@momentum-design/components 0.54.2 → 0.55.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/browser/index.js +164 -136
- package/dist/browser/index.js.map +4 -4
- package/dist/components/popover/popover.component.d.ts +2 -1
- package/dist/components/popover/popover.component.js +15 -12
- package/dist/components/popover/popover.styles.js +0 -1
- package/dist/components/popover/popover.utils.d.ts +8 -0
- package/dist/components/popover/popover.utils.js +28 -0
- package/dist/components/select/select.component.d.ts +3 -1
- package/dist/components/select/select.component.js +10 -3
- package/dist/components/toggletip/index.d.ts +9 -0
- package/dist/components/toggletip/index.js +6 -0
- package/dist/components/toggletip/toggletip.component.d.ts +66 -0
- package/dist/components/toggletip/toggletip.component.js +131 -0
- package/dist/components/toggletip/toggletip.constants.d.ts +10 -0
- package/dist/components/toggletip/toggletip.constants.js +12 -0
- package/dist/components/toggletip/toggletip.styles.d.ts +2 -0
- package/dist/components/toggletip/toggletip.styles.js +25 -0
- package/dist/components/toggletip/toggletip.types.d.ts +7 -0
- package/dist/components/toggletip/toggletip.types.js +1 -0
- package/dist/custom-elements.json +2453 -781
- package/dist/index.d.ts +2 -1
- package/dist/index.js +2 -1
- package/dist/react/index.d.ts +2 -1
- package/dist/react/index.js +2 -1
- package/dist/react/toggletip/index.d.ts +44 -0
- package/dist/react/toggletip/index.js +52 -0
- package/package.json +1 -1
|
@@ -4,476 +4,171 @@
|
|
|
4
4
|
"modules": [
|
|
5
5
|
{
|
|
6
6
|
"kind": "javascript-module",
|
|
7
|
-
"path": "components/
|
|
8
|
-
"declarations": [
|
|
9
|
-
{
|
|
10
|
-
"kind": "class",
|
|
11
|
-
"description": "The `mdc-appheader` component provides a structured and accessible app header layout.\nIt consists of three primary sections: leading, center, and trailing.\n\n- The **leading section** typically holds a **brand logo**, **brand name** or **menu icon**.\n- The **center section** can contain a **search bar**, **icons** or action controls.\n- The **trailing section** generally includes a **profile avatar**, **additional icons** or **action controls**.",
|
|
12
|
-
"name": "Appheader",
|
|
13
|
-
"cssParts": [
|
|
14
|
-
{
|
|
15
|
-
"description": "The main container for styling the header.",
|
|
16
|
-
"name": "container"
|
|
17
|
-
},
|
|
18
|
-
{
|
|
19
|
-
"description": "The leading section of the header.",
|
|
20
|
-
"name": "leading-section"
|
|
21
|
-
},
|
|
22
|
-
{
|
|
23
|
-
"description": "The center section of the header.",
|
|
24
|
-
"name": "center-section"
|
|
25
|
-
},
|
|
26
|
-
{
|
|
27
|
-
"description": "The trailing section of the header.",
|
|
28
|
-
"name": "trailing-section"
|
|
29
|
-
}
|
|
30
|
-
],
|
|
31
|
-
"slots": [
|
|
32
|
-
{
|
|
33
|
-
"description": "Slot for the leading section (e.g., brand logo, brand name).",
|
|
34
|
-
"name": "leading"
|
|
35
|
-
},
|
|
36
|
-
{
|
|
37
|
-
"description": "Slot for the center section (e.g., search bar, icons).",
|
|
38
|
-
"name": "center"
|
|
39
|
-
},
|
|
40
|
-
{
|
|
41
|
-
"description": "Slot for the trailing section (e.g., profile avatar, icons).",
|
|
42
|
-
"name": "trailing"
|
|
43
|
-
}
|
|
44
|
-
],
|
|
45
|
-
"members": [],
|
|
46
|
-
"superclass": {
|
|
47
|
-
"name": "Component",
|
|
48
|
-
"module": "/src/models"
|
|
49
|
-
},
|
|
50
|
-
"tagName": "mdc-appheader",
|
|
51
|
-
"jsDoc": "/**\n * The `mdc-appheader` component provides a structured and accessible app header layout.\n * It consists of three primary sections: leading, center, and trailing.\n *\n * - The **leading section** typically holds a **brand logo**, **brand name** or **menu icon**.\n * - The **center section** can contain a **search bar**, **icons** or action controls.\n * - The **trailing section** generally includes a **profile avatar**, **additional icons** or **action controls**.\n *\n * @tagname mdc-appheader\n *\n * @slot leading - Slot for the leading section (e.g., brand logo, brand name).\n * @slot center - Slot for the center section (e.g., search bar, icons).\n * @slot trailing - Slot for the trailing section (e.g., profile avatar, icons).\n *\n * @csspart container - The main container for styling the header.\n * @csspart leading-section - The leading section of the header.\n * @csspart center-section - The center section of the header.\n * @csspart trailing-section - The trailing section of the header.\n */",
|
|
52
|
-
"customElement": true
|
|
53
|
-
}
|
|
54
|
-
],
|
|
55
|
-
"exports": [
|
|
56
|
-
{
|
|
57
|
-
"kind": "js",
|
|
58
|
-
"name": "default",
|
|
59
|
-
"declaration": {
|
|
60
|
-
"name": "Appheader",
|
|
61
|
-
"module": "components/appheader/appheader.component.js"
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
]
|
|
65
|
-
},
|
|
66
|
-
{
|
|
67
|
-
"kind": "javascript-module",
|
|
68
|
-
"path": "components/avatar/avatar.component.js",
|
|
7
|
+
"path": "components/alertchip/alertchip.component.js",
|
|
69
8
|
"declarations": [
|
|
70
9
|
{
|
|
71
10
|
"kind": "class",
|
|
72
|
-
"description": "
|
|
73
|
-
"name": "
|
|
11
|
+
"description": "mdc-alertchip component is an interactive chip that consumers can use to represent an alert.\n\n- It supports a leading icon along with label.\n- It supports 5 variants of alerts - neutral, warning, error, success, and informational\n\nThis component is built by extending Buttonsimple.",
|
|
12
|
+
"name": "AlertChip",
|
|
74
13
|
"cssProperties": [
|
|
75
14
|
{
|
|
76
|
-
"description": "
|
|
77
|
-
"name": "--mdc-
|
|
78
|
-
},
|
|
79
|
-
{
|
|
80
|
-
"description": "Allows customization of the default foreground color.",
|
|
81
|
-
"name": "--mdc-avatar-default-foreground-color"
|
|
15
|
+
"description": "The color of the label text",
|
|
16
|
+
"name": "--mdc-chip-color"
|
|
82
17
|
},
|
|
83
18
|
{
|
|
84
|
-
"description": "
|
|
85
|
-
"name": "--mdc-
|
|
19
|
+
"description": "The color of the icon",
|
|
20
|
+
"name": "--mdc-chip-icon-color"
|
|
86
21
|
},
|
|
87
22
|
{
|
|
88
|
-
"description": "
|
|
89
|
-
"name": "--mdc-
|
|
23
|
+
"description": "The border color of the alertchip",
|
|
24
|
+
"name": "--mdc-chip-border-color"
|
|
90
25
|
},
|
|
91
26
|
{
|
|
92
|
-
"description": "
|
|
93
|
-
"name": "--mdc-
|
|
27
|
+
"description": "The background color of the alertchip",
|
|
28
|
+
"name": "--mdc-chip-background-color"
|
|
94
29
|
}
|
|
95
30
|
],
|
|
96
31
|
"members": [
|
|
97
32
|
{
|
|
98
33
|
"kind": "field",
|
|
99
|
-
"name": "
|
|
34
|
+
"name": "variant",
|
|
100
35
|
"type": {
|
|
101
|
-
"text": "
|
|
36
|
+
"text": "VariantType"
|
|
102
37
|
},
|
|
103
|
-
"description": "The
|
|
104
|
-
"
|
|
105
|
-
"
|
|
106
|
-
"name": "AvatarComponentMixin",
|
|
107
|
-
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
108
|
-
}
|
|
38
|
+
"description": "The variant of the alertchip. It supports 5 variants\n- neutral\n- warning\n- error\n- success\n- informational",
|
|
39
|
+
"default": "neutral",
|
|
40
|
+
"attribute": "variant"
|
|
109
41
|
},
|
|
110
42
|
{
|
|
111
43
|
"kind": "field",
|
|
112
|
-
"name": "
|
|
44
|
+
"name": "label",
|
|
113
45
|
"type": {
|
|
114
|
-
"text": "string
|
|
46
|
+
"text": "string"
|
|
115
47
|
},
|
|
116
|
-
"
|
|
117
|
-
"
|
|
118
|
-
"
|
|
119
|
-
"name": "AvatarComponentMixin",
|
|
120
|
-
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
121
|
-
}
|
|
48
|
+
"default": "''",
|
|
49
|
+
"description": "The visible label text of the alertchip.\n\nWe recommend limiting the <b>maximum length of the label text to 20 characters</b>,\nincluding empty spaces to split words.",
|
|
50
|
+
"attribute": "label"
|
|
122
51
|
},
|
|
123
52
|
{
|
|
124
53
|
"kind": "field",
|
|
125
|
-
"name": "
|
|
54
|
+
"name": "tabIndex",
|
|
126
55
|
"type": {
|
|
127
|
-
"text": "
|
|
56
|
+
"text": "number"
|
|
128
57
|
},
|
|
129
|
-
"
|
|
130
|
-
"
|
|
58
|
+
"default": "0",
|
|
59
|
+
"description": "This property specifies the tab order of the element.",
|
|
60
|
+
"attribute": "tabIndex",
|
|
61
|
+
"reflects": true,
|
|
131
62
|
"inheritedFrom": {
|
|
132
|
-
"name": "
|
|
133
|
-
"module": "utils/mixins/
|
|
63
|
+
"name": "TabIndexMixin",
|
|
64
|
+
"module": "utils/mixins/TabIndexMixin.js"
|
|
134
65
|
}
|
|
135
66
|
},
|
|
136
67
|
{
|
|
137
68
|
"kind": "field",
|
|
138
|
-
"name": "
|
|
69
|
+
"name": "disabled",
|
|
139
70
|
"type": {
|
|
140
|
-
"text": "
|
|
71
|
+
"text": "boolean | undefined"
|
|
141
72
|
},
|
|
142
|
-
"description": "
|
|
143
|
-
"default": "
|
|
144
|
-
"attribute": "
|
|
73
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
|
74
|
+
"default": "undefined",
|
|
75
|
+
"attribute": "disabled",
|
|
145
76
|
"reflects": true,
|
|
146
77
|
"inheritedFrom": {
|
|
147
|
-
"name": "
|
|
148
|
-
"module": "utils/mixins/
|
|
78
|
+
"name": "DisabledMixin",
|
|
79
|
+
"module": "utils/mixins/DisabledMixin.js"
|
|
149
80
|
}
|
|
150
81
|
},
|
|
151
82
|
{
|
|
152
83
|
"kind": "field",
|
|
153
|
-
"name": "
|
|
84
|
+
"name": "active",
|
|
154
85
|
"type": {
|
|
155
|
-
"text": "
|
|
86
|
+
"text": "boolean | undefined"
|
|
156
87
|
},
|
|
157
|
-
"description": "The
|
|
158
|
-
"
|
|
88
|
+
"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.\n\nThis attribute is used to set the provided `ariaStateKey` to true or false.",
|
|
89
|
+
"default": "undefined",
|
|
90
|
+
"attribute": "active",
|
|
91
|
+
"reflects": true,
|
|
159
92
|
"inheritedFrom": {
|
|
160
|
-
"name": "
|
|
161
|
-
"module": "
|
|
93
|
+
"name": "Buttonsimple",
|
|
94
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
162
95
|
}
|
|
163
96
|
},
|
|
164
97
|
{
|
|
165
98
|
"kind": "field",
|
|
166
|
-
"name": "
|
|
99
|
+
"name": "softDisabled",
|
|
167
100
|
"type": {
|
|
168
|
-
"text": "boolean"
|
|
101
|
+
"text": "boolean | undefined"
|
|
169
102
|
},
|
|
170
|
-
"
|
|
171
|
-
"
|
|
172
|
-
"attribute": "
|
|
103
|
+
"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.",
|
|
104
|
+
"default": "undefined",
|
|
105
|
+
"attribute": "soft-disabled",
|
|
173
106
|
"inheritedFrom": {
|
|
174
|
-
"name": "
|
|
175
|
-
"module": "
|
|
107
|
+
"name": "Buttonsimple",
|
|
108
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
176
109
|
}
|
|
177
110
|
},
|
|
178
111
|
{
|
|
179
112
|
"kind": "field",
|
|
180
|
-
"name": "
|
|
113
|
+
"name": "size",
|
|
181
114
|
"type": {
|
|
182
|
-
"text": "
|
|
115
|
+
"text": "ButtonSize"
|
|
183
116
|
},
|
|
184
|
-
"description": "
|
|
185
|
-
"
|
|
117
|
+
"description": "Simplebutton size is a super set of all the sizes supported by children components.",
|
|
118
|
+
"default": "32",
|
|
119
|
+
"attribute": "size",
|
|
120
|
+
"reflects": true,
|
|
186
121
|
"inheritedFrom": {
|
|
187
|
-
"name": "
|
|
188
|
-
"module": "
|
|
122
|
+
"name": "Buttonsimple",
|
|
123
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
189
124
|
}
|
|
190
|
-
}
|
|
191
|
-
],
|
|
192
|
-
"mixins": [
|
|
193
|
-
{
|
|
194
|
-
"name": "AvatarComponentMixin",
|
|
195
|
-
"module": "/src/utils/mixins/AvatarComponentMixin"
|
|
196
125
|
},
|
|
197
126
|
{
|
|
198
|
-
"
|
|
199
|
-
"
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
"module": "/src/models"
|
|
205
|
-
},
|
|
206
|
-
"tagName": "mdc-avatar",
|
|
207
|
-
"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 */",
|
|
208
|
-
"customElement": true,
|
|
209
|
-
"attributes": [
|
|
210
|
-
{
|
|
211
|
-
"name": "src",
|
|
212
|
-
"type": {
|
|
213
|
-
"text": "string | undefined"
|
|
214
|
-
},
|
|
215
|
-
"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.",
|
|
216
|
-
"fieldName": "src",
|
|
127
|
+
"kind": "field",
|
|
128
|
+
"name": "role",
|
|
129
|
+
"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.",
|
|
130
|
+
"default": "button",
|
|
131
|
+
"attribute": "role",
|
|
132
|
+
"reflects": true,
|
|
217
133
|
"inheritedFrom": {
|
|
218
|
-
"name": "
|
|
219
|
-
"module": "
|
|
134
|
+
"name": "Buttonsimple",
|
|
135
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
220
136
|
}
|
|
221
137
|
},
|
|
222
138
|
{
|
|
223
|
-
"
|
|
139
|
+
"kind": "field",
|
|
140
|
+
"name": "ariaStateKey",
|
|
224
141
|
"type": {
|
|
225
142
|
"text": "string | undefined"
|
|
226
143
|
},
|
|
227
|
-
"description": "
|
|
228
|
-
"
|
|
144
|
+
"description": "This property defines the ARIA state key, which will be toggled when the\nButton is set to `active`.\nThe default value is 'aria-pressed', which is commonly used for toggle buttons.\n\nConsumers can override this property to use a different ARIA state key if needed.\nIn case multiple aria attributes should be toggled, they can be passed in as\na comma separated string.\nFor example: `aria-pressed,aria-expanded`",
|
|
145
|
+
"default": "'aria-pressed' (when)",
|
|
146
|
+
"attribute": "ariaStateKey",
|
|
147
|
+
"reflects": true,
|
|
229
148
|
"inheritedFrom": {
|
|
230
|
-
"name": "
|
|
231
|
-
"module": "
|
|
149
|
+
"name": "Buttonsimple",
|
|
150
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
232
151
|
}
|
|
233
152
|
},
|
|
234
153
|
{
|
|
235
|
-
"
|
|
154
|
+
"kind": "field",
|
|
155
|
+
"name": "type",
|
|
236
156
|
"type": {
|
|
237
|
-
"text": "
|
|
157
|
+
"text": "ButtonType"
|
|
238
158
|
},
|
|
239
|
-
"description": "
|
|
240
|
-
"
|
|
159
|
+
"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.",
|
|
160
|
+
"default": "button",
|
|
161
|
+
"attribute": "type",
|
|
162
|
+
"reflects": true,
|
|
241
163
|
"inheritedFrom": {
|
|
242
|
-
"name": "
|
|
243
|
-
"module": "
|
|
164
|
+
"name": "Buttonsimple",
|
|
165
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
244
166
|
}
|
|
245
167
|
},
|
|
246
168
|
{
|
|
247
|
-
"
|
|
248
|
-
"
|
|
249
|
-
|
|
250
|
-
},
|
|
251
|
-
"description": "Acceptable values include (size in px unit):\n- 24\n- 32\n- 48\n- 64\n- 72\n- 88\n- 124",
|
|
252
|
-
"default": "32",
|
|
253
|
-
"fieldName": "size",
|
|
254
|
-
"inheritedFrom": {
|
|
255
|
-
"name": "AvatarComponentMixin",
|
|
256
|
-
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
257
|
-
}
|
|
258
|
-
},
|
|
259
|
-
{
|
|
260
|
-
"name": "counter",
|
|
261
|
-
"type": {
|
|
262
|
-
"text": "number | undefined"
|
|
263
|
-
},
|
|
264
|
-
"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`.",
|
|
265
|
-
"fieldName": "counter",
|
|
266
|
-
"inheritedFrom": {
|
|
267
|
-
"name": "AvatarComponentMixin",
|
|
268
|
-
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
269
|
-
}
|
|
270
|
-
},
|
|
271
|
-
{
|
|
272
|
-
"name": "is-typing",
|
|
273
|
-
"type": {
|
|
274
|
-
"text": "boolean"
|
|
275
|
-
},
|
|
276
|
-
"default": "false",
|
|
277
|
-
"description": "Represents the typing indicator when the user is typing.",
|
|
278
|
-
"fieldName": "isTyping",
|
|
279
|
-
"inheritedFrom": {
|
|
280
|
-
"name": "AvatarComponentMixin",
|
|
281
|
-
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
282
|
-
}
|
|
283
|
-
},
|
|
284
|
-
{
|
|
285
|
-
"name": "icon-name",
|
|
286
|
-
"type": {
|
|
287
|
-
"text": "IconNames | undefined"
|
|
288
|
-
},
|
|
289
|
-
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
|
290
|
-
"fieldName": "iconName",
|
|
291
|
-
"inheritedFrom": {
|
|
292
|
-
"name": "IconNameMixin",
|
|
293
|
-
"module": "src/utils/mixins/IconNameMixin.ts"
|
|
294
|
-
}
|
|
295
|
-
}
|
|
296
|
-
]
|
|
297
|
-
}
|
|
298
|
-
],
|
|
299
|
-
"exports": [
|
|
300
|
-
{
|
|
301
|
-
"kind": "js",
|
|
302
|
-
"name": "default",
|
|
303
|
-
"declaration": {
|
|
304
|
-
"name": "Avatar",
|
|
305
|
-
"module": "components/avatar/avatar.component.js"
|
|
306
|
-
}
|
|
307
|
-
}
|
|
308
|
-
]
|
|
309
|
-
},
|
|
310
|
-
{
|
|
311
|
-
"kind": "javascript-module",
|
|
312
|
-
"path": "components/alertchip/alertchip.component.js",
|
|
313
|
-
"declarations": [
|
|
314
|
-
{
|
|
315
|
-
"kind": "class",
|
|
316
|
-
"description": "mdc-alertchip component is an interactive chip that consumers can use to represent an alert.\n\n- It supports a leading icon along with label.\n- It supports 5 variants of alerts - neutral, warning, error, success, and informational\n\nThis component is built by extending Buttonsimple.",
|
|
317
|
-
"name": "AlertChip",
|
|
318
|
-
"cssProperties": [
|
|
319
|
-
{
|
|
320
|
-
"description": "The color of the label text",
|
|
321
|
-
"name": "--mdc-chip-color"
|
|
322
|
-
},
|
|
323
|
-
{
|
|
324
|
-
"description": "The color of the icon",
|
|
325
|
-
"name": "--mdc-chip-icon-color"
|
|
326
|
-
},
|
|
327
|
-
{
|
|
328
|
-
"description": "The border color of the alertchip",
|
|
329
|
-
"name": "--mdc-chip-border-color"
|
|
330
|
-
},
|
|
331
|
-
{
|
|
332
|
-
"description": "The background color of the alertchip",
|
|
333
|
-
"name": "--mdc-chip-background-color"
|
|
334
|
-
}
|
|
335
|
-
],
|
|
336
|
-
"members": [
|
|
337
|
-
{
|
|
338
|
-
"kind": "field",
|
|
339
|
-
"name": "variant",
|
|
340
|
-
"type": {
|
|
341
|
-
"text": "VariantType"
|
|
342
|
-
},
|
|
343
|
-
"description": "The variant of the alertchip. It supports 5 variants\n- neutral\n- warning\n- error\n- success\n- informational",
|
|
344
|
-
"default": "neutral",
|
|
345
|
-
"attribute": "variant"
|
|
346
|
-
},
|
|
347
|
-
{
|
|
348
|
-
"kind": "field",
|
|
349
|
-
"name": "label",
|
|
350
|
-
"type": {
|
|
351
|
-
"text": "string"
|
|
352
|
-
},
|
|
353
|
-
"default": "''",
|
|
354
|
-
"description": "The visible label text of the alertchip.\n\nWe recommend limiting the <b>maximum length of the label text to 20 characters</b>,\nincluding empty spaces to split words.",
|
|
355
|
-
"attribute": "label"
|
|
356
|
-
},
|
|
357
|
-
{
|
|
358
|
-
"kind": "field",
|
|
359
|
-
"name": "tabIndex",
|
|
360
|
-
"type": {
|
|
361
|
-
"text": "number"
|
|
362
|
-
},
|
|
363
|
-
"default": "0",
|
|
364
|
-
"description": "This property specifies the tab order of the element.",
|
|
365
|
-
"attribute": "tabIndex",
|
|
366
|
-
"reflects": true,
|
|
367
|
-
"inheritedFrom": {
|
|
368
|
-
"name": "TabIndexMixin",
|
|
369
|
-
"module": "utils/mixins/TabIndexMixin.js"
|
|
370
|
-
}
|
|
371
|
-
},
|
|
372
|
-
{
|
|
373
|
-
"kind": "field",
|
|
374
|
-
"name": "disabled",
|
|
375
|
-
"type": {
|
|
376
|
-
"text": "boolean | undefined"
|
|
377
|
-
},
|
|
378
|
-
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
|
379
|
-
"default": "undefined",
|
|
380
|
-
"attribute": "disabled",
|
|
381
|
-
"reflects": true,
|
|
382
|
-
"inheritedFrom": {
|
|
383
|
-
"name": "DisabledMixin",
|
|
384
|
-
"module": "utils/mixins/DisabledMixin.js"
|
|
385
|
-
}
|
|
386
|
-
},
|
|
387
|
-
{
|
|
388
|
-
"kind": "field",
|
|
389
|
-
"name": "active",
|
|
390
|
-
"type": {
|
|
391
|
-
"text": "boolean | undefined"
|
|
392
|
-
},
|
|
393
|
-
"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.\n\nThis attribute is used to set the provided `ariaStateKey` to true or false.",
|
|
394
|
-
"default": "undefined",
|
|
395
|
-
"attribute": "active",
|
|
396
|
-
"reflects": true,
|
|
397
|
-
"inheritedFrom": {
|
|
398
|
-
"name": "Buttonsimple",
|
|
399
|
-
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
400
|
-
}
|
|
401
|
-
},
|
|
402
|
-
{
|
|
403
|
-
"kind": "field",
|
|
404
|
-
"name": "softDisabled",
|
|
405
|
-
"type": {
|
|
406
|
-
"text": "boolean | undefined"
|
|
407
|
-
},
|
|
408
|
-
"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.",
|
|
409
|
-
"default": "undefined",
|
|
410
|
-
"attribute": "soft-disabled",
|
|
411
|
-
"inheritedFrom": {
|
|
412
|
-
"name": "Buttonsimple",
|
|
413
|
-
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
414
|
-
}
|
|
415
|
-
},
|
|
416
|
-
{
|
|
417
|
-
"kind": "field",
|
|
418
|
-
"name": "size",
|
|
419
|
-
"type": {
|
|
420
|
-
"text": "ButtonSize"
|
|
421
|
-
},
|
|
422
|
-
"description": "Simplebutton size is a super set of all the sizes supported by children components.",
|
|
423
|
-
"default": "32",
|
|
424
|
-
"attribute": "size",
|
|
425
|
-
"reflects": true,
|
|
426
|
-
"inheritedFrom": {
|
|
427
|
-
"name": "Buttonsimple",
|
|
428
|
-
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
429
|
-
}
|
|
430
|
-
},
|
|
431
|
-
{
|
|
432
|
-
"kind": "field",
|
|
433
|
-
"name": "role",
|
|
434
|
-
"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.",
|
|
435
|
-
"default": "button",
|
|
436
|
-
"attribute": "role",
|
|
437
|
-
"reflects": true,
|
|
438
|
-
"inheritedFrom": {
|
|
439
|
-
"name": "Buttonsimple",
|
|
440
|
-
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
441
|
-
}
|
|
442
|
-
},
|
|
443
|
-
{
|
|
444
|
-
"kind": "field",
|
|
445
|
-
"name": "ariaStateKey",
|
|
446
|
-
"type": {
|
|
447
|
-
"text": "string | undefined"
|
|
448
|
-
},
|
|
449
|
-
"description": "This property defines the ARIA state key, which will be toggled when the\nButton is set to `active`.\nThe default value is 'aria-pressed', which is commonly used for toggle buttons.\n\nConsumers can override this property to use a different ARIA state key if needed.\nIn case multiple aria attributes should be toggled, they can be passed in as\na comma separated string.\nFor example: `aria-pressed,aria-expanded`",
|
|
450
|
-
"default": "'aria-pressed' (when)",
|
|
451
|
-
"attribute": "ariaStateKey",
|
|
452
|
-
"reflects": true,
|
|
453
|
-
"inheritedFrom": {
|
|
454
|
-
"name": "Buttonsimple",
|
|
455
|
-
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
456
|
-
}
|
|
457
|
-
},
|
|
458
|
-
{
|
|
459
|
-
"kind": "field",
|
|
460
|
-
"name": "type",
|
|
461
|
-
"type": {
|
|
462
|
-
"text": "ButtonType"
|
|
463
|
-
},
|
|
464
|
-
"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.",
|
|
465
|
-
"default": "button",
|
|
466
|
-
"attribute": "type",
|
|
467
|
-
"reflects": true,
|
|
468
|
-
"inheritedFrom": {
|
|
469
|
-
"name": "Buttonsimple",
|
|
470
|
-
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
471
|
-
}
|
|
472
|
-
},
|
|
473
|
-
{
|
|
474
|
-
"kind": "method",
|
|
475
|
-
"name": "executeAction",
|
|
476
|
-
"privacy": "protected",
|
|
169
|
+
"kind": "method",
|
|
170
|
+
"name": "executeAction",
|
|
171
|
+
"privacy": "protected",
|
|
477
172
|
"inheritedFrom": {
|
|
478
173
|
"name": "Buttonsimple",
|
|
479
174
|
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
@@ -798,50 +493,96 @@
|
|
|
798
493
|
},
|
|
799
494
|
{
|
|
800
495
|
"kind": "javascript-module",
|
|
801
|
-
"path": "components/
|
|
496
|
+
"path": "components/appheader/appheader.component.js",
|
|
802
497
|
"declarations": [
|
|
803
498
|
{
|
|
804
499
|
"kind": "class",
|
|
805
|
-
"description": "The `mdc-
|
|
806
|
-
"name": "
|
|
807
|
-
"
|
|
500
|
+
"description": "The `mdc-appheader` component provides a structured and accessible app header layout.\nIt consists of three primary sections: leading, center, and trailing.\n\n- The **leading section** typically holds a **brand logo**, **brand name** or **menu icon**.\n- The **center section** can contain a **search bar**, **icons** or action controls.\n- The **trailing section** generally includes a **profile avatar**, **additional icons** or **action controls**.",
|
|
501
|
+
"name": "Appheader",
|
|
502
|
+
"cssParts": [
|
|
808
503
|
{
|
|
809
|
-
"description": "
|
|
810
|
-
"name": "
|
|
504
|
+
"description": "The main container for styling the header.",
|
|
505
|
+
"name": "container"
|
|
811
506
|
},
|
|
812
507
|
{
|
|
813
|
-
"description": "
|
|
814
|
-
"name": "
|
|
508
|
+
"description": "The leading section of the header.",
|
|
509
|
+
"name": "leading-section"
|
|
815
510
|
},
|
|
816
511
|
{
|
|
817
|
-
"description": "
|
|
818
|
-
"name": "
|
|
512
|
+
"description": "The center section of the header.",
|
|
513
|
+
"name": "center-section"
|
|
514
|
+
},
|
|
515
|
+
{
|
|
516
|
+
"description": "The trailing section of the header.",
|
|
517
|
+
"name": "trailing-section"
|
|
819
518
|
}
|
|
820
519
|
],
|
|
821
|
-
"
|
|
520
|
+
"slots": [
|
|
822
521
|
{
|
|
823
|
-
"
|
|
824
|
-
"name": "
|
|
825
|
-
"type": {
|
|
826
|
-
"text": "string | null"
|
|
827
|
-
},
|
|
828
|
-
"default": "null",
|
|
829
|
-
"description": "Aria-label attribute to be set for accessibility",
|
|
830
|
-
"attribute": "aria-label"
|
|
522
|
+
"description": "Slot for the leading section (e.g., brand logo, brand name).",
|
|
523
|
+
"name": "leading"
|
|
831
524
|
},
|
|
832
525
|
{
|
|
833
|
-
"
|
|
834
|
-
"name": "
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
526
|
+
"description": "Slot for the center section (e.g., search bar, icons).",
|
|
527
|
+
"name": "center"
|
|
528
|
+
},
|
|
529
|
+
{
|
|
530
|
+
"description": "Slot for the trailing section (e.g., profile avatar, icons).",
|
|
531
|
+
"name": "trailing"
|
|
532
|
+
}
|
|
533
|
+
],
|
|
534
|
+
"members": [],
|
|
535
|
+
"superclass": {
|
|
536
|
+
"name": "Component",
|
|
537
|
+
"module": "/src/models"
|
|
538
|
+
},
|
|
539
|
+
"tagName": "mdc-appheader",
|
|
540
|
+
"jsDoc": "/**\n * The `mdc-appheader` component provides a structured and accessible app header layout.\n * It consists of three primary sections: leading, center, and trailing.\n *\n * - The **leading section** typically holds a **brand logo**, **brand name** or **menu icon**.\n * - The **center section** can contain a **search bar**, **icons** or action controls.\n * - The **trailing section** generally includes a **profile avatar**, **additional icons** or **action controls**.\n *\n * @tagname mdc-appheader\n *\n * @slot leading - Slot for the leading section (e.g., brand logo, brand name).\n * @slot center - Slot for the center section (e.g., search bar, icons).\n * @slot trailing - Slot for the trailing section (e.g., profile avatar, icons).\n *\n * @csspart container - The main container for styling the header.\n * @csspart leading-section - The leading section of the header.\n * @csspart center-section - The center section of the header.\n * @csspart trailing-section - The trailing section of the header.\n */",
|
|
541
|
+
"customElement": true
|
|
542
|
+
}
|
|
543
|
+
],
|
|
544
|
+
"exports": [
|
|
545
|
+
{
|
|
546
|
+
"kind": "js",
|
|
547
|
+
"name": "default",
|
|
548
|
+
"declaration": {
|
|
549
|
+
"name": "Appheader",
|
|
550
|
+
"module": "components/appheader/appheader.component.js"
|
|
551
|
+
}
|
|
552
|
+
}
|
|
553
|
+
]
|
|
554
|
+
},
|
|
555
|
+
{
|
|
556
|
+
"kind": "javascript-module",
|
|
557
|
+
"path": "components/avatar/avatar.component.js",
|
|
558
|
+
"declarations": [
|
|
559
|
+
{
|
|
560
|
+
"kind": "class",
|
|
561
|
+
"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.",
|
|
562
|
+
"name": "Avatar",
|
|
563
|
+
"cssProperties": [
|
|
564
|
+
{
|
|
565
|
+
"description": "Allows customization of the default background color.",
|
|
566
|
+
"name": "--mdc-avatar-default-background-color"
|
|
567
|
+
},
|
|
568
|
+
{
|
|
569
|
+
"description": "Allows customization of the default foreground color.",
|
|
570
|
+
"name": "--mdc-avatar-default-foreground-color"
|
|
571
|
+
},
|
|
572
|
+
{
|
|
573
|
+
"description": "Allows customization of the loading indicator background color.",
|
|
574
|
+
"name": "--mdc-avatar-loading-indicator-background-color"
|
|
575
|
+
},
|
|
576
|
+
{
|
|
577
|
+
"description": "Allows customization of the loading indicator foreground color.",
|
|
578
|
+
"name": "--mdc-avatar-loading-indicator-foreground-color"
|
|
844
579
|
},
|
|
580
|
+
{
|
|
581
|
+
"description": "Allows customization of the loading overlay background color.",
|
|
582
|
+
"name": "--mdc-avatar-loading-overlay-background-color"
|
|
583
|
+
}
|
|
584
|
+
],
|
|
585
|
+
"members": [
|
|
845
586
|
{
|
|
846
587
|
"kind": "field",
|
|
847
588
|
"name": "src",
|
|
@@ -885,15 +626,15 @@
|
|
|
885
626
|
"kind": "field",
|
|
886
627
|
"name": "size",
|
|
887
628
|
"type": {
|
|
888
|
-
"text": "
|
|
629
|
+
"text": "AvatarSize"
|
|
889
630
|
},
|
|
890
631
|
"description": "Acceptable values include (size in px unit):\n- 24\n- 32\n- 48\n- 64\n- 72\n- 88\n- 124",
|
|
891
632
|
"default": "32",
|
|
892
633
|
"attribute": "size",
|
|
893
634
|
"reflects": true,
|
|
894
635
|
"inheritedFrom": {
|
|
895
|
-
"name": "
|
|
896
|
-
"module": "
|
|
636
|
+
"name": "AvatarComponentMixin",
|
|
637
|
+
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
897
638
|
}
|
|
898
639
|
},
|
|
899
640
|
{
|
|
@@ -935,133 +676,392 @@
|
|
|
935
676
|
"name": "IconNameMixin",
|
|
936
677
|
"module": "utils/mixins/IconNameMixin.js"
|
|
937
678
|
}
|
|
679
|
+
}
|
|
680
|
+
],
|
|
681
|
+
"mixins": [
|
|
682
|
+
{
|
|
683
|
+
"name": "AvatarComponentMixin",
|
|
684
|
+
"module": "/src/utils/mixins/AvatarComponentMixin"
|
|
938
685
|
},
|
|
939
686
|
{
|
|
940
|
-
"
|
|
941
|
-
"
|
|
687
|
+
"name": "IconNameMixin",
|
|
688
|
+
"module": "/src/utils/mixins/IconNameMixin"
|
|
689
|
+
}
|
|
690
|
+
],
|
|
691
|
+
"superclass": {
|
|
692
|
+
"name": "Component",
|
|
693
|
+
"module": "/src/models"
|
|
694
|
+
},
|
|
695
|
+
"tagName": "mdc-avatar",
|
|
696
|
+
"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 */",
|
|
697
|
+
"customElement": true,
|
|
698
|
+
"attributes": [
|
|
699
|
+
{
|
|
700
|
+
"name": "src",
|
|
942
701
|
"type": {
|
|
943
|
-
"text": "
|
|
702
|
+
"text": "string | undefined"
|
|
944
703
|
},
|
|
945
|
-
"
|
|
946
|
-
"
|
|
947
|
-
"attribute": "tabIndex",
|
|
948
|
-
"reflects": true,
|
|
704
|
+
"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.",
|
|
705
|
+
"fieldName": "src",
|
|
949
706
|
"inheritedFrom": {
|
|
950
|
-
"name": "
|
|
951
|
-
"module": "utils/mixins/
|
|
707
|
+
"name": "AvatarComponentMixin",
|
|
708
|
+
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
952
709
|
}
|
|
953
710
|
},
|
|
954
711
|
{
|
|
955
|
-
"
|
|
956
|
-
"name": "disabled",
|
|
712
|
+
"name": "initials",
|
|
957
713
|
"type": {
|
|
958
|
-
"text": "
|
|
714
|
+
"text": "string | undefined"
|
|
959
715
|
},
|
|
960
|
-
"description": "
|
|
961
|
-
"
|
|
962
|
-
"attribute": "disabled",
|
|
963
|
-
"reflects": true,
|
|
716
|
+
"description": "The initials to be displayed for the avatar.",
|
|
717
|
+
"fieldName": "initials",
|
|
964
718
|
"inheritedFrom": {
|
|
965
|
-
"name": "
|
|
966
|
-
"module": "utils/mixins/
|
|
719
|
+
"name": "AvatarComponentMixin",
|
|
720
|
+
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
967
721
|
}
|
|
968
722
|
},
|
|
969
723
|
{
|
|
970
|
-
"
|
|
971
|
-
"name": "active",
|
|
724
|
+
"name": "presence",
|
|
972
725
|
"type": {
|
|
973
|
-
"text": "
|
|
726
|
+
"text": "PresenceType | undefined"
|
|
974
727
|
},
|
|
975
|
-
"description": "The
|
|
976
|
-
"
|
|
977
|
-
"attribute": "active",
|
|
978
|
-
"reflects": true,
|
|
728
|
+
"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`",
|
|
729
|
+
"fieldName": "presence",
|
|
979
730
|
"inheritedFrom": {
|
|
980
|
-
"name": "
|
|
981
|
-
"module": "
|
|
731
|
+
"name": "AvatarComponentMixin",
|
|
732
|
+
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
982
733
|
}
|
|
983
734
|
},
|
|
984
735
|
{
|
|
985
|
-
"
|
|
986
|
-
"name": "softDisabled",
|
|
736
|
+
"name": "size",
|
|
987
737
|
"type": {
|
|
988
|
-
"text": "
|
|
738
|
+
"text": "AvatarSize"
|
|
989
739
|
},
|
|
990
|
-
"description": "
|
|
991
|
-
"default": "
|
|
992
|
-
"
|
|
740
|
+
"description": "Acceptable values include (size in px unit):\n- 24\n- 32\n- 48\n- 64\n- 72\n- 88\n- 124",
|
|
741
|
+
"default": "32",
|
|
742
|
+
"fieldName": "size",
|
|
993
743
|
"inheritedFrom": {
|
|
994
|
-
"name": "
|
|
995
|
-
"module": "
|
|
744
|
+
"name": "AvatarComponentMixin",
|
|
745
|
+
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
996
746
|
}
|
|
997
747
|
},
|
|
998
748
|
{
|
|
999
|
-
"
|
|
1000
|
-
"
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
"
|
|
1004
|
-
"
|
|
749
|
+
"name": "counter",
|
|
750
|
+
"type": {
|
|
751
|
+
"text": "number | undefined"
|
|
752
|
+
},
|
|
753
|
+
"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`.",
|
|
754
|
+
"fieldName": "counter",
|
|
1005
755
|
"inheritedFrom": {
|
|
1006
|
-
"name": "
|
|
1007
|
-
"module": "
|
|
756
|
+
"name": "AvatarComponentMixin",
|
|
757
|
+
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
1008
758
|
}
|
|
1009
759
|
},
|
|
1010
760
|
{
|
|
1011
|
-
"
|
|
1012
|
-
"name": "ariaStateKey",
|
|
761
|
+
"name": "is-typing",
|
|
1013
762
|
"type": {
|
|
1014
|
-
"text": "
|
|
763
|
+
"text": "boolean"
|
|
1015
764
|
},
|
|
1016
|
-
"
|
|
1017
|
-
"
|
|
1018
|
-
"
|
|
1019
|
-
"reflects": true,
|
|
765
|
+
"default": "false",
|
|
766
|
+
"description": "Represents the typing indicator when the user is typing.",
|
|
767
|
+
"fieldName": "isTyping",
|
|
1020
768
|
"inheritedFrom": {
|
|
1021
|
-
"name": "
|
|
1022
|
-
"module": "
|
|
769
|
+
"name": "AvatarComponentMixin",
|
|
770
|
+
"module": "src/utils/mixins/AvatarComponentMixin.ts"
|
|
1023
771
|
}
|
|
1024
772
|
},
|
|
1025
773
|
{
|
|
1026
|
-
"
|
|
1027
|
-
"name": "type",
|
|
774
|
+
"name": "icon-name",
|
|
1028
775
|
"type": {
|
|
1029
|
-
"text": "
|
|
776
|
+
"text": "IconNames | undefined"
|
|
1030
777
|
},
|
|
1031
|
-
"description": "
|
|
1032
|
-
"
|
|
1033
|
-
"attribute": "type",
|
|
1034
|
-
"reflects": true,
|
|
778
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
|
779
|
+
"fieldName": "iconName",
|
|
1035
780
|
"inheritedFrom": {
|
|
1036
|
-
"name": "
|
|
1037
|
-
"module": "
|
|
781
|
+
"name": "IconNameMixin",
|
|
782
|
+
"module": "src/utils/mixins/IconNameMixin.ts"
|
|
1038
783
|
}
|
|
784
|
+
}
|
|
785
|
+
]
|
|
786
|
+
}
|
|
787
|
+
],
|
|
788
|
+
"exports": [
|
|
789
|
+
{
|
|
790
|
+
"kind": "js",
|
|
791
|
+
"name": "default",
|
|
792
|
+
"declaration": {
|
|
793
|
+
"name": "Avatar",
|
|
794
|
+
"module": "components/avatar/avatar.component.js"
|
|
795
|
+
}
|
|
796
|
+
}
|
|
797
|
+
]
|
|
798
|
+
},
|
|
799
|
+
{
|
|
800
|
+
"kind": "javascript-module",
|
|
801
|
+
"path": "components/avatarbutton/avatarbutton.component.js",
|
|
802
|
+
"declarations": [
|
|
803
|
+
{
|
|
804
|
+
"kind": "class",
|
|
805
|
+
"description": "The `mdc-avatarbutton` component is an interactable version of the `mdc-avatar` component.\n\nThis component is made by extending `buttonsimple` class.\nThe button component acts as a wrapper for the avatar component.",
|
|
806
|
+
"name": "AvatarButton",
|
|
807
|
+
"cssProperties": [
|
|
808
|
+
{
|
|
809
|
+
"description": "Background color of the overlay in rest state",
|
|
810
|
+
"name": "--mdc-avatarbutton-overlay-background-color-rest"
|
|
1039
811
|
},
|
|
1040
812
|
{
|
|
1041
|
-
"
|
|
1042
|
-
"name": "
|
|
1043
|
-
"privacy": "protected",
|
|
1044
|
-
"inheritedFrom": {
|
|
1045
|
-
"name": "Buttonsimple",
|
|
1046
|
-
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
1047
|
-
}
|
|
813
|
+
"description": "Background color of the overlay in hover state",
|
|
814
|
+
"name": "--mdc-avatarbutton-overlay-background-color-hover"
|
|
1048
815
|
},
|
|
1049
816
|
{
|
|
1050
|
-
"
|
|
1051
|
-
"name": "
|
|
1052
|
-
|
|
1053
|
-
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
|
|
1060
|
-
|
|
1061
|
-
|
|
1062
|
-
|
|
1063
|
-
|
|
1064
|
-
|
|
817
|
+
"description": "Background color of the overlay in active state",
|
|
818
|
+
"name": "--mdc-avatarbutton-overlay-background-color-active"
|
|
819
|
+
}
|
|
820
|
+
],
|
|
821
|
+
"members": [
|
|
822
|
+
{
|
|
823
|
+
"kind": "field",
|
|
824
|
+
"name": "ariaLabel",
|
|
825
|
+
"type": {
|
|
826
|
+
"text": "string | null"
|
|
827
|
+
},
|
|
828
|
+
"default": "null",
|
|
829
|
+
"description": "Aria-label attribute to be set for accessibility",
|
|
830
|
+
"attribute": "aria-label"
|
|
831
|
+
},
|
|
832
|
+
{
|
|
833
|
+
"kind": "method",
|
|
834
|
+
"name": "setSize",
|
|
835
|
+
"privacy": "private",
|
|
836
|
+
"parameters": [
|
|
837
|
+
{
|
|
838
|
+
"name": "size",
|
|
839
|
+
"type": {
|
|
840
|
+
"text": "AvatarSize"
|
|
841
|
+
}
|
|
842
|
+
}
|
|
843
|
+
]
|
|
844
|
+
},
|
|
845
|
+
{
|
|
846
|
+
"kind": "field",
|
|
847
|
+
"name": "src",
|
|
848
|
+
"type": {
|
|
849
|
+
"text": "string | undefined"
|
|
850
|
+
},
|
|
851
|
+
"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.",
|
|
852
|
+
"attribute": "src",
|
|
853
|
+
"inheritedFrom": {
|
|
854
|
+
"name": "AvatarComponentMixin",
|
|
855
|
+
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
856
|
+
}
|
|
857
|
+
},
|
|
858
|
+
{
|
|
859
|
+
"kind": "field",
|
|
860
|
+
"name": "initials",
|
|
861
|
+
"type": {
|
|
862
|
+
"text": "string | undefined"
|
|
863
|
+
},
|
|
864
|
+
"description": "The initials to be displayed for the avatar.",
|
|
865
|
+
"attribute": "initials",
|
|
866
|
+
"inheritedFrom": {
|
|
867
|
+
"name": "AvatarComponentMixin",
|
|
868
|
+
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
869
|
+
}
|
|
870
|
+
},
|
|
871
|
+
{
|
|
872
|
+
"kind": "field",
|
|
873
|
+
"name": "presence",
|
|
874
|
+
"type": {
|
|
875
|
+
"text": "PresenceType | undefined"
|
|
876
|
+
},
|
|
877
|
+
"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`",
|
|
878
|
+
"attribute": "presence",
|
|
879
|
+
"inheritedFrom": {
|
|
880
|
+
"name": "AvatarComponentMixin",
|
|
881
|
+
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
882
|
+
}
|
|
883
|
+
},
|
|
884
|
+
{
|
|
885
|
+
"kind": "field",
|
|
886
|
+
"name": "size",
|
|
887
|
+
"type": {
|
|
888
|
+
"text": "ButtonSize"
|
|
889
|
+
},
|
|
890
|
+
"description": "Acceptable values include (size in px unit):\n- 24\n- 32\n- 48\n- 64\n- 72\n- 88\n- 124",
|
|
891
|
+
"default": "32",
|
|
892
|
+
"attribute": "size",
|
|
893
|
+
"reflects": true,
|
|
894
|
+
"inheritedFrom": {
|
|
895
|
+
"name": "Buttonsimple",
|
|
896
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
897
|
+
}
|
|
898
|
+
},
|
|
899
|
+
{
|
|
900
|
+
"kind": "field",
|
|
901
|
+
"name": "counter",
|
|
902
|
+
"type": {
|
|
903
|
+
"text": "number | undefined"
|
|
904
|
+
},
|
|
905
|
+
"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`.",
|
|
906
|
+
"attribute": "counter",
|
|
907
|
+
"inheritedFrom": {
|
|
908
|
+
"name": "AvatarComponentMixin",
|
|
909
|
+
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
910
|
+
}
|
|
911
|
+
},
|
|
912
|
+
{
|
|
913
|
+
"kind": "field",
|
|
914
|
+
"name": "isTyping",
|
|
915
|
+
"type": {
|
|
916
|
+
"text": "boolean"
|
|
917
|
+
},
|
|
918
|
+
"default": "false",
|
|
919
|
+
"description": "Represents the typing indicator when the user is typing.",
|
|
920
|
+
"attribute": "is-typing",
|
|
921
|
+
"inheritedFrom": {
|
|
922
|
+
"name": "AvatarComponentMixin",
|
|
923
|
+
"module": "utils/mixins/AvatarComponentMixin.js"
|
|
924
|
+
}
|
|
925
|
+
},
|
|
926
|
+
{
|
|
927
|
+
"kind": "field",
|
|
928
|
+
"name": "iconName",
|
|
929
|
+
"type": {
|
|
930
|
+
"text": "IconNames | undefined"
|
|
931
|
+
},
|
|
932
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
|
933
|
+
"attribute": "icon-name",
|
|
934
|
+
"inheritedFrom": {
|
|
935
|
+
"name": "IconNameMixin",
|
|
936
|
+
"module": "utils/mixins/IconNameMixin.js"
|
|
937
|
+
}
|
|
938
|
+
},
|
|
939
|
+
{
|
|
940
|
+
"kind": "field",
|
|
941
|
+
"name": "tabIndex",
|
|
942
|
+
"type": {
|
|
943
|
+
"text": "number"
|
|
944
|
+
},
|
|
945
|
+
"default": "0",
|
|
946
|
+
"description": "This property specifies the tab order of the element.",
|
|
947
|
+
"attribute": "tabIndex",
|
|
948
|
+
"reflects": true,
|
|
949
|
+
"inheritedFrom": {
|
|
950
|
+
"name": "TabIndexMixin",
|
|
951
|
+
"module": "utils/mixins/TabIndexMixin.js"
|
|
952
|
+
}
|
|
953
|
+
},
|
|
954
|
+
{
|
|
955
|
+
"kind": "field",
|
|
956
|
+
"name": "disabled",
|
|
957
|
+
"type": {
|
|
958
|
+
"text": "boolean | undefined"
|
|
959
|
+
},
|
|
960
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
|
961
|
+
"default": "undefined",
|
|
962
|
+
"attribute": "disabled",
|
|
963
|
+
"reflects": true,
|
|
964
|
+
"inheritedFrom": {
|
|
965
|
+
"name": "DisabledMixin",
|
|
966
|
+
"module": "utils/mixins/DisabledMixin.js"
|
|
967
|
+
}
|
|
968
|
+
},
|
|
969
|
+
{
|
|
970
|
+
"kind": "field",
|
|
971
|
+
"name": "active",
|
|
972
|
+
"type": {
|
|
973
|
+
"text": "boolean | undefined"
|
|
974
|
+
},
|
|
975
|
+
"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.\n\nThis attribute is used to set the provided `ariaStateKey` to true or false.",
|
|
976
|
+
"default": "undefined",
|
|
977
|
+
"attribute": "active",
|
|
978
|
+
"reflects": true,
|
|
979
|
+
"inheritedFrom": {
|
|
980
|
+
"name": "Buttonsimple",
|
|
981
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
982
|
+
}
|
|
983
|
+
},
|
|
984
|
+
{
|
|
985
|
+
"kind": "field",
|
|
986
|
+
"name": "softDisabled",
|
|
987
|
+
"type": {
|
|
988
|
+
"text": "boolean | undefined"
|
|
989
|
+
},
|
|
990
|
+
"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.",
|
|
991
|
+
"default": "undefined",
|
|
992
|
+
"attribute": "soft-disabled",
|
|
993
|
+
"inheritedFrom": {
|
|
994
|
+
"name": "Buttonsimple",
|
|
995
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
996
|
+
}
|
|
997
|
+
},
|
|
998
|
+
{
|
|
999
|
+
"kind": "field",
|
|
1000
|
+
"name": "role",
|
|
1001
|
+
"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.",
|
|
1002
|
+
"default": "button",
|
|
1003
|
+
"attribute": "role",
|
|
1004
|
+
"reflects": true,
|
|
1005
|
+
"inheritedFrom": {
|
|
1006
|
+
"name": "Buttonsimple",
|
|
1007
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
1008
|
+
}
|
|
1009
|
+
},
|
|
1010
|
+
{
|
|
1011
|
+
"kind": "field",
|
|
1012
|
+
"name": "ariaStateKey",
|
|
1013
|
+
"type": {
|
|
1014
|
+
"text": "string | undefined"
|
|
1015
|
+
},
|
|
1016
|
+
"description": "This property defines the ARIA state key, which will be toggled when the\nButton is set to `active`.\nThe default value is 'aria-pressed', which is commonly used for toggle buttons.\n\nConsumers can override this property to use a different ARIA state key if needed.\nIn case multiple aria attributes should be toggled, they can be passed in as\na comma separated string.\nFor example: `aria-pressed,aria-expanded`",
|
|
1017
|
+
"default": "'aria-pressed' (when)",
|
|
1018
|
+
"attribute": "ariaStateKey",
|
|
1019
|
+
"reflects": true,
|
|
1020
|
+
"inheritedFrom": {
|
|
1021
|
+
"name": "Buttonsimple",
|
|
1022
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
1023
|
+
}
|
|
1024
|
+
},
|
|
1025
|
+
{
|
|
1026
|
+
"kind": "field",
|
|
1027
|
+
"name": "type",
|
|
1028
|
+
"type": {
|
|
1029
|
+
"text": "ButtonType"
|
|
1030
|
+
},
|
|
1031
|
+
"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.",
|
|
1032
|
+
"default": "button",
|
|
1033
|
+
"attribute": "type",
|
|
1034
|
+
"reflects": true,
|
|
1035
|
+
"inheritedFrom": {
|
|
1036
|
+
"name": "Buttonsimple",
|
|
1037
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
1038
|
+
}
|
|
1039
|
+
},
|
|
1040
|
+
{
|
|
1041
|
+
"kind": "method",
|
|
1042
|
+
"name": "executeAction",
|
|
1043
|
+
"privacy": "protected",
|
|
1044
|
+
"inheritedFrom": {
|
|
1045
|
+
"name": "Buttonsimple",
|
|
1046
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
|
1047
|
+
}
|
|
1048
|
+
},
|
|
1049
|
+
{
|
|
1050
|
+
"kind": "method",
|
|
1051
|
+
"name": "setActive",
|
|
1052
|
+
"privacy": "protected",
|
|
1053
|
+
"parameters": [
|
|
1054
|
+
{
|
|
1055
|
+
"name": "element",
|
|
1056
|
+
"type": {
|
|
1057
|
+
"text": "HTMLElement"
|
|
1058
|
+
},
|
|
1059
|
+
"description": "The button element"
|
|
1060
|
+
},
|
|
1061
|
+
{
|
|
1062
|
+
"name": "active",
|
|
1063
|
+
"optional": true,
|
|
1064
|
+
"type": {
|
|
1065
1065
|
"text": "boolean"
|
|
1066
1066
|
},
|
|
1067
1067
|
"description": "The active state of the element"
|
|
@@ -4947,6 +4947,7 @@
|
|
|
4947
4947
|
"default": "null",
|
|
4948
4948
|
"description": "aria-label attribute to be set for close button accessibility.",
|
|
4949
4949
|
"attribute": "close-button-aria-label",
|
|
4950
|
+
"reflects": true,
|
|
4950
4951
|
"inheritedFrom": {
|
|
4951
4952
|
"name": "Popover",
|
|
4952
4953
|
"module": "components/popover/popover.component.js"
|
|
@@ -10818,7 +10819,8 @@
|
|
|
10818
10819
|
},
|
|
10819
10820
|
"default": "null",
|
|
10820
10821
|
"description": "aria-label attribute to be set for close button accessibility.",
|
|
10821
|
-
"attribute": "close-button-aria-label"
|
|
10822
|
+
"attribute": "close-button-aria-label",
|
|
10823
|
+
"reflects": true
|
|
10822
10824
|
},
|
|
10823
10825
|
{
|
|
10824
10826
|
"kind": "field",
|
|
@@ -10859,7 +10861,7 @@
|
|
|
10859
10861
|
"type": {
|
|
10860
10862
|
"text": "boolean"
|
|
10861
10863
|
},
|
|
10862
|
-
"description": "Disable aria-expanded attribute on trigger element.",
|
|
10864
|
+
"description": "Disable aria-expanded attribute on trigger element.\nMake sure to set this to false when the popover is interactive.",
|
|
10863
10865
|
"default": "false",
|
|
10864
10866
|
"attribute": "disable-aria-expanded",
|
|
10865
10867
|
"reflects": true
|
|
@@ -11727,7 +11729,7 @@
|
|
|
11727
11729
|
"type": {
|
|
11728
11730
|
"text": "boolean"
|
|
11729
11731
|
},
|
|
11730
|
-
"description": "Disable aria-expanded attribute on trigger element.",
|
|
11732
|
+
"description": "Disable aria-expanded attribute on trigger element.\nMake sure to set this to false when the popover is interactive.",
|
|
11731
11733
|
"default": "false",
|
|
11732
11734
|
"fieldName": "disableAriaExpanded"
|
|
11733
11735
|
},
|
|
@@ -18846,444 +18848,2113 @@
|
|
|
18846
18848
|
}
|
|
18847
18849
|
},
|
|
18848
18850
|
{
|
|
18849
|
-
"kind": "field",
|
|
18850
|
-
"name": "validity",
|
|
18851
|
-
"type": {
|
|
18852
|
-
"text": "ValidityState"
|
|
18853
|
-
},
|
|
18854
|
-
"readonly": true,
|
|
18851
|
+
"kind": "field",
|
|
18852
|
+
"name": "validity",
|
|
18853
|
+
"type": {
|
|
18854
|
+
"text": "ValidityState"
|
|
18855
|
+
},
|
|
18856
|
+
"readonly": true,
|
|
18857
|
+
"inheritedFrom": {
|
|
18858
|
+
"name": "FormInternalsMixin",
|
|
18859
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
18860
|
+
}
|
|
18861
|
+
},
|
|
18862
|
+
{
|
|
18863
|
+
"kind": "field",
|
|
18864
|
+
"name": "willValidate",
|
|
18865
|
+
"readonly": true,
|
|
18866
|
+
"inheritedFrom": {
|
|
18867
|
+
"name": "FormInternalsMixin",
|
|
18868
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
18869
|
+
}
|
|
18870
|
+
},
|
|
18871
|
+
{
|
|
18872
|
+
"kind": "method",
|
|
18873
|
+
"name": "setValidity",
|
|
18874
|
+
"description": "Sets the validity of the input field based on the input field's validity.",
|
|
18875
|
+
"return": {
|
|
18876
|
+
"type": {
|
|
18877
|
+
"text": ""
|
|
18878
|
+
}
|
|
18879
|
+
},
|
|
18880
|
+
"inheritedFrom": {
|
|
18881
|
+
"name": "FormInternalsMixin",
|
|
18882
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
18883
|
+
}
|
|
18884
|
+
},
|
|
18885
|
+
{
|
|
18886
|
+
"kind": "method",
|
|
18887
|
+
"name": "checkValidity",
|
|
18888
|
+
"return": {
|
|
18889
|
+
"type": {
|
|
18890
|
+
"text": "boolean"
|
|
18891
|
+
}
|
|
18892
|
+
},
|
|
18893
|
+
"inheritedFrom": {
|
|
18894
|
+
"name": "FormInternalsMixin",
|
|
18895
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
18896
|
+
}
|
|
18897
|
+
},
|
|
18898
|
+
{
|
|
18899
|
+
"kind": "method",
|
|
18900
|
+
"name": "reportValidity",
|
|
18901
|
+
"inheritedFrom": {
|
|
18902
|
+
"name": "FormInternalsMixin",
|
|
18903
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
|
18904
|
+
}
|
|
18905
|
+
},
|
|
18906
|
+
{
|
|
18907
|
+
"kind": "field",
|
|
18908
|
+
"name": "dataAriaLabel",
|
|
18909
|
+
"type": {
|
|
18910
|
+
"text": "string | null"
|
|
18911
|
+
},
|
|
18912
|
+
"default": "null",
|
|
18913
|
+
"description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
|
|
18914
|
+
"attribute": "data-aria-label",
|
|
18915
|
+
"reflects": true,
|
|
18916
|
+
"inheritedFrom": {
|
|
18917
|
+
"name": "DataAriaLabelMixin",
|
|
18918
|
+
"module": "utils/mixins/DataAriaLabelMixin.js"
|
|
18919
|
+
}
|
|
18920
|
+
},
|
|
18921
|
+
{
|
|
18922
|
+
"kind": "field",
|
|
18923
|
+
"name": "disabled",
|
|
18924
|
+
"type": {
|
|
18925
|
+
"text": "boolean | undefined"
|
|
18926
|
+
},
|
|
18927
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
|
18928
|
+
"default": "undefined",
|
|
18929
|
+
"attribute": "disabled",
|
|
18930
|
+
"reflects": true,
|
|
18931
|
+
"inheritedFrom": {
|
|
18932
|
+
"name": "FormfieldWrapper",
|
|
18933
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
18934
|
+
}
|
|
18935
|
+
},
|
|
18936
|
+
{
|
|
18937
|
+
"kind": "field",
|
|
18938
|
+
"name": "label",
|
|
18939
|
+
"type": {
|
|
18940
|
+
"text": "string | undefined"
|
|
18941
|
+
},
|
|
18942
|
+
"description": "The label of the input field. It is linked to the input field using the `for` attribute.",
|
|
18943
|
+
"attribute": "label",
|
|
18944
|
+
"reflects": true,
|
|
18945
|
+
"inheritedFrom": {
|
|
18946
|
+
"name": "FormfieldWrapper",
|
|
18947
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
18948
|
+
}
|
|
18949
|
+
},
|
|
18950
|
+
{
|
|
18951
|
+
"kind": "field",
|
|
18952
|
+
"name": "requiredLabel",
|
|
18953
|
+
"type": {
|
|
18954
|
+
"text": "string | undefined"
|
|
18955
|
+
},
|
|
18956
|
+
"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.",
|
|
18957
|
+
"attribute": "required-label",
|
|
18958
|
+
"reflects": true,
|
|
18959
|
+
"inheritedFrom": {
|
|
18960
|
+
"name": "FormfieldWrapper",
|
|
18961
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
18962
|
+
}
|
|
18963
|
+
},
|
|
18964
|
+
{
|
|
18965
|
+
"kind": "field",
|
|
18966
|
+
"name": "id",
|
|
18967
|
+
"type": {
|
|
18968
|
+
"text": "string"
|
|
18969
|
+
},
|
|
18970
|
+
"default": "''",
|
|
18971
|
+
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
|
18972
|
+
"attribute": "id",
|
|
18973
|
+
"inheritedFrom": {
|
|
18974
|
+
"name": "FormfieldWrapper",
|
|
18975
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
18976
|
+
}
|
|
18977
|
+
},
|
|
18978
|
+
{
|
|
18979
|
+
"kind": "field",
|
|
18980
|
+
"name": "helpTextType",
|
|
18981
|
+
"type": {
|
|
18982
|
+
"text": "ValidationType"
|
|
18983
|
+
},
|
|
18984
|
+
"description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
|
|
18985
|
+
"attribute": "help-text-type",
|
|
18986
|
+
"reflects": true,
|
|
18987
|
+
"inheritedFrom": {
|
|
18988
|
+
"name": "FormfieldWrapper",
|
|
18989
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
18990
|
+
}
|
|
18991
|
+
},
|
|
18992
|
+
{
|
|
18993
|
+
"kind": "field",
|
|
18994
|
+
"name": "helpText",
|
|
18995
|
+
"type": {
|
|
18996
|
+
"text": "string | undefined"
|
|
18997
|
+
},
|
|
18998
|
+
"description": "The help text that is displayed below the input field.",
|
|
18999
|
+
"attribute": "help-text",
|
|
19000
|
+
"reflects": true,
|
|
19001
|
+
"inheritedFrom": {
|
|
19002
|
+
"name": "FormfieldWrapper",
|
|
19003
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
19004
|
+
}
|
|
19005
|
+
},
|
|
19006
|
+
{
|
|
19007
|
+
"kind": "method",
|
|
19008
|
+
"name": "renderLabelElement",
|
|
19009
|
+
"privacy": "protected",
|
|
19010
|
+
"description": "creates the label element when the label property is set.\nid is used to link the label with the input field.",
|
|
19011
|
+
"return": {
|
|
19012
|
+
"type": {
|
|
19013
|
+
"text": ""
|
|
19014
|
+
}
|
|
19015
|
+
},
|
|
19016
|
+
"inheritedFrom": {
|
|
19017
|
+
"name": "FormfieldWrapper",
|
|
19018
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
19019
|
+
}
|
|
19020
|
+
},
|
|
19021
|
+
{
|
|
19022
|
+
"kind": "method",
|
|
19023
|
+
"name": "renderRequiredLabel",
|
|
19024
|
+
"privacy": "protected",
|
|
19025
|
+
"inheritedFrom": {
|
|
19026
|
+
"name": "FormfieldWrapper",
|
|
19027
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
19028
|
+
}
|
|
19029
|
+
},
|
|
19030
|
+
{
|
|
19031
|
+
"kind": "method",
|
|
19032
|
+
"name": "renderHelpTextIcon",
|
|
19033
|
+
"privacy": "protected",
|
|
19034
|
+
"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.",
|
|
19035
|
+
"return": {
|
|
19036
|
+
"type": {
|
|
19037
|
+
"text": ""
|
|
19038
|
+
}
|
|
19039
|
+
},
|
|
19040
|
+
"inheritedFrom": {
|
|
19041
|
+
"name": "FormfieldWrapper",
|
|
19042
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
19043
|
+
}
|
|
19044
|
+
},
|
|
19045
|
+
{
|
|
19046
|
+
"kind": "method",
|
|
19047
|
+
"name": "renderHelpText",
|
|
19048
|
+
"privacy": "protected",
|
|
19049
|
+
"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.",
|
|
19050
|
+
"return": {
|
|
19051
|
+
"type": {
|
|
19052
|
+
"text": ""
|
|
19053
|
+
}
|
|
19054
|
+
},
|
|
19055
|
+
"inheritedFrom": {
|
|
19056
|
+
"name": "FormfieldWrapper",
|
|
19057
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
19058
|
+
}
|
|
19059
|
+
},
|
|
19060
|
+
{
|
|
19061
|
+
"kind": "method",
|
|
19062
|
+
"name": "renderLabel",
|
|
19063
|
+
"privacy": "protected",
|
|
19064
|
+
"description": "renders the mdc-label-text container that contains the label and labelInfoToggleTip.",
|
|
19065
|
+
"return": {
|
|
19066
|
+
"type": {
|
|
19067
|
+
"text": ""
|
|
19068
|
+
}
|
|
19069
|
+
},
|
|
19070
|
+
"inheritedFrom": {
|
|
19071
|
+
"name": "FormfieldWrapper",
|
|
19072
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
19073
|
+
}
|
|
19074
|
+
},
|
|
19075
|
+
{
|
|
19076
|
+
"kind": "method",
|
|
19077
|
+
"name": "renderHelperText",
|
|
19078
|
+
"privacy": "protected",
|
|
19079
|
+
"description": "renders the mdc-help-text container that contains the helpertext icon and helpertext.",
|
|
19080
|
+
"return": {
|
|
19081
|
+
"type": {
|
|
19082
|
+
"text": ""
|
|
19083
|
+
}
|
|
19084
|
+
},
|
|
19085
|
+
"inheritedFrom": {
|
|
19086
|
+
"name": "FormfieldWrapper",
|
|
19087
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
|
19088
|
+
}
|
|
19089
|
+
}
|
|
19090
|
+
],
|
|
19091
|
+
"events": [
|
|
19092
|
+
{
|
|
19093
|
+
"type": {
|
|
19094
|
+
"text": "EventConstructor"
|
|
19095
|
+
}
|
|
19096
|
+
},
|
|
19097
|
+
{
|
|
19098
|
+
"description": "(React: onChange) Event that gets dispatched when the toggle state changes.",
|
|
19099
|
+
"name": "change",
|
|
19100
|
+
"reactName": "onChange"
|
|
19101
|
+
},
|
|
19102
|
+
{
|
|
19103
|
+
"description": "(React: onFocus) Event that gets dispatched when the toggle receives focus.",
|
|
19104
|
+
"name": "focus",
|
|
19105
|
+
"reactName": "onFocus"
|
|
19106
|
+
}
|
|
19107
|
+
],
|
|
19108
|
+
"attributes": [
|
|
19109
|
+
{
|
|
19110
|
+
"name": "checked",
|
|
19111
|
+
"type": {
|
|
19112
|
+
"text": "boolean"
|
|
19113
|
+
},
|
|
19114
|
+
"default": "false",
|
|
19115
|
+
"description": "Determines whether the toggle is active or inactive.",
|
|
19116
|
+
"fieldName": "checked"
|
|
19117
|
+
},
|
|
19118
|
+
{
|
|
19119
|
+
"name": "size",
|
|
19120
|
+
"type": {
|
|
19121
|
+
"text": "ToggleSize"
|
|
19122
|
+
},
|
|
19123
|
+
"description": "Determines toggle size in rem (height is specified here).\n- **Default**: 1.5\n- **Compact**: 1",
|
|
19124
|
+
"default": "default",
|
|
19125
|
+
"fieldName": "size"
|
|
19126
|
+
},
|
|
19127
|
+
{
|
|
19128
|
+
"name": "autofocus",
|
|
19129
|
+
"type": {
|
|
19130
|
+
"text": "boolean"
|
|
19131
|
+
},
|
|
19132
|
+
"default": "false",
|
|
19133
|
+
"description": "Automatically focus on the element when the page loads.\n[MDN Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus)",
|
|
19134
|
+
"fieldName": "autofocus"
|
|
19135
|
+
},
|
|
19136
|
+
{
|
|
19137
|
+
"name": "name",
|
|
19138
|
+
"type": {
|
|
19139
|
+
"text": "string"
|
|
19140
|
+
},
|
|
19141
|
+
"default": "''",
|
|
19142
|
+
"description": "Indicates the name of the component group.\nThey are used to group elements in a form together.",
|
|
19143
|
+
"fieldName": "name",
|
|
19144
|
+
"inheritedFrom": {
|
|
19145
|
+
"name": "FormInternalsMixin",
|
|
19146
|
+
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
|
19147
|
+
}
|
|
19148
|
+
},
|
|
19149
|
+
{
|
|
19150
|
+
"name": "value",
|
|
19151
|
+
"type": {
|
|
19152
|
+
"text": "string"
|
|
19153
|
+
},
|
|
19154
|
+
"default": "''",
|
|
19155
|
+
"description": "Indicates the value of the component group (ex: input, checkbox, radio, select etc...)",
|
|
19156
|
+
"fieldName": "value",
|
|
19157
|
+
"inheritedFrom": {
|
|
19158
|
+
"name": "FormInternalsMixin",
|
|
19159
|
+
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
|
19160
|
+
}
|
|
19161
|
+
},
|
|
19162
|
+
{
|
|
19163
|
+
"name": "validation-message",
|
|
19164
|
+
"type": {
|
|
19165
|
+
"text": "string | undefined"
|
|
19166
|
+
},
|
|
19167
|
+
"description": "Custom validation message that will override the default message and displayed when the input is invalid.",
|
|
19168
|
+
"fieldName": "validationMessage",
|
|
19169
|
+
"inheritedFrom": {
|
|
19170
|
+
"name": "FormInternalsMixin",
|
|
19171
|
+
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
|
19172
|
+
}
|
|
19173
|
+
},
|
|
19174
|
+
{
|
|
19175
|
+
"name": "data-aria-label",
|
|
19176
|
+
"type": {
|
|
19177
|
+
"text": "string | null"
|
|
19178
|
+
},
|
|
19179
|
+
"default": "null",
|
|
19180
|
+
"description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
|
|
19181
|
+
"fieldName": "dataAriaLabel",
|
|
19182
|
+
"inheritedFrom": {
|
|
19183
|
+
"name": "DataAriaLabelMixin",
|
|
19184
|
+
"module": "src/utils/mixins/DataAriaLabelMixin.ts"
|
|
19185
|
+
}
|
|
19186
|
+
},
|
|
19187
|
+
{
|
|
19188
|
+
"name": "disabled",
|
|
19189
|
+
"type": {
|
|
19190
|
+
"text": "boolean | undefined"
|
|
19191
|
+
},
|
|
19192
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
|
19193
|
+
"default": "undefined",
|
|
19194
|
+
"fieldName": "disabled",
|
|
19195
|
+
"inheritedFrom": {
|
|
19196
|
+
"name": "FormfieldWrapper",
|
|
19197
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
19198
|
+
}
|
|
19199
|
+
},
|
|
19200
|
+
{
|
|
19201
|
+
"name": "label",
|
|
19202
|
+
"type": {
|
|
19203
|
+
"text": "string | undefined"
|
|
19204
|
+
},
|
|
19205
|
+
"description": "The label of the input field. It is linked to the input field using the `for` attribute.",
|
|
19206
|
+
"fieldName": "label",
|
|
19207
|
+
"inheritedFrom": {
|
|
19208
|
+
"name": "FormfieldWrapper",
|
|
19209
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
19210
|
+
}
|
|
19211
|
+
},
|
|
19212
|
+
{
|
|
19213
|
+
"name": "required-label",
|
|
19214
|
+
"type": {
|
|
19215
|
+
"text": "string | undefined"
|
|
19216
|
+
},
|
|
19217
|
+
"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.",
|
|
19218
|
+
"fieldName": "requiredLabel",
|
|
19219
|
+
"inheritedFrom": {
|
|
19220
|
+
"name": "FormfieldWrapper",
|
|
19221
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
19222
|
+
}
|
|
19223
|
+
},
|
|
19224
|
+
{
|
|
19225
|
+
"name": "id",
|
|
19226
|
+
"type": {
|
|
19227
|
+
"text": "string"
|
|
19228
|
+
},
|
|
19229
|
+
"default": "''",
|
|
19230
|
+
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
|
19231
|
+
"fieldName": "id",
|
|
19232
|
+
"inheritedFrom": {
|
|
19233
|
+
"name": "FormfieldWrapper",
|
|
19234
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
19235
|
+
}
|
|
19236
|
+
},
|
|
19237
|
+
{
|
|
19238
|
+
"name": "help-text-type",
|
|
19239
|
+
"type": {
|
|
19240
|
+
"text": "ValidationType"
|
|
19241
|
+
},
|
|
19242
|
+
"description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
|
|
19243
|
+
"fieldName": "helpTextType",
|
|
19244
|
+
"inheritedFrom": {
|
|
19245
|
+
"name": "FormfieldWrapper",
|
|
19246
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
19247
|
+
}
|
|
19248
|
+
},
|
|
19249
|
+
{
|
|
19250
|
+
"name": "help-text",
|
|
19251
|
+
"type": {
|
|
19252
|
+
"text": "string | undefined"
|
|
19253
|
+
},
|
|
19254
|
+
"description": "The help text that is displayed below the input field.",
|
|
19255
|
+
"fieldName": "helpText",
|
|
19256
|
+
"inheritedFrom": {
|
|
19257
|
+
"name": "FormfieldWrapper",
|
|
19258
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
19259
|
+
}
|
|
19260
|
+
}
|
|
19261
|
+
],
|
|
19262
|
+
"mixins": [
|
|
19263
|
+
{
|
|
19264
|
+
"name": "FormInternalsMixin",
|
|
19265
|
+
"module": "/src/utils/mixins/FormInternalsMixin"
|
|
19266
|
+
},
|
|
19267
|
+
{
|
|
19268
|
+
"name": "DataAriaLabelMixin",
|
|
19269
|
+
"module": "/src/utils/mixins/DataAriaLabelMixin"
|
|
19270
|
+
}
|
|
19271
|
+
],
|
|
19272
|
+
"superclass": {
|
|
19273
|
+
"name": "FormfieldWrapper",
|
|
19274
|
+
"module": "/src/components/formfieldwrapper"
|
|
19275
|
+
},
|
|
19276
|
+
"tagName": "mdc-toggle",
|
|
19277
|
+
"jsDoc": "/**\n * Toggle Component is an interactive control used to switch between two mutually exclusive options,\n * such as On/Off, Active/Inactive. These are commonly used in settings panels, forms, and preference selections\n * where users need to enable or disable a feature.\n * It contains an optional label and an optional helper text.\n *\n * To create a group of toggles, use the FormFieldGroup component.\n *\n * Note: It internally renders a checkbox styled as a toggle switch.\n *\n * @dependency mdc-icon\n *\n * @tagname mdc-toggle\n *\n * @event change - (React: onChange) Event that gets dispatched when the toggle state changes.\n * @event focus - (React: onFocus) Event that gets dispatched when the toggle receives focus.\n *\n * @cssproperty --mdc-toggle-width - width of the toggle\n * @cssproperty --mdc-toggle-height - height of the toggle\n * @cssproperty --mdc-toggle-width-compact - width of the toggle when it's size is compact\n * @cssproperty --mdc-toggle-height-compact - height of the toggle when it's size is compact\n * @cssproperty --mdc-toggle-border-radius - border radius of the toggle\n * @cssproperty --mdc-toggle-border-radius-compact - border radius of the toggle when it's size is compact\n * @cssproperty --mdc-toggle-border - border of the toggle\n * @cssproperty --mdc-toggle-inactive-rest-color - background color of the inactive toggle in rest state\n * @cssproperty --mdc-toggle-inactive-hover-color - background color of the inactive toggle in hover state\n * @cssproperty --mdc-toggle-inactive-pressed-color - background color of the inactive toggle in pressed state\n * @cssproperty --mdc-toggle-inactive-disabled-color - background color of the inactive toggle in disabled state\n * @cssproperty --mdc-toggle-active-rest-color - background color of the active toggle in rest state\n * @cssproperty --mdc-toggle-active-hover-color - background color of the active toggle in hover state\n * @cssproperty --mdc-toggle-active-pressed-color - background color of the active toggle in pressed state\n * @cssproperty --mdc-toggle-active-disabled-color - background color of the active toggle in disabled state\n * @cssproperty --mdc-toggle-help-text-color - color of the help text label\n * @cssproperty --mdc-toggle-label-color-disabled - color of the toggle label and help text in disabled state\n *\n */",
|
|
19278
|
+
"customElement": true,
|
|
19279
|
+
"slots": [
|
|
19280
|
+
{
|
|
19281
|
+
"description": "slot to add the label info icon",
|
|
19282
|
+
"name": "label-info",
|
|
19283
|
+
"inheritedFrom": {
|
|
19284
|
+
"name": "FormfieldWrapper",
|
|
19285
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
19286
|
+
}
|
|
19287
|
+
}
|
|
19288
|
+
]
|
|
19289
|
+
}
|
|
19290
|
+
],
|
|
19291
|
+
"exports": [
|
|
19292
|
+
{
|
|
19293
|
+
"kind": "js",
|
|
19294
|
+
"name": "default",
|
|
19295
|
+
"declaration": {
|
|
19296
|
+
"name": "Toggle",
|
|
19297
|
+
"module": "components/toggle/toggle.component.js"
|
|
19298
|
+
}
|
|
19299
|
+
}
|
|
19300
|
+
]
|
|
19301
|
+
},
|
|
19302
|
+
{
|
|
19303
|
+
"kind": "javascript-module",
|
|
19304
|
+
"path": "components/toggletip/toggletip.component.js",
|
|
19305
|
+
"declarations": [
|
|
19306
|
+
{
|
|
19307
|
+
"kind": "class",
|
|
19308
|
+
"description": "A toggletip is triggered by clicking a trigger element.\n\nIt can contain interactive content and can be closed by\nclicking outside the toggletip or pressing the escape key.\n\nIt can have optional close button to close the toggletip.\n\nToggletip component uses `mdc-screenreaderannouncer` internally to\nannounce the toggletip text content with screen readers when the toggletip is shown.\n\n`screenreader-announcer-identity` attribute can be used to provide ID of an element\nin DOM to which announcement elements are added. If not set, a visually hidden\ndiv element is created in DOM to which announcement elements are added.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
|
|
19309
|
+
"name": "ToggleTip",
|
|
19310
|
+
"cssProperties": [
|
|
19311
|
+
{
|
|
19312
|
+
"description": "The maximum width of the toggletip.",
|
|
19313
|
+
"name": "--mdc-toggletip-max-width"
|
|
19314
|
+
},
|
|
19315
|
+
{
|
|
19316
|
+
"description": "The text color of the toggletip.",
|
|
19317
|
+
"name": "--mdc-toggletip-text-color"
|
|
19318
|
+
},
|
|
19319
|
+
{
|
|
19320
|
+
"description": "The text color of the toggletip when the color is contrast.",
|
|
19321
|
+
"name": "--mdc-toggletip-text-color-contrast"
|
|
19322
|
+
},
|
|
19323
|
+
{
|
|
19324
|
+
"description": "radius of the arrow border",
|
|
19325
|
+
"name": "--mdc-popover-arrow-border-radius",
|
|
19326
|
+
"inheritedFrom": {
|
|
19327
|
+
"name": "Popover",
|
|
19328
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19329
|
+
}
|
|
19330
|
+
},
|
|
19331
|
+
{
|
|
19332
|
+
"description": "border of the arrow",
|
|
19333
|
+
"name": "--mdc-popover-arrow-border",
|
|
19334
|
+
"inheritedFrom": {
|
|
19335
|
+
"name": "Popover",
|
|
19336
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19337
|
+
}
|
|
19338
|
+
},
|
|
19339
|
+
{
|
|
19340
|
+
"description": "primary background color of the popover",
|
|
19341
|
+
"name": "--mdc-popover-primary-background-color",
|
|
19342
|
+
"inheritedFrom": {
|
|
19343
|
+
"name": "Popover",
|
|
19344
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19345
|
+
}
|
|
19346
|
+
},
|
|
19347
|
+
{
|
|
19348
|
+
"description": "border color of the popover",
|
|
19349
|
+
"name": "--mdc-popover-border-color",
|
|
19350
|
+
"inheritedFrom": {
|
|
19351
|
+
"name": "Popover",
|
|
19352
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19353
|
+
}
|
|
19354
|
+
},
|
|
19355
|
+
{
|
|
19356
|
+
"description": "inverted background color of the popover",
|
|
19357
|
+
"name": "--mdc-popover-inverted-background-color",
|
|
19358
|
+
"inheritedFrom": {
|
|
19359
|
+
"name": "Popover",
|
|
19360
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19361
|
+
}
|
|
19362
|
+
},
|
|
19363
|
+
{
|
|
19364
|
+
"description": "inverted border color of the popover",
|
|
19365
|
+
"name": "--mdc-popover-inverted-border-color",
|
|
19366
|
+
"inheritedFrom": {
|
|
19367
|
+
"name": "Popover",
|
|
19368
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19369
|
+
}
|
|
19370
|
+
},
|
|
19371
|
+
{
|
|
19372
|
+
"description": "inverted text color of the popover",
|
|
19373
|
+
"name": "--mdc-popover-inverted-text-color",
|
|
19374
|
+
"inheritedFrom": {
|
|
19375
|
+
"name": "Popover",
|
|
19376
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19377
|
+
}
|
|
19378
|
+
},
|
|
19379
|
+
{
|
|
19380
|
+
"description": "elevation of the popover",
|
|
19381
|
+
"name": "--mdc-popover-elevation-3",
|
|
19382
|
+
"inheritedFrom": {
|
|
19383
|
+
"name": "Popover",
|
|
19384
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19385
|
+
}
|
|
19386
|
+
},
|
|
19387
|
+
{
|
|
19388
|
+
"description": "max width of the popover",
|
|
19389
|
+
"name": "--mdc-popover-max-width",
|
|
19390
|
+
"inheritedFrom": {
|
|
19391
|
+
"name": "Popover",
|
|
19392
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19393
|
+
}
|
|
19394
|
+
},
|
|
19395
|
+
{
|
|
19396
|
+
"description": "max height of the popover",
|
|
19397
|
+
"name": "--mdc-popover-max-height",
|
|
19398
|
+
"inheritedFrom": {
|
|
19399
|
+
"name": "Popover",
|
|
19400
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19401
|
+
}
|
|
19402
|
+
}
|
|
19403
|
+
],
|
|
19404
|
+
"slots": [
|
|
19405
|
+
{
|
|
19406
|
+
"description": "Default slot for the toggletip content",
|
|
19407
|
+
"name": "",
|
|
19408
|
+
"inheritedFrom": {
|
|
19409
|
+
"name": "Popover",
|
|
19410
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19411
|
+
}
|
|
19412
|
+
}
|
|
19413
|
+
],
|
|
19414
|
+
"members": [
|
|
19415
|
+
{
|
|
19416
|
+
"kind": "field",
|
|
19417
|
+
"name": "defaultSlotNodes",
|
|
19418
|
+
"type": {
|
|
19419
|
+
"text": "Array<Node>"
|
|
19420
|
+
},
|
|
19421
|
+
"privacy": "private"
|
|
19422
|
+
},
|
|
19423
|
+
{
|
|
19424
|
+
"kind": "field",
|
|
19425
|
+
"name": "screenreaderAnnouncerIdentity",
|
|
19426
|
+
"type": {
|
|
19427
|
+
"text": "string"
|
|
19428
|
+
},
|
|
19429
|
+
"default": "''",
|
|
19430
|
+
"description": "Set this attribute with the id of the element in the DOM, to which announcement\nelements will be appended.\nIf an id is provided, the announcement elements will be appended to this element.\nIf id is not provided, a visually hidden div element will be created in the DOM.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
|
|
19431
|
+
"attribute": "screenreader-announcer-identity",
|
|
19432
|
+
"reflects": true
|
|
19433
|
+
},
|
|
19434
|
+
{
|
|
19435
|
+
"kind": "method",
|
|
19436
|
+
"name": "getToggleTipText",
|
|
19437
|
+
"privacy": "private",
|
|
19438
|
+
"return": {
|
|
19439
|
+
"type": {
|
|
19440
|
+
"text": ""
|
|
19441
|
+
}
|
|
19442
|
+
}
|
|
19443
|
+
},
|
|
19444
|
+
{
|
|
19445
|
+
"kind": "method",
|
|
19446
|
+
"name": "onPlacementUpdated",
|
|
19447
|
+
"privacy": "private",
|
|
19448
|
+
"return": {
|
|
19449
|
+
"type": {
|
|
19450
|
+
"text": "void"
|
|
19451
|
+
}
|
|
19452
|
+
},
|
|
19453
|
+
"description": "Updates the placement attribute if it is not a valid placement.\nDefault placement for toggle tip is top."
|
|
19454
|
+
},
|
|
19455
|
+
{
|
|
19456
|
+
"kind": "field",
|
|
19457
|
+
"name": "enabledFocusTrap",
|
|
19458
|
+
"type": {
|
|
19459
|
+
"text": "boolean"
|
|
19460
|
+
},
|
|
19461
|
+
"description": "Determines whether the focus trap is enabled.\nIf true, focus will be restricted to the content within this component.",
|
|
19462
|
+
"default": "false",
|
|
19463
|
+
"attribute": "enabledFocusTrap",
|
|
19464
|
+
"inheritedFrom": {
|
|
19465
|
+
"name": "Popover",
|
|
19466
|
+
"module": "components/popover/popover.component.js"
|
|
19467
|
+
}
|
|
19468
|
+
},
|
|
19469
|
+
{
|
|
19470
|
+
"kind": "field",
|
|
19471
|
+
"name": "enabledPreventScroll",
|
|
19472
|
+
"type": {
|
|
19473
|
+
"text": "boolean"
|
|
19474
|
+
},
|
|
19475
|
+
"description": "Prevent outside scrolling when popover show.",
|
|
19476
|
+
"default": "false",
|
|
19477
|
+
"attribute": "enabledPreventScroll",
|
|
19478
|
+
"inheritedFrom": {
|
|
19479
|
+
"name": "Popover",
|
|
19480
|
+
"module": "components/popover/popover.component.js"
|
|
19481
|
+
}
|
|
19482
|
+
},
|
|
19483
|
+
{
|
|
19484
|
+
"kind": "field",
|
|
19485
|
+
"name": "shouldWrapFocus",
|
|
19486
|
+
"type": {
|
|
19487
|
+
"text": "() => boolean"
|
|
19488
|
+
},
|
|
19489
|
+
"inheritedFrom": {
|
|
19490
|
+
"name": "Popover",
|
|
19491
|
+
"module": "components/popover/popover.component.js"
|
|
19492
|
+
}
|
|
19493
|
+
},
|
|
19494
|
+
{
|
|
19495
|
+
"kind": "method",
|
|
19496
|
+
"name": "deactivateFocusTrap",
|
|
19497
|
+
"description": "Deactivate the focus trap.",
|
|
19498
|
+
"inheritedFrom": {
|
|
19499
|
+
"name": "Popover",
|
|
19500
|
+
"module": "components/popover/popover.component.js"
|
|
19501
|
+
}
|
|
19502
|
+
},
|
|
19503
|
+
{
|
|
19504
|
+
"kind": "method",
|
|
19505
|
+
"name": "hasNoClientRects",
|
|
19506
|
+
"privacy": "private",
|
|
19507
|
+
"parameters": [
|
|
19508
|
+
{
|
|
19509
|
+
"name": "element",
|
|
19510
|
+
"type": {
|
|
19511
|
+
"text": "HTMLElement"
|
|
19512
|
+
},
|
|
19513
|
+
"description": "The element to check."
|
|
19514
|
+
}
|
|
19515
|
+
],
|
|
19516
|
+
"description": "Checks if the element has no client rectangles (not visible in the viewport).",
|
|
19517
|
+
"return": {
|
|
19518
|
+
"type": {
|
|
19519
|
+
"text": ""
|
|
19520
|
+
}
|
|
19521
|
+
},
|
|
19522
|
+
"inheritedFrom": {
|
|
19523
|
+
"name": "Popover",
|
|
19524
|
+
"module": "components/popover/popover.component.js"
|
|
19525
|
+
}
|
|
19526
|
+
},
|
|
19527
|
+
{
|
|
19528
|
+
"kind": "method",
|
|
19529
|
+
"name": "hasZeroDimensions",
|
|
19530
|
+
"privacy": "private",
|
|
19531
|
+
"parameters": [
|
|
19532
|
+
{
|
|
19533
|
+
"name": "element",
|
|
19534
|
+
"type": {
|
|
19535
|
+
"text": "HTMLElement"
|
|
19536
|
+
},
|
|
19537
|
+
"description": "The element to check."
|
|
19538
|
+
}
|
|
19539
|
+
],
|
|
19540
|
+
"description": "Checks if the element has zero dimensions (width and height are both 0).",
|
|
19541
|
+
"return": {
|
|
19542
|
+
"type": {
|
|
19543
|
+
"text": ""
|
|
19544
|
+
}
|
|
19545
|
+
},
|
|
19546
|
+
"inheritedFrom": {
|
|
19547
|
+
"name": "Popover",
|
|
19548
|
+
"module": "components/popover/popover.component.js"
|
|
19549
|
+
}
|
|
19550
|
+
},
|
|
19551
|
+
{
|
|
19552
|
+
"kind": "method",
|
|
19553
|
+
"name": "isNotVisible",
|
|
19554
|
+
"privacy": "private",
|
|
19555
|
+
"parameters": [
|
|
19556
|
+
{
|
|
19557
|
+
"name": "element",
|
|
19558
|
+
"type": {
|
|
19559
|
+
"text": "HTMLElement"
|
|
19560
|
+
},
|
|
19561
|
+
"description": "The element to check."
|
|
19562
|
+
}
|
|
19563
|
+
],
|
|
19564
|
+
"description": "Determines if the element is not visible in the DOM.",
|
|
19565
|
+
"return": {
|
|
19566
|
+
"type": {
|
|
19567
|
+
"text": ""
|
|
19568
|
+
}
|
|
19569
|
+
},
|
|
19570
|
+
"inheritedFrom": {
|
|
19571
|
+
"name": "Popover",
|
|
19572
|
+
"module": "components/popover/popover.component.js"
|
|
19573
|
+
}
|
|
19574
|
+
},
|
|
19575
|
+
{
|
|
19576
|
+
"kind": "method",
|
|
19577
|
+
"name": "hasHiddenStyle",
|
|
19578
|
+
"privacy": "private",
|
|
19579
|
+
"parameters": [
|
|
19580
|
+
{
|
|
19581
|
+
"name": "element",
|
|
19582
|
+
"type": {
|
|
19583
|
+
"text": "HTMLElement"
|
|
19584
|
+
},
|
|
19585
|
+
"description": "The element to check."
|
|
19586
|
+
}
|
|
19587
|
+
],
|
|
19588
|
+
"description": "Checks if the element has inline styles that make it hidden.",
|
|
19589
|
+
"return": {
|
|
19590
|
+
"type": {
|
|
19591
|
+
"text": ""
|
|
19592
|
+
}
|
|
19593
|
+
},
|
|
19594
|
+
"inheritedFrom": {
|
|
19595
|
+
"name": "Popover",
|
|
19596
|
+
"module": "components/popover/popover.component.js"
|
|
19597
|
+
}
|
|
19598
|
+
},
|
|
19599
|
+
{
|
|
19600
|
+
"kind": "method",
|
|
19601
|
+
"name": "hasComputedHidden",
|
|
19602
|
+
"privacy": "private",
|
|
19603
|
+
"parameters": [
|
|
19604
|
+
{
|
|
19605
|
+
"name": "element",
|
|
19606
|
+
"type": {
|
|
19607
|
+
"text": "HTMLElement"
|
|
19608
|
+
},
|
|
19609
|
+
"description": "The element to check."
|
|
19610
|
+
}
|
|
19611
|
+
],
|
|
19612
|
+
"description": "Checks if the element is hidden by a computed style.",
|
|
19613
|
+
"return": {
|
|
19614
|
+
"type": {
|
|
19615
|
+
"text": ""
|
|
19616
|
+
}
|
|
19617
|
+
},
|
|
19618
|
+
"inheritedFrom": {
|
|
19619
|
+
"name": "Popover",
|
|
19620
|
+
"module": "components/popover/popover.component.js"
|
|
19621
|
+
}
|
|
19622
|
+
},
|
|
19623
|
+
{
|
|
19624
|
+
"kind": "method",
|
|
19625
|
+
"name": "isHidden",
|
|
19626
|
+
"privacy": "private",
|
|
19627
|
+
"parameters": [
|
|
19628
|
+
{
|
|
19629
|
+
"name": "element",
|
|
19630
|
+
"type": {
|
|
19631
|
+
"text": "HTMLElement"
|
|
19632
|
+
},
|
|
19633
|
+
"description": "The element to check."
|
|
19634
|
+
}
|
|
19635
|
+
],
|
|
19636
|
+
"description": "Checks if the element is hidden from the user.",
|
|
19637
|
+
"return": {
|
|
19638
|
+
"type": {
|
|
19639
|
+
"text": ""
|
|
19640
|
+
}
|
|
19641
|
+
},
|
|
19642
|
+
"inheritedFrom": {
|
|
19643
|
+
"name": "Popover",
|
|
19644
|
+
"module": "components/popover/popover.component.js"
|
|
19645
|
+
}
|
|
19646
|
+
},
|
|
19647
|
+
{
|
|
19648
|
+
"kind": "method",
|
|
19649
|
+
"name": "isNotTabbable",
|
|
19650
|
+
"privacy": "private",
|
|
19651
|
+
"parameters": [
|
|
19652
|
+
{
|
|
19653
|
+
"name": "element",
|
|
19654
|
+
"type": {
|
|
19655
|
+
"text": "HTMLElement"
|
|
19656
|
+
},
|
|
19657
|
+
"description": "The element to check."
|
|
19658
|
+
}
|
|
19659
|
+
],
|
|
19660
|
+
"description": "Checks if the element is not tabbable.",
|
|
19661
|
+
"return": {
|
|
19662
|
+
"type": {
|
|
19663
|
+
"text": ""
|
|
19664
|
+
}
|
|
19665
|
+
},
|
|
19666
|
+
"inheritedFrom": {
|
|
19667
|
+
"name": "Popover",
|
|
19668
|
+
"module": "components/popover/popover.component.js"
|
|
19669
|
+
}
|
|
19670
|
+
},
|
|
19671
|
+
{
|
|
19672
|
+
"kind": "method",
|
|
19673
|
+
"name": "isInteractiveElement",
|
|
19674
|
+
"privacy": "private",
|
|
19675
|
+
"return": {
|
|
19676
|
+
"type": {
|
|
19677
|
+
"text": ""
|
|
19678
|
+
}
|
|
19679
|
+
},
|
|
19680
|
+
"parameters": [
|
|
19681
|
+
{
|
|
19682
|
+
"name": "element",
|
|
19683
|
+
"type": {
|
|
19684
|
+
"text": "HTMLElement"
|
|
19685
|
+
},
|
|
19686
|
+
"description": "The element to check."
|
|
19687
|
+
}
|
|
19688
|
+
],
|
|
19689
|
+
"description": "Checks if the element is interactive.",
|
|
19690
|
+
"inheritedFrom": {
|
|
19691
|
+
"name": "Popover",
|
|
19692
|
+
"module": "components/popover/popover.component.js"
|
|
19693
|
+
}
|
|
19694
|
+
},
|
|
19695
|
+
{
|
|
19696
|
+
"kind": "method",
|
|
19697
|
+
"name": "isFocusable",
|
|
19698
|
+
"privacy": "private",
|
|
19699
|
+
"parameters": [
|
|
19700
|
+
{
|
|
19701
|
+
"name": "element",
|
|
19702
|
+
"type": {
|
|
19703
|
+
"text": "HTMLElement"
|
|
19704
|
+
},
|
|
19705
|
+
"description": "The element to check."
|
|
19706
|
+
}
|
|
19707
|
+
],
|
|
19708
|
+
"description": "Checks if the element is focusable.",
|
|
19709
|
+
"return": {
|
|
19710
|
+
"type": {
|
|
19711
|
+
"text": ""
|
|
19712
|
+
}
|
|
19713
|
+
},
|
|
19714
|
+
"inheritedFrom": {
|
|
19715
|
+
"name": "Popover",
|
|
19716
|
+
"module": "components/popover/popover.component.js"
|
|
19717
|
+
}
|
|
19718
|
+
},
|
|
19719
|
+
{
|
|
19720
|
+
"kind": "method",
|
|
19721
|
+
"name": "findFocusable",
|
|
19722
|
+
"privacy": "private",
|
|
19723
|
+
"return": {
|
|
19724
|
+
"type": {
|
|
19725
|
+
"text": ""
|
|
19726
|
+
}
|
|
19727
|
+
},
|
|
19728
|
+
"parameters": [
|
|
19729
|
+
{
|
|
19730
|
+
"name": "root",
|
|
19731
|
+
"type": {
|
|
19732
|
+
"text": "ShadowRoot | HTMLElement"
|
|
19733
|
+
},
|
|
19734
|
+
"description": "The root element to search for focusable elements."
|
|
19735
|
+
},
|
|
19736
|
+
{
|
|
19737
|
+
"name": "matches",
|
|
19738
|
+
"default": "new Set()",
|
|
19739
|
+
"type": {
|
|
19740
|
+
"text": "Set<HTMLElement>"
|
|
19741
|
+
},
|
|
19742
|
+
"description": "The set of focusable elements."
|
|
19743
|
+
}
|
|
19744
|
+
],
|
|
19745
|
+
"description": "Recursively finds all focusable elements within the given root and its descendants.",
|
|
19746
|
+
"inheritedFrom": {
|
|
19747
|
+
"name": "Popover",
|
|
19748
|
+
"module": "components/popover/popover.component.js"
|
|
19749
|
+
}
|
|
19750
|
+
},
|
|
19751
|
+
{
|
|
19752
|
+
"kind": "method",
|
|
19753
|
+
"name": "setFocusableElements",
|
|
19754
|
+
"privacy": "public",
|
|
19755
|
+
"description": "Updates the list of focusable elements within the component's shadow root.",
|
|
19756
|
+
"inheritedFrom": {
|
|
19757
|
+
"name": "Popover",
|
|
19758
|
+
"module": "components/popover/popover.component.js"
|
|
19759
|
+
}
|
|
19760
|
+
},
|
|
19761
|
+
{
|
|
19762
|
+
"kind": "method",
|
|
19763
|
+
"name": "setInitialFocus",
|
|
19764
|
+
"privacy": "public",
|
|
19765
|
+
"parameters": [
|
|
19766
|
+
{
|
|
19767
|
+
"name": "prefferableElement",
|
|
19768
|
+
"default": "0",
|
|
19769
|
+
"type": {
|
|
19770
|
+
"text": "number"
|
|
19771
|
+
},
|
|
19772
|
+
"description": "The index of the prefferable element to focus."
|
|
19773
|
+
}
|
|
19774
|
+
],
|
|
19775
|
+
"description": "Sets the initial focus within the container.",
|
|
19776
|
+
"inheritedFrom": {
|
|
19777
|
+
"name": "Popover",
|
|
19778
|
+
"module": "components/popover/popover.component.js"
|
|
19779
|
+
}
|
|
19780
|
+
},
|
|
19781
|
+
{
|
|
19782
|
+
"kind": "method",
|
|
19783
|
+
"name": "calculateNextIndex",
|
|
19784
|
+
"privacy": "private",
|
|
19785
|
+
"parameters": [
|
|
19786
|
+
{
|
|
19787
|
+
"name": "currentIndex",
|
|
19788
|
+
"type": {
|
|
19789
|
+
"text": "number"
|
|
19790
|
+
},
|
|
19791
|
+
"description": "The current index."
|
|
19792
|
+
},
|
|
19793
|
+
{
|
|
19794
|
+
"name": "step",
|
|
19795
|
+
"type": {
|
|
19796
|
+
"text": "number"
|
|
19797
|
+
},
|
|
19798
|
+
"description": "The step to calculate the next index."
|
|
19799
|
+
}
|
|
19800
|
+
],
|
|
19801
|
+
"description": "Calculates the next index for the focus trap.",
|
|
19802
|
+
"return": {
|
|
19803
|
+
"type": {
|
|
19804
|
+
"text": ""
|
|
19805
|
+
}
|
|
19806
|
+
},
|
|
19807
|
+
"inheritedFrom": {
|
|
19808
|
+
"name": "Popover",
|
|
19809
|
+
"module": "components/popover/popover.component.js"
|
|
19810
|
+
}
|
|
19811
|
+
},
|
|
19812
|
+
{
|
|
19813
|
+
"kind": "method",
|
|
19814
|
+
"name": "getDeepActiveElement",
|
|
19815
|
+
"privacy": "private",
|
|
19816
|
+
"description": "Returns the deepest active element in the shadow DOM.",
|
|
19817
|
+
"return": {
|
|
19818
|
+
"type": {
|
|
19819
|
+
"text": ""
|
|
19820
|
+
}
|
|
19821
|
+
},
|
|
19822
|
+
"inheritedFrom": {
|
|
19823
|
+
"name": "Popover",
|
|
19824
|
+
"module": "components/popover/popover.component.js"
|
|
19825
|
+
}
|
|
19826
|
+
},
|
|
19827
|
+
{
|
|
19828
|
+
"kind": "method",
|
|
19829
|
+
"name": "findElement",
|
|
19830
|
+
"privacy": "private",
|
|
19831
|
+
"parameters": [
|
|
19832
|
+
{
|
|
19833
|
+
"name": "activeElement",
|
|
19834
|
+
"type": {
|
|
19835
|
+
"text": "HTMLElement"
|
|
19836
|
+
},
|
|
19837
|
+
"description": "The active element."
|
|
19838
|
+
}
|
|
19839
|
+
],
|
|
19840
|
+
"description": "Finds the index of the active element within the focusable elements.",
|
|
19841
|
+
"return": {
|
|
19842
|
+
"type": {
|
|
19843
|
+
"text": ""
|
|
19844
|
+
}
|
|
19845
|
+
},
|
|
19846
|
+
"inheritedFrom": {
|
|
19847
|
+
"name": "Popover",
|
|
19848
|
+
"module": "components/popover/popover.component.js"
|
|
19849
|
+
}
|
|
19850
|
+
},
|
|
19851
|
+
{
|
|
19852
|
+
"kind": "method",
|
|
19853
|
+
"name": "isEqualFocusNode",
|
|
19854
|
+
"privacy": "private",
|
|
19855
|
+
"parameters": [
|
|
19856
|
+
{
|
|
19857
|
+
"name": "activeElement",
|
|
19858
|
+
"type": {
|
|
19859
|
+
"text": "HTMLElement"
|
|
19860
|
+
},
|
|
19861
|
+
"description": "The active element."
|
|
19862
|
+
},
|
|
19863
|
+
{
|
|
19864
|
+
"name": "element",
|
|
19865
|
+
"type": {
|
|
19866
|
+
"text": "HTMLElement"
|
|
19867
|
+
},
|
|
19868
|
+
"description": "The element to compare."
|
|
19869
|
+
}
|
|
19870
|
+
],
|
|
19871
|
+
"description": "Checks if the active element is equal to the given element.",
|
|
19872
|
+
"return": {
|
|
19873
|
+
"type": {
|
|
19874
|
+
"text": ""
|
|
19875
|
+
}
|
|
19876
|
+
},
|
|
19877
|
+
"inheritedFrom": {
|
|
19878
|
+
"name": "Popover",
|
|
19879
|
+
"module": "components/popover/popover.component.js"
|
|
19880
|
+
}
|
|
19881
|
+
},
|
|
19882
|
+
{
|
|
19883
|
+
"kind": "method",
|
|
19884
|
+
"name": "trapFocus",
|
|
19885
|
+
"privacy": "private",
|
|
19886
|
+
"parameters": [
|
|
19887
|
+
{
|
|
19888
|
+
"name": "direction",
|
|
19889
|
+
"type": {
|
|
19890
|
+
"text": "boolean"
|
|
19891
|
+
},
|
|
19892
|
+
"description": "The direction of the focus trap.\nIf true, the focus will be trapped in the previous element."
|
|
19893
|
+
}
|
|
19894
|
+
],
|
|
19895
|
+
"description": "Traps focus within the container.",
|
|
19896
|
+
"inheritedFrom": {
|
|
19897
|
+
"name": "Popover",
|
|
19898
|
+
"module": "components/popover/popover.component.js"
|
|
19899
|
+
}
|
|
19900
|
+
},
|
|
19901
|
+
{
|
|
19902
|
+
"kind": "method",
|
|
19903
|
+
"name": "handleKeydown",
|
|
19904
|
+
"privacy": "private",
|
|
19905
|
+
"parameters": [
|
|
19906
|
+
{
|
|
19907
|
+
"name": "event",
|
|
19908
|
+
"type": {
|
|
19909
|
+
"text": "KeyboardEvent"
|
|
19910
|
+
},
|
|
19911
|
+
"description": "The keyboard event."
|
|
19912
|
+
}
|
|
19913
|
+
],
|
|
19914
|
+
"description": "Traps focus within the container.",
|
|
19915
|
+
"inheritedFrom": {
|
|
19916
|
+
"name": "Popover",
|
|
19917
|
+
"module": "components/popover/popover.component.js"
|
|
19918
|
+
}
|
|
19919
|
+
},
|
|
19920
|
+
{
|
|
19921
|
+
"kind": "field",
|
|
19922
|
+
"name": "id",
|
|
19923
|
+
"type": {
|
|
19924
|
+
"text": "string"
|
|
19925
|
+
},
|
|
19926
|
+
"default": "''",
|
|
19927
|
+
"description": "The unique ID of the popover.",
|
|
19928
|
+
"attribute": "id",
|
|
19929
|
+
"reflects": true,
|
|
19930
|
+
"inheritedFrom": {
|
|
19931
|
+
"name": "Popover",
|
|
19932
|
+
"module": "components/popover/popover.component.js"
|
|
19933
|
+
}
|
|
19934
|
+
},
|
|
19935
|
+
{
|
|
19936
|
+
"kind": "field",
|
|
19937
|
+
"name": "triggerID",
|
|
19938
|
+
"type": {
|
|
19939
|
+
"text": "string"
|
|
19940
|
+
},
|
|
19941
|
+
"default": "''",
|
|
19942
|
+
"description": "The ID of the element that triggers the popover.\nThis attribute is required for the popover to work.",
|
|
19943
|
+
"attribute": "triggerID",
|
|
19944
|
+
"reflects": true,
|
|
19945
|
+
"inheritedFrom": {
|
|
19946
|
+
"name": "Popover",
|
|
19947
|
+
"module": "components/popover/popover.component.js"
|
|
19948
|
+
}
|
|
19949
|
+
},
|
|
19950
|
+
{
|
|
19951
|
+
"kind": "field",
|
|
19952
|
+
"name": "trigger",
|
|
19953
|
+
"type": {
|
|
19954
|
+
"text": "PopoverTrigger"
|
|
19955
|
+
},
|
|
19956
|
+
"description": "Determines the events that cause the Popover to show.\nMultiple event names should be separated by spaces.\nFor example to allow both click and hover, use 'click mouseenter' as the trigger.\n- **click**\n- **mouseenter**\n- **focusin**\n- **manual**",
|
|
19957
|
+
"default": "click",
|
|
19958
|
+
"attribute": "trigger",
|
|
19959
|
+
"reflects": true,
|
|
19960
|
+
"inheritedFrom": {
|
|
19961
|
+
"name": "Popover",
|
|
19962
|
+
"module": "components/popover/popover.component.js"
|
|
19963
|
+
}
|
|
19964
|
+
},
|
|
19965
|
+
{
|
|
19966
|
+
"kind": "field",
|
|
19967
|
+
"name": "placement",
|
|
19968
|
+
"type": {
|
|
19969
|
+
"text": "PopoverPlacement"
|
|
19970
|
+
},
|
|
19971
|
+
"description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
|
|
19972
|
+
"default": "bottom",
|
|
19973
|
+
"attribute": "placement",
|
|
19974
|
+
"reflects": true,
|
|
19975
|
+
"inheritedFrom": {
|
|
19976
|
+
"name": "Popover",
|
|
19977
|
+
"module": "components/popover/popover.component.js"
|
|
19978
|
+
}
|
|
19979
|
+
},
|
|
19980
|
+
{
|
|
19981
|
+
"kind": "field",
|
|
19982
|
+
"name": "color",
|
|
19983
|
+
"type": {
|
|
19984
|
+
"text": "PopoverColor"
|
|
19985
|
+
},
|
|
19986
|
+
"description": "Color of the popover\n- **tonal**\n- **contrast**",
|
|
19987
|
+
"default": "tonal",
|
|
19988
|
+
"attribute": "color",
|
|
19989
|
+
"reflects": true,
|
|
19990
|
+
"inheritedFrom": {
|
|
19991
|
+
"name": "Popover",
|
|
19992
|
+
"module": "components/popover/popover.component.js"
|
|
19993
|
+
}
|
|
19994
|
+
},
|
|
19995
|
+
{
|
|
19996
|
+
"kind": "field",
|
|
19997
|
+
"name": "visible",
|
|
19998
|
+
"type": {
|
|
19999
|
+
"text": "boolean"
|
|
20000
|
+
},
|
|
20001
|
+
"description": "The visibility of the popover.",
|
|
20002
|
+
"default": "false",
|
|
20003
|
+
"attribute": "visible",
|
|
20004
|
+
"reflects": true,
|
|
20005
|
+
"inheritedFrom": {
|
|
20006
|
+
"name": "Popover",
|
|
20007
|
+
"module": "components/popover/popover.component.js"
|
|
20008
|
+
}
|
|
20009
|
+
},
|
|
20010
|
+
{
|
|
20011
|
+
"kind": "field",
|
|
20012
|
+
"name": "offset",
|
|
20013
|
+
"type": {
|
|
20014
|
+
"text": "number"
|
|
20015
|
+
},
|
|
20016
|
+
"description": "The offset of the popover.",
|
|
20017
|
+
"default": "4",
|
|
20018
|
+
"attribute": "offset",
|
|
20019
|
+
"reflects": true,
|
|
20020
|
+
"inheritedFrom": {
|
|
20021
|
+
"name": "Popover",
|
|
20022
|
+
"module": "components/popover/popover.component.js"
|
|
20023
|
+
}
|
|
20024
|
+
},
|
|
20025
|
+
{
|
|
20026
|
+
"kind": "field",
|
|
20027
|
+
"name": "focusTrap",
|
|
20028
|
+
"type": {
|
|
20029
|
+
"text": "boolean"
|
|
20030
|
+
},
|
|
20031
|
+
"description": "Determines whether the focus trap is enabled.\nIf true, focus will be restricted to the content within this component.",
|
|
20032
|
+
"default": "false",
|
|
20033
|
+
"attribute": "focus-trap",
|
|
20034
|
+
"reflects": true,
|
|
20035
|
+
"inheritedFrom": {
|
|
20036
|
+
"name": "Popover",
|
|
20037
|
+
"module": "components/popover/popover.component.js"
|
|
20038
|
+
}
|
|
20039
|
+
},
|
|
20040
|
+
{
|
|
20041
|
+
"kind": "field",
|
|
20042
|
+
"name": "preventScroll",
|
|
20043
|
+
"type": {
|
|
20044
|
+
"text": "boolean"
|
|
20045
|
+
},
|
|
20046
|
+
"description": "Prevent outside scrolling when popover show.",
|
|
20047
|
+
"default": "false",
|
|
20048
|
+
"attribute": "prevent-scroll",
|
|
20049
|
+
"reflects": true,
|
|
20050
|
+
"inheritedFrom": {
|
|
20051
|
+
"name": "Popover",
|
|
20052
|
+
"module": "components/popover/popover.component.js"
|
|
20053
|
+
}
|
|
20054
|
+
},
|
|
20055
|
+
{
|
|
20056
|
+
"kind": "field",
|
|
20057
|
+
"name": "showArrow",
|
|
20058
|
+
"type": {
|
|
20059
|
+
"text": "boolean"
|
|
20060
|
+
},
|
|
20061
|
+
"description": "The arrow visibility of the popover.",
|
|
20062
|
+
"default": "false",
|
|
20063
|
+
"attribute": "show-arrow",
|
|
20064
|
+
"reflects": true,
|
|
20065
|
+
"inheritedFrom": {
|
|
20066
|
+
"name": "Popover",
|
|
20067
|
+
"module": "components/popover/popover.component.js"
|
|
20068
|
+
}
|
|
20069
|
+
},
|
|
20070
|
+
{
|
|
20071
|
+
"kind": "field",
|
|
20072
|
+
"name": "closeButton",
|
|
20073
|
+
"type": {
|
|
20074
|
+
"text": "boolean"
|
|
20075
|
+
},
|
|
20076
|
+
"description": "The close button visibility of the popover.",
|
|
20077
|
+
"default": "false",
|
|
20078
|
+
"attribute": "close-button",
|
|
20079
|
+
"reflects": true,
|
|
20080
|
+
"inheritedFrom": {
|
|
20081
|
+
"name": "Popover",
|
|
20082
|
+
"module": "components/popover/popover.component.js"
|
|
20083
|
+
}
|
|
20084
|
+
},
|
|
20085
|
+
{
|
|
20086
|
+
"kind": "field",
|
|
20087
|
+
"name": "interactive",
|
|
20088
|
+
"type": {
|
|
20089
|
+
"text": "boolean"
|
|
20090
|
+
},
|
|
20091
|
+
"description": "Determines whether the popover is interactive。",
|
|
20092
|
+
"default": "false",
|
|
20093
|
+
"attribute": "interactive",
|
|
20094
|
+
"reflects": true,
|
|
20095
|
+
"inheritedFrom": {
|
|
20096
|
+
"name": "Popover",
|
|
20097
|
+
"module": "components/popover/popover.component.js"
|
|
20098
|
+
}
|
|
20099
|
+
},
|
|
20100
|
+
{
|
|
20101
|
+
"kind": "field",
|
|
20102
|
+
"name": "delay",
|
|
20103
|
+
"type": {
|
|
20104
|
+
"text": "string"
|
|
20105
|
+
},
|
|
20106
|
+
"description": "The delay of the show/hide popover.",
|
|
20107
|
+
"default": "0,0",
|
|
20108
|
+
"attribute": "delay",
|
|
20109
|
+
"reflects": true,
|
|
20110
|
+
"inheritedFrom": {
|
|
20111
|
+
"name": "Popover",
|
|
20112
|
+
"module": "components/popover/popover.component.js"
|
|
20113
|
+
}
|
|
20114
|
+
},
|
|
20115
|
+
{
|
|
20116
|
+
"kind": "field",
|
|
20117
|
+
"name": "hideOnEscape",
|
|
20118
|
+
"type": {
|
|
20119
|
+
"text": "boolean"
|
|
20120
|
+
},
|
|
20121
|
+
"description": "Hide popover on escape key press.",
|
|
20122
|
+
"default": "false",
|
|
20123
|
+
"attribute": "hide-on-escape",
|
|
20124
|
+
"reflects": true,
|
|
20125
|
+
"inheritedFrom": {
|
|
20126
|
+
"name": "Popover",
|
|
20127
|
+
"module": "components/popover/popover.component.js"
|
|
20128
|
+
}
|
|
20129
|
+
},
|
|
20130
|
+
{
|
|
20131
|
+
"kind": "field",
|
|
20132
|
+
"name": "hideOnBlur",
|
|
20133
|
+
"type": {
|
|
20134
|
+
"text": "boolean"
|
|
20135
|
+
},
|
|
20136
|
+
"description": "Hide popover on blur.",
|
|
20137
|
+
"default": "false",
|
|
20138
|
+
"attribute": "hide-on-blur",
|
|
20139
|
+
"reflects": true,
|
|
20140
|
+
"inheritedFrom": {
|
|
20141
|
+
"name": "Popover",
|
|
20142
|
+
"module": "components/popover/popover.component.js"
|
|
20143
|
+
}
|
|
20144
|
+
},
|
|
20145
|
+
{
|
|
20146
|
+
"kind": "field",
|
|
20147
|
+
"name": "hideOnOutsideClick",
|
|
20148
|
+
"type": {
|
|
20149
|
+
"text": "boolean"
|
|
20150
|
+
},
|
|
20151
|
+
"description": "Hide on outside click of the popover.",
|
|
20152
|
+
"default": "false",
|
|
20153
|
+
"attribute": "hide-on-outside-click",
|
|
20154
|
+
"reflects": true,
|
|
20155
|
+
"inheritedFrom": {
|
|
20156
|
+
"name": "Popover",
|
|
20157
|
+
"module": "components/popover/popover.component.js"
|
|
20158
|
+
}
|
|
20159
|
+
},
|
|
20160
|
+
{
|
|
20161
|
+
"kind": "field",
|
|
20162
|
+
"name": "focusBackToTrigger",
|
|
20163
|
+
"type": {
|
|
20164
|
+
"text": "boolean"
|
|
20165
|
+
},
|
|
20166
|
+
"description": "The focus back to trigger after the popover hide.",
|
|
20167
|
+
"default": "false",
|
|
20168
|
+
"attribute": "focus-back-to-trigger",
|
|
20169
|
+
"reflects": true,
|
|
20170
|
+
"inheritedFrom": {
|
|
20171
|
+
"name": "Popover",
|
|
20172
|
+
"module": "components/popover/popover.component.js"
|
|
20173
|
+
}
|
|
20174
|
+
},
|
|
20175
|
+
{
|
|
20176
|
+
"kind": "field",
|
|
20177
|
+
"name": "backdrop",
|
|
20178
|
+
"type": {
|
|
20179
|
+
"text": "boolean"
|
|
20180
|
+
},
|
|
20181
|
+
"description": "Determines whether the popover with backdrop.\nOther than popover and trigger element, the rest of the screen will be covered with a backdrop.",
|
|
20182
|
+
"default": "false",
|
|
20183
|
+
"attribute": "backdrop",
|
|
20184
|
+
"reflects": true,
|
|
20185
|
+
"inheritedFrom": {
|
|
20186
|
+
"name": "Popover",
|
|
20187
|
+
"module": "components/popover/popover.component.js"
|
|
20188
|
+
}
|
|
20189
|
+
},
|
|
20190
|
+
{
|
|
20191
|
+
"kind": "field",
|
|
20192
|
+
"name": "flip",
|
|
20193
|
+
"type": {
|
|
20194
|
+
"text": "boolean"
|
|
20195
|
+
},
|
|
20196
|
+
"description": "Changes the placement of popover to keep it in view when scrolling.",
|
|
20197
|
+
"default": "true",
|
|
20198
|
+
"attribute": "flip",
|
|
20199
|
+
"reflects": true,
|
|
20200
|
+
"inheritedFrom": {
|
|
20201
|
+
"name": "Popover",
|
|
20202
|
+
"module": "components/popover/popover.component.js"
|
|
20203
|
+
}
|
|
20204
|
+
},
|
|
20205
|
+
{
|
|
20206
|
+
"kind": "field",
|
|
20207
|
+
"name": "size",
|
|
20208
|
+
"type": {
|
|
20209
|
+
"text": "boolean"
|
|
20210
|
+
},
|
|
20211
|
+
"description": "Changes the size of popover to keep it in view when scrolling.",
|
|
20212
|
+
"default": "false",
|
|
20213
|
+
"attribute": "size",
|
|
20214
|
+
"reflects": true,
|
|
20215
|
+
"inheritedFrom": {
|
|
20216
|
+
"name": "Popover",
|
|
20217
|
+
"module": "components/popover/popover.component.js"
|
|
20218
|
+
}
|
|
20219
|
+
},
|
|
20220
|
+
{
|
|
20221
|
+
"kind": "field",
|
|
20222
|
+
"name": "zIndex",
|
|
20223
|
+
"type": {
|
|
20224
|
+
"text": "number"
|
|
20225
|
+
},
|
|
20226
|
+
"description": "The z-index of the popover.",
|
|
20227
|
+
"default": "1000",
|
|
20228
|
+
"attribute": "z-index",
|
|
20229
|
+
"reflects": true,
|
|
20230
|
+
"inheritedFrom": {
|
|
20231
|
+
"name": "Popover",
|
|
20232
|
+
"module": "components/popover/popover.component.js"
|
|
20233
|
+
}
|
|
20234
|
+
},
|
|
20235
|
+
{
|
|
20236
|
+
"kind": "field",
|
|
20237
|
+
"name": "appendTo",
|
|
20238
|
+
"type": {
|
|
20239
|
+
"text": "string"
|
|
20240
|
+
},
|
|
20241
|
+
"default": "''",
|
|
20242
|
+
"description": "Element ID that the popover append to.",
|
|
20243
|
+
"attribute": "append-to",
|
|
20244
|
+
"reflects": true,
|
|
20245
|
+
"inheritedFrom": {
|
|
20246
|
+
"name": "Popover",
|
|
20247
|
+
"module": "components/popover/popover.component.js"
|
|
20248
|
+
}
|
|
20249
|
+
},
|
|
20250
|
+
{
|
|
20251
|
+
"kind": "field",
|
|
20252
|
+
"name": "closeButtonAriaLabel",
|
|
20253
|
+
"type": {
|
|
20254
|
+
"text": "string | null"
|
|
20255
|
+
},
|
|
20256
|
+
"default": "null",
|
|
20257
|
+
"description": "aria-label attribute to be set for close button accessibility.",
|
|
20258
|
+
"attribute": "close-button-aria-label",
|
|
20259
|
+
"reflects": true,
|
|
20260
|
+
"inheritedFrom": {
|
|
20261
|
+
"name": "Popover",
|
|
20262
|
+
"module": "components/popover/popover.component.js"
|
|
20263
|
+
}
|
|
20264
|
+
},
|
|
20265
|
+
{
|
|
20266
|
+
"kind": "field",
|
|
20267
|
+
"name": "role",
|
|
20268
|
+
"type": {
|
|
20269
|
+
"text": "HTMLElement['role']"
|
|
20270
|
+
},
|
|
20271
|
+
"description": "Role of the popover",
|
|
20272
|
+
"default": "dialog",
|
|
20273
|
+
"attribute": "role",
|
|
20274
|
+
"reflects": true,
|
|
20275
|
+
"inheritedFrom": {
|
|
20276
|
+
"name": "Popover",
|
|
20277
|
+
"module": "components/popover/popover.component.js"
|
|
20278
|
+
}
|
|
20279
|
+
},
|
|
20280
|
+
{
|
|
20281
|
+
"kind": "field",
|
|
20282
|
+
"name": "ariaLabelledby",
|
|
20283
|
+
"type": {
|
|
20284
|
+
"text": "string | null"
|
|
20285
|
+
},
|
|
20286
|
+
"default": "null",
|
|
20287
|
+
"description": "aria-labelledby for an interactive popover only, defaults to the trigger component id.\nUsed in nested cases where the triggerComponent isn't the actual button.",
|
|
20288
|
+
"attribute": "aria-labelledby",
|
|
20289
|
+
"reflects": true,
|
|
20290
|
+
"inheritedFrom": {
|
|
20291
|
+
"name": "Popover",
|
|
20292
|
+
"module": "components/popover/popover.component.js"
|
|
20293
|
+
}
|
|
20294
|
+
},
|
|
20295
|
+
{
|
|
20296
|
+
"kind": "field",
|
|
20297
|
+
"name": "ariaDescribedby",
|
|
20298
|
+
"type": {
|
|
20299
|
+
"text": "string | null"
|
|
20300
|
+
},
|
|
20301
|
+
"default": "null",
|
|
20302
|
+
"description": "aria-describedby of the popover.",
|
|
20303
|
+
"attribute": "aria-describedby",
|
|
20304
|
+
"reflects": true,
|
|
20305
|
+
"inheritedFrom": {
|
|
20306
|
+
"name": "Popover",
|
|
20307
|
+
"module": "components/popover/popover.component.js"
|
|
20308
|
+
}
|
|
20309
|
+
},
|
|
20310
|
+
{
|
|
20311
|
+
"kind": "field",
|
|
20312
|
+
"name": "disableAriaExpanded",
|
|
20313
|
+
"type": {
|
|
20314
|
+
"text": "boolean"
|
|
20315
|
+
},
|
|
20316
|
+
"description": "Disable aria-expanded attribute on trigger element.\nMake sure to set this to false when the popover is interactive.",
|
|
20317
|
+
"default": "false",
|
|
20318
|
+
"attribute": "disable-aria-expanded",
|
|
20319
|
+
"reflects": true,
|
|
20320
|
+
"inheritedFrom": {
|
|
20321
|
+
"name": "Popover",
|
|
20322
|
+
"module": "components/popover/popover.component.js"
|
|
20323
|
+
}
|
|
20324
|
+
},
|
|
20325
|
+
{
|
|
20326
|
+
"kind": "field",
|
|
20327
|
+
"name": "arrowElement",
|
|
20328
|
+
"type": {
|
|
20329
|
+
"text": "HTMLElement | null"
|
|
20330
|
+
},
|
|
20331
|
+
"privacy": "public",
|
|
20332
|
+
"default": "null",
|
|
20333
|
+
"inheritedFrom": {
|
|
20334
|
+
"name": "Popover",
|
|
20335
|
+
"module": "components/popover/popover.component.js"
|
|
20336
|
+
}
|
|
20337
|
+
},
|
|
20338
|
+
{
|
|
20339
|
+
"kind": "field",
|
|
20340
|
+
"name": "triggerElement",
|
|
20341
|
+
"type": {
|
|
20342
|
+
"text": "HTMLElement | null"
|
|
20343
|
+
},
|
|
20344
|
+
"privacy": "public",
|
|
20345
|
+
"default": "null",
|
|
20346
|
+
"inheritedFrom": {
|
|
20347
|
+
"name": "Popover",
|
|
20348
|
+
"module": "components/popover/popover.component.js"
|
|
20349
|
+
}
|
|
20350
|
+
},
|
|
20351
|
+
{
|
|
20352
|
+
"kind": "method",
|
|
20353
|
+
"name": "setupTriggerListener",
|
|
20354
|
+
"privacy": "private",
|
|
20355
|
+
"description": "Sets up the trigger event listeners based on the trigger type.",
|
|
20356
|
+
"inheritedFrom": {
|
|
20357
|
+
"name": "Popover",
|
|
20358
|
+
"module": "components/popover/popover.component.js"
|
|
20359
|
+
}
|
|
20360
|
+
},
|
|
20361
|
+
{
|
|
20362
|
+
"kind": "method",
|
|
20363
|
+
"name": "removeEventListeners",
|
|
20364
|
+
"privacy": "private",
|
|
20365
|
+
"description": "Removes the trigger event listeners.",
|
|
20366
|
+
"inheritedFrom": {
|
|
20367
|
+
"name": "Popover",
|
|
20368
|
+
"module": "components/popover/popover.component.js"
|
|
20369
|
+
}
|
|
20370
|
+
},
|
|
20371
|
+
{
|
|
20372
|
+
"kind": "field",
|
|
20373
|
+
"name": "onOutsidePopoverClick",
|
|
20374
|
+
"privacy": "private",
|
|
20375
|
+
"description": "Handles the outside click event to close the popover.",
|
|
20376
|
+
"parameters": [
|
|
20377
|
+
{
|
|
20378
|
+
"description": "The mouse event.",
|
|
20379
|
+
"name": "event"
|
|
20380
|
+
}
|
|
20381
|
+
],
|
|
20382
|
+
"inheritedFrom": {
|
|
20383
|
+
"name": "Popover",
|
|
20384
|
+
"module": "components/popover/popover.component.js"
|
|
20385
|
+
}
|
|
20386
|
+
},
|
|
20387
|
+
{
|
|
20388
|
+
"kind": "field",
|
|
20389
|
+
"name": "onEscapeKeydown",
|
|
20390
|
+
"privacy": "private",
|
|
20391
|
+
"description": "Handles the escape keydown event to close the popover.",
|
|
20392
|
+
"parameters": [
|
|
20393
|
+
{
|
|
20394
|
+
"description": "The keyboard event.",
|
|
20395
|
+
"name": "event"
|
|
20396
|
+
}
|
|
20397
|
+
],
|
|
20398
|
+
"inheritedFrom": {
|
|
20399
|
+
"name": "Popover",
|
|
20400
|
+
"module": "components/popover/popover.component.js"
|
|
20401
|
+
}
|
|
20402
|
+
},
|
|
20403
|
+
{
|
|
20404
|
+
"kind": "field",
|
|
20405
|
+
"name": "onPopoverFocusOut",
|
|
20406
|
+
"privacy": "private",
|
|
20407
|
+
"description": "Handles the popover focus out event.",
|
|
20408
|
+
"parameters": [
|
|
20409
|
+
{
|
|
20410
|
+
"description": "The focus event.",
|
|
20411
|
+
"name": "event"
|
|
20412
|
+
}
|
|
20413
|
+
],
|
|
20414
|
+
"inheritedFrom": {
|
|
20415
|
+
"name": "Popover",
|
|
20416
|
+
"module": "components/popover/popover.component.js"
|
|
20417
|
+
}
|
|
20418
|
+
},
|
|
20419
|
+
{
|
|
20420
|
+
"kind": "method",
|
|
20421
|
+
"name": "isOpenUpdated",
|
|
20422
|
+
"privacy": "private",
|
|
20423
|
+
"parameters": [
|
|
20424
|
+
{
|
|
20425
|
+
"name": "oldValue",
|
|
20426
|
+
"type": {
|
|
20427
|
+
"text": "boolean"
|
|
20428
|
+
},
|
|
20429
|
+
"description": "The old value of the visible property."
|
|
20430
|
+
},
|
|
20431
|
+
{
|
|
20432
|
+
"name": "newValue",
|
|
20433
|
+
"type": {
|
|
20434
|
+
"text": "boolean"
|
|
20435
|
+
},
|
|
20436
|
+
"description": "The new value of the visible property."
|
|
20437
|
+
}
|
|
20438
|
+
],
|
|
20439
|
+
"description": "Handles the popover visibility change and position the popover.\nHandles the exit event to close the popover.",
|
|
20440
|
+
"inheritedFrom": {
|
|
20441
|
+
"name": "Popover",
|
|
20442
|
+
"module": "components/popover/popover.component.js"
|
|
20443
|
+
}
|
|
20444
|
+
},
|
|
20445
|
+
{
|
|
20446
|
+
"kind": "field",
|
|
20447
|
+
"name": "startCloseDelay",
|
|
20448
|
+
"privacy": "private",
|
|
20449
|
+
"description": "Starts the close delay timer.\nIf the popover is not interactive, it will close the popover after the delay.",
|
|
20450
|
+
"inheritedFrom": {
|
|
20451
|
+
"name": "Popover",
|
|
20452
|
+
"module": "components/popover/popover.component.js"
|
|
20453
|
+
}
|
|
20454
|
+
},
|
|
20455
|
+
{
|
|
20456
|
+
"kind": "field",
|
|
20457
|
+
"name": "cancelCloseDelay",
|
|
20458
|
+
"privacy": "private",
|
|
20459
|
+
"description": "Cancels the close delay timer.",
|
|
20460
|
+
"inheritedFrom": {
|
|
20461
|
+
"name": "Popover",
|
|
20462
|
+
"module": "components/popover/popover.component.js"
|
|
20463
|
+
}
|
|
20464
|
+
},
|
|
20465
|
+
{
|
|
20466
|
+
"kind": "field",
|
|
20467
|
+
"name": "showPopover",
|
|
20468
|
+
"privacy": "public",
|
|
20469
|
+
"description": "Shows the popover.",
|
|
20470
|
+
"inheritedFrom": {
|
|
20471
|
+
"name": "Popover",
|
|
20472
|
+
"module": "components/popover/popover.component.js"
|
|
20473
|
+
}
|
|
20474
|
+
},
|
|
20475
|
+
{
|
|
20476
|
+
"kind": "field",
|
|
20477
|
+
"name": "hidePopover",
|
|
20478
|
+
"privacy": "public",
|
|
20479
|
+
"description": "Hides the popover.",
|
|
20480
|
+
"inheritedFrom": {
|
|
20481
|
+
"name": "Popover",
|
|
20482
|
+
"module": "components/popover/popover.component.js"
|
|
20483
|
+
}
|
|
20484
|
+
},
|
|
20485
|
+
{
|
|
20486
|
+
"kind": "field",
|
|
20487
|
+
"name": "togglePopoverVisible",
|
|
20488
|
+
"privacy": "public",
|
|
20489
|
+
"description": "Toggles the popover visibility.",
|
|
20490
|
+
"inheritedFrom": {
|
|
20491
|
+
"name": "Popover",
|
|
20492
|
+
"module": "components/popover/popover.component.js"
|
|
20493
|
+
}
|
|
20494
|
+
},
|
|
20495
|
+
{
|
|
20496
|
+
"kind": "method",
|
|
20497
|
+
"name": "handleCreatePopoverFirstUpdate",
|
|
20498
|
+
"privacy": "private",
|
|
20499
|
+
"description": "Sets the focusable elements inside the popover.",
|
|
20500
|
+
"inheritedFrom": {
|
|
20501
|
+
"name": "Popover",
|
|
20502
|
+
"module": "components/popover/popover.component.js"
|
|
20503
|
+
}
|
|
20504
|
+
},
|
|
20505
|
+
{
|
|
20506
|
+
"kind": "method",
|
|
20507
|
+
"name": "positionPopover",
|
|
20508
|
+
"privacy": "private",
|
|
20509
|
+
"description": "Positions the popover based on the trigger element.\nIt also handles the flip, size and arrow placement.\nIt uses the floating-ui/dom library to calculate the position.",
|
|
20510
|
+
"inheritedFrom": {
|
|
20511
|
+
"name": "Popover",
|
|
20512
|
+
"module": "components/popover/popover.component.js"
|
|
20513
|
+
}
|
|
20514
|
+
},
|
|
20515
|
+
{
|
|
20516
|
+
"kind": "field",
|
|
20517
|
+
"name": "utils",
|
|
20518
|
+
"default": "new PopoverUtils(this)",
|
|
20519
|
+
"inheritedFrom": {
|
|
20520
|
+
"name": "Popover",
|
|
20521
|
+
"module": "components/popover/popover.component.js"
|
|
20522
|
+
}
|
|
20523
|
+
}
|
|
20524
|
+
],
|
|
20525
|
+
"events": [
|
|
20526
|
+
{
|
|
20527
|
+
"description": "(React: onShown) This event is dispatched when the toggletip is shown",
|
|
20528
|
+
"name": "shown",
|
|
20529
|
+
"reactName": "onShown",
|
|
20530
|
+
"inheritedFrom": {
|
|
20531
|
+
"name": "Popover",
|
|
20532
|
+
"module": "src/components/popover/popover.component.ts"
|
|
20533
|
+
}
|
|
20534
|
+
},
|
|
20535
|
+
{
|
|
20536
|
+
"description": "(React: onHidden) This event is dispatched when the toggletip is hidden",
|
|
20537
|
+
"name": "hidden",
|
|
20538
|
+
"reactName": "onHidden",
|
|
18855
20539
|
"inheritedFrom": {
|
|
18856
|
-
"name": "
|
|
18857
|
-
"module": "
|
|
20540
|
+
"name": "Popover",
|
|
20541
|
+
"module": "src/components/popover/popover.component.ts"
|
|
18858
20542
|
}
|
|
18859
20543
|
},
|
|
18860
20544
|
{
|
|
18861
|
-
"
|
|
18862
|
-
"name": "
|
|
18863
|
-
"
|
|
20545
|
+
"description": "(React: onCreated) This event is dispatched when the toggletip is created (added to the DOM)",
|
|
20546
|
+
"name": "created",
|
|
20547
|
+
"reactName": "onCreated",
|
|
18864
20548
|
"inheritedFrom": {
|
|
18865
|
-
"name": "
|
|
18866
|
-
"module": "
|
|
20549
|
+
"name": "Popover",
|
|
20550
|
+
"module": "src/components/popover/popover.component.ts"
|
|
18867
20551
|
}
|
|
18868
20552
|
},
|
|
18869
20553
|
{
|
|
18870
|
-
"
|
|
18871
|
-
"name": "
|
|
18872
|
-
"
|
|
18873
|
-
"return": {
|
|
18874
|
-
"type": {
|
|
18875
|
-
"text": ""
|
|
18876
|
-
}
|
|
18877
|
-
},
|
|
20554
|
+
"description": "(React: onDestroyed) This event is dispatched when the toggletip is destroyed (removed from the DOM)",
|
|
20555
|
+
"name": "destroyed",
|
|
20556
|
+
"reactName": "onDestroyed",
|
|
18878
20557
|
"inheritedFrom": {
|
|
18879
|
-
"name": "
|
|
18880
|
-
"module": "
|
|
20558
|
+
"name": "Popover",
|
|
20559
|
+
"module": "src/components/popover/popover.component.ts"
|
|
18881
20560
|
}
|
|
18882
|
-
}
|
|
20561
|
+
}
|
|
20562
|
+
],
|
|
20563
|
+
"attributes": [
|
|
18883
20564
|
{
|
|
18884
|
-
"
|
|
18885
|
-
"
|
|
18886
|
-
|
|
18887
|
-
"type": {
|
|
18888
|
-
"text": "boolean"
|
|
18889
|
-
}
|
|
20565
|
+
"name": "screenreader-announcer-identity",
|
|
20566
|
+
"type": {
|
|
20567
|
+
"text": "string"
|
|
18890
20568
|
},
|
|
18891
|
-
"
|
|
18892
|
-
|
|
18893
|
-
|
|
18894
|
-
}
|
|
20569
|
+
"default": "''",
|
|
20570
|
+
"description": "Set this attribute with the id of the element in the DOM, to which announcement\nelements will be appended.\nIf an id is provided, the announcement elements will be appended to this element.\nIf id is not provided, a visually hidden div element will be created in the DOM.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
|
|
20571
|
+
"fieldName": "screenreaderAnnouncerIdentity"
|
|
18895
20572
|
},
|
|
18896
20573
|
{
|
|
18897
|
-
"
|
|
18898
|
-
"
|
|
20574
|
+
"name": "enabledFocusTrap",
|
|
20575
|
+
"type": {
|
|
20576
|
+
"text": "boolean"
|
|
20577
|
+
},
|
|
20578
|
+
"description": "Determines whether the focus trap is enabled.\nIf true, focus will be restricted to the content within this component.",
|
|
20579
|
+
"default": "false",
|
|
20580
|
+
"fieldName": "enabledFocusTrap",
|
|
18899
20581
|
"inheritedFrom": {
|
|
18900
|
-
"name": "
|
|
18901
|
-
"module": "
|
|
20582
|
+
"name": "Popover",
|
|
20583
|
+
"module": "src/components/popover/popover.component.ts"
|
|
18902
20584
|
}
|
|
18903
20585
|
},
|
|
18904
20586
|
{
|
|
18905
|
-
"
|
|
18906
|
-
"name": "dataAriaLabel",
|
|
20587
|
+
"name": "enabledPreventScroll",
|
|
18907
20588
|
"type": {
|
|
18908
|
-
"text": "
|
|
20589
|
+
"text": "boolean"
|
|
18909
20590
|
},
|
|
18910
|
-
"
|
|
18911
|
-
"
|
|
18912
|
-
"
|
|
18913
|
-
"reflects": true,
|
|
20591
|
+
"description": "Prevent outside scrolling when popover show.",
|
|
20592
|
+
"default": "false",
|
|
20593
|
+
"fieldName": "enabledPreventScroll",
|
|
18914
20594
|
"inheritedFrom": {
|
|
18915
|
-
"name": "
|
|
18916
|
-
"module": "
|
|
20595
|
+
"name": "Popover",
|
|
20596
|
+
"module": "src/components/popover/popover.component.ts"
|
|
18917
20597
|
}
|
|
18918
20598
|
},
|
|
18919
20599
|
{
|
|
18920
|
-
"
|
|
18921
|
-
"name": "disabled",
|
|
20600
|
+
"name": "id",
|
|
18922
20601
|
"type": {
|
|
18923
|
-
"text": "
|
|
20602
|
+
"text": "string"
|
|
18924
20603
|
},
|
|
18925
|
-
"
|
|
18926
|
-
"
|
|
18927
|
-
"
|
|
18928
|
-
"reflects": true,
|
|
20604
|
+
"default": "''",
|
|
20605
|
+
"description": "The unique ID of the popover.",
|
|
20606
|
+
"fieldName": "id",
|
|
18929
20607
|
"inheritedFrom": {
|
|
18930
|
-
"name": "
|
|
18931
|
-
"module": "components/
|
|
20608
|
+
"name": "Popover",
|
|
20609
|
+
"module": "src/components/popover/popover.component.ts"
|
|
18932
20610
|
}
|
|
18933
20611
|
},
|
|
18934
20612
|
{
|
|
18935
|
-
"
|
|
18936
|
-
"name": "label",
|
|
20613
|
+
"name": "triggerID",
|
|
18937
20614
|
"type": {
|
|
18938
|
-
"text": "string
|
|
20615
|
+
"text": "string"
|
|
18939
20616
|
},
|
|
18940
|
-
"
|
|
18941
|
-
"
|
|
18942
|
-
"
|
|
20617
|
+
"default": "''",
|
|
20618
|
+
"description": "The ID of the element that triggers the popover.\nThis attribute is required for the popover to work.",
|
|
20619
|
+
"fieldName": "triggerID",
|
|
18943
20620
|
"inheritedFrom": {
|
|
18944
|
-
"name": "
|
|
18945
|
-
"module": "components/
|
|
20621
|
+
"name": "Popover",
|
|
20622
|
+
"module": "src/components/popover/popover.component.ts"
|
|
18946
20623
|
}
|
|
18947
20624
|
},
|
|
18948
20625
|
{
|
|
18949
|
-
"
|
|
18950
|
-
"name": "requiredLabel",
|
|
20626
|
+
"name": "trigger",
|
|
18951
20627
|
"type": {
|
|
18952
|
-
"text": "
|
|
20628
|
+
"text": "PopoverTrigger"
|
|
18953
20629
|
},
|
|
18954
|
-
"description": "
|
|
18955
|
-
"
|
|
18956
|
-
"
|
|
20630
|
+
"description": "Determines the events that cause the Popover to show.\nMultiple event names should be separated by spaces.\nFor example to allow both click and hover, use 'click mouseenter' as the trigger.\n- **click**\n- **mouseenter**\n- **focusin**\n- **manual**",
|
|
20631
|
+
"default": "click",
|
|
20632
|
+
"fieldName": "trigger",
|
|
18957
20633
|
"inheritedFrom": {
|
|
18958
|
-
"name": "
|
|
18959
|
-
"module": "components/
|
|
20634
|
+
"name": "Popover",
|
|
20635
|
+
"module": "src/components/popover/popover.component.ts"
|
|
18960
20636
|
}
|
|
18961
20637
|
},
|
|
18962
20638
|
{
|
|
18963
|
-
"
|
|
18964
|
-
"name": "id",
|
|
20639
|
+
"name": "placement",
|
|
18965
20640
|
"type": {
|
|
18966
|
-
"text": "
|
|
20641
|
+
"text": "PopoverPlacement"
|
|
18967
20642
|
},
|
|
18968
|
-
"
|
|
18969
|
-
"
|
|
18970
|
-
"
|
|
20643
|
+
"description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
|
|
20644
|
+
"default": "bottom",
|
|
20645
|
+
"fieldName": "placement",
|
|
18971
20646
|
"inheritedFrom": {
|
|
18972
|
-
"name": "
|
|
18973
|
-
"module": "components/
|
|
20647
|
+
"name": "Popover",
|
|
20648
|
+
"module": "src/components/popover/popover.component.ts"
|
|
18974
20649
|
}
|
|
18975
20650
|
},
|
|
18976
20651
|
{
|
|
18977
|
-
"
|
|
18978
|
-
"name": "helpTextType",
|
|
20652
|
+
"name": "color",
|
|
18979
20653
|
"type": {
|
|
18980
|
-
"text": "
|
|
20654
|
+
"text": "PopoverColor"
|
|
18981
20655
|
},
|
|
18982
|
-
"description": "
|
|
18983
|
-
"
|
|
18984
|
-
"
|
|
20656
|
+
"description": "Color of the popover\n- **tonal**\n- **contrast**",
|
|
20657
|
+
"default": "tonal",
|
|
20658
|
+
"fieldName": "color",
|
|
18985
20659
|
"inheritedFrom": {
|
|
18986
|
-
"name": "
|
|
18987
|
-
"module": "components/
|
|
20660
|
+
"name": "Popover",
|
|
20661
|
+
"module": "src/components/popover/popover.component.ts"
|
|
18988
20662
|
}
|
|
18989
20663
|
},
|
|
18990
20664
|
{
|
|
18991
|
-
"
|
|
18992
|
-
"name": "helpText",
|
|
20665
|
+
"name": "visible",
|
|
18993
20666
|
"type": {
|
|
18994
|
-
"text": "
|
|
20667
|
+
"text": "boolean"
|
|
18995
20668
|
},
|
|
18996
|
-
"description": "The
|
|
18997
|
-
"
|
|
18998
|
-
"
|
|
20669
|
+
"description": "The visibility of the popover.",
|
|
20670
|
+
"default": "false",
|
|
20671
|
+
"fieldName": "visible",
|
|
18999
20672
|
"inheritedFrom": {
|
|
19000
|
-
"name": "
|
|
19001
|
-
"module": "components/
|
|
20673
|
+
"name": "Popover",
|
|
20674
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19002
20675
|
}
|
|
19003
20676
|
},
|
|
19004
20677
|
{
|
|
19005
|
-
"
|
|
19006
|
-
"
|
|
19007
|
-
|
|
19008
|
-
"description": "creates the label element when the label property is set.\nid is used to link the label with the input field.",
|
|
19009
|
-
"return": {
|
|
19010
|
-
"type": {
|
|
19011
|
-
"text": ""
|
|
19012
|
-
}
|
|
20678
|
+
"name": "offset",
|
|
20679
|
+
"type": {
|
|
20680
|
+
"text": "number"
|
|
19013
20681
|
},
|
|
20682
|
+
"description": "The offset of the popover.",
|
|
20683
|
+
"default": "4",
|
|
20684
|
+
"fieldName": "offset",
|
|
19014
20685
|
"inheritedFrom": {
|
|
19015
|
-
"name": "
|
|
19016
|
-
"module": "components/
|
|
20686
|
+
"name": "Popover",
|
|
20687
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19017
20688
|
}
|
|
19018
20689
|
},
|
|
19019
20690
|
{
|
|
19020
|
-
"
|
|
19021
|
-
"
|
|
19022
|
-
|
|
20691
|
+
"name": "focus-trap",
|
|
20692
|
+
"type": {
|
|
20693
|
+
"text": "boolean"
|
|
20694
|
+
},
|
|
20695
|
+
"description": "Determines whether the focus trap is enabled.\nIf true, focus will be restricted to the content within this component.",
|
|
20696
|
+
"default": "false",
|
|
20697
|
+
"fieldName": "focusTrap",
|
|
19023
20698
|
"inheritedFrom": {
|
|
19024
|
-
"name": "
|
|
19025
|
-
"module": "components/
|
|
20699
|
+
"name": "Popover",
|
|
20700
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19026
20701
|
}
|
|
19027
20702
|
},
|
|
19028
20703
|
{
|
|
19029
|
-
"
|
|
19030
|
-
"
|
|
19031
|
-
|
|
19032
|
-
"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.",
|
|
19033
|
-
"return": {
|
|
19034
|
-
"type": {
|
|
19035
|
-
"text": ""
|
|
19036
|
-
}
|
|
20704
|
+
"name": "prevent-scroll",
|
|
20705
|
+
"type": {
|
|
20706
|
+
"text": "boolean"
|
|
19037
20707
|
},
|
|
20708
|
+
"description": "Prevent outside scrolling when popover show.",
|
|
20709
|
+
"default": "false",
|
|
20710
|
+
"fieldName": "preventScroll",
|
|
19038
20711
|
"inheritedFrom": {
|
|
19039
|
-
"name": "
|
|
19040
|
-
"module": "components/
|
|
20712
|
+
"name": "Popover",
|
|
20713
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19041
20714
|
}
|
|
19042
20715
|
},
|
|
19043
20716
|
{
|
|
19044
|
-
"
|
|
19045
|
-
"
|
|
19046
|
-
|
|
19047
|
-
"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.",
|
|
19048
|
-
"return": {
|
|
19049
|
-
"type": {
|
|
19050
|
-
"text": ""
|
|
19051
|
-
}
|
|
20717
|
+
"name": "show-arrow",
|
|
20718
|
+
"type": {
|
|
20719
|
+
"text": "boolean"
|
|
19052
20720
|
},
|
|
20721
|
+
"description": "The arrow visibility of the popover.",
|
|
20722
|
+
"default": "false",
|
|
20723
|
+
"fieldName": "showArrow",
|
|
19053
20724
|
"inheritedFrom": {
|
|
19054
|
-
"name": "
|
|
19055
|
-
"module": "components/
|
|
20725
|
+
"name": "Popover",
|
|
20726
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19056
20727
|
}
|
|
19057
20728
|
},
|
|
19058
20729
|
{
|
|
19059
|
-
"
|
|
19060
|
-
"
|
|
19061
|
-
|
|
19062
|
-
"description": "renders the mdc-label-text container that contains the label and labelInfoToggleTip.",
|
|
19063
|
-
"return": {
|
|
19064
|
-
"type": {
|
|
19065
|
-
"text": ""
|
|
19066
|
-
}
|
|
20730
|
+
"name": "close-button",
|
|
20731
|
+
"type": {
|
|
20732
|
+
"text": "boolean"
|
|
19067
20733
|
},
|
|
20734
|
+
"description": "The close button visibility of the popover.",
|
|
20735
|
+
"default": "false",
|
|
20736
|
+
"fieldName": "closeButton",
|
|
19068
20737
|
"inheritedFrom": {
|
|
19069
|
-
"name": "
|
|
19070
|
-
"module": "components/
|
|
20738
|
+
"name": "Popover",
|
|
20739
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19071
20740
|
}
|
|
19072
20741
|
},
|
|
19073
20742
|
{
|
|
19074
|
-
"
|
|
19075
|
-
"
|
|
19076
|
-
|
|
19077
|
-
"description": "renders the mdc-help-text container that contains the helpertext icon and helpertext.",
|
|
19078
|
-
"return": {
|
|
19079
|
-
"type": {
|
|
19080
|
-
"text": ""
|
|
19081
|
-
}
|
|
20743
|
+
"name": "interactive",
|
|
20744
|
+
"type": {
|
|
20745
|
+
"text": "boolean"
|
|
19082
20746
|
},
|
|
20747
|
+
"description": "Determines whether the popover is interactive。",
|
|
20748
|
+
"default": "false",
|
|
20749
|
+
"fieldName": "interactive",
|
|
19083
20750
|
"inheritedFrom": {
|
|
19084
|
-
"name": "
|
|
19085
|
-
"module": "components/
|
|
20751
|
+
"name": "Popover",
|
|
20752
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19086
20753
|
}
|
|
19087
|
-
}
|
|
19088
|
-
],
|
|
19089
|
-
"events": [
|
|
20754
|
+
},
|
|
19090
20755
|
{
|
|
20756
|
+
"name": "delay",
|
|
19091
20757
|
"type": {
|
|
19092
|
-
"text": "
|
|
20758
|
+
"text": "string"
|
|
20759
|
+
},
|
|
20760
|
+
"description": "The delay of the show/hide popover.",
|
|
20761
|
+
"default": "0,0",
|
|
20762
|
+
"fieldName": "delay",
|
|
20763
|
+
"inheritedFrom": {
|
|
20764
|
+
"name": "Popover",
|
|
20765
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19093
20766
|
}
|
|
19094
20767
|
},
|
|
19095
20768
|
{
|
|
19096
|
-
"
|
|
19097
|
-
"name": "change",
|
|
19098
|
-
"reactName": "onChange"
|
|
19099
|
-
},
|
|
19100
|
-
{
|
|
19101
|
-
"description": "(React: onFocus) Event that gets dispatched when the toggle receives focus.",
|
|
19102
|
-
"name": "focus",
|
|
19103
|
-
"reactName": "onFocus"
|
|
19104
|
-
}
|
|
19105
|
-
],
|
|
19106
|
-
"attributes": [
|
|
19107
|
-
{
|
|
19108
|
-
"name": "checked",
|
|
20769
|
+
"name": "hide-on-escape",
|
|
19109
20770
|
"type": {
|
|
19110
20771
|
"text": "boolean"
|
|
19111
20772
|
},
|
|
20773
|
+
"description": "Hide popover on escape key press.",
|
|
19112
20774
|
"default": "false",
|
|
19113
|
-
"
|
|
19114
|
-
"
|
|
20775
|
+
"fieldName": "hideOnEscape",
|
|
20776
|
+
"inheritedFrom": {
|
|
20777
|
+
"name": "Popover",
|
|
20778
|
+
"module": "src/components/popover/popover.component.ts"
|
|
20779
|
+
}
|
|
19115
20780
|
},
|
|
19116
20781
|
{
|
|
19117
|
-
"name": "
|
|
20782
|
+
"name": "hide-on-blur",
|
|
19118
20783
|
"type": {
|
|
19119
|
-
"text": "
|
|
20784
|
+
"text": "boolean"
|
|
19120
20785
|
},
|
|
19121
|
-
"description": "
|
|
19122
|
-
"default": "
|
|
19123
|
-
"fieldName": "
|
|
20786
|
+
"description": "Hide popover on blur.",
|
|
20787
|
+
"default": "false",
|
|
20788
|
+
"fieldName": "hideOnBlur",
|
|
20789
|
+
"inheritedFrom": {
|
|
20790
|
+
"name": "Popover",
|
|
20791
|
+
"module": "src/components/popover/popover.component.ts"
|
|
20792
|
+
}
|
|
19124
20793
|
},
|
|
19125
20794
|
{
|
|
19126
|
-
"name": "
|
|
20795
|
+
"name": "hide-on-outside-click",
|
|
19127
20796
|
"type": {
|
|
19128
20797
|
"text": "boolean"
|
|
19129
20798
|
},
|
|
20799
|
+
"description": "Hide on outside click of the popover.",
|
|
19130
20800
|
"default": "false",
|
|
19131
|
-
"
|
|
19132
|
-
"
|
|
20801
|
+
"fieldName": "hideOnOutsideClick",
|
|
20802
|
+
"inheritedFrom": {
|
|
20803
|
+
"name": "Popover",
|
|
20804
|
+
"module": "src/components/popover/popover.component.ts"
|
|
20805
|
+
}
|
|
19133
20806
|
},
|
|
19134
20807
|
{
|
|
19135
|
-
"name": "
|
|
20808
|
+
"name": "focus-back-to-trigger",
|
|
19136
20809
|
"type": {
|
|
19137
|
-
"text": "
|
|
20810
|
+
"text": "boolean"
|
|
19138
20811
|
},
|
|
19139
|
-
"
|
|
19140
|
-
"
|
|
19141
|
-
"fieldName": "
|
|
20812
|
+
"description": "The focus back to trigger after the popover hide.",
|
|
20813
|
+
"default": "false",
|
|
20814
|
+
"fieldName": "focusBackToTrigger",
|
|
19142
20815
|
"inheritedFrom": {
|
|
19143
|
-
"name": "
|
|
19144
|
-
"module": "src/
|
|
20816
|
+
"name": "Popover",
|
|
20817
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19145
20818
|
}
|
|
19146
20819
|
},
|
|
19147
20820
|
{
|
|
19148
|
-
"name": "
|
|
20821
|
+
"name": "backdrop",
|
|
19149
20822
|
"type": {
|
|
19150
|
-
"text": "
|
|
20823
|
+
"text": "boolean"
|
|
19151
20824
|
},
|
|
19152
|
-
"
|
|
19153
|
-
"
|
|
19154
|
-
"fieldName": "
|
|
20825
|
+
"description": "Determines whether the popover with backdrop.\nOther than popover and trigger element, the rest of the screen will be covered with a backdrop.",
|
|
20826
|
+
"default": "false",
|
|
20827
|
+
"fieldName": "backdrop",
|
|
19155
20828
|
"inheritedFrom": {
|
|
19156
|
-
"name": "
|
|
19157
|
-
"module": "src/
|
|
20829
|
+
"name": "Popover",
|
|
20830
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19158
20831
|
}
|
|
19159
20832
|
},
|
|
19160
20833
|
{
|
|
19161
|
-
"name": "
|
|
20834
|
+
"name": "flip",
|
|
19162
20835
|
"type": {
|
|
19163
|
-
"text": "
|
|
20836
|
+
"text": "boolean"
|
|
19164
20837
|
},
|
|
19165
|
-
"description": "
|
|
19166
|
-
"
|
|
20838
|
+
"description": "Changes the placement of popover to keep it in view when scrolling.",
|
|
20839
|
+
"default": "true",
|
|
20840
|
+
"fieldName": "flip",
|
|
19167
20841
|
"inheritedFrom": {
|
|
19168
|
-
"name": "
|
|
19169
|
-
"module": "src/
|
|
20842
|
+
"name": "Popover",
|
|
20843
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19170
20844
|
}
|
|
19171
20845
|
},
|
|
19172
20846
|
{
|
|
19173
|
-
"name": "
|
|
20847
|
+
"name": "size",
|
|
19174
20848
|
"type": {
|
|
19175
|
-
"text": "
|
|
20849
|
+
"text": "boolean"
|
|
19176
20850
|
},
|
|
19177
|
-
"
|
|
19178
|
-
"
|
|
19179
|
-
"fieldName": "
|
|
20851
|
+
"description": "Changes the size of popover to keep it in view when scrolling.",
|
|
20852
|
+
"default": "false",
|
|
20853
|
+
"fieldName": "size",
|
|
19180
20854
|
"inheritedFrom": {
|
|
19181
|
-
"name": "
|
|
19182
|
-
"module": "src/
|
|
20855
|
+
"name": "Popover",
|
|
20856
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19183
20857
|
}
|
|
19184
20858
|
},
|
|
19185
20859
|
{
|
|
19186
|
-
"name": "
|
|
20860
|
+
"name": "z-index",
|
|
19187
20861
|
"type": {
|
|
19188
|
-
"text": "
|
|
20862
|
+
"text": "number"
|
|
19189
20863
|
},
|
|
19190
|
-
"description": "
|
|
19191
|
-
"default": "
|
|
19192
|
-
"fieldName": "
|
|
20864
|
+
"description": "The z-index of the popover.",
|
|
20865
|
+
"default": "1000",
|
|
20866
|
+
"fieldName": "zIndex",
|
|
19193
20867
|
"inheritedFrom": {
|
|
19194
|
-
"name": "
|
|
19195
|
-
"module": "src/components/
|
|
20868
|
+
"name": "Popover",
|
|
20869
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19196
20870
|
}
|
|
19197
20871
|
},
|
|
19198
20872
|
{
|
|
19199
|
-
"name": "
|
|
20873
|
+
"name": "append-to",
|
|
19200
20874
|
"type": {
|
|
19201
|
-
"text": "string
|
|
20875
|
+
"text": "string"
|
|
19202
20876
|
},
|
|
19203
|
-
"
|
|
19204
|
-
"
|
|
20877
|
+
"default": "''",
|
|
20878
|
+
"description": "Element ID that the popover append to.",
|
|
20879
|
+
"fieldName": "appendTo",
|
|
19205
20880
|
"inheritedFrom": {
|
|
19206
|
-
"name": "
|
|
19207
|
-
"module": "src/components/
|
|
20881
|
+
"name": "Popover",
|
|
20882
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19208
20883
|
}
|
|
19209
20884
|
},
|
|
19210
20885
|
{
|
|
19211
|
-
"name": "
|
|
20886
|
+
"name": "close-button-aria-label",
|
|
19212
20887
|
"type": {
|
|
19213
|
-
"text": "string |
|
|
20888
|
+
"text": "string | null"
|
|
19214
20889
|
},
|
|
19215
|
-
"
|
|
19216
|
-
"
|
|
20890
|
+
"default": "null",
|
|
20891
|
+
"description": "aria-label attribute to be set for close button accessibility.",
|
|
20892
|
+
"fieldName": "closeButtonAriaLabel",
|
|
19217
20893
|
"inheritedFrom": {
|
|
19218
|
-
"name": "
|
|
19219
|
-
"module": "src/components/
|
|
20894
|
+
"name": "Popover",
|
|
20895
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19220
20896
|
}
|
|
19221
20897
|
},
|
|
19222
20898
|
{
|
|
19223
|
-
"name": "
|
|
20899
|
+
"name": "role",
|
|
19224
20900
|
"type": {
|
|
19225
|
-
"text": "
|
|
20901
|
+
"text": "HTMLElement['role']"
|
|
19226
20902
|
},
|
|
19227
|
-
"
|
|
19228
|
-
"
|
|
19229
|
-
"fieldName": "
|
|
20903
|
+
"description": "Role of the popover",
|
|
20904
|
+
"default": "dialog",
|
|
20905
|
+
"fieldName": "role",
|
|
19230
20906
|
"inheritedFrom": {
|
|
19231
|
-
"name": "
|
|
19232
|
-
"module": "src/components/
|
|
20907
|
+
"name": "Popover",
|
|
20908
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19233
20909
|
}
|
|
19234
20910
|
},
|
|
19235
20911
|
{
|
|
19236
|
-
"name": "
|
|
20912
|
+
"name": "aria-labelledby",
|
|
19237
20913
|
"type": {
|
|
19238
|
-
"text": "
|
|
20914
|
+
"text": "string | null"
|
|
19239
20915
|
},
|
|
19240
|
-
"
|
|
19241
|
-
"
|
|
20916
|
+
"default": "null",
|
|
20917
|
+
"description": "aria-labelledby for an interactive popover only, defaults to the trigger component id.\nUsed in nested cases where the triggerComponent isn't the actual button.",
|
|
20918
|
+
"fieldName": "ariaLabelledby",
|
|
19242
20919
|
"inheritedFrom": {
|
|
19243
|
-
"name": "
|
|
19244
|
-
"module": "src/components/
|
|
20920
|
+
"name": "Popover",
|
|
20921
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19245
20922
|
}
|
|
19246
20923
|
},
|
|
19247
20924
|
{
|
|
19248
|
-
"name": "
|
|
20925
|
+
"name": "aria-describedby",
|
|
19249
20926
|
"type": {
|
|
19250
|
-
"text": "string |
|
|
20927
|
+
"text": "string | null"
|
|
19251
20928
|
},
|
|
19252
|
-
"
|
|
19253
|
-
"
|
|
20929
|
+
"default": "null",
|
|
20930
|
+
"description": "aria-describedby of the popover.",
|
|
20931
|
+
"fieldName": "ariaDescribedby",
|
|
19254
20932
|
"inheritedFrom": {
|
|
19255
|
-
"name": "
|
|
19256
|
-
"module": "src/components/
|
|
20933
|
+
"name": "Popover",
|
|
20934
|
+
"module": "src/components/popover/popover.component.ts"
|
|
19257
20935
|
}
|
|
19258
|
-
}
|
|
19259
|
-
],
|
|
19260
|
-
"mixins": [
|
|
19261
|
-
{
|
|
19262
|
-
"name": "FormInternalsMixin",
|
|
19263
|
-
"module": "/src/utils/mixins/FormInternalsMixin"
|
|
19264
20936
|
},
|
|
19265
20937
|
{
|
|
19266
|
-
"name": "
|
|
19267
|
-
"
|
|
20938
|
+
"name": "disable-aria-expanded",
|
|
20939
|
+
"type": {
|
|
20940
|
+
"text": "boolean"
|
|
20941
|
+
},
|
|
20942
|
+
"description": "Disable aria-expanded attribute on trigger element.\nMake sure to set this to false when the popover is interactive.",
|
|
20943
|
+
"default": "false",
|
|
20944
|
+
"fieldName": "disableAriaExpanded",
|
|
20945
|
+
"inheritedFrom": {
|
|
20946
|
+
"name": "Popover",
|
|
20947
|
+
"module": "src/components/popover/popover.component.ts"
|
|
20948
|
+
}
|
|
19268
20949
|
}
|
|
19269
20950
|
],
|
|
19270
20951
|
"superclass": {
|
|
19271
|
-
"name": "
|
|
19272
|
-
"module": "/src/components/
|
|
20952
|
+
"name": "Popover",
|
|
20953
|
+
"module": "/src/components/popover/popover.component"
|
|
19273
20954
|
},
|
|
19274
|
-
"tagName": "mdc-
|
|
19275
|
-
"jsDoc": "/**\n *
|
|
19276
|
-
"customElement": true
|
|
19277
|
-
"slots": [
|
|
19278
|
-
{
|
|
19279
|
-
"description": "slot to add the label info icon",
|
|
19280
|
-
"name": "label-info",
|
|
19281
|
-
"inheritedFrom": {
|
|
19282
|
-
"name": "FormfieldWrapper",
|
|
19283
|
-
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
|
19284
|
-
}
|
|
19285
|
-
}
|
|
19286
|
-
]
|
|
20955
|
+
"tagName": "mdc-toggletip",
|
|
20956
|
+
"jsDoc": "/**\n * A toggletip is triggered by clicking a trigger element.\n *\n * It can contain interactive content and can be closed by\n * clicking outside the toggletip or pressing the escape key.\n *\n * It can have optional close button to close the toggletip.\n *\n * Toggletip component uses `mdc-screenreaderannouncer` internally to\n * announce the toggletip text content with screen readers when the toggletip is shown.\n *\n * `screenreader-announcer-identity` attribute can be used to provide ID of an element\n * in DOM to which announcement elements are added. If not set, a visually hidden\n * div element is created in DOM to which announcement elements are added.\n *\n * Please refer to the `mdc-screenreaderannouncer` component for more details.\n *\n * @dependency mdc-screenreaderannouncer\n * @dependency mdc-button\n *\n * @tagname mdc-toggletip\n *\n * @event shown - (React: onShown) This event is dispatched when the toggletip is shown\n * @event hidden - (React: onHidden) This event is dispatched when the toggletip is hidden\n * @event created - (React: onCreated) This event is dispatched when the toggletip is created (added to the DOM)\n * @event destroyed - (React: onDestroyed) This event is dispatched when the toggletip\n * is destroyed (removed from the DOM)\n *\n * @cssproperty --mdc-toggletip-max-width - The maximum width of the toggletip.\n * @cssproperty --mdc-toggletip-text-color - The text color of the toggletip.\n * @cssproperty --mdc-toggletip-text-color-contrast - The text color of the toggletip\n * when the color is contrast.\n *\n * @slot - Default slot for the toggletip content\n */",
|
|
20957
|
+
"customElement": true
|
|
19287
20958
|
}
|
|
19288
20959
|
],
|
|
19289
20960
|
"exports": [
|
|
@@ -19291,8 +20962,8 @@
|
|
|
19291
20962
|
"kind": "js",
|
|
19292
20963
|
"name": "default",
|
|
19293
20964
|
"declaration": {
|
|
19294
|
-
"name": "
|
|
19295
|
-
"module": "components/
|
|
20965
|
+
"name": "ToggleTip",
|
|
20966
|
+
"module": "components/toggletip/toggletip.component.js"
|
|
19296
20967
|
}
|
|
19297
20968
|
}
|
|
19298
20969
|
]
|
|
@@ -20299,6 +21970,7 @@
|
|
|
20299
21970
|
"default": "null",
|
|
20300
21971
|
"description": "aria-label attribute to be set for close button accessibility.",
|
|
20301
21972
|
"attribute": "close-button-aria-label",
|
|
21973
|
+
"reflects": true,
|
|
20302
21974
|
"inheritedFrom": {
|
|
20303
21975
|
"name": "Popover",
|
|
20304
21976
|
"module": "components/popover/popover.component.js"
|
|
@@ -20355,7 +22027,7 @@
|
|
|
20355
22027
|
"type": {
|
|
20356
22028
|
"text": "boolean"
|
|
20357
22029
|
},
|
|
20358
|
-
"description": "Disable aria-expanded attribute on trigger element.",
|
|
22030
|
+
"description": "Disable aria-expanded attribute on trigger element.\nMake sure to set this to false when the popover is interactive.",
|
|
20359
22031
|
"default": "false",
|
|
20360
22032
|
"attribute": "disable-aria-expanded",
|
|
20361
22033
|
"reflects": true,
|
|
@@ -20981,7 +22653,7 @@
|
|
|
20981
22653
|
"type": {
|
|
20982
22654
|
"text": "boolean"
|
|
20983
22655
|
},
|
|
20984
|
-
"description": "Disable aria-expanded attribute on trigger element.",
|
|
22656
|
+
"description": "Disable aria-expanded attribute on trigger element.\nMake sure to set this to false when the popover is interactive.",
|
|
20985
22657
|
"default": "false",
|
|
20986
22658
|
"fieldName": "disableAriaExpanded",
|
|
20987
22659
|
"inheritedFrom": {
|