@momentum-design/components 0.32.0 → 0.32.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/browser/index.js +313 -140
- package/dist/browser/index.js.map +4 -4
- package/dist/components/input/input.component.js +1 -1
- package/dist/components/textarea/index.d.ts +10 -0
- package/dist/components/textarea/index.js +7 -0
- package/dist/components/textarea/textarea.component.d.ts +203 -0
- package/dist/components/textarea/textarea.component.js +432 -0
- package/dist/components/textarea/textarea.constants.d.ts +21 -0
- package/dist/components/textarea/textarea.constants.js +25 -0
- package/dist/components/textarea/textarea.styles.d.ts +2 -0
- package/dist/components/textarea/textarea.styles.js +122 -0
- package/dist/components/textarea/textarea.types.d.ts +5 -0
- package/dist/components/textarea/textarea.types.js +1 -0
- package/dist/custom-elements.json +1515 -579
- package/dist/index.d.ts +2 -1
- package/dist/index.js +2 -1
- package/dist/react/index.d.ts +3 -2
- package/dist/react/index.js +3 -2
- package/dist/react/textarea/index.d.ts +61 -0
- package/dist/react/textarea/index.js +70 -0
- package/dist/utils/mixins/FormInternalsMixin.d.ts +2 -2
- package/dist/utils/mixins/FormInternalsMixin.js +1 -1
- package/package.json +1 -1
|
@@ -4,218 +4,115 @@
|
|
|
4
4
|
"modules": [
|
|
5
5
|
{
|
|
6
6
|
"kind": "javascript-module",
|
|
7
|
-
"path": "components/
|
|
7
|
+
"path": "components/avatar/avatar.component.js",
|
|
8
8
|
"declarations": [
|
|
9
9
|
{
|
|
10
10
|
"kind": "class",
|
|
11
|
-
"description": "The `mdc-
|
|
12
|
-
"name": "
|
|
11
|
+
"description": "The `mdc-avatar` component is used to represent a person or a space.\nAn avatar can be an icon, initials, counter and photo.\n\nTo set the photo of an avatar,\nyou need to set \"src\" attribute.\n\nWhile the avatar image is loading, as a placeholder,\nwe will show the initials text.\nIf the initials are not specified then,\nwe will show `user-regular` icon as a placeholder.\n\nBy default, if there are no attributes specified,\nthen the default avatar will be an icon with `user-regular` name.\n\nThe avatar component is non clickable and non interactive/focusable component.\nIf the avatar is typing, then the loading indicator will be displayed.\nIf the counter type avatar is set to a negative number, then we will display 0.\nThe presence indicator will be hidden when the counter property is set.",
|
|
12
|
+
"name": "Avatar",
|
|
13
13
|
"cssProperties": [
|
|
14
14
|
{
|
|
15
|
-
"description": "
|
|
16
|
-
"name": "--mdc-
|
|
17
|
-
},
|
|
18
|
-
{
|
|
19
|
-
"description": "The background color of the primary badge.",
|
|
20
|
-
"name": "--mdc-badge-primary-background-color"
|
|
21
|
-
},
|
|
22
|
-
{
|
|
23
|
-
"description": "The foreground color of the secondary badge.",
|
|
24
|
-
"name": "--mdc-badge-secondary-foreground-color"
|
|
25
|
-
},
|
|
26
|
-
{
|
|
27
|
-
"description": "The background color of the secondary badge.",
|
|
28
|
-
"name": "--mdc-badge-secondary-background-color"
|
|
29
|
-
},
|
|
30
|
-
{
|
|
31
|
-
"description": "The foreground color of the success badge.",
|
|
32
|
-
"name": "--mdc-badge-success-foreground-color"
|
|
33
|
-
},
|
|
34
|
-
{
|
|
35
|
-
"description": "The background color of the success badge.",
|
|
36
|
-
"name": "--mdc-badge-success-background-color"
|
|
37
|
-
},
|
|
38
|
-
{
|
|
39
|
-
"description": "The foreground color of the warning badge.",
|
|
40
|
-
"name": "--mdc-badge-warning-foreground-color"
|
|
15
|
+
"description": "Allows customization of the default background color.",
|
|
16
|
+
"name": "--mdc-avatar-default-background-color"
|
|
41
17
|
},
|
|
42
18
|
{
|
|
43
|
-
"description": "
|
|
44
|
-
"name": "--mdc-
|
|
19
|
+
"description": "Allows customization of the default foreground color.",
|
|
20
|
+
"name": "--mdc-avatar-default-foreground-color"
|
|
45
21
|
},
|
|
46
22
|
{
|
|
47
|
-
"description": "
|
|
48
|
-
"name": "--mdc-
|
|
23
|
+
"description": "Allows customization of the loading indicator background color.",
|
|
24
|
+
"name": "--mdc-avatar-loading-indicator-background-color"
|
|
49
25
|
},
|
|
50
26
|
{
|
|
51
|
-
"description": "
|
|
52
|
-
"name": "--mdc-
|
|
27
|
+
"description": "Allows customization of the loading indicator foreground color.",
|
|
28
|
+
"name": "--mdc-avatar-loading-indicator-foreground-color"
|
|
53
29
|
},
|
|
54
30
|
{
|
|
55
|
-
"description": "
|
|
56
|
-
"name": "--mdc-
|
|
31
|
+
"description": "Allows customization of the loading overlay background color.",
|
|
32
|
+
"name": "--mdc-avatar-loading-overlay-background-color"
|
|
57
33
|
}
|
|
58
34
|
],
|
|
59
35
|
"members": [
|
|
60
36
|
{
|
|
61
37
|
"kind": "field",
|
|
62
|
-
"name": "
|
|
38
|
+
"name": "src",
|
|
63
39
|
"type": {
|
|
64
|
-
"text": "
|
|
40
|
+
"text": "string | undefined"
|
|
65
41
|
},
|
|
66
|
-
"description": "
|
|
67
|
-
"attribute": "
|
|
68
|
-
"
|
|
42
|
+
"description": "The src is the url which will be used to display the avatar.\nWhen the src is loading, we will display the initials as a placeholder.",
|
|
43
|
+
"attribute": "src",
|
|
44
|
+
"inheritedFrom": {
|
|
45
|
+
"name": "AvatarComponentMixin",
|
|
46
|
+
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
47
|
+
}
|
|
69
48
|
},
|
|
70
49
|
{
|
|
71
50
|
"kind": "field",
|
|
72
|
-
"name": "
|
|
51
|
+
"name": "initials",
|
|
73
52
|
"type": {
|
|
74
|
-
"text": "
|
|
53
|
+
"text": "string | undefined"
|
|
75
54
|
},
|
|
76
|
-
"description": "
|
|
77
|
-
"
|
|
78
|
-
"
|
|
79
|
-
|
|
55
|
+
"description": "The initials to be displayed for the avatar.",
|
|
56
|
+
"attribute": "initials",
|
|
57
|
+
"inheritedFrom": {
|
|
58
|
+
"name": "AvatarComponentMixin",
|
|
59
|
+
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
60
|
+
}
|
|
80
61
|
},
|
|
81
62
|
{
|
|
82
63
|
"kind": "field",
|
|
83
|
-
"name": "
|
|
64
|
+
"name": "presence",
|
|
84
65
|
"type": {
|
|
85
|
-
"text": "
|
|
66
|
+
"text": "PresenceType | undefined"
|
|
86
67
|
},
|
|
87
|
-
"description": "
|
|
88
|
-
"attribute": "
|
|
68
|
+
"description": "The presence is the status which can be used to display the\nactivity state of a user or a space within an avatar component.\n\nAcceptable values include:\n- `active`\n- `away`\n- `away-calling`\n- `busy`\n- `dnd`\n- `meeting`\n- `on-call`\n- `on-device`\n- `on-mobile`\n- `pause`\n- `pto`\n- `presenting`\n- `quiet`\n- `scheduled`",
|
|
69
|
+
"attribute": "presence",
|
|
70
|
+
"inheritedFrom": {
|
|
71
|
+
"name": "AvatarComponentMixin",
|
|
72
|
+
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
73
|
+
}
|
|
89
74
|
},
|
|
90
75
|
{
|
|
91
76
|
"kind": "field",
|
|
92
|
-
"name": "
|
|
77
|
+
"name": "size",
|
|
93
78
|
"type": {
|
|
94
|
-
"text": "
|
|
79
|
+
"text": "AvatarSize"
|
|
95
80
|
},
|
|
96
|
-
"description": "
|
|
97
|
-
"default": "
|
|
98
|
-
"attribute": "
|
|
99
|
-
"reflects": true
|
|
81
|
+
"description": "Acceptable values include (size in px unit):\n- 24\n- 32\n- 48\n- 64\n- 72\n- 88\n- 124",
|
|
82
|
+
"default": "32",
|
|
83
|
+
"attribute": "size",
|
|
84
|
+
"reflects": true,
|
|
85
|
+
"inheritedFrom": {
|
|
86
|
+
"name": "AvatarComponentMixin",
|
|
87
|
+
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
88
|
+
}
|
|
100
89
|
},
|
|
101
90
|
{
|
|
102
91
|
"kind": "field",
|
|
103
|
-
"name": "
|
|
92
|
+
"name": "counter",
|
|
104
93
|
"type": {
|
|
105
|
-
"text": "
|
|
94
|
+
"text": "number | undefined"
|
|
106
95
|
},
|
|
107
|
-
"
|
|
108
|
-
"
|
|
109
|
-
"
|
|
96
|
+
"description": "The counter is the number which can be displayed on the avatar.\nThe maximum number is 99 and if the given number is greater than 99,\nthen the avatar will be displayed as `99+`.\nIf the given number is a negative number,\nthen the avatar will be displayed as `0`.",
|
|
97
|
+
"attribute": "counter",
|
|
98
|
+
"inheritedFrom": {
|
|
99
|
+
"name": "AvatarComponentMixin",
|
|
100
|
+
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
101
|
+
}
|
|
110
102
|
},
|
|
111
103
|
{
|
|
112
104
|
"kind": "field",
|
|
113
|
-
"name": "
|
|
105
|
+
"name": "isTyping",
|
|
114
106
|
"type": {
|
|
115
|
-
"text": "
|
|
116
|
-
},
|
|
117
|
-
"default": "null",
|
|
118
|
-
"description": "Aria-label attribute to be set for accessibility",
|
|
119
|
-
"attribute": "aria-label"
|
|
120
|
-
},
|
|
121
|
-
{
|
|
122
|
-
"kind": "method",
|
|
123
|
-
"name": "getCounterText",
|
|
124
|
-
"privacy": "private",
|
|
125
|
-
"return": {
|
|
126
|
-
"type": {
|
|
127
|
-
"text": ""
|
|
128
|
-
}
|
|
129
|
-
},
|
|
130
|
-
"parameters": [
|
|
131
|
-
{
|
|
132
|
-
"name": "maxCounter",
|
|
133
|
-
"type": {
|
|
134
|
-
"text": "number"
|
|
135
|
-
},
|
|
136
|
-
"description": "the maximum limit which can be displayed on the badge"
|
|
137
|
-
},
|
|
138
|
-
{
|
|
139
|
-
"name": "counter",
|
|
140
|
-
"optional": true,
|
|
141
|
-
"type": {
|
|
142
|
-
"text": "number"
|
|
143
|
-
},
|
|
144
|
-
"description": "the number to be displayed on the badge"
|
|
145
|
-
}
|
|
146
|
-
],
|
|
147
|
-
"description": "If `type` is set to `counter` and if `counter` is greater than `maxCounter`,\nthen it will return a string the maxCounter value as string.\nOtherwise, it will return a string representation of `counter`.\nIf `counter` is not a number, it will return an empty string."
|
|
148
|
-
},
|
|
149
|
-
{
|
|
150
|
-
"kind": "method",
|
|
151
|
-
"name": "getBadgeIcon",
|
|
152
|
-
"privacy": "private",
|
|
153
|
-
"return": {
|
|
154
|
-
"type": {
|
|
155
|
-
"text": ""
|
|
156
|
-
}
|
|
157
|
-
},
|
|
158
|
-
"parameters": [
|
|
159
|
-
{
|
|
160
|
-
"name": "iconName",
|
|
161
|
-
"type": {
|
|
162
|
-
"text": "string"
|
|
163
|
-
},
|
|
164
|
-
"description": "the name of the icon from the icon set"
|
|
165
|
-
},
|
|
166
|
-
{
|
|
167
|
-
"name": "backgroundClassPostfix",
|
|
168
|
-
"type": {
|
|
169
|
-
"text": "string"
|
|
170
|
-
},
|
|
171
|
-
"description": "postfix for the class to style the badge icon."
|
|
172
|
-
}
|
|
173
|
-
],
|
|
174
|
-
"description": "Method to generate the badge icon."
|
|
175
|
-
},
|
|
176
|
-
{
|
|
177
|
-
"kind": "method",
|
|
178
|
-
"name": "getBadgeDot",
|
|
179
|
-
"privacy": "private",
|
|
180
|
-
"return": {
|
|
181
|
-
"type": {
|
|
182
|
-
"text": ""
|
|
183
|
-
}
|
|
184
|
-
},
|
|
185
|
-
"description": "Method to generate the badge dot template."
|
|
186
|
-
},
|
|
187
|
-
{
|
|
188
|
-
"kind": "method",
|
|
189
|
-
"name": "getBadgeCounterText",
|
|
190
|
-
"privacy": "private",
|
|
191
|
-
"return": {
|
|
192
|
-
"type": {
|
|
193
|
-
"text": ""
|
|
194
|
-
}
|
|
195
|
-
},
|
|
196
|
-
"description": "Method to generate the badge text and counter template."
|
|
197
|
-
},
|
|
198
|
-
{
|
|
199
|
-
"kind": "method",
|
|
200
|
-
"name": "setRoleByAriaLabel",
|
|
201
|
-
"privacy": "private",
|
|
202
|
-
"return": {
|
|
203
|
-
"type": {
|
|
204
|
-
"text": "void"
|
|
205
|
-
}
|
|
206
|
-
},
|
|
207
|
-
"description": "Method to set the role based on the aria-label provided.\nIf the aria-label is provided, the role of the element will be 'img'.\nOtherwise, the role will be null."
|
|
208
|
-
},
|
|
209
|
-
{
|
|
210
|
-
"kind": "method",
|
|
211
|
-
"name": "getBadgeContentBasedOnType",
|
|
212
|
-
"privacy": "private",
|
|
213
|
-
"return": {
|
|
214
|
-
"type": {
|
|
215
|
-
"text": ""
|
|
216
|
-
}
|
|
107
|
+
"text": "boolean"
|
|
217
108
|
},
|
|
218
|
-
"
|
|
109
|
+
"default": "false",
|
|
110
|
+
"description": "Represents the typing indicator when the user is typing.",
|
|
111
|
+
"attribute": "is-typing",
|
|
112
|
+
"inheritedFrom": {
|
|
113
|
+
"name": "AvatarComponentMixin",
|
|
114
|
+
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
115
|
+
}
|
|
219
116
|
},
|
|
220
117
|
{
|
|
221
118
|
"kind": "field",
|
|
@@ -231,58 +128,97 @@
|
|
|
231
128
|
}
|
|
232
129
|
}
|
|
233
130
|
],
|
|
234
|
-
"
|
|
131
|
+
"mixins": [
|
|
235
132
|
{
|
|
236
|
-
"name": "
|
|
237
|
-
"
|
|
238
|
-
"text": "BadgeType | undefined"
|
|
239
|
-
},
|
|
240
|
-
"description": "Type of the badge\nCan be `dot` (notification) , `icon`, `counter`, `success`, `warning` or `error`.",
|
|
241
|
-
"fieldName": "type"
|
|
133
|
+
"name": "AvatarComponentMixin",
|
|
134
|
+
"module": "/src/utils/mixins/AvatarComponentMixin"
|
|
242
135
|
},
|
|
243
136
|
{
|
|
244
|
-
"name": "
|
|
137
|
+
"name": "IconNameMixin",
|
|
138
|
+
"module": "/src/utils/mixins/IconNameMixin"
|
|
139
|
+
}
|
|
140
|
+
],
|
|
141
|
+
"superclass": {
|
|
142
|
+
"name": "Component",
|
|
143
|
+
"module": "/src/models"
|
|
144
|
+
},
|
|
145
|
+
"tagName": "mdc-avatar",
|
|
146
|
+
"jsDoc": "/**\n * The `mdc-avatar` component is used to represent a person or a space.\n * An avatar can be an icon, initials, counter and photo.\n *\n * To set the photo of an avatar,\n * you need to set \"src\" attribute.\n *\n * While the avatar image is loading, as a placeholder,\n * we will show the initials text.\n * If the initials are not specified then,\n * we will show `user-regular` icon as a placeholder.\n *\n * By default, if there are no attributes specified,\n * then the default avatar will be an icon with `user-regular` name.\n *\n * The avatar component is non clickable and non interactive/focusable component.\n * If the avatar is typing, then the loading indicator will be displayed.\n * If the counter type avatar is set to a negative number, then we will display 0.\n * The presence indicator will be hidden when the counter property is set.\n *\n * @dependency mdc-icon\n * @dependency mdc-presence\n * @dependency mdc-text\n *\n * @tagname mdc-avatar\n *\n * @cssproperty --mdc-avatar-default-background-color - Allows customization of the default background color.\n * @cssproperty --mdc-avatar-default-foreground-color - Allows customization of the default foreground color.\n * @cssproperty --mdc-avatar-loading-indicator-background-color -\n * Allows customization of the loading indicator background color.\n * @cssproperty --mdc-avatar-loading-indicator-foreground-color -\n * Allows customization of the loading indicator foreground color.\n * @cssproperty --mdc-avatar-loading-overlay-background-color -\n * Allows customization of the loading overlay background color.\n */",
|
|
147
|
+
"customElement": true,
|
|
148
|
+
"attributes": [
|
|
149
|
+
{
|
|
150
|
+
"name": "src",
|
|
245
151
|
"type": {
|
|
246
|
-
"text": "
|
|
152
|
+
"text": "string | undefined"
|
|
247
153
|
},
|
|
248
|
-
"description": "
|
|
249
|
-
"
|
|
250
|
-
"
|
|
154
|
+
"description": "The src is the url which will be used to display the avatar.\nWhen the src is loading, we will display the initials as a placeholder.",
|
|
155
|
+
"fieldName": "src",
|
|
156
|
+
"inheritedFrom": {
|
|
157
|
+
"name": "AvatarComponentMixin",
|
|
158
|
+
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
159
|
+
}
|
|
251
160
|
},
|
|
252
161
|
{
|
|
253
|
-
"name": "
|
|
162
|
+
"name": "initials",
|
|
254
163
|
"type": {
|
|
255
|
-
"text": "
|
|
164
|
+
"text": "string | undefined"
|
|
256
165
|
},
|
|
257
|
-
"description": "
|
|
258
|
-
"fieldName": "
|
|
166
|
+
"description": "The initials to be displayed for the avatar.",
|
|
167
|
+
"fieldName": "initials",
|
|
168
|
+
"inheritedFrom": {
|
|
169
|
+
"name": "AvatarComponentMixin",
|
|
170
|
+
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
171
|
+
}
|
|
259
172
|
},
|
|
260
173
|
{
|
|
261
|
-
"name": "
|
|
174
|
+
"name": "presence",
|
|
262
175
|
"type": {
|
|
263
|
-
"text": "
|
|
176
|
+
"text": "PresenceType | undefined"
|
|
264
177
|
},
|
|
265
|
-
"description": "The
|
|
266
|
-
"
|
|
267
|
-
"
|
|
178
|
+
"description": "The presence is the status which can be used to display the\nactivity state of a user or a space within an avatar component.\n\nAcceptable values include:\n- `active`\n- `away`\n- `away-calling`\n- `busy`\n- `dnd`\n- `meeting`\n- `on-call`\n- `on-device`\n- `on-mobile`\n- `pause`\n- `pto`\n- `presenting`\n- `quiet`\n- `scheduled`",
|
|
179
|
+
"fieldName": "presence",
|
|
180
|
+
"inheritedFrom": {
|
|
181
|
+
"name": "AvatarComponentMixin",
|
|
182
|
+
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
183
|
+
}
|
|
268
184
|
},
|
|
269
185
|
{
|
|
270
|
-
"name": "
|
|
186
|
+
"name": "size",
|
|
271
187
|
"type": {
|
|
272
|
-
"text": "
|
|
188
|
+
"text": "AvatarSize"
|
|
273
189
|
},
|
|
274
|
-
"
|
|
275
|
-
"
|
|
276
|
-
"fieldName": "
|
|
190
|
+
"description": "Acceptable values include (size in px unit):\n- 24\n- 32\n- 48\n- 64\n- 72\n- 88\n- 124",
|
|
191
|
+
"default": "32",
|
|
192
|
+
"fieldName": "size",
|
|
193
|
+
"inheritedFrom": {
|
|
194
|
+
"name": "AvatarComponentMixin",
|
|
195
|
+
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
196
|
+
}
|
|
277
197
|
},
|
|
278
198
|
{
|
|
279
|
-
"name": "
|
|
199
|
+
"name": "counter",
|
|
280
200
|
"type": {
|
|
281
|
-
"text": "
|
|
201
|
+
"text": "number | undefined"
|
|
282
202
|
},
|
|
283
|
-
"
|
|
284
|
-
"
|
|
285
|
-
"
|
|
203
|
+
"description": "The counter is the number which can be displayed on the avatar.\nThe maximum number is 99 and if the given number is greater than 99,\nthen the avatar will be displayed as `99+`.\nIf the given number is a negative number,\nthen the avatar will be displayed as `0`.",
|
|
204
|
+
"fieldName": "counter",
|
|
205
|
+
"inheritedFrom": {
|
|
206
|
+
"name": "AvatarComponentMixin",
|
|
207
|
+
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
208
|
+
}
|
|
209
|
+
},
|
|
210
|
+
{
|
|
211
|
+
"name": "is-typing",
|
|
212
|
+
"type": {
|
|
213
|
+
"text": "boolean"
|
|
214
|
+
},
|
|
215
|
+
"default": "false",
|
|
216
|
+
"description": "Represents the typing indicator when the user is typing.",
|
|
217
|
+
"fieldName": "isTyping",
|
|
218
|
+
"inheritedFrom": {
|
|
219
|
+
"name": "AvatarComponentMixin",
|
|
220
|
+
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
221
|
+
}
|
|
286
222
|
},
|
|
287
223
|
{
|
|
288
224
|
"name": "icon-name",
|
|
@@ -296,20 +232,7 @@
|
|
|
296
232
|
"module": "src/utils/mixins/IconNameMixin.ts"
|
|
297
233
|
}
|
|
298
234
|
}
|
|
299
|
-
]
|
|
300
|
-
"mixins": [
|
|
301
|
-
{
|
|
302
|
-
"name": "IconNameMixin",
|
|
303
|
-
"module": "/src/utils/mixins/IconNameMixin"
|
|
304
|
-
}
|
|
305
|
-
],
|
|
306
|
-
"superclass": {
|
|
307
|
-
"name": "Component",
|
|
308
|
-
"module": "/src/models"
|
|
309
|
-
},
|
|
310
|
-
"tagName": "mdc-badge",
|
|
311
|
-
"jsDoc": "/**\n * The `mdc-badge` component is a versatile UI element used to\n * display dot, icons, counters, success, warning and error type badge.\n *\n * Supported badge types:\n * - `dot`: Displays a dot notification badge with a blue color.\n * - `icon`: Displays a badge with a specified icon using the `icon-name` attribute.\n * - `counter`: Displays a badge with a counter value. If the counter exceeds the `max-counter`,\n * it shows `maxCounter+`. The maximum value of the counter is 999 and anything above that will be set to `999+`.\n * - `success`: Displays a success badge with a check circle icon and green color.\n * - `warning`: Displays a warning badge with a warning icon and yellow color.\n * - `error`: Displays a error badge with a error legacy icon and red color.\n *\n * For `icon`, `success`, `warning` and `error` types, the `mdc-icon` component is used to render the icon.\n *\n * For the `counter` type, the `mdc-text` component is used to render the counter value.\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @tagname mdc-badge\n *\n * @cssproperty --mdc-badge-primary-foreground-color - The foreground color of the primary badge.\n * @cssproperty --mdc-badge-primary-background-color - The background color of the primary badge.\n * @cssproperty --mdc-badge-secondary-foreground-color - The foreground color of the secondary badge.\n * @cssproperty --mdc-badge-secondary-background-color - The background color of the secondary badge.\n * @cssproperty --mdc-badge-success-foreground-color - The foreground color of the success badge.\n * @cssproperty --mdc-badge-success-background-color - The background color of the success badge.\n * @cssproperty --mdc-badge-warning-foreground-color - The foreground color of the warning badge.\n * @cssproperty --mdc-badge-warning-background-color - The background color of the warning badge.\n * @cssproperty --mdc-badge-error-foreground-color - The foreground color of the error badge.\n * @cssproperty --mdc-badge-error-background-color - The background color of the error badge.\n * @cssproperty --mdc-badge-overlay-background-color - The background color of the badge overlay.\n */",
|
|
312
|
-
"customElement": true
|
|
235
|
+
]
|
|
313
236
|
}
|
|
314
237
|
],
|
|
315
238
|
"exports": [
|
|
@@ -317,8 +240,8 @@
|
|
|
317
240
|
"kind": "js",
|
|
318
241
|
"name": "default",
|
|
319
242
|
"declaration": {
|
|
320
|
-
"name": "
|
|
321
|
-
"module": "components/
|
|
243
|
+
"name": "Avatar",
|
|
244
|
+
"module": "components/avatar/avatar.component.js"
|
|
322
245
|
}
|
|
323
246
|
}
|
|
324
247
|
]
|
|
@@ -929,186 +852,218 @@
|
|
|
929
852
|
},
|
|
930
853
|
{
|
|
931
854
|
"kind": "javascript-module",
|
|
932
|
-
"path": "components/
|
|
855
|
+
"path": "components/badge/badge.component.js",
|
|
933
856
|
"declarations": [
|
|
934
857
|
{
|
|
935
858
|
"kind": "class",
|
|
936
|
-
"description": "
|
|
937
|
-
"name": "
|
|
859
|
+
"description": "The `mdc-badge` component is a versatile UI element used to\ndisplay dot, icons, counters, success, warning and error type badge.\n\nSupported badge types:\n- `dot`: Displays a dot notification badge with a blue color.\n- `icon`: Displays a badge with a specified icon using the `icon-name` attribute.\n- `counter`: Displays a badge with a counter value. If the counter exceeds the `max-counter`,\nit shows `maxCounter+`. The maximum value of the counter is 999 and anything above that will be set to `999+`.\n- `success`: Displays a success badge with a check circle icon and green color.\n- `warning`: Displays a warning badge with a warning icon and yellow color.\n- `error`: Displays a error badge with a error legacy icon and red color.\n\nFor `icon`, `success`, `warning` and `error` types, the `mdc-icon` component is used to render the icon.\n\nFor the `counter` type, the `mdc-text` component is used to render the counter value.",
|
|
860
|
+
"name": "Badge",
|
|
938
861
|
"cssProperties": [
|
|
939
862
|
{
|
|
940
|
-
"description": "
|
|
941
|
-
"name": "--mdc-
|
|
863
|
+
"description": "The foreground color of the primary badge.",
|
|
864
|
+
"name": "--mdc-badge-primary-foreground-color"
|
|
942
865
|
},
|
|
943
866
|
{
|
|
944
|
-
"description": "
|
|
945
|
-
"name": "--mdc-
|
|
867
|
+
"description": "The background color of the primary badge.",
|
|
868
|
+
"name": "--mdc-badge-primary-background-color"
|
|
946
869
|
},
|
|
947
870
|
{
|
|
948
|
-
"description": "
|
|
949
|
-
"name": "--mdc-
|
|
871
|
+
"description": "The foreground color of the secondary badge.",
|
|
872
|
+
"name": "--mdc-badge-secondary-foreground-color"
|
|
950
873
|
},
|
|
951
874
|
{
|
|
952
|
-
"description": "
|
|
953
|
-
"name": "--mdc-
|
|
954
|
-
}
|
|
955
|
-
],
|
|
956
|
-
"members": [
|
|
875
|
+
"description": "The background color of the secondary badge.",
|
|
876
|
+
"name": "--mdc-badge-secondary-background-color"
|
|
877
|
+
},
|
|
957
878
|
{
|
|
958
|
-
"
|
|
959
|
-
"name": "
|
|
960
|
-
|
|
961
|
-
"text": "Size"
|
|
962
|
-
},
|
|
963
|
-
"privacy": "public",
|
|
964
|
-
"description": "Size of the bullet\n\nPossible values: 'small', 'medium', 'large'",
|
|
965
|
-
"default": "small",
|
|
966
|
-
"attribute": "size",
|
|
967
|
-
"reflects": true
|
|
968
|
-
}
|
|
969
|
-
],
|
|
970
|
-
"attributes": [
|
|
879
|
+
"description": "The foreground color of the success badge.",
|
|
880
|
+
"name": "--mdc-badge-success-foreground-color"
|
|
881
|
+
},
|
|
971
882
|
{
|
|
972
|
-
"
|
|
973
|
-
"
|
|
974
|
-
|
|
975
|
-
},
|
|
976
|
-
"description": "Size of the bullet\n\nPossible values: 'small', 'medium', 'large'",
|
|
977
|
-
"default": "small",
|
|
978
|
-
"fieldName": "size"
|
|
979
|
-
}
|
|
980
|
-
],
|
|
981
|
-
"superclass": {
|
|
982
|
-
"name": "Component",
|
|
983
|
-
"module": "/src/models"
|
|
984
|
-
},
|
|
985
|
-
"tagName": "mdc-bullet",
|
|
986
|
-
"jsDoc": "/**\n * Bullet component, which is a visual marker\n * and be used to organize and present items in a list format.\n *\n * @tagname mdc-bullet\n *\n * @cssproperty --mdc-bullet-background-color - background color of the bullet\n * @cssproperty --mdc-bullet-size-small - small size value of the bullet\n * @cssproperty --mdc-bullet-size-medium - medium size value of the bullet\n * @cssproperty --mdc-bullet-size-large - large size value of the bullet\n*/",
|
|
987
|
-
"customElement": true
|
|
988
|
-
}
|
|
989
|
-
],
|
|
990
|
-
"exports": [
|
|
991
|
-
{
|
|
992
|
-
"kind": "js",
|
|
993
|
-
"name": "default",
|
|
994
|
-
"declaration": {
|
|
995
|
-
"name": "Bullet",
|
|
996
|
-
"module": "components/bullet/bullet.component.js"
|
|
997
|
-
}
|
|
998
|
-
}
|
|
999
|
-
]
|
|
1000
|
-
},
|
|
1001
|
-
{
|
|
1002
|
-
"kind": "javascript-module",
|
|
1003
|
-
"path": "components/avatar/avatar.component.js",
|
|
1004
|
-
"declarations": [
|
|
1005
|
-
{
|
|
1006
|
-
"kind": "class",
|
|
1007
|
-
"description": "The `mdc-avatar` component is used to represent a person or a space.\nAn avatar can be an icon, initials, counter and photo.\n\nTo set the photo of an avatar,\nyou need to set \"src\" attribute.\n\nWhile the avatar image is loading, as a placeholder,\nwe will show the initials text.\nIf the initials are not specified then,\nwe will show `user-regular` icon as a placeholder.\n\nBy default, if there are no attributes specified,\nthen the default avatar will be an icon with `user-regular` name.\n\nThe avatar component is non clickable and non interactive/focusable component.\nIf the avatar is typing, then the loading indicator will be displayed.\nIf the counter type avatar is set to a negative number, then we will display 0.\nThe presence indicator will be hidden when the counter property is set.",
|
|
1008
|
-
"name": "Avatar",
|
|
1009
|
-
"cssProperties": [
|
|
883
|
+
"description": "The background color of the success badge.",
|
|
884
|
+
"name": "--mdc-badge-success-background-color"
|
|
885
|
+
},
|
|
1010
886
|
{
|
|
1011
|
-
"description": "
|
|
1012
|
-
"name": "--mdc-
|
|
887
|
+
"description": "The foreground color of the warning badge.",
|
|
888
|
+
"name": "--mdc-badge-warning-foreground-color"
|
|
1013
889
|
},
|
|
1014
890
|
{
|
|
1015
|
-
"description": "
|
|
1016
|
-
"name": "--mdc-
|
|
891
|
+
"description": "The background color of the warning badge.",
|
|
892
|
+
"name": "--mdc-badge-warning-background-color"
|
|
1017
893
|
},
|
|
1018
894
|
{
|
|
1019
|
-
"description": "
|
|
1020
|
-
"name": "--mdc-
|
|
895
|
+
"description": "The foreground color of the error badge.",
|
|
896
|
+
"name": "--mdc-badge-error-foreground-color"
|
|
1021
897
|
},
|
|
1022
898
|
{
|
|
1023
|
-
"description": "
|
|
1024
|
-
"name": "--mdc-
|
|
899
|
+
"description": "The background color of the error badge.",
|
|
900
|
+
"name": "--mdc-badge-error-background-color"
|
|
1025
901
|
},
|
|
1026
902
|
{
|
|
1027
|
-
"description": "
|
|
1028
|
-
"name": "--mdc-
|
|
903
|
+
"description": "The background color of the badge overlay.",
|
|
904
|
+
"name": "--mdc-badge-overlay-background-color"
|
|
1029
905
|
}
|
|
1030
906
|
],
|
|
1031
907
|
"members": [
|
|
1032
908
|
{
|
|
1033
909
|
"kind": "field",
|
|
1034
|
-
"name": "
|
|
910
|
+
"name": "type",
|
|
1035
911
|
"type": {
|
|
1036
|
-
"text": "
|
|
912
|
+
"text": "BadgeType | undefined"
|
|
1037
913
|
},
|
|
1038
|
-
"description": "
|
|
1039
|
-
"attribute": "
|
|
1040
|
-
"
|
|
1041
|
-
"name": "AvatarComponentMixin",
|
|
1042
|
-
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
1043
|
-
}
|
|
914
|
+
"description": "Type of the badge\nCan be `dot` (notification) , `icon`, `counter`, `success`, `warning` or `error`.",
|
|
915
|
+
"attribute": "type",
|
|
916
|
+
"reflects": true
|
|
1044
917
|
},
|
|
1045
918
|
{
|
|
1046
919
|
"kind": "field",
|
|
1047
|
-
"name": "
|
|
920
|
+
"name": "variant",
|
|
1048
921
|
"type": {
|
|
1049
|
-
"text": "
|
|
922
|
+
"text": "IconVariant"
|
|
1050
923
|
},
|
|
1051
|
-
"description": "
|
|
1052
|
-
"
|
|
1053
|
-
"
|
|
1054
|
-
|
|
1055
|
-
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
1056
|
-
}
|
|
924
|
+
"description": "Type of the variant can be `primary` or `secondary`.\nIt defines the background and foreground color of the icon.",
|
|
925
|
+
"default": "primary",
|
|
926
|
+
"attribute": "variant",
|
|
927
|
+
"reflects": true
|
|
1057
928
|
},
|
|
1058
929
|
{
|
|
1059
930
|
"kind": "field",
|
|
1060
|
-
"name": "
|
|
931
|
+
"name": "counter",
|
|
1061
932
|
"type": {
|
|
1062
|
-
"text": "
|
|
933
|
+
"text": "number | undefined"
|
|
1063
934
|
},
|
|
1064
|
-
"description": "
|
|
1065
|
-
"attribute": "
|
|
1066
|
-
"inheritedFrom": {
|
|
1067
|
-
"name": "AvatarComponentMixin",
|
|
1068
|
-
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
1069
|
-
}
|
|
935
|
+
"description": "Counter is the number which can be provided in the badge.",
|
|
936
|
+
"attribute": "counter"
|
|
1070
937
|
},
|
|
1071
938
|
{
|
|
1072
939
|
"kind": "field",
|
|
1073
|
-
"name": "
|
|
940
|
+
"name": "maxCounter",
|
|
1074
941
|
"type": {
|
|
1075
|
-
"text": "
|
|
942
|
+
"text": "number"
|
|
1076
943
|
},
|
|
1077
|
-
"description": "
|
|
1078
|
-
"default": "
|
|
1079
|
-
"attribute": "
|
|
1080
|
-
"reflects": true
|
|
1081
|
-
"inheritedFrom": {
|
|
1082
|
-
"name": "AvatarComponentMixin",
|
|
1083
|
-
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
1084
|
-
}
|
|
944
|
+
"description": "The maximum number can be set up to 999, anything above that will be rendered as _999+_.\nThe max counter can be `9`, `99` or `999`.",
|
|
945
|
+
"default": "99",
|
|
946
|
+
"attribute": "max-counter",
|
|
947
|
+
"reflects": true
|
|
1085
948
|
},
|
|
1086
949
|
{
|
|
1087
950
|
"kind": "field",
|
|
1088
|
-
"name": "
|
|
951
|
+
"name": "overlay",
|
|
1089
952
|
"type": {
|
|
1090
|
-
"text": "
|
|
953
|
+
"text": "boolean"
|
|
1091
954
|
},
|
|
1092
|
-
"
|
|
1093
|
-
"
|
|
1094
|
-
"
|
|
1095
|
-
"name": "AvatarComponentMixin",
|
|
1096
|
-
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
1097
|
-
}
|
|
955
|
+
"default": "false",
|
|
956
|
+
"description": "Overlay is to add a thin outline to the badge.\nThis will help distinguish between the badge and the button,\nwhere the badge will be layered on top of a button.",
|
|
957
|
+
"attribute": "overlay"
|
|
1098
958
|
},
|
|
1099
959
|
{
|
|
1100
960
|
"kind": "field",
|
|
1101
|
-
"name": "
|
|
961
|
+
"name": "ariaLabel",
|
|
1102
962
|
"type": {
|
|
1103
|
-
"text": "
|
|
963
|
+
"text": "string | null"
|
|
1104
964
|
},
|
|
1105
|
-
"default": "
|
|
1106
|
-
"description": "
|
|
1107
|
-
"attribute": "
|
|
1108
|
-
|
|
1109
|
-
|
|
1110
|
-
|
|
1111
|
-
|
|
965
|
+
"default": "null",
|
|
966
|
+
"description": "Aria-label attribute to be set for accessibility",
|
|
967
|
+
"attribute": "aria-label"
|
|
968
|
+
},
|
|
969
|
+
{
|
|
970
|
+
"kind": "method",
|
|
971
|
+
"name": "getCounterText",
|
|
972
|
+
"privacy": "private",
|
|
973
|
+
"return": {
|
|
974
|
+
"type": {
|
|
975
|
+
"text": ""
|
|
976
|
+
}
|
|
977
|
+
},
|
|
978
|
+
"parameters": [
|
|
979
|
+
{
|
|
980
|
+
"name": "maxCounter",
|
|
981
|
+
"type": {
|
|
982
|
+
"text": "number"
|
|
983
|
+
},
|
|
984
|
+
"description": "the maximum limit which can be displayed on the badge"
|
|
985
|
+
},
|
|
986
|
+
{
|
|
987
|
+
"name": "counter",
|
|
988
|
+
"optional": true,
|
|
989
|
+
"type": {
|
|
990
|
+
"text": "number"
|
|
991
|
+
},
|
|
992
|
+
"description": "the number to be displayed on the badge"
|
|
993
|
+
}
|
|
994
|
+
],
|
|
995
|
+
"description": "If `type` is set to `counter` and if `counter` is greater than `maxCounter`,\nthen it will return a string the maxCounter value as string.\nOtherwise, it will return a string representation of `counter`.\nIf `counter` is not a number, it will return an empty string."
|
|
996
|
+
},
|
|
997
|
+
{
|
|
998
|
+
"kind": "method",
|
|
999
|
+
"name": "getBadgeIcon",
|
|
1000
|
+
"privacy": "private",
|
|
1001
|
+
"return": {
|
|
1002
|
+
"type": {
|
|
1003
|
+
"text": ""
|
|
1004
|
+
}
|
|
1005
|
+
},
|
|
1006
|
+
"parameters": [
|
|
1007
|
+
{
|
|
1008
|
+
"name": "iconName",
|
|
1009
|
+
"type": {
|
|
1010
|
+
"text": "string"
|
|
1011
|
+
},
|
|
1012
|
+
"description": "the name of the icon from the icon set"
|
|
1013
|
+
},
|
|
1014
|
+
{
|
|
1015
|
+
"name": "backgroundClassPostfix",
|
|
1016
|
+
"type": {
|
|
1017
|
+
"text": "string"
|
|
1018
|
+
},
|
|
1019
|
+
"description": "postfix for the class to style the badge icon."
|
|
1020
|
+
}
|
|
1021
|
+
],
|
|
1022
|
+
"description": "Method to generate the badge icon."
|
|
1023
|
+
},
|
|
1024
|
+
{
|
|
1025
|
+
"kind": "method",
|
|
1026
|
+
"name": "getBadgeDot",
|
|
1027
|
+
"privacy": "private",
|
|
1028
|
+
"return": {
|
|
1029
|
+
"type": {
|
|
1030
|
+
"text": ""
|
|
1031
|
+
}
|
|
1032
|
+
},
|
|
1033
|
+
"description": "Method to generate the badge dot template."
|
|
1034
|
+
},
|
|
1035
|
+
{
|
|
1036
|
+
"kind": "method",
|
|
1037
|
+
"name": "getBadgeCounterText",
|
|
1038
|
+
"privacy": "private",
|
|
1039
|
+
"return": {
|
|
1040
|
+
"type": {
|
|
1041
|
+
"text": ""
|
|
1042
|
+
}
|
|
1043
|
+
},
|
|
1044
|
+
"description": "Method to generate the badge text and counter template."
|
|
1045
|
+
},
|
|
1046
|
+
{
|
|
1047
|
+
"kind": "method",
|
|
1048
|
+
"name": "setRoleByAriaLabel",
|
|
1049
|
+
"privacy": "private",
|
|
1050
|
+
"return": {
|
|
1051
|
+
"type": {
|
|
1052
|
+
"text": "void"
|
|
1053
|
+
}
|
|
1054
|
+
},
|
|
1055
|
+
"description": "Method to set the role based on the aria-label provided.\nIf the aria-label is provided, the role of the element will be 'img'.\nOtherwise, the role will be null."
|
|
1056
|
+
},
|
|
1057
|
+
{
|
|
1058
|
+
"kind": "method",
|
|
1059
|
+
"name": "getBadgeContentBasedOnType",
|
|
1060
|
+
"privacy": "private",
|
|
1061
|
+
"return": {
|
|
1062
|
+
"type": {
|
|
1063
|
+
"text": ""
|
|
1064
|
+
}
|
|
1065
|
+
},
|
|
1066
|
+
"description": "Generates the badge content based on the badge type.\nUtilizes various helper methods to create the appropriate badge template based on the\ncurrent badge type. Supports 'dot', 'icon', 'counter', 'success', 'warning', and 'error'\ntypes, returning the corresponding template result for each type."
|
|
1112
1067
|
},
|
|
1113
1068
|
{
|
|
1114
1069
|
"kind": "field",
|
|
@@ -1124,97 +1079,58 @@
|
|
|
1124
1079
|
}
|
|
1125
1080
|
}
|
|
1126
1081
|
],
|
|
1127
|
-
"mixins": [
|
|
1128
|
-
{
|
|
1129
|
-
"name": "AvatarComponentMixin",
|
|
1130
|
-
"module": "/src/utils/mixins/AvatarComponentMixin"
|
|
1131
|
-
},
|
|
1132
|
-
{
|
|
1133
|
-
"name": "IconNameMixin",
|
|
1134
|
-
"module": "/src/utils/mixins/IconNameMixin"
|
|
1135
|
-
}
|
|
1136
|
-
],
|
|
1137
|
-
"superclass": {
|
|
1138
|
-
"name": "Component",
|
|
1139
|
-
"module": "/src/models"
|
|
1140
|
-
},
|
|
1141
|
-
"tagName": "mdc-avatar",
|
|
1142
|
-
"jsDoc": "/**\n * The `mdc-avatar` component is used to represent a person or a space.\n * An avatar can be an icon, initials, counter and photo.\n *\n * To set the photo of an avatar,\n * you need to set \"src\" attribute.\n *\n * While the avatar image is loading, as a placeholder,\n * we will show the initials text.\n * If the initials are not specified then,\n * we will show `user-regular` icon as a placeholder.\n *\n * By default, if there are no attributes specified,\n * then the default avatar will be an icon with `user-regular` name.\n *\n * The avatar component is non clickable and non interactive/focusable component.\n * If the avatar is typing, then the loading indicator will be displayed.\n * If the counter type avatar is set to a negative number, then we will display 0.\n * The presence indicator will be hidden when the counter property is set.\n *\n * @dependency mdc-icon\n * @dependency mdc-presence\n * @dependency mdc-text\n *\n * @tagname mdc-avatar\n *\n * @cssproperty --mdc-avatar-default-background-color - Allows customization of the default background color.\n * @cssproperty --mdc-avatar-default-foreground-color - Allows customization of the default foreground color.\n * @cssproperty --mdc-avatar-loading-indicator-background-color -\n * Allows customization of the loading indicator background color.\n * @cssproperty --mdc-avatar-loading-indicator-foreground-color -\n * Allows customization of the loading indicator foreground color.\n * @cssproperty --mdc-avatar-loading-overlay-background-color -\n * Allows customization of the loading overlay background color.\n */",
|
|
1143
|
-
"customElement": true,
|
|
1144
1082
|
"attributes": [
|
|
1145
1083
|
{
|
|
1146
|
-
"name": "
|
|
1084
|
+
"name": "type",
|
|
1147
1085
|
"type": {
|
|
1148
|
-
"text": "
|
|
1086
|
+
"text": "BadgeType | undefined"
|
|
1149
1087
|
},
|
|
1150
|
-
"description": "
|
|
1151
|
-
"fieldName": "
|
|
1152
|
-
"inheritedFrom": {
|
|
1153
|
-
"name": "AvatarComponentMixin",
|
|
1154
|
-
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
1155
|
-
}
|
|
1088
|
+
"description": "Type of the badge\nCan be `dot` (notification) , `icon`, `counter`, `success`, `warning` or `error`.",
|
|
1089
|
+
"fieldName": "type"
|
|
1156
1090
|
},
|
|
1157
1091
|
{
|
|
1158
|
-
"name": "
|
|
1092
|
+
"name": "variant",
|
|
1159
1093
|
"type": {
|
|
1160
|
-
"text": "
|
|
1094
|
+
"text": "IconVariant"
|
|
1161
1095
|
},
|
|
1162
|
-
"description": "
|
|
1163
|
-
"
|
|
1164
|
-
"
|
|
1165
|
-
"name": "AvatarComponentMixin",
|
|
1166
|
-
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
1167
|
-
}
|
|
1096
|
+
"description": "Type of the variant can be `primary` or `secondary`.\nIt defines the background and foreground color of the icon.",
|
|
1097
|
+
"default": "primary",
|
|
1098
|
+
"fieldName": "variant"
|
|
1168
1099
|
},
|
|
1169
1100
|
{
|
|
1170
|
-
"name": "
|
|
1101
|
+
"name": "counter",
|
|
1171
1102
|
"type": {
|
|
1172
|
-
"text": "
|
|
1103
|
+
"text": "number | undefined"
|
|
1173
1104
|
},
|
|
1174
|
-
"description": "
|
|
1175
|
-
"fieldName": "
|
|
1176
|
-
"inheritedFrom": {
|
|
1177
|
-
"name": "AvatarComponentMixin",
|
|
1178
|
-
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
1179
|
-
}
|
|
1105
|
+
"description": "Counter is the number which can be provided in the badge.",
|
|
1106
|
+
"fieldName": "counter"
|
|
1180
1107
|
},
|
|
1181
1108
|
{
|
|
1182
|
-
"name": "
|
|
1109
|
+
"name": "max-counter",
|
|
1183
1110
|
"type": {
|
|
1184
|
-
"text": "
|
|
1111
|
+
"text": "number"
|
|
1185
1112
|
},
|
|
1186
|
-
"description": "
|
|
1187
|
-
"default": "
|
|
1188
|
-
"fieldName": "
|
|
1189
|
-
"inheritedFrom": {
|
|
1190
|
-
"name": "AvatarComponentMixin",
|
|
1191
|
-
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
1192
|
-
}
|
|
1113
|
+
"description": "The maximum number can be set up to 999, anything above that will be rendered as _999+_.\nThe max counter can be `9`, `99` or `999`.",
|
|
1114
|
+
"default": "99",
|
|
1115
|
+
"fieldName": "maxCounter"
|
|
1193
1116
|
},
|
|
1194
1117
|
{
|
|
1195
|
-
"name": "
|
|
1118
|
+
"name": "overlay",
|
|
1196
1119
|
"type": {
|
|
1197
|
-
"text": "
|
|
1120
|
+
"text": "boolean"
|
|
1198
1121
|
},
|
|
1199
|
-
"
|
|
1200
|
-
"
|
|
1201
|
-
"
|
|
1202
|
-
"name": "AvatarComponentMixin",
|
|
1203
|
-
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
1204
|
-
}
|
|
1122
|
+
"default": "false",
|
|
1123
|
+
"description": "Overlay is to add a thin outline to the badge.\nThis will help distinguish between the badge and the button,\nwhere the badge will be layered on top of a button.",
|
|
1124
|
+
"fieldName": "overlay"
|
|
1205
1125
|
},
|
|
1206
1126
|
{
|
|
1207
|
-
"name": "
|
|
1127
|
+
"name": "aria-label",
|
|
1208
1128
|
"type": {
|
|
1209
|
-
"text": "
|
|
1129
|
+
"text": "string | null"
|
|
1210
1130
|
},
|
|
1211
|
-
"default": "
|
|
1212
|
-
"description": "
|
|
1213
|
-
"fieldName": "
|
|
1214
|
-
"inheritedFrom": {
|
|
1215
|
-
"name": "AvatarComponentMixin",
|
|
1216
|
-
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
1217
|
-
}
|
|
1131
|
+
"default": "null",
|
|
1132
|
+
"description": "Aria-label attribute to be set for accessibility",
|
|
1133
|
+
"fieldName": "ariaLabel"
|
|
1218
1134
|
},
|
|
1219
1135
|
{
|
|
1220
1136
|
"name": "icon-name",
|
|
@@ -1228,7 +1144,20 @@
|
|
|
1228
1144
|
"module": "src/utils/mixins/IconNameMixin.ts"
|
|
1229
1145
|
}
|
|
1230
1146
|
}
|
|
1231
|
-
]
|
|
1147
|
+
],
|
|
1148
|
+
"mixins": [
|
|
1149
|
+
{
|
|
1150
|
+
"name": "IconNameMixin",
|
|
1151
|
+
"module": "/src/utils/mixins/IconNameMixin"
|
|
1152
|
+
}
|
|
1153
|
+
],
|
|
1154
|
+
"superclass": {
|
|
1155
|
+
"name": "Component",
|
|
1156
|
+
"module": "/src/models"
|
|
1157
|
+
},
|
|
1158
|
+
"tagName": "mdc-badge",
|
|
1159
|
+
"jsDoc": "/**\n * The `mdc-badge` component is a versatile UI element used to\n * display dot, icons, counters, success, warning and error type badge.\n *\n * Supported badge types:\n * - `dot`: Displays a dot notification badge with a blue color.\n * - `icon`: Displays a badge with a specified icon using the `icon-name` attribute.\n * - `counter`: Displays a badge with a counter value. If the counter exceeds the `max-counter`,\n * it shows `maxCounter+`. The maximum value of the counter is 999 and anything above that will be set to `999+`.\n * - `success`: Displays a success badge with a check circle icon and green color.\n * - `warning`: Displays a warning badge with a warning icon and yellow color.\n * - `error`: Displays a error badge with a error legacy icon and red color.\n *\n * For `icon`, `success`, `warning` and `error` types, the `mdc-icon` component is used to render the icon.\n *\n * For the `counter` type, the `mdc-text` component is used to render the counter value.\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @tagname mdc-badge\n *\n * @cssproperty --mdc-badge-primary-foreground-color - The foreground color of the primary badge.\n * @cssproperty --mdc-badge-primary-background-color - The background color of the primary badge.\n * @cssproperty --mdc-badge-secondary-foreground-color - The foreground color of the secondary badge.\n * @cssproperty --mdc-badge-secondary-background-color - The background color of the secondary badge.\n * @cssproperty --mdc-badge-success-foreground-color - The foreground color of the success badge.\n * @cssproperty --mdc-badge-success-background-color - The background color of the success badge.\n * @cssproperty --mdc-badge-warning-foreground-color - The foreground color of the warning badge.\n * @cssproperty --mdc-badge-warning-background-color - The background color of the warning badge.\n * @cssproperty --mdc-badge-error-foreground-color - The foreground color of the error badge.\n * @cssproperty --mdc-badge-error-background-color - The background color of the error badge.\n * @cssproperty --mdc-badge-overlay-background-color - The background color of the badge overlay.\n */",
|
|
1160
|
+
"customElement": true
|
|
1232
1161
|
}
|
|
1233
1162
|
],
|
|
1234
1163
|
"exports": [
|
|
@@ -1236,31 +1165,102 @@
|
|
|
1236
1165
|
"kind": "js",
|
|
1237
1166
|
"name": "default",
|
|
1238
1167
|
"declaration": {
|
|
1239
|
-
"name": "
|
|
1240
|
-
"module": "components/
|
|
1168
|
+
"name": "Badge",
|
|
1169
|
+
"module": "components/badge/badge.component.js"
|
|
1241
1170
|
}
|
|
1242
1171
|
}
|
|
1243
1172
|
]
|
|
1244
1173
|
},
|
|
1245
1174
|
{
|
|
1246
1175
|
"kind": "javascript-module",
|
|
1247
|
-
"path": "components/
|
|
1176
|
+
"path": "components/bullet/bullet.component.js",
|
|
1248
1177
|
"declarations": [
|
|
1249
1178
|
{
|
|
1250
1179
|
"kind": "class",
|
|
1251
|
-
"description": "
|
|
1252
|
-
"name": "
|
|
1253
|
-
"
|
|
1180
|
+
"description": "Bullet component, which is a visual marker\nand be used to organize and present items in a list format.",
|
|
1181
|
+
"name": "Bullet",
|
|
1182
|
+
"cssProperties": [
|
|
1254
1183
|
{
|
|
1255
|
-
"description": "
|
|
1256
|
-
"name": ""
|
|
1257
|
-
}
|
|
1258
|
-
],
|
|
1259
|
-
"members": [
|
|
1184
|
+
"description": "background color of the bullet",
|
|
1185
|
+
"name": "--mdc-bullet-background-color"
|
|
1186
|
+
},
|
|
1260
1187
|
{
|
|
1261
|
-
"
|
|
1262
|
-
"name": "
|
|
1263
|
-
|
|
1188
|
+
"description": "small size value of the bullet",
|
|
1189
|
+
"name": "--mdc-bullet-size-small"
|
|
1190
|
+
},
|
|
1191
|
+
{
|
|
1192
|
+
"description": "medium size value of the bullet",
|
|
1193
|
+
"name": "--mdc-bullet-size-medium"
|
|
1194
|
+
},
|
|
1195
|
+
{
|
|
1196
|
+
"description": "large size value of the bullet",
|
|
1197
|
+
"name": "--mdc-bullet-size-large"
|
|
1198
|
+
}
|
|
1199
|
+
],
|
|
1200
|
+
"members": [
|
|
1201
|
+
{
|
|
1202
|
+
"kind": "field",
|
|
1203
|
+
"name": "size",
|
|
1204
|
+
"type": {
|
|
1205
|
+
"text": "Size"
|
|
1206
|
+
},
|
|
1207
|
+
"privacy": "public",
|
|
1208
|
+
"description": "Size of the bullet\n\nPossible values: 'small', 'medium', 'large'",
|
|
1209
|
+
"default": "small",
|
|
1210
|
+
"attribute": "size",
|
|
1211
|
+
"reflects": true
|
|
1212
|
+
}
|
|
1213
|
+
],
|
|
1214
|
+
"attributes": [
|
|
1215
|
+
{
|
|
1216
|
+
"name": "size",
|
|
1217
|
+
"type": {
|
|
1218
|
+
"text": "Size"
|
|
1219
|
+
},
|
|
1220
|
+
"description": "Size of the bullet\n\nPossible values: 'small', 'medium', 'large'",
|
|
1221
|
+
"default": "small",
|
|
1222
|
+
"fieldName": "size"
|
|
1223
|
+
}
|
|
1224
|
+
],
|
|
1225
|
+
"superclass": {
|
|
1226
|
+
"name": "Component",
|
|
1227
|
+
"module": "/src/models"
|
|
1228
|
+
},
|
|
1229
|
+
"tagName": "mdc-bullet",
|
|
1230
|
+
"jsDoc": "/**\n * Bullet component, which is a visual marker\n * and be used to organize and present items in a list format.\n *\n * @tagname mdc-bullet\n *\n * @cssproperty --mdc-bullet-background-color - background color of the bullet\n * @cssproperty --mdc-bullet-size-small - small size value of the bullet\n * @cssproperty --mdc-bullet-size-medium - medium size value of the bullet\n * @cssproperty --mdc-bullet-size-large - large size value of the bullet\n*/",
|
|
1231
|
+
"customElement": true
|
|
1232
|
+
}
|
|
1233
|
+
],
|
|
1234
|
+
"exports": [
|
|
1235
|
+
{
|
|
1236
|
+
"kind": "js",
|
|
1237
|
+
"name": "default",
|
|
1238
|
+
"declaration": {
|
|
1239
|
+
"name": "Bullet",
|
|
1240
|
+
"module": "components/bullet/bullet.component.js"
|
|
1241
|
+
}
|
|
1242
|
+
}
|
|
1243
|
+
]
|
|
1244
|
+
},
|
|
1245
|
+
{
|
|
1246
|
+
"kind": "javascript-module",
|
|
1247
|
+
"path": "components/button/button.component.js",
|
|
1248
|
+
"declarations": [
|
|
1249
|
+
{
|
|
1250
|
+
"kind": "class",
|
|
1251
|
+
"description": "`mdc-button` is a component that can be configured in various ways to suit different use cases.\n\nButton Variants:\n- **Primary**: Solid background color.\n- **Secondary**: Transparent background with a solid border.\n- **Tertiary**: No background or border, appears as plain text but retains all button functionalities.\n\nButton Colors:\n- **Positive**: Green color.\n- **Negative**: Red color.\n- **Accent**: Blue color.\n- **Promotional**: Purple color.\n- **Default**: White color.\n\nButton Sizes (in REM units):\n- **Pill button**: 40, 32, 28, 24.\n- **Icon button**: 64, 52, 40, 32, 28, 24.\n- **Tertiary icon button**: 20.\n\nButton Types:\n- **Pill button**: A button that contains text value. Commonly used for call to action, tags, or filters.\n- **Pill button with icons**: A button containing an icon either on the left or right side of the button.\n- **Icon button**: A button represented by just an icon without any text.\nThe type of button is inferred based on the presence of slot and/or prefix and postfix icons.",
|
|
1252
|
+
"name": "Button",
|
|
1253
|
+
"slots": [
|
|
1254
|
+
{
|
|
1255
|
+
"description": "Text label of the button.",
|
|
1256
|
+
"name": ""
|
|
1257
|
+
}
|
|
1258
|
+
],
|
|
1259
|
+
"members": [
|
|
1260
|
+
{
|
|
1261
|
+
"kind": "field",
|
|
1262
|
+
"name": "prefixIcon",
|
|
1263
|
+
"type": {
|
|
1264
1264
|
"text": "string | undefined"
|
|
1265
1265
|
},
|
|
1266
1266
|
"description": "The name of the icon to display as a prefix.\nThe icon is displayed on the left side of the button.",
|
|
@@ -9002,232 +9002,1168 @@
|
|
|
9002
9002
|
}
|
|
9003
9003
|
},
|
|
9004
9004
|
{
|
|
9005
|
-
"description": "(React: onFocus) This event is dispatched when the tab receives focus.",
|
|
9006
|
-
"name": "focus",
|
|
9007
|
-
"reactName": "onFocus",
|
|
9008
|
-
"eventName": "FocusEvent",
|
|
9009
|
-
"inheritedFrom": {
|
|
9010
|
-
"name": "Buttonsimple",
|
|
9011
|
-
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
|
9012
|
-
}
|
|
9013
|
-
}
|
|
9014
|
-
],
|
|
9015
|
-
"attributes": [
|
|
9005
|
+
"description": "(React: onFocus) This event is dispatched when the tab receives focus.",
|
|
9006
|
+
"name": "focus",
|
|
9007
|
+
"reactName": "onFocus",
|
|
9008
|
+
"eventName": "FocusEvent",
|
|
9009
|
+
"inheritedFrom": {
|
|
9010
|
+
"name": "Buttonsimple",
|
|
9011
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
|
9012
|
+
}
|
|
9013
|
+
}
|
|
9014
|
+
],
|
|
9015
|
+
"attributes": [
|
|
9016
|
+
{
|
|
9017
|
+
"name": "text",
|
|
9018
|
+
"type": {
|
|
9019
|
+
"text": "string | undefined"
|
|
9020
|
+
},
|
|
9021
|
+
"description": "Text to be displayed in the tab.\nIf no `text` is provided, no text will be rendered,\n`aria-label` should be set on the tab.",
|
|
9022
|
+
"fieldName": "text"
|
|
9023
|
+
},
|
|
9024
|
+
{
|
|
9025
|
+
"name": "variant",
|
|
9026
|
+
"type": {
|
|
9027
|
+
"text": "Variant"
|
|
9028
|
+
},
|
|
9029
|
+
"description": "Tab can have three variants:\n- `glass`\n- `line`\n- `pill`\n\nIt defines the background and foreground color of the tab.",
|
|
9030
|
+
"default": "pill",
|
|
9031
|
+
"fieldName": "variant"
|
|
9032
|
+
},
|
|
9033
|
+
{
|
|
9034
|
+
"name": "icon-name",
|
|
9035
|
+
"type": {
|
|
9036
|
+
"text": "IconNames | undefined"
|
|
9037
|
+
},
|
|
9038
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
|
9039
|
+
"fieldName": "iconName",
|
|
9040
|
+
"inheritedFrom": {
|
|
9041
|
+
"name": "IconNameMixin",
|
|
9042
|
+
"module": "src/utils/mixins/IconNameMixin.ts"
|
|
9043
|
+
}
|
|
9044
|
+
},
|
|
9045
|
+
{
|
|
9046
|
+
"name": "tabIndex",
|
|
9047
|
+
"type": {
|
|
9048
|
+
"text": "number"
|
|
9049
|
+
},
|
|
9050
|
+
"default": "0",
|
|
9051
|
+
"description": "This property specifies the tab order of the element.",
|
|
9052
|
+
"fieldName": "tabIndex",
|
|
9053
|
+
"inheritedFrom": {
|
|
9054
|
+
"name": "Buttonsimple",
|
|
9055
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
|
9056
|
+
}
|
|
9057
|
+
},
|
|
9058
|
+
{
|
|
9059
|
+
"name": "disabled",
|
|
9060
|
+
"type": {
|
|
9061
|
+
"text": "boolean"
|
|
9062
|
+
},
|
|
9063
|
+
"default": "false",
|
|
9064
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
|
9065
|
+
"fieldName": "disabled",
|
|
9066
|
+
"inheritedFrom": {
|
|
9067
|
+
"name": "Buttonsimple",
|
|
9068
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
|
9069
|
+
}
|
|
9070
|
+
},
|
|
9071
|
+
{
|
|
9072
|
+
"name": "active",
|
|
9073
|
+
"type": {
|
|
9074
|
+
"text": "boolean"
|
|
9075
|
+
},
|
|
9076
|
+
"default": "false",
|
|
9077
|
+
"description": "The button's active state indicates whether it is currently toggled on (active) or off (inactive).\nWhen the active state is true, the button is considered to be in an active state, meaning it is toggled on.\nConversely, when the active state is false, the button is in an inactive state, indicating it is toggled off.",
|
|
9078
|
+
"fieldName": "active",
|
|
9079
|
+
"inheritedFrom": {
|
|
9080
|
+
"name": "Buttonsimple",
|
|
9081
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
|
9082
|
+
}
|
|
9083
|
+
},
|
|
9084
|
+
{
|
|
9085
|
+
"name": "soft-disabled",
|
|
9086
|
+
"type": {
|
|
9087
|
+
"text": "boolean"
|
|
9088
|
+
},
|
|
9089
|
+
"default": "false",
|
|
9090
|
+
"description": "Indicates whether the button is soft disabled.\nWhen set to `true`, the button appears visually disabled but still allows\nfocus, click, and keyboard actions to be passed through.\n\n**Important:** When using soft disabled, consumers must ensure that\nthe button behaves like a disabled button, allowing only focus and\npreventing any interactions (clicks or keyboard actions) from triggering unintended actions.",
|
|
9091
|
+
"fieldName": "softDisabled",
|
|
9092
|
+
"inheritedFrom": {
|
|
9093
|
+
"name": "Buttonsimple",
|
|
9094
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
|
9095
|
+
}
|
|
9096
|
+
},
|
|
9097
|
+
{
|
|
9098
|
+
"name": "size",
|
|
9099
|
+
"type": {
|
|
9100
|
+
"text": "ButtonSize"
|
|
9101
|
+
},
|
|
9102
|
+
"description": "Simplebutton size is a super set of all the sizes supported by children components.",
|
|
9103
|
+
"default": "32",
|
|
9104
|
+
"fieldName": "size",
|
|
9105
|
+
"inheritedFrom": {
|
|
9106
|
+
"name": "Buttonsimple",
|
|
9107
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
|
9108
|
+
}
|
|
9109
|
+
},
|
|
9110
|
+
{
|
|
9111
|
+
"name": "role",
|
|
9112
|
+
"description": "This property defines the ARIA role for the element. By default, it is set to 'button'.\nConsumers should override this role when:\n- The element is being used in a context where a different role is more appropriate.\n- Custom behaviors are implemented that require a specific ARIA role for accessibility purposes.",
|
|
9113
|
+
"default": "button",
|
|
9114
|
+
"fieldName": "role",
|
|
9115
|
+
"inheritedFrom": {
|
|
9116
|
+
"name": "Buttonsimple",
|
|
9117
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
|
9118
|
+
}
|
|
9119
|
+
},
|
|
9120
|
+
{
|
|
9121
|
+
"name": "type",
|
|
9122
|
+
"type": {
|
|
9123
|
+
"text": "ButtonType"
|
|
9124
|
+
},
|
|
9125
|
+
"description": "This property defines the type attribute for the button element.\nThe type attribute specifies the behavior of the button when it is clicked.\n- **submit**: The button submits the form data to the server.\n- **reset**: The button resets the form data to its initial state.\n- **button**: The button does nothing when clicked.",
|
|
9126
|
+
"default": "button",
|
|
9127
|
+
"fieldName": "type",
|
|
9128
|
+
"inheritedFrom": {
|
|
9129
|
+
"name": "Buttonsimple",
|
|
9130
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
|
9131
|
+
}
|
|
9132
|
+
}
|
|
9133
|
+
],
|
|
9134
|
+
"mixins": [
|
|
9135
|
+
{
|
|
9136
|
+
"name": "IconNameMixin",
|
|
9137
|
+
"module": "/src/utils/mixins/IconNameMixin"
|
|
9138
|
+
}
|
|
9139
|
+
],
|
|
9140
|
+
"superclass": {
|
|
9141
|
+
"name": "Buttonsimple",
|
|
9142
|
+
"module": "/src/components/buttonsimple/buttonsimple.component"
|
|
9143
|
+
},
|
|
9144
|
+
"tagName": "mdc-tab",
|
|
9145
|
+
"jsDoc": "/**\n * `mdc-tab` is Tab component to be used within the Tabgroup.\n *\n * Passing in the attribute `text` to the tab component is changing the text displayed in the tab.\n *\n * The `slot=\"badge\"` can be used to add a badge to the tab.\n *\n * The `slot=\"chip\"` can be used to add a chip to the tab.\n *\n * For `icon`, the `mdc-icon` component is used to render the icon.\n *\n * Note: Icons can be used in conjunction with badges or chips.\n * Badges and chips should not be used at the same time.\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @event click - (React: onClick) This event is dispatched when the tab is clicked.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the tab.\n * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the tab.\n * @event focus - (React: onFocus) This event is dispatched when the tab receives focus.\n *\n * @tagname mdc-tab\n *\n * @cssproperty --mdc-tab-content-gap - Gap between the badge(if provided), icon and text.\n * @cssproperty --mdc-tab-height - Height of the tab.\n * @cssproperty --mdc-tab-glass-active-background-color-disabled - Background color for active glass tab\n * in disabled state.\n * @cssproperty --mdc-tab-glass-active-background-color-hover - Background color for active glass tab in hover state.\n * @cssproperty --mdc-tab-glass-active-background-color-normal - Background color for active glass tab in rest state.\n * @cssproperty --mdc-tab-glass-active-background-color-pressed - Background color for active glass tab\n * in pressed state.\n * @cssproperty --mdc-tab-glass-active-color - Text and icon color for active glass tab.\n * @cssproperty --mdc-tab-glass-active-color-disabled - Text and icon color for active glass tab in disabled state.\n * @cssproperty --mdc-tab-glass-border-radius - Border radius for glass tab.\n * @cssproperty --mdc-tab-glass-inactive-background-color-disabled - Background color for inactive glass tab\n * in disabled state.\n * @cssproperty --mdc-tab-glass-inactive-background-color-hover - Background color for inactive glass tab\n * in hover state.\n * @cssproperty --mdc-tab-glass-inactive-background-color-normal - Background color for inactive glass tab\n * in rest state.\n * @cssproperty --mdc-tab-glass-inactive-background-color-pressed - Background color for inactive glass tab\n * in pressed state.\n * @cssproperty --mdc-tab-glass-inactive-color - Text and icon color for inactive glass tab.\n * @cssproperty --mdc-tab-glass-inactive-color-disabled - Text and icon color for inactive glass tab in disabled state.\n * @cssproperty --mdc-tab-line-active-background-color-pressed - Background color for active line tab in pressed state.\n * @cssproperty --mdc-tab-line-active-background-color-disabled - Background color for active line tab\n * in disabled state.\n * @cssproperty --mdc-tab-line-active-background-color-hover - Background color for active line tab in hover state.\n * @cssproperty --mdc-tab-line-active-background-color-normal - Background color for active line tab in rest state.\n * @cssproperty --mdc-tab-line-active-color - Text and icon color for active line tab.\n * @cssproperty --mdc-tab-line-active-color-disabled - Text and icon color for active line tab in disabled state.\n * @cssproperty --mdc-tab-line-active-indicator-color - color for indicator in active line tab.\n * @cssproperty --mdc-tab-line-active-indicator-color-disabled - Color for indicator in active line tab\n * in disabled state.\n * @cssproperty --mdc-tab-line-active-indicator-height - Height for indicator in active line tab.\n * @cssproperty --mdc-tab-line-active-indicator-width - Width for indicator in active line tab.\n * @cssproperty --mdc-tab-line-border-bottom-left-radius - Bottom left border radius for line tab.\n * @cssproperty --mdc-tab-line-border-bottom-right-radius - Bottom right border radius for line tab.\n * @cssproperty --mdc-tab-line-border-top-left-radius - Top left border radius for line tab.\n * @cssproperty --mdc-tab-line-border-top-right-radius - Top right border radius for line tab.\n * @cssproperty --mdc-tab-line-inactive-background-color-pressed - Background color for inactive line tab\n * in pressed state.\n * @cssproperty --mdc-tab-line-inactive-background-color-disabled - Background color for inactive line tab\n * in disabled state\n * @cssproperty --mdc-tab-line-inactive-background-color-hover - Background color for inactive line tab in hover state.\n * @cssproperty --mdc-tab-line-inactive-background-color-normal - Background color for inactive line tab\n * in rest state.\n * @cssproperty --mdc-tab-line-inactive-color - Text and icon color for inactive line tab.\n * @cssproperty --mdc-tab-line-inactive-color-disabled - Text and icon color for inactive line tab in disabled state.\n * @cssproperty --mdc-tab-padding-left - Padding left for the tab.\n * @cssproperty --mdc-tab-padding-right - Padding right for the tab.\n * @cssproperty --mdc-tab-pill-active-background-color-pressed - Background color for active pill tab in pressed state.\n * @cssproperty --mdc-tab-pill-active-background-color-disabled - Background color for active pill tab\n * in disabled state.\n * @cssproperty --mdc-tab-pill-active-background-color-hover - Background color for active pill tab in hover state.\n * @cssproperty --mdc-tab-pill-active-background-color-normal - Background color for active pill tab in rest state.\n * @cssproperty --mdc-tab-pill-active-color - Text and icon color for active pill tab.\n * @cssproperty --mdc-tab-pill-active-color-disabled - Text and icon color for active pill tab in disabled state.\n * @cssproperty --mdc-tab-pill-border-radius - Border radius for pill tab.\n * @cssproperty --mdc-tab-pill-inactive-background-color-pressed - Background color for inactive pill tab\n * in pressed state.\n * @cssproperty --mdc-tab-pill-inactive-background-color-disabled - Background color for inactive pill tab\n * in disabled state.\n * @cssproperty --mdc-tab-pill-inactive-background-color-hover - Background color for inactive pill tab in hover state.\n * @cssproperty --mdc-tab-pill-inactive-background-color-normal - Background color for inactive pill tab in rest state.\n * @cssproperty --mdc-tab-pill-inactive-color - Text and icon color for inactive pill tab.\n * @cssproperty --mdc-tab-pill-inactive-color-disabled - Text and icon color for inactive pill tab in disabled state.\n */",
|
|
9146
|
+
"customElement": true
|
|
9147
|
+
}
|
|
9148
|
+
],
|
|
9149
|
+
"exports": [
|
|
9150
|
+
{
|
|
9151
|
+
"kind": "js",
|
|
9152
|
+
"name": "default",
|
|
9153
|
+
"declaration": {
|
|
9154
|
+
"name": "Tab",
|
|
9155
|
+
"module": "components/tab/tab.component.js"
|
|
9156
|
+
}
|
|
9157
|
+
}
|
|
9158
|
+
]
|
|
9159
|
+
},
|
|
9160
|
+
{
|
|
9161
|
+
"kind": "javascript-module",
|
|
9162
|
+
"path": "components/text/text.component.js",
|
|
9163
|
+
"declarations": [
|
|
9164
|
+
{
|
|
9165
|
+
"kind": "class",
|
|
9166
|
+
"description": "Text component for creating styled text elements.\nIt has to be mounted within the ThemeProvider to access color and font tokens.\n\nThe `type` attribute allows changing the text style.\nThe `tagname` attribute allows changing the tag name of the text element.\nThe default tag name is `p`.\n\nThe `tagname` attribute should be a valid HTML tag name.\nIf the `tagname` attribute is not a valid HTML tag name, the default tag name will be used.\n\nThe styling is applied based on the `type` attribute.",
|
|
9167
|
+
"name": "Text",
|
|
9168
|
+
"cssParts": [
|
|
9169
|
+
{
|
|
9170
|
+
"description": "The text element",
|
|
9171
|
+
"name": "text"
|
|
9172
|
+
}
|
|
9173
|
+
],
|
|
9174
|
+
"slots": [
|
|
9175
|
+
{
|
|
9176
|
+
"description": "Default slot for text content",
|
|
9177
|
+
"name": ""
|
|
9178
|
+
}
|
|
9179
|
+
],
|
|
9180
|
+
"members": [
|
|
9181
|
+
{
|
|
9182
|
+
"kind": "field",
|
|
9183
|
+
"name": "type",
|
|
9184
|
+
"type": {
|
|
9185
|
+
"text": "TextType"
|
|
9186
|
+
},
|
|
9187
|
+
"privacy": "public",
|
|
9188
|
+
"description": "Specifies the text style to be applied.\n\nAcceptable values include:\n\n- 'body-small-regular'\n- 'body-small-medium'\n- 'body-small-bold'\n- 'body-midsize-regular'\n- 'body-midsize-medium'\n- 'body-midsize-bold'\n- 'body-large-regular'\n- 'body-large-medium'\n- 'body-large-bold'\n- 'body-small-regular-underline'\n- 'body-small-medium-underline'\n- 'body-midsize-regular-underline'\n- 'body-midsize-medium-underline'\n- 'body-large-regular-underline'\n- 'body-large-medium-underline'\n- 'heading-small-regular'\n- 'heading-small-medium'\n- 'heading-small-bold'\n- 'heading-midsize-regular'\n- 'heading-midsize-medium'\n- 'heading-midsize-bold'\n- 'heading-large-regular'\n- 'heading-large-medium'\n- 'heading-large-bold'\n- 'heading-xlarge-regular'\n- 'heading-xlarge-medium'\n- 'heading-xlarge-bold'\n- 'headline-small-light'\n- 'headline-small-regular'",
|
|
9189
|
+
"default": "body-large-regular",
|
|
9190
|
+
"attribute": "type",
|
|
9191
|
+
"reflects": true
|
|
9192
|
+
},
|
|
9193
|
+
{
|
|
9194
|
+
"kind": "field",
|
|
9195
|
+
"name": "tagname",
|
|
9196
|
+
"type": {
|
|
9197
|
+
"text": "TagName | undefined"
|
|
9198
|
+
},
|
|
9199
|
+
"privacy": "public",
|
|
9200
|
+
"description": "Specifies the HTML tag name for the text element. The default tag name is `p`.\nThis attribute is optional. When set, it changes the tag name of the text element.\n\nAcceptable values include:\n\n- 'h1'\n- 'h2'\n- 'h3'\n- 'h4'\n- 'h5'\n- 'h6'\n- 'p'\n- 'small'\n- 'span'\n- 'div'\n\nFor instance, setting this attribute to `h2` will render the text element as an `h2` element.\nNote that the styling is determined by the `type` attribute.",
|
|
9201
|
+
"attribute": "tagname",
|
|
9202
|
+
"reflects": true
|
|
9203
|
+
}
|
|
9204
|
+
],
|
|
9205
|
+
"attributes": [
|
|
9206
|
+
{
|
|
9207
|
+
"name": "type",
|
|
9208
|
+
"type": {
|
|
9209
|
+
"text": "TextType"
|
|
9210
|
+
},
|
|
9211
|
+
"description": "Specifies the text style to be applied.\n\nAcceptable values include:\n\n- 'body-small-regular'\n- 'body-small-medium'\n- 'body-small-bold'\n- 'body-midsize-regular'\n- 'body-midsize-medium'\n- 'body-midsize-bold'\n- 'body-large-regular'\n- 'body-large-medium'\n- 'body-large-bold'\n- 'body-small-regular-underline'\n- 'body-small-medium-underline'\n- 'body-midsize-regular-underline'\n- 'body-midsize-medium-underline'\n- 'body-large-regular-underline'\n- 'body-large-medium-underline'\n- 'heading-small-regular'\n- 'heading-small-medium'\n- 'heading-small-bold'\n- 'heading-midsize-regular'\n- 'heading-midsize-medium'\n- 'heading-midsize-bold'\n- 'heading-large-regular'\n- 'heading-large-medium'\n- 'heading-large-bold'\n- 'heading-xlarge-regular'\n- 'heading-xlarge-medium'\n- 'heading-xlarge-bold'\n- 'headline-small-light'\n- 'headline-small-regular'",
|
|
9212
|
+
"default": "body-large-regular",
|
|
9213
|
+
"fieldName": "type"
|
|
9214
|
+
},
|
|
9215
|
+
{
|
|
9216
|
+
"name": "tagname",
|
|
9217
|
+
"type": {
|
|
9218
|
+
"text": "TagName | undefined"
|
|
9219
|
+
},
|
|
9220
|
+
"description": "Specifies the HTML tag name for the text element. The default tag name is `p`.\nThis attribute is optional. When set, it changes the tag name of the text element.\n\nAcceptable values include:\n\n- 'h1'\n- 'h2'\n- 'h3'\n- 'h4'\n- 'h5'\n- 'h6'\n- 'p'\n- 'small'\n- 'span'\n- 'div'\n\nFor instance, setting this attribute to `h2` will render the text element as an `h2` element.\nNote that the styling is determined by the `type` attribute.",
|
|
9221
|
+
"fieldName": "tagname"
|
|
9222
|
+
}
|
|
9223
|
+
],
|
|
9224
|
+
"superclass": {
|
|
9225
|
+
"name": "Component",
|
|
9226
|
+
"module": "/src/models"
|
|
9227
|
+
},
|
|
9228
|
+
"tagName": "mdc-text",
|
|
9229
|
+
"jsDoc": "/**\n * Text component for creating styled text elements.\n * It has to be mounted within the ThemeProvider to access color and font tokens.\n *\n * The `type` attribute allows changing the text style.\n * The `tagname` attribute allows changing the tag name of the text element.\n * The default tag name is `p`.\n *\n * The `tagname` attribute should be a valid HTML tag name.\n * If the `tagname` attribute is not a valid HTML tag name, the default tag name will be used.\n *\n * The styling is applied based on the `type` attribute.\n *\n * @tagname mdc-text\n * @slot - Default slot for text content\n *\n * @csspart text - The text element\n */",
|
|
9230
|
+
"customElement": true
|
|
9231
|
+
}
|
|
9232
|
+
],
|
|
9233
|
+
"exports": [
|
|
9234
|
+
{
|
|
9235
|
+
"kind": "js",
|
|
9236
|
+
"name": "default",
|
|
9237
|
+
"declaration": {
|
|
9238
|
+
"name": "Text",
|
|
9239
|
+
"module": "components/text/text.component.js"
|
|
9240
|
+
}
|
|
9241
|
+
}
|
|
9242
|
+
]
|
|
9243
|
+
},
|
|
9244
|
+
{
|
|
9245
|
+
"kind": "javascript-module",
|
|
9246
|
+
"path": "components/textarea/textarea.component.js",
|
|
9247
|
+
"declarations": [
|
|
9248
|
+
{
|
|
9249
|
+
"kind": "class",
|
|
9250
|
+
"description": "mdc-textarea component, which is used to get the multi-line text input from the user.\nIt contains:\n- label: It is the title of the textarea field.\n- required-label: A string depicting that the textarea field is required.\n- Textarea: It is the multi-line text input field.\n- helper-text: It is the text that provides additional information about the textarea field.\n- max-character-limit: It is the text that shows the character count of the textarea field.\n- clear-button: A boolean value when marked to true represents a button that can\n clear the text value within the textarea field.\n- Error, Warning, Success, Priority Help Text type: It is the text that provides additional information\n about the textarea field based on the validation state.\n- limitexceeded: It is the event that is dispatched when the character limit exceeds or restored.\n This event exposes 3 properties:\n - currentCharacterCount - the current number of characters in the textarea field,\n - maxCharacterLimit - the maximum number of characters allowed in the textarea field,\n - value - the current value of the textarea field,\n\n**Note**: Consumers must set the help-text-type with 'error' and\nhelp-text attribute with the error message using limitexceeded event.\nThe same help-text value will be used for the validation message to be displayed.",
|
|
9251
|
+
"name": "Textarea",
|
|
9252
|
+
"cssProperties": [
|
|
9253
|
+
{
|
|
9254
|
+
"description": "Border color for the textarea container when disabled",
|
|
9255
|
+
"name": "--mdc-textarea-disabled-border-color"
|
|
9256
|
+
},
|
|
9257
|
+
{
|
|
9258
|
+
"description": "Text color for the textarea field when disabled",
|
|
9259
|
+
"name": "--mdc-textarea-disabled-text-color"
|
|
9260
|
+
},
|
|
9261
|
+
{
|
|
9262
|
+
"description": "Background color for the textarea field when disabled",
|
|
9263
|
+
"name": "--mdc-textarea-disabled-background-color"
|
|
9264
|
+
},
|
|
9265
|
+
{
|
|
9266
|
+
"description": "Text color for the textarea field",
|
|
9267
|
+
"name": "--mdc-textarea-text-color"
|
|
9268
|
+
},
|
|
9269
|
+
{
|
|
9270
|
+
"description": "Background color for the textarea field",
|
|
9271
|
+
"name": "--mdc-textarea-background-color"
|
|
9272
|
+
},
|
|
9273
|
+
{
|
|
9274
|
+
"description": "Border color for the textarea field",
|
|
9275
|
+
"name": "--mdc-textarea-border-color"
|
|
9276
|
+
},
|
|
9277
|
+
{
|
|
9278
|
+
"description": "Text color for the character counter",
|
|
9279
|
+
"name": "--mdc-textarea-text-secondary-normal"
|
|
9280
|
+
},
|
|
9281
|
+
{
|
|
9282
|
+
"description": "Border color for the error related help text",
|
|
9283
|
+
"name": "--mdc-textarea-error-border-color"
|
|
9284
|
+
},
|
|
9285
|
+
{
|
|
9286
|
+
"description": "Border color for the warning related help text",
|
|
9287
|
+
"name": "--mdc-textarea-warning-border-color"
|
|
9288
|
+
},
|
|
9289
|
+
{
|
|
9290
|
+
"description": "Border color for the success related help text",
|
|
9291
|
+
"name": "--mdc-textarea-success-border-color"
|
|
9292
|
+
},
|
|
9293
|
+
{
|
|
9294
|
+
"description": "Border color for the priority related help text",
|
|
9295
|
+
"name": "--mdc-textarea-primary-border-color"
|
|
9296
|
+
},
|
|
9297
|
+
{
|
|
9298
|
+
"description": "Background color for the textarea container when hover",
|
|
9299
|
+
"name": "--mdc-textarea-hover-background-color"
|
|
9300
|
+
},
|
|
9301
|
+
{
|
|
9302
|
+
"description": "Background color for the textarea container when focused",
|
|
9303
|
+
"name": "--mdc-textarea-focused-background-color"
|
|
9304
|
+
},
|
|
9305
|
+
{
|
|
9306
|
+
"description": "Border color for the textarea container when focused",
|
|
9307
|
+
"name": "--mdc-textarea-focused-border-color"
|
|
9308
|
+
}
|
|
9309
|
+
],
|
|
9310
|
+
"members": [
|
|
9311
|
+
{
|
|
9312
|
+
"kind": "field",
|
|
9313
|
+
"name": "placeholder",
|
|
9314
|
+
"type": {
|
|
9315
|
+
"text": "string | undefined"
|
|
9316
|
+
},
|
|
9317
|
+
"description": "The placeholder text that is displayed when the textarea field is empty.",
|
|
9318
|
+
"attribute": "placeholder"
|
|
9319
|
+
},
|
|
9320
|
+
{
|
|
9321
|
+
"kind": "field",
|
|
9322
|
+
"name": "readonly",
|
|
9323
|
+
"type": {
|
|
9324
|
+
"text": "boolean"
|
|
9325
|
+
},
|
|
9326
|
+
"default": "false",
|
|
9327
|
+
"description": "readonly attribute of the textarea field. If true, the textarea field is read-only.",
|
|
9328
|
+
"attribute": "readonly"
|
|
9329
|
+
},
|
|
9330
|
+
{
|
|
9331
|
+
"kind": "field",
|
|
9332
|
+
"name": "rows",
|
|
9333
|
+
"description": "The rows attribute specifies the visible number of lines in a text area.",
|
|
9334
|
+
"default": "5",
|
|
9335
|
+
"attribute": "rows"
|
|
9336
|
+
},
|
|
9337
|
+
{
|
|
9338
|
+
"kind": "field",
|
|
9339
|
+
"name": "cols",
|
|
9340
|
+
"description": "The cols attribute specifies the visible number of lines in a text area.",
|
|
9341
|
+
"default": "40",
|
|
9342
|
+
"attribute": "cols"
|
|
9343
|
+
},
|
|
9344
|
+
{
|
|
9345
|
+
"kind": "field",
|
|
9346
|
+
"name": "wrap",
|
|
9347
|
+
"type": {
|
|
9348
|
+
"text": "WrapType"
|
|
9349
|
+
},
|
|
9350
|
+
"description": "The wrap attribute specifies how the text in a text area is to be wrapped when submitted in a form.",
|
|
9351
|
+
"default": "'soft'",
|
|
9352
|
+
"attribute": "wrap"
|
|
9353
|
+
},
|
|
9354
|
+
{
|
|
9355
|
+
"kind": "field",
|
|
9356
|
+
"name": "autocapitalize",
|
|
9357
|
+
"type": {
|
|
9358
|
+
"text": "AutoCapitalizeType"
|
|
9359
|
+
},
|
|
9360
|
+
"description": "The autocapitalize attribute of the textarea field.",
|
|
9361
|
+
"default": "'off'",
|
|
9362
|
+
"attribute": "autocapitalize"
|
|
9363
|
+
},
|
|
9364
|
+
{
|
|
9365
|
+
"kind": "field",
|
|
9366
|
+
"name": "autocomplete",
|
|
9367
|
+
"type": {
|
|
9368
|
+
"text": "AutoCompleteType"
|
|
9369
|
+
},
|
|
9370
|
+
"description": "The autocomplete attribute of the textarea field.",
|
|
9371
|
+
"default": "'off'",
|
|
9372
|
+
"attribute": "autocomplete"
|
|
9373
|
+
},
|
|
9374
|
+
{
|
|
9375
|
+
"kind": "field",
|
|
9376
|
+
"name": "autofocus",
|
|
9377
|
+
"type": {
|
|
9378
|
+
"text": "boolean"
|
|
9379
|
+
},
|
|
9380
|
+
"default": "false",
|
|
9381
|
+
"description": "If true, the textarea field is focused when the component is rendered.",
|
|
9382
|
+
"attribute": "autofocus"
|
|
9383
|
+
},
|
|
9384
|
+
{
|
|
9385
|
+
"kind": "field",
|
|
9386
|
+
"name": "dirname",
|
|
9387
|
+
"type": {
|
|
9388
|
+
"text": "string | undefined"
|
|
9389
|
+
},
|
|
9390
|
+
"description": "Specifies the name of the directionality of text for submission purposes (e.g., \"rtl\" for right-to-left).",
|
|
9391
|
+
"attribute": "dirname"
|
|
9392
|
+
},
|
|
9393
|
+
{
|
|
9394
|
+
"kind": "field",
|
|
9395
|
+
"name": "maxlength",
|
|
9396
|
+
"type": {
|
|
9397
|
+
"text": "number | undefined"
|
|
9398
|
+
},
|
|
9399
|
+
"description": "The maximum number of characters that the textarea field can accept.",
|
|
9400
|
+
"attribute": "maxlength"
|
|
9401
|
+
},
|
|
9402
|
+
{
|
|
9403
|
+
"kind": "field",
|
|
9404
|
+
"name": "minlength",
|
|
9405
|
+
"type": {
|
|
9406
|
+
"text": "number | undefined"
|
|
9407
|
+
},
|
|
9408
|
+
"description": "The minimum number of characters that the textarea field can accept.",
|
|
9409
|
+
"attribute": "minlength"
|
|
9410
|
+
},
|
|
9411
|
+
{
|
|
9412
|
+
"kind": "field",
|
|
9413
|
+
"name": "clearButton",
|
|
9414
|
+
"type": {
|
|
9415
|
+
"text": "boolean"
|
|
9416
|
+
},
|
|
9417
|
+
"default": "false",
|
|
9418
|
+
"description": "The clear button when set to true, shows a clear button that clears the textarea field.",
|
|
9419
|
+
"attribute": "clear-button"
|
|
9420
|
+
},
|
|
9421
|
+
{
|
|
9422
|
+
"kind": "field",
|
|
9423
|
+
"name": "clearAriaLabel",
|
|
9424
|
+
"type": {
|
|
9425
|
+
"text": "string"
|
|
9426
|
+
},
|
|
9427
|
+
"default": "''",
|
|
9428
|
+
"description": "Aria label for the clear button. If clear button is set to true, this label is used for the clear button.",
|
|
9429
|
+
"attribute": "clear-aria-label"
|
|
9430
|
+
},
|
|
9431
|
+
{
|
|
9432
|
+
"kind": "field",
|
|
9433
|
+
"name": "maxCharacterLimit",
|
|
9434
|
+
"type": {
|
|
9435
|
+
"text": "number | undefined"
|
|
9436
|
+
},
|
|
9437
|
+
"description": "maximum character limit for the textarea field for character counter.",
|
|
9438
|
+
"attribute": "max-character-limit"
|
|
9439
|
+
},
|
|
9440
|
+
{
|
|
9441
|
+
"kind": "field",
|
|
9442
|
+
"name": "characterLimitExceedingFired",
|
|
9443
|
+
"type": {
|
|
9444
|
+
"text": "boolean"
|
|
9445
|
+
},
|
|
9446
|
+
"privacy": "private",
|
|
9447
|
+
"default": "false"
|
|
9448
|
+
},
|
|
9449
|
+
{
|
|
9450
|
+
"kind": "field",
|
|
9451
|
+
"name": "textarea",
|
|
9452
|
+
"type": {
|
|
9453
|
+
"text": "HTMLTextAreaElement"
|
|
9454
|
+
},
|
|
9455
|
+
"privacy": "protected",
|
|
9456
|
+
"readonly": true
|
|
9457
|
+
},
|
|
9458
|
+
{
|
|
9459
|
+
"kind": "method",
|
|
9460
|
+
"name": "setTextareaValidity",
|
|
9461
|
+
"privacy": "private"
|
|
9462
|
+
},
|
|
9463
|
+
{
|
|
9464
|
+
"kind": "method",
|
|
9465
|
+
"name": "handleValueChange",
|
|
9466
|
+
"description": "Handles the value change of the textarea field.\nSets the form value and updates the validity of the textarea field.",
|
|
9467
|
+
"return": {
|
|
9468
|
+
"type": {
|
|
9469
|
+
"text": ""
|
|
9470
|
+
}
|
|
9471
|
+
}
|
|
9472
|
+
},
|
|
9473
|
+
{
|
|
9474
|
+
"kind": "method",
|
|
9475
|
+
"name": "dispatchCharacterOverflowStateChangeEvent",
|
|
9476
|
+
"privacy": "private",
|
|
9477
|
+
"description": "Dispatches the character overflow state change event.",
|
|
9478
|
+
"return": {
|
|
9479
|
+
"type": {
|
|
9480
|
+
"text": ""
|
|
9481
|
+
}
|
|
9482
|
+
}
|
|
9483
|
+
},
|
|
9484
|
+
{
|
|
9485
|
+
"kind": "method",
|
|
9486
|
+
"name": "handleCharacterOverflowStateChange",
|
|
9487
|
+
"privacy": "private",
|
|
9488
|
+
"description": "Handles the character overflow state change.\nDispatches the character overflow state change event if the character limit is exceeded or restored.",
|
|
9489
|
+
"return": {
|
|
9490
|
+
"type": {
|
|
9491
|
+
"text": ""
|
|
9492
|
+
}
|
|
9493
|
+
}
|
|
9494
|
+
},
|
|
9495
|
+
{
|
|
9496
|
+
"kind": "method",
|
|
9497
|
+
"name": "updateValue",
|
|
9498
|
+
"privacy": "private",
|
|
9499
|
+
"description": "Updates the value of the textarea field.\nSets the form value.",
|
|
9500
|
+
"return": {
|
|
9501
|
+
"type": {
|
|
9502
|
+
"text": ""
|
|
9503
|
+
}
|
|
9504
|
+
}
|
|
9505
|
+
},
|
|
9506
|
+
{
|
|
9507
|
+
"kind": "method",
|
|
9508
|
+
"name": "onChange",
|
|
9509
|
+
"privacy": "private",
|
|
9510
|
+
"parameters": [
|
|
9511
|
+
{
|
|
9512
|
+
"name": "event",
|
|
9513
|
+
"type": {
|
|
9514
|
+
"text": "Event"
|
|
9515
|
+
},
|
|
9516
|
+
"description": "Event which contains information about the value change."
|
|
9517
|
+
}
|
|
9518
|
+
],
|
|
9519
|
+
"description": "Handles the change event of the textarea field.\nUpdates the value and sets the validity of the textarea field.\n\nThe 'change' event does not bubble up through the shadow DOM as it was not composed.\nTherefore, we need to re-dispatch the same event to ensure it is propagated correctly.\nRead more: https://developer.mozilla.org/en-US/docs/Web/API/Event/composed"
|
|
9520
|
+
},
|
|
9521
|
+
{
|
|
9522
|
+
"kind": "method",
|
|
9523
|
+
"name": "handleKeyDown",
|
|
9524
|
+
"privacy": "private",
|
|
9525
|
+
"parameters": [
|
|
9526
|
+
{
|
|
9527
|
+
"name": "event",
|
|
9528
|
+
"type": {
|
|
9529
|
+
"text": "KeyboardEvent"
|
|
9530
|
+
},
|
|
9531
|
+
"description": "Keyboard event"
|
|
9532
|
+
}
|
|
9533
|
+
],
|
|
9534
|
+
"description": "Handles the keydown event of the textarea field.\nClears the textarea field when the 'Enter' key is pressed.",
|
|
9535
|
+
"return": {
|
|
9536
|
+
"type": {
|
|
9537
|
+
"text": ""
|
|
9538
|
+
}
|
|
9539
|
+
}
|
|
9540
|
+
},
|
|
9541
|
+
{
|
|
9542
|
+
"kind": "method",
|
|
9543
|
+
"name": "clearInputText",
|
|
9544
|
+
"privacy": "private",
|
|
9545
|
+
"description": "Clears the textarea field.",
|
|
9546
|
+
"return": {
|
|
9547
|
+
"type": {
|
|
9548
|
+
"text": ""
|
|
9549
|
+
}
|
|
9550
|
+
}
|
|
9551
|
+
},
|
|
9552
|
+
{
|
|
9553
|
+
"kind": "method",
|
|
9554
|
+
"name": "renderClearButton",
|
|
9555
|
+
"privacy": "protected",
|
|
9556
|
+
"description": "Renders the clear button to clear the textarea field if the clearButton is set to true.",
|
|
9557
|
+
"return": {
|
|
9558
|
+
"type": {
|
|
9559
|
+
"text": ""
|
|
9560
|
+
}
|
|
9561
|
+
}
|
|
9562
|
+
},
|
|
9563
|
+
{
|
|
9564
|
+
"kind": "method",
|
|
9565
|
+
"name": "renderCharacterCounter",
|
|
9566
|
+
"privacy": "protected"
|
|
9567
|
+
},
|
|
9568
|
+
{
|
|
9569
|
+
"kind": "method",
|
|
9570
|
+
"name": "renderTextareaFooter",
|
|
9571
|
+
"privacy": "protected"
|
|
9572
|
+
},
|
|
9573
|
+
{
|
|
9574
|
+
"kind": "field",
|
|
9575
|
+
"name": "value",
|
|
9576
|
+
"type": {
|
|
9577
|
+
"text": "string"
|
|
9578
|
+
},
|
|
9579
|
+
"default": "''",
|
|
9580
|
+
"description": "Indicates the value of the component group (ex: input, checkbox, radio, select etc...)",
|
|
9581
|
+
"attribute": "value",
|
|
9582
|
+
"reflects": true,
|
|
9583
|
+
"inheritedFrom": {
|
|
9584
|
+
"name": "FormInternalsMixin",
|
|
9585
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
9586
|
+
}
|
|
9587
|
+
},
|
|
9588
|
+
{
|
|
9589
|
+
"kind": "field",
|
|
9590
|
+
"name": "name",
|
|
9591
|
+
"type": {
|
|
9592
|
+
"text": "string"
|
|
9593
|
+
},
|
|
9594
|
+
"default": "''",
|
|
9595
|
+
"description": "Indicates the name of the component group.\nThey are used to group elements in a form together.",
|
|
9596
|
+
"attribute": "name",
|
|
9597
|
+
"reflects": true,
|
|
9598
|
+
"inheritedFrom": {
|
|
9599
|
+
"name": "FormInternalsMixin",
|
|
9600
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
9601
|
+
}
|
|
9602
|
+
},
|
|
9603
|
+
{
|
|
9604
|
+
"kind": "field",
|
|
9605
|
+
"name": "validationMessage",
|
|
9606
|
+
"type": {
|
|
9607
|
+
"text": "string | undefined"
|
|
9608
|
+
},
|
|
9609
|
+
"description": "Custom validation message that will override the default message and displayed when the input is invalid.",
|
|
9610
|
+
"attribute": "validation-message",
|
|
9611
|
+
"reflects": true,
|
|
9612
|
+
"inheritedFrom": {
|
|
9613
|
+
"name": "FormInternalsMixin",
|
|
9614
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
9615
|
+
}
|
|
9616
|
+
},
|
|
9617
|
+
{
|
|
9618
|
+
"kind": "field",
|
|
9619
|
+
"name": "validity",
|
|
9620
|
+
"type": {
|
|
9621
|
+
"text": "ValidityState"
|
|
9622
|
+
},
|
|
9623
|
+
"readonly": true,
|
|
9624
|
+
"inheritedFrom": {
|
|
9625
|
+
"name": "FormInternalsMixin",
|
|
9626
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
9627
|
+
}
|
|
9628
|
+
},
|
|
9629
|
+
{
|
|
9630
|
+
"kind": "field",
|
|
9631
|
+
"name": "willValidate",
|
|
9632
|
+
"readonly": true,
|
|
9633
|
+
"inheritedFrom": {
|
|
9634
|
+
"name": "FormInternalsMixin",
|
|
9635
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
9636
|
+
}
|
|
9637
|
+
},
|
|
9638
|
+
{
|
|
9639
|
+
"kind": "method",
|
|
9640
|
+
"name": "setValidity",
|
|
9641
|
+
"description": "Sets the validity of the input field based on the input field's validity.",
|
|
9642
|
+
"return": {
|
|
9643
|
+
"type": {
|
|
9644
|
+
"text": ""
|
|
9645
|
+
}
|
|
9646
|
+
},
|
|
9647
|
+
"inheritedFrom": {
|
|
9648
|
+
"name": "FormInternalsMixin",
|
|
9649
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
9650
|
+
}
|
|
9651
|
+
},
|
|
9652
|
+
{
|
|
9653
|
+
"kind": "method",
|
|
9654
|
+
"name": "checkValidity",
|
|
9655
|
+
"return": {
|
|
9656
|
+
"type": {
|
|
9657
|
+
"text": "boolean"
|
|
9658
|
+
}
|
|
9659
|
+
},
|
|
9660
|
+
"inheritedFrom": {
|
|
9661
|
+
"name": "FormInternalsMixin",
|
|
9662
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
9663
|
+
}
|
|
9664
|
+
},
|
|
9665
|
+
{
|
|
9666
|
+
"kind": "method",
|
|
9667
|
+
"name": "reportValidity",
|
|
9668
|
+
"inheritedFrom": {
|
|
9669
|
+
"name": "FormInternalsMixin",
|
|
9670
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
9671
|
+
}
|
|
9672
|
+
},
|
|
9673
|
+
{
|
|
9674
|
+
"kind": "field",
|
|
9675
|
+
"name": "id",
|
|
9676
|
+
"type": {
|
|
9677
|
+
"text": "string"
|
|
9678
|
+
},
|
|
9679
|
+
"default": "`mdc-input-${uuidv4()}`",
|
|
9680
|
+
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
|
9681
|
+
"attribute": "id",
|
|
9682
|
+
"inheritedFrom": {
|
|
9683
|
+
"name": "FormfieldWrapper",
|
|
9684
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
9685
|
+
}
|
|
9686
|
+
},
|
|
9687
|
+
{
|
|
9688
|
+
"kind": "field",
|
|
9689
|
+
"name": "dataAriaLabel",
|
|
9690
|
+
"type": {
|
|
9691
|
+
"text": "string | null"
|
|
9692
|
+
},
|
|
9693
|
+
"default": "null",
|
|
9694
|
+
"description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
|
|
9695
|
+
"attribute": "data-aria-label",
|
|
9696
|
+
"reflects": true,
|
|
9697
|
+
"inheritedFrom": {
|
|
9698
|
+
"name": "DataAriaLabelMixin",
|
|
9699
|
+
"module": "utils/mixins/DataAriaLabelMixin.js"
|
|
9700
|
+
}
|
|
9701
|
+
},
|
|
9702
|
+
{
|
|
9703
|
+
"kind": "field",
|
|
9704
|
+
"name": "disabled",
|
|
9705
|
+
"type": {
|
|
9706
|
+
"text": "boolean"
|
|
9707
|
+
},
|
|
9708
|
+
"default": "false",
|
|
9709
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
|
9710
|
+
"attribute": "disabled",
|
|
9711
|
+
"reflects": true,
|
|
9712
|
+
"inheritedFrom": {
|
|
9713
|
+
"name": "FormfieldWrapper",
|
|
9714
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
9715
|
+
}
|
|
9716
|
+
},
|
|
9717
|
+
{
|
|
9718
|
+
"kind": "field",
|
|
9719
|
+
"name": "label",
|
|
9720
|
+
"type": {
|
|
9721
|
+
"text": "string | undefined"
|
|
9722
|
+
},
|
|
9723
|
+
"description": "The label of the input field. It is linked to the input field using the `for` attribute.",
|
|
9724
|
+
"attribute": "label",
|
|
9725
|
+
"reflects": true,
|
|
9726
|
+
"inheritedFrom": {
|
|
9727
|
+
"name": "FormfieldWrapper",
|
|
9728
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
9729
|
+
}
|
|
9730
|
+
},
|
|
9731
|
+
{
|
|
9732
|
+
"kind": "field",
|
|
9733
|
+
"name": "requiredLabel",
|
|
9734
|
+
"type": {
|
|
9735
|
+
"text": "string | undefined"
|
|
9736
|
+
},
|
|
9737
|
+
"description": "The required label of the input field.\nWhen an appropriate string value is set,\nthe input field is marked as required and the label is appended with this text.",
|
|
9738
|
+
"attribute": "required-label",
|
|
9739
|
+
"reflects": true,
|
|
9740
|
+
"inheritedFrom": {
|
|
9741
|
+
"name": "FormfieldWrapper",
|
|
9742
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
9743
|
+
}
|
|
9744
|
+
},
|
|
9745
|
+
{
|
|
9746
|
+
"kind": "field",
|
|
9747
|
+
"name": "helpTextType",
|
|
9748
|
+
"type": {
|
|
9749
|
+
"text": "ValidationType"
|
|
9750
|
+
},
|
|
9751
|
+
"description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
|
|
9752
|
+
"attribute": "help-text-type",
|
|
9753
|
+
"reflects": true,
|
|
9754
|
+
"inheritedFrom": {
|
|
9755
|
+
"name": "FormfieldWrapper",
|
|
9756
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
9757
|
+
}
|
|
9758
|
+
},
|
|
9759
|
+
{
|
|
9760
|
+
"kind": "field",
|
|
9761
|
+
"name": "helpText",
|
|
9762
|
+
"type": {
|
|
9763
|
+
"text": "string | undefined"
|
|
9764
|
+
},
|
|
9765
|
+
"description": "The help text that is displayed below the input field.",
|
|
9766
|
+
"attribute": "help-text",
|
|
9767
|
+
"reflects": true,
|
|
9768
|
+
"inheritedFrom": {
|
|
9769
|
+
"name": "FormfieldWrapper",
|
|
9770
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
9771
|
+
}
|
|
9772
|
+
},
|
|
9773
|
+
{
|
|
9774
|
+
"kind": "method",
|
|
9775
|
+
"name": "renderLabelElement",
|
|
9776
|
+
"privacy": "protected",
|
|
9777
|
+
"description": "creates the label element when the label property is set.\nid is used to link the label with the input field.",
|
|
9778
|
+
"return": {
|
|
9779
|
+
"type": {
|
|
9780
|
+
"text": ""
|
|
9781
|
+
}
|
|
9782
|
+
},
|
|
9783
|
+
"inheritedFrom": {
|
|
9784
|
+
"name": "FormfieldWrapper",
|
|
9785
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
9786
|
+
}
|
|
9787
|
+
},
|
|
9788
|
+
{
|
|
9789
|
+
"kind": "method",
|
|
9790
|
+
"name": "renderRequiredLabel",
|
|
9791
|
+
"privacy": "protected",
|
|
9792
|
+
"inheritedFrom": {
|
|
9793
|
+
"name": "FormfieldWrapper",
|
|
9794
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
9795
|
+
}
|
|
9796
|
+
},
|
|
9797
|
+
{
|
|
9798
|
+
"kind": "method",
|
|
9799
|
+
"name": "renderHelpTextIcon",
|
|
9800
|
+
"privacy": "protected",
|
|
9801
|
+
"description": "creates the helpertext icon based on the helpTextType for validation.\nIf the helpTextType is not set, it defaults to 'default' and it doesn't display any icon.",
|
|
9802
|
+
"return": {
|
|
9803
|
+
"type": {
|
|
9804
|
+
"text": ""
|
|
9805
|
+
}
|
|
9806
|
+
},
|
|
9807
|
+
"inheritedFrom": {
|
|
9808
|
+
"name": "FormfieldWrapper",
|
|
9809
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
9810
|
+
}
|
|
9811
|
+
},
|
|
9812
|
+
{
|
|
9813
|
+
"kind": "method",
|
|
9814
|
+
"name": "renderHelpText",
|
|
9815
|
+
"privacy": "protected",
|
|
9816
|
+
"description": "creates the helper text component when the helpertext value is set.\nIt is also used to display the validation message based on the helpTextType.",
|
|
9817
|
+
"return": {
|
|
9818
|
+
"type": {
|
|
9819
|
+
"text": ""
|
|
9820
|
+
}
|
|
9821
|
+
},
|
|
9822
|
+
"inheritedFrom": {
|
|
9823
|
+
"name": "FormfieldWrapper",
|
|
9824
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
9825
|
+
}
|
|
9826
|
+
},
|
|
9827
|
+
{
|
|
9828
|
+
"kind": "method",
|
|
9829
|
+
"name": "renderLabel",
|
|
9830
|
+
"privacy": "protected",
|
|
9831
|
+
"description": "renders the mdc-label-text container that contains the label and labelInfoToggleTip.",
|
|
9832
|
+
"return": {
|
|
9833
|
+
"type": {
|
|
9834
|
+
"text": ""
|
|
9835
|
+
}
|
|
9836
|
+
},
|
|
9837
|
+
"inheritedFrom": {
|
|
9838
|
+
"name": "FormfieldWrapper",
|
|
9839
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
9840
|
+
}
|
|
9841
|
+
},
|
|
9842
|
+
{
|
|
9843
|
+
"kind": "method",
|
|
9844
|
+
"name": "renderHelperText",
|
|
9845
|
+
"privacy": "protected",
|
|
9846
|
+
"description": "renders the mdc-help-text container that contains the helpertext icon and helpertext.",
|
|
9847
|
+
"return": {
|
|
9848
|
+
"type": {
|
|
9849
|
+
"text": ""
|
|
9850
|
+
}
|
|
9851
|
+
},
|
|
9852
|
+
"inheritedFrom": {
|
|
9853
|
+
"name": "FormfieldWrapper",
|
|
9854
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
9855
|
+
}
|
|
9856
|
+
}
|
|
9857
|
+
],
|
|
9858
|
+
"events": [
|
|
9859
|
+
{
|
|
9860
|
+
"name": "limitexceeded",
|
|
9861
|
+
"type": {
|
|
9862
|
+
"text": "CustomEvent"
|
|
9863
|
+
},
|
|
9864
|
+
"description": "(React: onLimitExceeded) This event is dispatched once when the character limit exceeds or restored.",
|
|
9865
|
+
"reactName": "onLimitExceeded",
|
|
9866
|
+
"eventName": "LimitexceededEvent"
|
|
9867
|
+
},
|
|
9868
|
+
{
|
|
9869
|
+
"type": {
|
|
9870
|
+
"text": "EventConstructor"
|
|
9871
|
+
}
|
|
9872
|
+
},
|
|
9873
|
+
{
|
|
9874
|
+
"description": "(React: onInput) This event is dispatched when the value of the textarea field changes (every press).",
|
|
9875
|
+
"name": "input",
|
|
9876
|
+
"reactName": "onInput",
|
|
9877
|
+
"eventName": "InputEvent"
|
|
9878
|
+
},
|
|
9879
|
+
{
|
|
9880
|
+
"description": "(React: onChange) This event is dispatched when the value of the textarea field changes (on blur).",
|
|
9881
|
+
"name": "change",
|
|
9882
|
+
"reactName": "onChange",
|
|
9883
|
+
"eventName": "ChangeEvent"
|
|
9884
|
+
},
|
|
9885
|
+
{
|
|
9886
|
+
"description": "(React: onFocus) This event is dispatched when the textarea receives focus.",
|
|
9887
|
+
"name": "focus",
|
|
9888
|
+
"reactName": "onFocus",
|
|
9889
|
+
"eventName": "FocusEvent"
|
|
9890
|
+
},
|
|
9891
|
+
{
|
|
9892
|
+
"description": "(React: onBlur) This event is dispatched when the textarea loses focus.",
|
|
9893
|
+
"name": "blur",
|
|
9894
|
+
"reactName": "onBlur",
|
|
9895
|
+
"eventName": "BlurEvent"
|
|
9896
|
+
}
|
|
9897
|
+
],
|
|
9898
|
+
"attributes": [
|
|
9899
|
+
{
|
|
9900
|
+
"name": "placeholder",
|
|
9901
|
+
"type": {
|
|
9902
|
+
"text": "string | undefined"
|
|
9903
|
+
},
|
|
9904
|
+
"description": "The placeholder text that is displayed when the textarea field is empty.",
|
|
9905
|
+
"fieldName": "placeholder"
|
|
9906
|
+
},
|
|
9907
|
+
{
|
|
9908
|
+
"name": "readonly",
|
|
9909
|
+
"type": {
|
|
9910
|
+
"text": "boolean"
|
|
9911
|
+
},
|
|
9912
|
+
"default": "false",
|
|
9913
|
+
"description": "readonly attribute of the textarea field. If true, the textarea field is read-only.",
|
|
9914
|
+
"fieldName": "readonly"
|
|
9915
|
+
},
|
|
9916
|
+
{
|
|
9917
|
+
"name": "rows",
|
|
9918
|
+
"description": "The rows attribute specifies the visible number of lines in a text area.",
|
|
9919
|
+
"default": "5",
|
|
9920
|
+
"fieldName": "rows"
|
|
9921
|
+
},
|
|
9922
|
+
{
|
|
9923
|
+
"name": "cols",
|
|
9924
|
+
"description": "The cols attribute specifies the visible number of lines in a text area.",
|
|
9925
|
+
"default": "40",
|
|
9926
|
+
"fieldName": "cols"
|
|
9927
|
+
},
|
|
9928
|
+
{
|
|
9929
|
+
"name": "wrap",
|
|
9930
|
+
"type": {
|
|
9931
|
+
"text": "WrapType"
|
|
9932
|
+
},
|
|
9933
|
+
"description": "The wrap attribute specifies how the text in a text area is to be wrapped when submitted in a form.",
|
|
9934
|
+
"default": "'soft'",
|
|
9935
|
+
"fieldName": "wrap"
|
|
9936
|
+
},
|
|
9937
|
+
{
|
|
9938
|
+
"name": "autocapitalize",
|
|
9939
|
+
"type": {
|
|
9940
|
+
"text": "AutoCapitalizeType"
|
|
9941
|
+
},
|
|
9942
|
+
"description": "The autocapitalize attribute of the textarea field.",
|
|
9943
|
+
"default": "'off'",
|
|
9944
|
+
"fieldName": "autocapitalize"
|
|
9945
|
+
},
|
|
9946
|
+
{
|
|
9947
|
+
"name": "autocomplete",
|
|
9948
|
+
"type": {
|
|
9949
|
+
"text": "AutoCompleteType"
|
|
9950
|
+
},
|
|
9951
|
+
"description": "The autocomplete attribute of the textarea field.",
|
|
9952
|
+
"default": "'off'",
|
|
9953
|
+
"fieldName": "autocomplete"
|
|
9954
|
+
},
|
|
9955
|
+
{
|
|
9956
|
+
"name": "autofocus",
|
|
9957
|
+
"type": {
|
|
9958
|
+
"text": "boolean"
|
|
9959
|
+
},
|
|
9960
|
+
"default": "false",
|
|
9961
|
+
"description": "If true, the textarea field is focused when the component is rendered.",
|
|
9962
|
+
"fieldName": "autofocus"
|
|
9963
|
+
},
|
|
9964
|
+
{
|
|
9965
|
+
"name": "dirname",
|
|
9966
|
+
"type": {
|
|
9967
|
+
"text": "string | undefined"
|
|
9968
|
+
},
|
|
9969
|
+
"description": "Specifies the name of the directionality of text for submission purposes (e.g., \"rtl\" for right-to-left).",
|
|
9970
|
+
"fieldName": "dirname"
|
|
9971
|
+
},
|
|
9972
|
+
{
|
|
9973
|
+
"name": "maxlength",
|
|
9974
|
+
"type": {
|
|
9975
|
+
"text": "number | undefined"
|
|
9976
|
+
},
|
|
9977
|
+
"description": "The maximum number of characters that the textarea field can accept.",
|
|
9978
|
+
"fieldName": "maxlength"
|
|
9979
|
+
},
|
|
9980
|
+
{
|
|
9981
|
+
"name": "minlength",
|
|
9982
|
+
"type": {
|
|
9983
|
+
"text": "number | undefined"
|
|
9984
|
+
},
|
|
9985
|
+
"description": "The minimum number of characters that the textarea field can accept.",
|
|
9986
|
+
"fieldName": "minlength"
|
|
9987
|
+
},
|
|
9988
|
+
{
|
|
9989
|
+
"name": "clear-button",
|
|
9990
|
+
"type": {
|
|
9991
|
+
"text": "boolean"
|
|
9992
|
+
},
|
|
9993
|
+
"default": "false",
|
|
9994
|
+
"description": "The clear button when set to true, shows a clear button that clears the textarea field.",
|
|
9995
|
+
"fieldName": "clearButton"
|
|
9996
|
+
},
|
|
9016
9997
|
{
|
|
9017
|
-
"name": "
|
|
9998
|
+
"name": "clear-aria-label",
|
|
9018
9999
|
"type": {
|
|
9019
|
-
"text": "string
|
|
10000
|
+
"text": "string"
|
|
9020
10001
|
},
|
|
9021
|
-
"
|
|
9022
|
-
"
|
|
10002
|
+
"default": "''",
|
|
10003
|
+
"description": "Aria label for the clear button. If clear button is set to true, this label is used for the clear button.",
|
|
10004
|
+
"fieldName": "clearAriaLabel"
|
|
9023
10005
|
},
|
|
9024
10006
|
{
|
|
9025
|
-
"name": "
|
|
10007
|
+
"name": "max-character-limit",
|
|
9026
10008
|
"type": {
|
|
9027
|
-
"text": "
|
|
10009
|
+
"text": "number | undefined"
|
|
9028
10010
|
},
|
|
9029
|
-
"description": "
|
|
9030
|
-
"
|
|
9031
|
-
"fieldName": "variant"
|
|
10011
|
+
"description": "maximum character limit for the textarea field for character counter.",
|
|
10012
|
+
"fieldName": "maxCharacterLimit"
|
|
9032
10013
|
},
|
|
9033
10014
|
{
|
|
9034
|
-
"name": "
|
|
10015
|
+
"name": "name",
|
|
9035
10016
|
"type": {
|
|
9036
|
-
"text": "
|
|
10017
|
+
"text": "string"
|
|
9037
10018
|
},
|
|
9038
|
-
"
|
|
9039
|
-
"
|
|
10019
|
+
"default": "''",
|
|
10020
|
+
"description": "Indicates the name of the component group.\nThey are used to group elements in a form together.",
|
|
10021
|
+
"fieldName": "name",
|
|
9040
10022
|
"inheritedFrom": {
|
|
9041
|
-
"name": "
|
|
9042
|
-
"module": "src/utils/mixins/
|
|
10023
|
+
"name": "FormInternalsMixin",
|
|
10024
|
+
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
|
9043
10025
|
}
|
|
9044
10026
|
},
|
|
9045
10027
|
{
|
|
9046
|
-
"name": "
|
|
10028
|
+
"name": "value",
|
|
9047
10029
|
"type": {
|
|
9048
|
-
"text": "
|
|
10030
|
+
"text": "string"
|
|
9049
10031
|
},
|
|
9050
|
-
"default": "
|
|
9051
|
-
"description": "
|
|
9052
|
-
"fieldName": "
|
|
10032
|
+
"default": "''",
|
|
10033
|
+
"description": "Indicates the value of the component group (ex: input, checkbox, radio, select etc...)",
|
|
10034
|
+
"fieldName": "value",
|
|
9053
10035
|
"inheritedFrom": {
|
|
9054
|
-
"name": "
|
|
9055
|
-
"module": "src/
|
|
10036
|
+
"name": "FormInternalsMixin",
|
|
10037
|
+
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
|
9056
10038
|
}
|
|
9057
10039
|
},
|
|
9058
10040
|
{
|
|
9059
|
-
"name": "
|
|
10041
|
+
"name": "validation-message",
|
|
9060
10042
|
"type": {
|
|
9061
|
-
"text": "
|
|
10043
|
+
"text": "string | undefined"
|
|
9062
10044
|
},
|
|
9063
|
-
"
|
|
9064
|
-
"
|
|
9065
|
-
"fieldName": "disabled",
|
|
10045
|
+
"description": "Custom validation message that will override the default message and displayed when the input is invalid.",
|
|
10046
|
+
"fieldName": "validationMessage",
|
|
9066
10047
|
"inheritedFrom": {
|
|
9067
|
-
"name": "
|
|
9068
|
-
"module": "src/
|
|
10048
|
+
"name": "FormInternalsMixin",
|
|
10049
|
+
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
|
9069
10050
|
}
|
|
9070
10051
|
},
|
|
9071
10052
|
{
|
|
9072
|
-
"name": "
|
|
10053
|
+
"name": "data-aria-label",
|
|
9073
10054
|
"type": {
|
|
9074
|
-
"text": "
|
|
10055
|
+
"text": "string | null"
|
|
9075
10056
|
},
|
|
9076
|
-
"default": "
|
|
9077
|
-
"description": "
|
|
9078
|
-
"fieldName": "
|
|
10057
|
+
"default": "null",
|
|
10058
|
+
"description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
|
|
10059
|
+
"fieldName": "dataAriaLabel",
|
|
9079
10060
|
"inheritedFrom": {
|
|
9080
|
-
"name": "
|
|
9081
|
-
"module": "src/
|
|
10061
|
+
"name": "DataAriaLabelMixin",
|
|
10062
|
+
"module": "src/utils/mixins/DataAriaLabelMixin.ts"
|
|
9082
10063
|
}
|
|
9083
10064
|
},
|
|
9084
10065
|
{
|
|
9085
|
-
"name": "
|
|
10066
|
+
"name": "disabled",
|
|
9086
10067
|
"type": {
|
|
9087
10068
|
"text": "boolean"
|
|
9088
10069
|
},
|
|
9089
10070
|
"default": "false",
|
|
9090
|
-
"description": "Indicates whether the
|
|
9091
|
-
"fieldName": "
|
|
10071
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
|
10072
|
+
"fieldName": "disabled",
|
|
9092
10073
|
"inheritedFrom": {
|
|
9093
|
-
"name": "
|
|
9094
|
-
"module": "src/components/
|
|
10074
|
+
"name": "FormfieldWrapper",
|
|
10075
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
9095
10076
|
}
|
|
9096
10077
|
},
|
|
9097
10078
|
{
|
|
9098
|
-
"name": "
|
|
10079
|
+
"name": "label",
|
|
9099
10080
|
"type": {
|
|
9100
|
-
"text": "
|
|
10081
|
+
"text": "string | undefined"
|
|
9101
10082
|
},
|
|
9102
|
-
"description": "
|
|
9103
|
-
"
|
|
9104
|
-
"fieldName": "size",
|
|
10083
|
+
"description": "The label of the input field. It is linked to the input field using the `for` attribute.",
|
|
10084
|
+
"fieldName": "label",
|
|
9105
10085
|
"inheritedFrom": {
|
|
9106
|
-
"name": "
|
|
9107
|
-
"module": "src/components/
|
|
10086
|
+
"name": "FormfieldWrapper",
|
|
10087
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
9108
10088
|
}
|
|
9109
10089
|
},
|
|
9110
10090
|
{
|
|
9111
|
-
"name": "
|
|
9112
|
-
"
|
|
9113
|
-
|
|
9114
|
-
|
|
10091
|
+
"name": "required-label",
|
|
10092
|
+
"type": {
|
|
10093
|
+
"text": "string | undefined"
|
|
10094
|
+
},
|
|
10095
|
+
"description": "The required label of the input field.\nWhen an appropriate string value is set,\nthe input field is marked as required and the label is appended with this text.",
|
|
10096
|
+
"fieldName": "requiredLabel",
|
|
9115
10097
|
"inheritedFrom": {
|
|
9116
|
-
"name": "
|
|
9117
|
-
"module": "src/components/
|
|
10098
|
+
"name": "FormfieldWrapper",
|
|
10099
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
9118
10100
|
}
|
|
9119
10101
|
},
|
|
9120
10102
|
{
|
|
9121
|
-
"name": "
|
|
10103
|
+
"name": "id",
|
|
9122
10104
|
"type": {
|
|
9123
|
-
"text": "
|
|
10105
|
+
"text": "string"
|
|
9124
10106
|
},
|
|
9125
|
-
"
|
|
9126
|
-
"
|
|
9127
|
-
"fieldName": "
|
|
10107
|
+
"default": "''",
|
|
10108
|
+
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
|
10109
|
+
"fieldName": "id",
|
|
9128
10110
|
"inheritedFrom": {
|
|
9129
|
-
"name": "
|
|
9130
|
-
"module": "src/components/
|
|
10111
|
+
"name": "FormfieldWrapper",
|
|
10112
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
9131
10113
|
}
|
|
9132
|
-
}
|
|
9133
|
-
],
|
|
9134
|
-
"mixins": [
|
|
9135
|
-
{
|
|
9136
|
-
"name": "IconNameMixin",
|
|
9137
|
-
"module": "/src/utils/mixins/IconNameMixin"
|
|
9138
|
-
}
|
|
9139
|
-
],
|
|
9140
|
-
"superclass": {
|
|
9141
|
-
"name": "Buttonsimple",
|
|
9142
|
-
"module": "/src/components/buttonsimple/buttonsimple.component"
|
|
9143
|
-
},
|
|
9144
|
-
"tagName": "mdc-tab",
|
|
9145
|
-
"jsDoc": "/**\n * `mdc-tab` is Tab component to be used within the Tabgroup.\n *\n * Passing in the attribute `text` to the tab component is changing the text displayed in the tab.\n *\n * The `slot=\"badge\"` can be used to add a badge to the tab.\n *\n * The `slot=\"chip\"` can be used to add a chip to the tab.\n *\n * For `icon`, the `mdc-icon` component is used to render the icon.\n *\n * Note: Icons can be used in conjunction with badges or chips.\n * Badges and chips should not be used at the same time.\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @event click - (React: onClick) This event is dispatched when the tab is clicked.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the tab.\n * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the tab.\n * @event focus - (React: onFocus) This event is dispatched when the tab receives focus.\n *\n * @tagname mdc-tab\n *\n * @cssproperty --mdc-tab-content-gap - Gap between the badge(if provided), icon and text.\n * @cssproperty --mdc-tab-height - Height of the tab.\n * @cssproperty --mdc-tab-glass-active-background-color-disabled - Background color for active glass tab\n * in disabled state.\n * @cssproperty --mdc-tab-glass-active-background-color-hover - Background color for active glass tab in hover state.\n * @cssproperty --mdc-tab-glass-active-background-color-normal - Background color for active glass tab in rest state.\n * @cssproperty --mdc-tab-glass-active-background-color-pressed - Background color for active glass tab\n * in pressed state.\n * @cssproperty --mdc-tab-glass-active-color - Text and icon color for active glass tab.\n * @cssproperty --mdc-tab-glass-active-color-disabled - Text and icon color for active glass tab in disabled state.\n * @cssproperty --mdc-tab-glass-border-radius - Border radius for glass tab.\n * @cssproperty --mdc-tab-glass-inactive-background-color-disabled - Background color for inactive glass tab\n * in disabled state.\n * @cssproperty --mdc-tab-glass-inactive-background-color-hover - Background color for inactive glass tab\n * in hover state.\n * @cssproperty --mdc-tab-glass-inactive-background-color-normal - Background color for inactive glass tab\n * in rest state.\n * @cssproperty --mdc-tab-glass-inactive-background-color-pressed - Background color for inactive glass tab\n * in pressed state.\n * @cssproperty --mdc-tab-glass-inactive-color - Text and icon color for inactive glass tab.\n * @cssproperty --mdc-tab-glass-inactive-color-disabled - Text and icon color for inactive glass tab in disabled state.\n * @cssproperty --mdc-tab-line-active-background-color-pressed - Background color for active line tab in pressed state.\n * @cssproperty --mdc-tab-line-active-background-color-disabled - Background color for active line tab\n * in disabled state.\n * @cssproperty --mdc-tab-line-active-background-color-hover - Background color for active line tab in hover state.\n * @cssproperty --mdc-tab-line-active-background-color-normal - Background color for active line tab in rest state.\n * @cssproperty --mdc-tab-line-active-color - Text and icon color for active line tab.\n * @cssproperty --mdc-tab-line-active-color-disabled - Text and icon color for active line tab in disabled state.\n * @cssproperty --mdc-tab-line-active-indicator-color - color for indicator in active line tab.\n * @cssproperty --mdc-tab-line-active-indicator-color-disabled - Color for indicator in active line tab\n * in disabled state.\n * @cssproperty --mdc-tab-line-active-indicator-height - Height for indicator in active line tab.\n * @cssproperty --mdc-tab-line-active-indicator-width - Width for indicator in active line tab.\n * @cssproperty --mdc-tab-line-border-bottom-left-radius - Bottom left border radius for line tab.\n * @cssproperty --mdc-tab-line-border-bottom-right-radius - Bottom right border radius for line tab.\n * @cssproperty --mdc-tab-line-border-top-left-radius - Top left border radius for line tab.\n * @cssproperty --mdc-tab-line-border-top-right-radius - Top right border radius for line tab.\n * @cssproperty --mdc-tab-line-inactive-background-color-pressed - Background color for inactive line tab\n * in pressed state.\n * @cssproperty --mdc-tab-line-inactive-background-color-disabled - Background color for inactive line tab\n * in disabled state\n * @cssproperty --mdc-tab-line-inactive-background-color-hover - Background color for inactive line tab in hover state.\n * @cssproperty --mdc-tab-line-inactive-background-color-normal - Background color for inactive line tab\n * in rest state.\n * @cssproperty --mdc-tab-line-inactive-color - Text and icon color for inactive line tab.\n * @cssproperty --mdc-tab-line-inactive-color-disabled - Text and icon color for inactive line tab in disabled state.\n * @cssproperty --mdc-tab-padding-left - Padding left for the tab.\n * @cssproperty --mdc-tab-padding-right - Padding right for the tab.\n * @cssproperty --mdc-tab-pill-active-background-color-pressed - Background color for active pill tab in pressed state.\n * @cssproperty --mdc-tab-pill-active-background-color-disabled - Background color for active pill tab\n * in disabled state.\n * @cssproperty --mdc-tab-pill-active-background-color-hover - Background color for active pill tab in hover state.\n * @cssproperty --mdc-tab-pill-active-background-color-normal - Background color for active pill tab in rest state.\n * @cssproperty --mdc-tab-pill-active-color - Text and icon color for active pill tab.\n * @cssproperty --mdc-tab-pill-active-color-disabled - Text and icon color for active pill tab in disabled state.\n * @cssproperty --mdc-tab-pill-border-radius - Border radius for pill tab.\n * @cssproperty --mdc-tab-pill-inactive-background-color-pressed - Background color for inactive pill tab\n * in pressed state.\n * @cssproperty --mdc-tab-pill-inactive-background-color-disabled - Background color for inactive pill tab\n * in disabled state.\n * @cssproperty --mdc-tab-pill-inactive-background-color-hover - Background color for inactive pill tab in hover state.\n * @cssproperty --mdc-tab-pill-inactive-background-color-normal - Background color for inactive pill tab in rest state.\n * @cssproperty --mdc-tab-pill-inactive-color - Text and icon color for inactive pill tab.\n * @cssproperty --mdc-tab-pill-inactive-color-disabled - Text and icon color for inactive pill tab in disabled state.\n */",
|
|
9146
|
-
"customElement": true
|
|
9147
|
-
}
|
|
9148
|
-
],
|
|
9149
|
-
"exports": [
|
|
9150
|
-
{
|
|
9151
|
-
"kind": "js",
|
|
9152
|
-
"name": "default",
|
|
9153
|
-
"declaration": {
|
|
9154
|
-
"name": "Tab",
|
|
9155
|
-
"module": "components/tab/tab.component.js"
|
|
9156
|
-
}
|
|
9157
|
-
}
|
|
9158
|
-
]
|
|
9159
|
-
},
|
|
9160
|
-
{
|
|
9161
|
-
"kind": "javascript-module",
|
|
9162
|
-
"path": "components/text/text.component.js",
|
|
9163
|
-
"declarations": [
|
|
9164
|
-
{
|
|
9165
|
-
"kind": "class",
|
|
9166
|
-
"description": "Text component for creating styled text elements.\nIt has to be mounted within the ThemeProvider to access color and font tokens.\n\nThe `type` attribute allows changing the text style.\nThe `tagname` attribute allows changing the tag name of the text element.\nThe default tag name is `p`.\n\nThe `tagname` attribute should be a valid HTML tag name.\nIf the `tagname` attribute is not a valid HTML tag name, the default tag name will be used.\n\nThe styling is applied based on the `type` attribute.",
|
|
9167
|
-
"name": "Text",
|
|
9168
|
-
"cssParts": [
|
|
9169
|
-
{
|
|
9170
|
-
"description": "The text element",
|
|
9171
|
-
"name": "text"
|
|
9172
|
-
}
|
|
9173
|
-
],
|
|
9174
|
-
"slots": [
|
|
9175
|
-
{
|
|
9176
|
-
"description": "Default slot for text content",
|
|
9177
|
-
"name": ""
|
|
9178
|
-
}
|
|
9179
|
-
],
|
|
9180
|
-
"members": [
|
|
10114
|
+
},
|
|
9181
10115
|
{
|
|
9182
|
-
"
|
|
9183
|
-
"name": "type",
|
|
10116
|
+
"name": "help-text-type",
|
|
9184
10117
|
"type": {
|
|
9185
|
-
"text": "
|
|
10118
|
+
"text": "ValidationType"
|
|
9186
10119
|
},
|
|
9187
|
-
"
|
|
9188
|
-
"
|
|
9189
|
-
"
|
|
9190
|
-
|
|
9191
|
-
|
|
10120
|
+
"description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
|
|
10121
|
+
"fieldName": "helpTextType",
|
|
10122
|
+
"inheritedFrom": {
|
|
10123
|
+
"name": "FormfieldWrapper",
|
|
10124
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
10125
|
+
}
|
|
9192
10126
|
},
|
|
9193
10127
|
{
|
|
9194
|
-
"
|
|
9195
|
-
"name": "tagname",
|
|
10128
|
+
"name": "help-text",
|
|
9196
10129
|
"type": {
|
|
9197
|
-
"text": "
|
|
10130
|
+
"text": "string | undefined"
|
|
9198
10131
|
},
|
|
9199
|
-
"
|
|
9200
|
-
"
|
|
9201
|
-
"
|
|
9202
|
-
|
|
10132
|
+
"description": "The help text that is displayed below the input field.",
|
|
10133
|
+
"fieldName": "helpText",
|
|
10134
|
+
"inheritedFrom": {
|
|
10135
|
+
"name": "FormfieldWrapper",
|
|
10136
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
10137
|
+
}
|
|
9203
10138
|
}
|
|
9204
10139
|
],
|
|
9205
|
-
"
|
|
10140
|
+
"mixins": [
|
|
9206
10141
|
{
|
|
9207
|
-
"name": "
|
|
9208
|
-
"
|
|
9209
|
-
"text": "TextType"
|
|
9210
|
-
},
|
|
9211
|
-
"description": "Specifies the text style to be applied.\n\nAcceptable values include:\n\n- 'body-small-regular'\n- 'body-small-medium'\n- 'body-small-bold'\n- 'body-midsize-regular'\n- 'body-midsize-medium'\n- 'body-midsize-bold'\n- 'body-large-regular'\n- 'body-large-medium'\n- 'body-large-bold'\n- 'body-small-regular-underline'\n- 'body-small-medium-underline'\n- 'body-midsize-regular-underline'\n- 'body-midsize-medium-underline'\n- 'body-large-regular-underline'\n- 'body-large-medium-underline'\n- 'heading-small-regular'\n- 'heading-small-medium'\n- 'heading-small-bold'\n- 'heading-midsize-regular'\n- 'heading-midsize-medium'\n- 'heading-midsize-bold'\n- 'heading-large-regular'\n- 'heading-large-medium'\n- 'heading-large-bold'\n- 'heading-xlarge-regular'\n- 'heading-xlarge-medium'\n- 'heading-xlarge-bold'\n- 'headline-small-light'\n- 'headline-small-regular'",
|
|
9212
|
-
"default": "body-large-regular",
|
|
9213
|
-
"fieldName": "type"
|
|
10142
|
+
"name": "FormInternalsMixin",
|
|
10143
|
+
"module": "/src/utils/mixins/FormInternalsMixin"
|
|
9214
10144
|
},
|
|
9215
10145
|
{
|
|
9216
|
-
"name": "
|
|
9217
|
-
"
|
|
9218
|
-
"text": "TagName | undefined"
|
|
9219
|
-
},
|
|
9220
|
-
"description": "Specifies the HTML tag name for the text element. The default tag name is `p`.\nThis attribute is optional. When set, it changes the tag name of the text element.\n\nAcceptable values include:\n\n- 'h1'\n- 'h2'\n- 'h3'\n- 'h4'\n- 'h5'\n- 'h6'\n- 'p'\n- 'small'\n- 'span'\n- 'div'\n\nFor instance, setting this attribute to `h2` will render the text element as an `h2` element.\nNote that the styling is determined by the `type` attribute.",
|
|
9221
|
-
"fieldName": "tagname"
|
|
10146
|
+
"name": "DataAriaLabelMixin",
|
|
10147
|
+
"module": "/src/utils/mixins/DataAriaLabelMixin"
|
|
9222
10148
|
}
|
|
9223
10149
|
],
|
|
9224
10150
|
"superclass": {
|
|
9225
|
-
"name": "
|
|
9226
|
-
"module": "/src/
|
|
10151
|
+
"name": "FormfieldWrapper",
|
|
10152
|
+
"module": "/src/components/formfieldwrapper"
|
|
9227
10153
|
},
|
|
9228
|
-
"tagName": "mdc-
|
|
9229
|
-
"jsDoc": "/**\n *
|
|
9230
|
-
"customElement": true
|
|
10154
|
+
"tagName": "mdc-textarea",
|
|
10155
|
+
"jsDoc": "/**\n * mdc-textarea component, which is used to get the multi-line text input from the user.\n * It contains:\n * - label: It is the title of the textarea field.\n * - required-label: A string depicting that the textarea field is required.\n * - Textarea: It is the multi-line text input field.\n * - helper-text: It is the text that provides additional information about the textarea field.\n * - max-character-limit: It is the text that shows the character count of the textarea field.\n * - clear-button: A boolean value when marked to true represents a button that can\n * clear the text value within the textarea field.\n * - Error, Warning, Success, Priority Help Text type: It is the text that provides additional information\n * about the textarea field based on the validation state.\n * - limitexceeded: It is the event that is dispatched when the character limit exceeds or restored.\n * This event exposes 3 properties:\n * - currentCharacterCount - the current number of characters in the textarea field,\n * - maxCharacterLimit - the maximum number of characters allowed in the textarea field,\n * - value - the current value of the textarea field,\n *\n * **Note**: Consumers must set the help-text-type with 'error' and\n * help-text attribute with the error message using limitexceeded event.\n * The same help-text value will be used for the validation message to be displayed.\n *\n * @tagname mdc-textarea\n *\n * @event input - (React: onInput) This event is dispatched when the value of the textarea field changes (every press).\n * @event change - (React: onChange) This event is dispatched when the value of the textarea field changes (on blur).\n * @event focus - (React: onFocus) This event is dispatched when the textarea receives focus.\n * @event blur - (React: onBlur) This event is dispatched when the textarea loses focus.\n * @event limitexceeded - (React: onLimitExceeded) This event is dispatched once when the character limit\n * exceeds or restored.\n *\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n * @dependency mdc-button\n *\n * @cssproperty --mdc-textarea-disabled-border-color - Border color for the textarea container when disabled\n * @cssproperty --mdc-textarea-disabled-text-color - Text color for the textarea field when disabled\n * @cssproperty --mdc-textarea-disabled-background-color - Background color for the textarea field when disabled\n * @cssproperty --mdc-textarea-text-color - Text color for the textarea field\n * @cssproperty --mdc-textarea-background-color - Background color for the textarea field\n * @cssproperty --mdc-textarea-border-color - Border color for the textarea field\n * @cssproperty --mdc-textarea-text-secondary-normal - Text color for the character counter\n * @cssproperty --mdc-textarea-error-border-color - Border color for the error related help text\n * @cssproperty --mdc-textarea-warning-border-color - Border color for the warning related help text\n * @cssproperty --mdc-textarea-success-border-color - Border color for the success related help text\n * @cssproperty --mdc-textarea-primary-border-color - Border color for the priority related help text\n * @cssproperty --mdc-textarea-hover-background-color - Background color for the textarea container when hover\n * @cssproperty --mdc-textarea-focused-background-color - Background color for the textarea container when focused\n * @cssproperty --mdc-textarea-focused-border-color - Border color for the textarea container when focused\n */",
|
|
10156
|
+
"customElement": true,
|
|
10157
|
+
"slots": [
|
|
10158
|
+
{
|
|
10159
|
+
"description": "slot to add the label info icon",
|
|
10160
|
+
"name": "label-info",
|
|
10161
|
+
"inheritedFrom": {
|
|
10162
|
+
"name": "FormfieldWrapper",
|
|
10163
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
10164
|
+
}
|
|
10165
|
+
}
|
|
10166
|
+
]
|
|
9231
10167
|
}
|
|
9232
10168
|
],
|
|
9233
10169
|
"exports": [
|
|
@@ -9235,8 +10171,8 @@
|
|
|
9235
10171
|
"kind": "js",
|
|
9236
10172
|
"name": "default",
|
|
9237
10173
|
"declaration": {
|
|
9238
|
-
"name": "
|
|
9239
|
-
"module": "components/
|
|
10174
|
+
"name": "Textarea",
|
|
10175
|
+
"module": "components/textarea/textarea.component.js"
|
|
9240
10176
|
}
|
|
9241
10177
|
}
|
|
9242
10178
|
]
|