@tylertech/forge 3.8.0-dev.1 → 3.8.0-dev.3
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/custom-elements.json +3383 -3319
- package/dist/app-bar/forge-app-bar.css +8 -0
- package/dist/lib.js +19 -19
- package/dist/lib.js.map +3 -3
- package/dist/vscode.css-custom-data.json +208 -208
- package/dist/vscode.html-custom-data.json +245 -245
- package/esm/app-bar/app-bar/app-bar.js +1 -1
- package/esm/app-bar/profile-button/app-bar-profile-button.d.ts +1 -1
- package/esm/app-bar/profile-button/app-bar-profile-button.js +9 -12
- package/esm/avatar/avatar.d.ts +3 -0
- package/esm/avatar/avatar.js +5 -0
- package/esm/badge/badge.d.ts +3 -0
- package/esm/badge/badge.js +6 -2
- package/esm/card/card.d.ts +3 -0
- package/esm/card/card.js +5 -1
- package/esm/dialog/dialog.js +2 -2
- package/esm/icon-button/icon-button.js +1 -1
- package/esm/key/key/index.js +2 -2
- package/esm/key/key/key.d.ts +4 -0
- package/esm/key/key/key.js +7 -1
- package/esm/key/key-item/index.js +2 -2
- package/esm/key/key-item/key-item.d.ts +4 -0
- package/esm/key/key-item/key-item.js +7 -1
- package/esm/meter/meter/meter.d.ts +3 -0
- package/esm/meter/meter/meter.js +6 -1
- package/esm/meter/meter-group/index.js +2 -2
- package/esm/meter/meter-group/meter-group.d.ts +4 -0
- package/esm/meter/meter-group/meter-group.js +7 -2
- package/esm/overlay/overlay-adapter.js +9 -4
- package/esm/split-view/split-view-panel/split-view-panel.js +1 -1
- package/package.json +1 -1
- package/sass/app-bar/app-bar/app-bar.scss +21 -11
- package/sass/core/styles/tokens/app-bar/app-bar/_tokens.scss +10 -1
- package/sass/icon-button/icon-button.scss +15 -0
|
@@ -101,28 +101,6 @@
|
|
|
101
101
|
],
|
|
102
102
|
"references": []
|
|
103
103
|
},
|
|
104
|
-
{
|
|
105
|
-
"name": "forge-avatar",
|
|
106
|
-
"description": "Avatars represent an entity via text or image.\n---\n\n\n### **Slots:**\n - _default_ - The default slot for avatar content if not provided via text/imageUrl.\n\n### **CSS Properties:**\n - **--forge-avatar-background** - The background color of the avatar. _(default: undefined)_\n- **--forge-avatar-shape** - The border radius of the avatar, defaults to 50%. _(default: undefined)_\n- **--forge-avatar-color** - The text color of the avatar. _(default: undefined)_\n- **--forge-avatar-size** - The height and width of the avatar. _(default: undefined)_\n- **--forge-avatar-transition-duration** - The transition duration for animations. _(default: undefined)_\n- **--forge-avatar-transition-timing** - The transition timing function for animations. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root container element.",
|
|
107
|
-
"attributes": [
|
|
108
|
-
{
|
|
109
|
-
"name": "text",
|
|
110
|
-
"description": "The text to display in the avatar.",
|
|
111
|
-
"values": []
|
|
112
|
-
},
|
|
113
|
-
{
|
|
114
|
-
"name": "letter-count",
|
|
115
|
-
"description": "Controls the number of letters to display from the text. By default the text is split on spaces and the first character of each word is used.",
|
|
116
|
-
"values": []
|
|
117
|
-
},
|
|
118
|
-
{
|
|
119
|
-
"name": "image-url",
|
|
120
|
-
"description": "The background image URL to use.",
|
|
121
|
-
"values": []
|
|
122
|
-
}
|
|
123
|
-
],
|
|
124
|
-
"references": []
|
|
125
|
-
},
|
|
126
104
|
{
|
|
127
105
|
"name": "forge-backdrop",
|
|
128
106
|
"description": "\n---\n\n\n### **Methods:**\n - **show(): _void_** - Immediately shows the backdrop by setting the `visibility` to `true` without animations.\n- **hide(): _void_** - Immediately hides the backdrop by setting the `visibility` to `false` without animations.\n- **fadeIn(): _Promise<void>_** - Sets the `visibility` to `true` and animates in.\n- **fadeOut(): _Promise<void>_** - Sets the `visibility` to `false` and animates out.\n\n### **CSS Properties:**\n - **--forge-backdrop-background** - The backdrop background color. _(default: undefined)_\n- **--forge-backdrop-opacity** - The backdrop opacity. _(default: undefined)_\n- **--forge-backdrop-z-index** - The backdrop z-index. _(default: undefined)_\n- **--forge-backdrop-enter-animation-duration** - The animation duration for the enter animation. _(default: undefined)_\n- **--forge-backdrop-enter-animation-easing** - The animation easing for the enter animation. _(default: undefined)_\n- **--forge-backdrop-exit-animation-duration** - The animation duration for the exit animation. _(default: undefined)_\n- **--forge-backdrop-exit-animation-easing** - The animation easing for the exit animation. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root element of the backdrop.",
|
|
@@ -141,33 +119,33 @@
|
|
|
141
119
|
"references": []
|
|
142
120
|
},
|
|
143
121
|
{
|
|
144
|
-
"name": "forge-
|
|
145
|
-
"description": "
|
|
146
|
-
"attributes": [],
|
|
147
|
-
"references": []
|
|
148
|
-
},
|
|
149
|
-
{
|
|
150
|
-
"name": "forge-banner",
|
|
151
|
-
"description": "Banners are used to inform users of important information, such as errors, warnings, or success messages.\n---\n\n\n### **Events:**\n - **forge-banner-before-dismiss** - Dispatched before the banner is dismissed. Cancelable to prevent dismissal.\n- **forge-banner-dismissed** - Dispatched when the banner is dismissed.\n\n### **Slots:**\n - _default_ - The content of the banner.\n- **icon** - The icon to display.\n- **button** - The optional button to display.\n\n### **CSS Properties:**\n - **--forge-banner-background** - The background color of the banner. _(default: undefined)_\n- **--forge-banner-color** - The text color of the banner. _(default: undefined)_\n- **--forge-banner-icon-color** - The color of the icon. _(default: undefined)_\n- **--forge-banner-gap** - The gap between the contents. _(default: undefined)_\n- **--forge-banner-padding-inline** - The inline padding. _(default: undefined)_\n- **--forge-banner-padding-block** - The block padding. _(default: undefined)_\n- **--forge-banner-transition-duration** - The transition duration. _(default: undefined)_\n- **--forge-banner-transition-easing** - The transition easing function. _(default: undefined)_",
|
|
122
|
+
"name": "forge-avatar",
|
|
123
|
+
"description": "Avatars represent an entity via text or image.\n---\n\n\n### **Slots:**\n - _default_ - The default slot for avatar content if not provided via text/imageUrl.\n\n### **CSS Properties:**\n - **--forge-avatar-background** - The background color of the avatar. _(default: undefined)_\n- **--forge-avatar-shape** - The border radius of the avatar, defaults to 50%. _(default: undefined)_\n- **--forge-avatar-color** - The text color of the avatar. _(default: undefined)_\n- **--forge-avatar-size** - The height and width of the avatar. _(default: undefined)_\n- **--forge-avatar-transition-duration** - The transition duration for animations. _(default: undefined)_\n- **--forge-avatar-transition-timing** - The transition timing function for animations. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root container element.",
|
|
152
124
|
"attributes": [
|
|
153
125
|
{
|
|
154
|
-
"name": "
|
|
155
|
-
"description": "
|
|
126
|
+
"name": "text",
|
|
127
|
+
"description": "The text to display in the avatar.",
|
|
156
128
|
"values": []
|
|
157
129
|
},
|
|
158
130
|
{
|
|
159
|
-
"name": "
|
|
160
|
-
"description": "Controls the
|
|
131
|
+
"name": "letter-count",
|
|
132
|
+
"description": "Controls the number of letters to display from the text. By default the text is split on spaces and the first character of each word is used.",
|
|
161
133
|
"values": []
|
|
162
134
|
},
|
|
163
135
|
{
|
|
164
|
-
"name": "
|
|
165
|
-
"description": "The
|
|
166
|
-
"values": [
|
|
136
|
+
"name": "image-url",
|
|
137
|
+
"description": "The background image URL to use.",
|
|
138
|
+
"values": []
|
|
167
139
|
}
|
|
168
140
|
],
|
|
169
141
|
"references": []
|
|
170
142
|
},
|
|
143
|
+
{
|
|
144
|
+
"name": "forge-badge",
|
|
145
|
+
"description": "\n---\n\n\n### **Slots:**\n - _default_ - Default content placed inside the badge.\n- **start** - Content placed before the default content.\n- **end** - Content placed after the default content.\n\n### **CSS Properties:**\n - **--forge-badge-background** - The background color. _(default: undefined)_\n- **--forge-badge-color** - The text color. _(default: undefined)_\n- **--forge-badge-shape** - The shape radius. _(default: undefined)_\n- **--forge-badge-padding-inline** - The inline padding. _(default: undefined)_\n- **--forge-badge-padding-block** - The block padding. _(default: undefined)_\n- **--forge-badge-border-width** - The border width. _(default: undefined)_\n- **--forge-badge-border-color** - The border color. _(default: undefined)_\n- **--forge-badge-border-style** - The border style. _(default: undefined)_\n- **--forge-badge-gap** - The spacing between the content within the badge. _(default: undefined)_",
|
|
146
|
+
"attributes": [],
|
|
147
|
+
"references": []
|
|
148
|
+
},
|
|
171
149
|
{
|
|
172
150
|
"name": "forge-bottom-sheet",
|
|
173
151
|
"description": "Bottom sheets slide up from the bottom of the screen to reveal more content and/or actions that the user can take.\n---\n\n\n### **Events:**\n - **forge-bottom-sheet-before-close** - Fires before the bottom sheet closes.\n- **forge-bottom-sheet-close** - Fires after the bottom sheet closes.\n- **forge-bottom-sheet-open** - Fires after the bottom sheet opens.\n- **forge-bottom-sheet-drag-start** - Fires when the bottom sheet starts to be dragged.\n- **forge-bottom-sheet-dragged** - Fires when the bottom sheet is dragged.\n- **forge-bottom-sheet-drag-end** - Fires when the bottom sheet drag ends.\n- **forge-bottom-sheet-drag-cancel** - Fires when the bottom sheet drag is cancelled.\n- **forge-bottom-sheet-fullscreen** - Fires when the bottom sheet is toggled to fullscreen.\n\n### **Slots:**\n - _default_ - The content of the bottom sheet. This is a passthrough slot to the dialog surface.\n\n### **CSS Properties:**\n - **--forge-bottom-sheet-desktop-max-width** - The maximum width of the bottom sheet on desktop. _(default: undefined)_\n- **--forge-bottom-sheet-desktop-min-width** - The minimum width of the bottom sheet on desktop. _(default: undefined)_\n- **--forge-bottom-sheet-animation-duration** - The duration of the bottom sheet animation to fullscreen. _(default: undefined)_\n- **--forge-bottom-sheet-animation-timing** - The timing function of the bottom sheet animation to fullscreen. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root element of the bottom sheet.\n- **surface** - The surface element of the bottom sheet within th dialog.",
|
|
@@ -195,6 +173,28 @@
|
|
|
195
173
|
],
|
|
196
174
|
"references": []
|
|
197
175
|
},
|
|
176
|
+
{
|
|
177
|
+
"name": "forge-banner",
|
|
178
|
+
"description": "Banners are used to inform users of important information, such as errors, warnings, or success messages.\n---\n\n\n### **Events:**\n - **forge-banner-before-dismiss** - Dispatched before the banner is dismissed. Cancelable to prevent dismissal.\n- **forge-banner-dismissed** - Dispatched when the banner is dismissed.\n\n### **Slots:**\n - _default_ - The content of the banner.\n- **icon** - The icon to display.\n- **button** - The optional button to display.\n\n### **CSS Properties:**\n - **--forge-banner-background** - The background color of the banner. _(default: undefined)_\n- **--forge-banner-color** - The text color of the banner. _(default: undefined)_\n- **--forge-banner-icon-color** - The color of the icon. _(default: undefined)_\n- **--forge-banner-gap** - The gap between the contents. _(default: undefined)_\n- **--forge-banner-padding-inline** - The inline padding. _(default: undefined)_\n- **--forge-banner-padding-block** - The block padding. _(default: undefined)_\n- **--forge-banner-transition-duration** - The transition duration. _(default: undefined)_\n- **--forge-banner-transition-easing** - The transition easing function. _(default: undefined)_",
|
|
179
|
+
"attributes": [
|
|
180
|
+
{
|
|
181
|
+
"name": "dismissed",
|
|
182
|
+
"description": "Controls the visibility of the banner.",
|
|
183
|
+
"values": []
|
|
184
|
+
},
|
|
185
|
+
{
|
|
186
|
+
"name": "persistent",
|
|
187
|
+
"description": "Controls the visibility of the built-in dismiss button.",
|
|
188
|
+
"values": []
|
|
189
|
+
},
|
|
190
|
+
{
|
|
191
|
+
"name": "theme",
|
|
192
|
+
"description": "The theme of the banner.",
|
|
193
|
+
"values": [{ "name": "BannerTheme" }]
|
|
194
|
+
}
|
|
195
|
+
],
|
|
196
|
+
"references": []
|
|
197
|
+
},
|
|
198
198
|
{
|
|
199
199
|
"name": "forge-button",
|
|
200
200
|
"description": "Buttons represent actions that a user can take.\n---\n\n\n### **Events:**\n - **click** - Fires when the button is clicked.\n\n### **Methods:**\n - **click(): _void_** - Clicks the button.\n- **focus(options: _ExperimentalFocusOptions_): _void_** - Focuses the button.\n\n### **Slots:**\n - _default_ - This is a default/unnamed slot for the label text.\n- **start** - Elements to logically render before the label text.\n- **end** - Elements to logically render after the label text.\n\n### **CSS Properties:**\n - **--forge-button-primary-color** - The primary color of the button. _(default: undefined)_\n- **--forge-button-text-color** - The text color of the button. Inherits from primary color. _(default: undefined)_\n- **--forge-button-disabled-color** - The disabled color of the button. _(default: undefined)_\n- **--forge-button-padding** - The padding of the button. _(default: undefined)_\n- **--forge-button-display** - The display of the button. _(default: undefined)_\n- **--forge-button-justify** - The flex justify of the button. _(default: undefined)_\n- **--forge-button-shape** - The shape of the button. _(default: undefined)_\n- **--forge-button-height** - The height of the button. _(default: undefined)_\n- **--forge-button-min-width** - The min-width of the button. _(default: undefined)_\n- **--forge-button-spacing** - The spacing of the button. _(default: undefined)_\n- **--forge-button-border-width** - The border-width of the button. _(default: undefined)_\n- **--forge-button-border-style** - The border style of the button. _(default: undefined)_\n- **--forge-button-border-color** - The border color of the button. _(default: undefined)_\n- **--forge-button-shape-start-start-radius** - The shape start start radius of the button. _(default: undefined)_\n- **--forge-button-shape-start-end-radius** - The shape start end radius of the button. _(default: undefined)_\n- **--forge-button-shape-end-start-radius** - The shape end start radius of the button. _(default: undefined)_\n- **--forge-button-shape-end-end-radius** - The shape end end radius of the button. _(default: undefined)_\n- **--forge-button-padding-block** - The padding block of the button. _(default: undefined)_\n- **--forge-button-padding-inline** - The padding inline of the button. _(default: undefined)_\n- **--forge-button-background** - The background color of the button. _(default: undefined)_\n- **--forge-button-hover-background** - The background color of the button on hover. _(default: undefined)_\n- **--forge-button-active-background** - The background color of the button on active state. _(default: undefined)_\n- **--forge-button-color** - The text color of the button. _(default: undefined)_\n- **--forge-button-icon-size** - The size of the icon in the button. _(default: undefined)_\n- **--forge-button-shadow** - The shadow of the button. _(default: undefined)_\n- **--forge-button-hover-shadow** - The shadow of the button on hover. _(default: undefined)_\n- **--forge-button-active-shadow** - The shadow of the button on active state. _(default: undefined)_\n- **--forge-button-cursor** - The cursor type of the button. _(default: undefined)_\n- **--forge-button-transition-duration** - The transition duration of the button. _(default: undefined)_\n- **--forge-button-transition-timing** - The transition timing of the button. _(default: undefined)_\n- **--forge-button-text-padding-inline** - The inline padding of the button when using the text variant. _(default: undefined)_\n- **--forge-button-filled-background** - The background color of the filled button. _(default: undefined)_\n- **--forge-button-filled-disabled-background** - The background color of the disabled filled button. _(default: undefined)_\n- **--forge-button-filled-color** - The text color of the filled button. _(default: undefined)_\n- **--forge-button-filled-disabled-color** - The text color of the disabled filled button. _(default: undefined)_\n- **--forge-button-raised-background** - The background color of the raised button. _(default: undefined)_\n- **--forge-button-raised-disabled-background** - The background color of the disabled raised button. _(default: undefined)_\n- **--forge-button-raised-color** - The text color of the raised button. _(default: undefined)_\n- **--forge-button-raised-disabled-color** - The text color of the disabled raised button. _(default: undefined)_\n- **--forge-button-raised-shadow** - The shadow of the raised button. _(default: undefined)_\n- **--forge-button-raised-hover-shadow** - The shadow of the raised button on hover. _(default: undefined)_\n- **--forge-button-raised-active-shadow** - The shadow of the raised button on active state. _(default: undefined)_\n- **--forge-button-raised-disabled-shadow** - The shadow of the disabled raised button. _(default: undefined)_\n- **--forge-button-flat-background** - The background color of the flat button. _(default: undefined)_\n- **--forge-button-flat-disabled-background** - The background color of the disabled flat button. _(default: undefined)_\n- **--forge-button-flat-color** - The text color of the flat button. _(default: undefined)_\n- **--forge-button-flat-disabled-color** - The text color of the disabled flat button. _(default: undefined)_\n- **--forge-button-outlined-background** - The background color of the outlined button. _(default: undefined)_\n- **--forge-button-outlined-color** - The text color of the outlined button. _(default: undefined)_\n- **--forge-button-outlined-border-width** - The border width of the outlined button. _(default: undefined)_\n- **--forge-button-outlined-border-style** - The border style of the outlined button. _(default: undefined)_\n- **--forge-button-outlined-border-color** - The border color of the outlined button. _(default: undefined)_\n- **--forge-button-link-color** - The text color of the link button. _(default: undefined)_\n- **--forge-button-link-text-decoration** - The text decoration of the link button. _(default: undefined)_\n- **--forge-button-link-height** - The height of the link button. _(default: undefined)_\n- **--forge-button-link-padding** - The padding of the link button. _(default: undefined)_\n- **--forge-button-link-line-height** - The line height of the link button. _(default: undefined)_\n- **--forge-button-link-width** - The width of the link button. _(default: undefined)_\n- **--forge-button-link-hover-text-decoration** - The text decoration of the link button on hover. _(default: undefined)_\n- **--forge-button-link-active-opacity** - The opacity of the link button on active state. _(default: undefined)_\n- **--forge-button-link-transition-duration** - The transition duration of the link button. _(default: undefined)_\n- **--forge-button-link-transition-timing** - The transition timing of the link button. _(default: undefined)_\n- **--forge-button-disabled-cursor** - The cursor type of the disabled button. _(default: undefined)_\n- **--forge-button-disabled-text-color** - The text color of the disabled button. _(default: undefined)_\n- **--forge-button-disabled-background** - The background color of the disabled button. _(default: undefined)_\n- **--forge-button-disabled-border-color** - The border color of the disabled button. _(default: undefined)_\n- **--forge-button-disabled-shadow** - The shadow of the disabled button. _(default: undefined)_\n- **--forge-button-dense-height** - The height of the dense button. _(default: undefined)_\n- **--forge-button-pill-shape** - The shape of the pill button. _(default: undefined)_\n- **--forge-button-pill-padding-inline** - The inline padding of the pill button. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root container element.\n- **focus-indicator** - The focus-indicator indicator element.\n- **state-layer** - The state-layer surface element.",
|
|
@@ -1190,6 +1190,33 @@
|
|
|
1190
1190
|
],
|
|
1191
1191
|
"references": []
|
|
1192
1192
|
},
|
|
1193
|
+
{
|
|
1194
|
+
"name": "forge-label",
|
|
1195
|
+
"description": "The Forge Label component is used to associate a text label with a compatible Forge component.\n---\n\n\n### **Methods:**\n - **update(): _void_** - Updates the targeted element with the label's current text content.",
|
|
1196
|
+
"attributes": [
|
|
1197
|
+
{
|
|
1198
|
+
"name": "for",
|
|
1199
|
+
"description": "The id of the associated element.",
|
|
1200
|
+
"values": []
|
|
1201
|
+
},
|
|
1202
|
+
{
|
|
1203
|
+
"name": "dynamic",
|
|
1204
|
+
"description": "Propagates changes in the label's text content to the associated element.",
|
|
1205
|
+
"values": []
|
|
1206
|
+
},
|
|
1207
|
+
{
|
|
1208
|
+
"name": "non-interactive",
|
|
1209
|
+
"description": "Removes click handling from the label.",
|
|
1210
|
+
"values": []
|
|
1211
|
+
},
|
|
1212
|
+
{
|
|
1213
|
+
"name": "legend",
|
|
1214
|
+
"description": "Whether or not the label should be associated with an ancestor element.",
|
|
1215
|
+
"values": []
|
|
1216
|
+
}
|
|
1217
|
+
],
|
|
1218
|
+
"references": []
|
|
1219
|
+
},
|
|
1193
1220
|
{
|
|
1194
1221
|
"name": "forge-keyboard-shortcut",
|
|
1195
1222
|
"description": "\n---\n\n\n### **Events:**\n - **forge-keyboard-shortcut-activate** - Event fired when the keyboard shortcut is activated.",
|
|
@@ -1242,33 +1269,6 @@
|
|
|
1242
1269
|
],
|
|
1243
1270
|
"references": []
|
|
1244
1271
|
},
|
|
1245
|
-
{
|
|
1246
|
-
"name": "forge-label",
|
|
1247
|
-
"description": "The Forge Label component is used to associate a text label with a compatible Forge component.\n---\n\n\n### **Methods:**\n - **update(): _void_** - Updates the targeted element with the label's current text content.",
|
|
1248
|
-
"attributes": [
|
|
1249
|
-
{
|
|
1250
|
-
"name": "for",
|
|
1251
|
-
"description": "The id of the associated element.",
|
|
1252
|
-
"values": []
|
|
1253
|
-
},
|
|
1254
|
-
{
|
|
1255
|
-
"name": "dynamic",
|
|
1256
|
-
"description": "Propagates changes in the label's text content to the associated element.",
|
|
1257
|
-
"values": []
|
|
1258
|
-
},
|
|
1259
|
-
{
|
|
1260
|
-
"name": "non-interactive",
|
|
1261
|
-
"description": "Removes click handling from the label.",
|
|
1262
|
-
"values": []
|
|
1263
|
-
},
|
|
1264
|
-
{
|
|
1265
|
-
"name": "legend",
|
|
1266
|
-
"description": "Whether or not the label should be associated with an ancestor element.",
|
|
1267
|
-
"values": []
|
|
1268
|
-
}
|
|
1269
|
-
],
|
|
1270
|
-
"references": []
|
|
1271
|
-
},
|
|
1272
1272
|
{
|
|
1273
1273
|
"name": "forge-label-value",
|
|
1274
1274
|
"description": "Label-value pairs are used to display a label and a value in a compact format.\n---\n\n\n### **Slots:**\n - **label** - The label to display.\n- **value** - The value to display.\n- **icon** - An icon to display next to the label.\n\n### **CSS Properties:**\n - **--forge-label-value-align** - Aligns the label and value. Possible values: `start` (default), `center`, `end`. _(default: undefined)_\n- **--forge-label-value-label-spacing** - The spacing between the label and value. _(default: undefined)_\n- **--forge-label-value-label-block-start-spacing** - The block start spacing for the label. _(default: undefined)_\n- **--forge-label-value-label-block-end-spacing** - The block end spacing for the label. _(default: undefined)_\n- **--forge-label-value-label-color** - The color to apply to the label. _(default: undefined)_\n- **--forge-label-value-icon-spacing** - The spacing between the icon and the label. _(default: undefined)_\n- **--forge-label-value-inline-label-spacing** - The spacing between the label and value when displayed inline. _(default: undefined)_\n- **--forge-label-value-empty-color** - The color to apply to the value when empty. _(default: undefined)_\n- **--forge-label-value-empty-style** - The font-style to apply to the value when empty. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root layout container element.\n- **label** - The label container element.\n- **value** - The value container element.\n- **icon** - The icon container element.",
|
|
@@ -1933,23 +1933,6 @@
|
|
|
1933
1933
|
],
|
|
1934
1934
|
"references": []
|
|
1935
1935
|
},
|
|
1936
|
-
{
|
|
1937
|
-
"name": "forge-state-layer",
|
|
1938
|
-
"description": "State layers show the interaction status of an element.\n---\n\n\n### **Methods:**\n - **playAnimation(coords: _StateLayerCoords_): _void_** - Triggers the animation to run.\n\nNote: If coordinates are not provided, the transition will originate from the center of the target element.\n\n### **CSS Properties:**\n - **--forge-state-layer-color** - The color of the state layer. Defaults to the on-surface theme. _(default: undefined)_\n- **--forge-state-layer-hover-color** - The color of the state layer when hovered. _(default: undefined)_\n- **--forge-state-layer-hover-opacity** - The opacity of the state layer when hovered. _(default: undefined)_\n- **--forge-state-layer-pressed-color** - The color of the state layer when pressed. _(default: undefined)_\n- **--forge-state-layer-pressed-opacity** - The opacity of the state layer when pressed. _(default: undefined)_\n- **--forge-state-layer-hover-duration** - The duration of the hover animation. _(default: undefined)_\n- **--forge-state-layer-animation-duration** - The duration of the animation. _(default: undefined)_\n- **--forge-state-layer-pressed-duration** - The duration of the pressed animation. _(default: undefined)_\n\n### **CSS Parts:**\n - **surface** - The surface element.",
|
|
1939
|
-
"attributes": [
|
|
1940
|
-
{
|
|
1941
|
-
"name": "target",
|
|
1942
|
-
"description": "The id of the element to attach the state layer to.",
|
|
1943
|
-
"values": []
|
|
1944
|
-
},
|
|
1945
|
-
{
|
|
1946
|
-
"name": "disabled",
|
|
1947
|
-
"description": "Controls whether the state layer is disabled.",
|
|
1948
|
-
"values": []
|
|
1949
|
-
}
|
|
1950
|
-
],
|
|
1951
|
-
"references": []
|
|
1952
|
-
},
|
|
1953
1936
|
{
|
|
1954
1937
|
"name": "forge-switch",
|
|
1955
1938
|
"description": "Switches toggle the state of a single setting on or off.\n---\n\n\n### **Events:**\n - **change** - Dispatches when the switch's value changes.\n- **forge-switch-change** - Dispatches when the switch's value changes.\n\n### **Methods:**\n - **toggle(force: _boolean_): _void_** - Toggles the switch on or off.\n\n### **CSS Properties:**\n - **--forge-theme-primary** - The primary color of the switch. _(default: undefined)_\n- **--forge-theme-on-primary** - The color of elements placed on top of the primary color (the handle icons for example). _(default: undefined)_\n- **--forge-switch-handle-on-color** - The color of the handle in the switch's on state. _(default: undefined)_\n- **--forge-switch-handle-off-color** - The color of the handle in the switch's off state. _(default: undefined)_\n- **--forge-switch-handle-active-on-color** - The color of the handle when the switch is active (pressed) in its on state. _(default: undefined)_\n- **--forge-switch-handle-active-off-color** - The color of the handle when the switch is active (pressed) in its off state. _(default: undefined)_\n- **--forge-switch-handle-size** - The inline and block size of the handle. _(default: undefined)_\n- **--forge-switch-handle-width** - The inline size of the handle. _(default: undefined)_\n- **--forge-switch-handle-height** - The block size of the handle. _(default: undefined)_\n- **--forge-switch-handle-scale** - The scale transformation applied to the handle. _(default: undefined)_\n- **--forge-switch-handle-on-scale** - The scale transformation applied to the handle in the switch's on state. _(default: undefined)_\n- **--forge-switch-handle-off-scale** - The scale transformation applied to the handle in the switch's off state. _(default: undefined)_\n- **--forge-switch-handle-active-scale** - The scale transformation applied to the handle when the switch is active (pressed). _(default: undefined)_\n- **--forge-switch-handle-active-on-scale** - The scale transformation applied to the handle when the switch is active (pressed) in its on state. _(default: undefined)_\n- **--forge-switch-handle-active-off-scale** - The scale transformation applied to the handle when the switch is active (pressed) in its off state. _(default: undefined)_\n- **--forge-switch-handle-shape** - The shape of the handle. _(default: undefined)_\n- **--forge-switch-handle-elevation** - The handle's shadow. _(default: undefined)_\n- **--forge-switch-handle-on-elevation** - The handle's shadow in the switch's on state. _(default: undefined)_\n- **--forge-switch-handle-off-elevation** - The handle's shadow in the switch's off state. _(default: undefined)_\n- **--forge-switch-handle-active-elevation** - The handle's shadow when the switch is active (pressed). _(default: undefined)_\n- **--forge-switch-handle-active-on-elevation** - The handle's shadow when the switch is active (pressed) in its on state. _(default: undefined)_\n- **--forge-switch-handle-active-off-elevation** - The handle's shadow when the switch is active (pressed) in its off state. _(default: undefined)_\n- **--forge-switch-track-on-color** - The color of the track in the switch's on state. _(default: undefined)_\n- **--forge-switch-track-off-color** - The color fo the track in the switch's off state. _(default: undefined)_\n- **--forge-switch-track-active-on-color** - The color of the track when the switch is active (pressed) in its on state. _(default: undefined)_\n- **--forge-switch-track-active-off-color** - The color fo the track when the switch is active (pressed) in its off state. _(default: undefined)_\n- **--forge-switch-track-width** - The inline size of the track. _(default: undefined)_\n- **--forge-switch-track-height** - The block size of the track. _(default: undefined)_\n- **--forge-switch-track-shape** - The shape of the track. _(default: undefined)_\n- **--forge-switch-track-border-width** - The width of the track border. _(default: undefined)_\n- **--forge-switch-track-on-border-width** - The width of the track border in the switch's on state. _(default: undefined)_\n- **--forge-switch-track-off-border-width** - The width of the track border in the switch's off state. _(default: undefined)_\n- **--forge-switch-track-active-on-border-width** - The width of the track border when the switch is active (pressed) in its on state. _(default: undefined)_\n- **--forge-switch-track-active-off-border-width** - The width of the track border when the switch is active (pressed) in its off state. _(default: undefined)_\n- **--forge-switch-track-border-color** - The color of the track border. _(default: undefined)_\n- **--forge-switch-track-on-border-color** - The color of the track border in the switch's on state. _(default: undefined)_\n- **--forge-switch-track-off-border-color** - The color of the track border in the switch's off state. _(default: undefined)_\n- **--forge-switch-track-active-on-border-color** - The color of the track border when the switch is active (pressed) in its on state. _(default: undefined)_\n- **--forge-switch-track-active-off-border-color** - The color of the track border when the switch is active (pressed) in its off state. _(default: undefined)_\n- **--forge-switch-icon-color** - The color of the handle icons. _(default: undefined)_\n- **--forge-switch-icon-on-color** - The color of the handle icon in the switch's on state. _(default: undefined)_\n- **--forge-switch-icon-off-color** - The color of the handle icon in the switch's off state. _(default: undefined)_\n- **--forge-switch-icon-active-on-color** - The color of the handle icon when the switch is active (pressed) in its on state. _(default: undefined)_\n- **--forge-switch-icon-active-off-color** - The color of the handle icon when the switch is active (pressed) in its off state. _(default: undefined)_\n- **--forge-switch-icon-size** - The size of the handle icon. _(default: undefined)_\n- **--forge-switch-icon-on-size** - The size of the handle icon in the switch's on state. _(default: undefined)_\n- **--forge-switch-icon-off-size** - The size of the handle icon in the switch's off state. _(default: undefined)_\n- **--forge-switch-icon-scale** - The scale transformation applied to the handle icons. _(default: undefined)_\n- **--forge-switch-icon-on-scale** - The scale transformation applied to the handle icons in the switch's on state. _(default: undefined)_\n- **--forge-switch-icon-off-scale** - The scale transformation applied to the handle icons in the switch's off state. _(default: undefined)_\n- **--forge-switch-icon-active-on-scale** - The scale transformation applied to the handle icons when the switch is active (pressed) in its on state. _(default: undefined)_\n- **--forge-switch-icon-active-off-scale** - The scale transformation applied to the handle icons when the switch is active (pressed) in its off state. _(default: undefined)_\n- **--forge-switch-gap** - The space between the switch and label. _(default: undefined)_\n- **--forge-switch-justify** - How the switch and label are distributed along their main axis. _(default: undefined)_\n- **--forge-switch-align** - How the switch and label are distributed along their cross axis. _(default: undefined)_\n- **--forge-switch-direction** - Whether the switch and label are arranged along the inline or block axis. _(default: undefined)_\n- **--forge-switch-state-layer-size** - The inline and block size of the handle's state layer. _(default: undefined)_\n- **--forge-switch-state-layer-width** - The inline size of the handle's state layer. _(default: undefined)_\n- **--forge-switch-state-layer-height** - The block size of the handle's state layer. _(default: undefined)_\n- **--forge-switch-state-layer-on-color** - The color of the handle's state layer when the switch is in its on state. _(default: undefined)_\n- **--forge-switch-state-layer-off-color** - The color of the handle's state layer when the switch is in its off state. _(default: undefined)_\n- **--forge-switch-state-layer-dense-size** - The inline and block size of the handle's state layer when the dense switch is used. _(default: undefined)_\n- **--forge-switch-state-layer-dense-width** - The inline size of the handle's state layer when the dense switch is used. _(default: undefined)_\n- **--forge-switch-state-layer-dense-height** - The block size of the handle's state layer when the dense switch is used. _(default: undefined)_\n- **--forge-switch-disabled-opacity** - The opacity of the switch when disabled. _(default: undefined)_\n- **--forge-switch-animation-duration** - The duration of animations. _(default: undefined)_\n- **--forge-switch-animation-timing** - The timing function used in most animations. _(default: undefined)_\n- **--forge-switch-active-animation-timing** - The timing function used in active state animations. _(default: undefined)_\n\n### **CSS Parts:**\n - **switch** - Styles the switch container element.\n- **track** - Styles the track element.\n- **handle** - Styles the handle element.\n- **icon-on** - Styles the on icon element.\n- **icon-off** - Styles the off icon element.\n- **label** - Styles the label element.\n- **state-layer** - Styles the state layer root element.\n- **focus-indicator** - Styles the focus indicator root element.",
|
|
@@ -2018,88 +2001,18 @@
|
|
|
2018
2001
|
"references": []
|
|
2019
2002
|
},
|
|
2020
2003
|
{
|
|
2021
|
-
"name": "forge-
|
|
2022
|
-
"description": "
|
|
2004
|
+
"name": "forge-state-layer",
|
|
2005
|
+
"description": "State layers show the interaction status of an element.\n---\n\n\n### **Methods:**\n - **playAnimation(coords: _StateLayerCoords_): _void_** - Triggers the animation to run.\n\nNote: If coordinates are not provided, the transition will originate from the center of the target element.\n\n### **CSS Properties:**\n - **--forge-state-layer-color** - The color of the state layer. Defaults to the on-surface theme. _(default: undefined)_\n- **--forge-state-layer-hover-color** - The color of the state layer when hovered. _(default: undefined)_\n- **--forge-state-layer-hover-opacity** - The opacity of the state layer when hovered. _(default: undefined)_\n- **--forge-state-layer-pressed-color** - The color of the state layer when pressed. _(default: undefined)_\n- **--forge-state-layer-pressed-opacity** - The opacity of the state layer when pressed. _(default: undefined)_\n- **--forge-state-layer-hover-duration** - The duration of the hover animation. _(default: undefined)_\n- **--forge-state-layer-animation-duration** - The duration of the animation. _(default: undefined)_\n- **--forge-state-layer-pressed-duration** - The duration of the pressed animation. _(default: undefined)_\n\n### **CSS Parts:**\n - **surface** - The surface element.",
|
|
2023
2006
|
"attributes": [
|
|
2024
2007
|
{
|
|
2025
|
-
"name": "
|
|
2026
|
-
"description": "
|
|
2027
|
-
"values": []
|
|
2028
|
-
},
|
|
2029
|
-
{
|
|
2030
|
-
"name": "multiselect",
|
|
2031
|
-
"description": "Controls the visibility of the select all checkbox (only applied when `select` is `true`).",
|
|
2032
|
-
"values": []
|
|
2033
|
-
},
|
|
2034
|
-
{
|
|
2035
|
-
"name": "select-key",
|
|
2036
|
-
"description": "The row key for matching data to selections.",
|
|
2037
|
-
"values": [{ "name": "string[]" }]
|
|
2038
|
-
},
|
|
2039
|
-
{
|
|
2040
|
-
"name": "tooltip-select",
|
|
2041
|
-
"description": "The tooltip to display when hovering over the select column.",
|
|
2042
|
-
"values": [{ "name": "TableSelectTooltipCallback" }]
|
|
2043
|
-
},
|
|
2044
|
-
{
|
|
2045
|
-
"name": "tooltip-select-all",
|
|
2046
|
-
"description": "The tooltip to display when hovering over the select all checkbox.",
|
|
2047
|
-
"values": []
|
|
2048
|
-
},
|
|
2049
|
-
{
|
|
2050
|
-
"name": "dense",
|
|
2051
|
-
"description": "Controls whether the table is dense or not.",
|
|
2052
|
-
"values": []
|
|
2053
|
-
},
|
|
2054
|
-
{
|
|
2055
|
-
"name": "roomy",
|
|
2056
|
-
"description": "Controls whether the table is roomy or not.",
|
|
2057
|
-
"values": []
|
|
2058
|
-
},
|
|
2059
|
-
{
|
|
2060
|
-
"name": "filter",
|
|
2061
|
-
"description": "Controls whether the table shows its column filter row.",
|
|
2062
|
-
"values": []
|
|
2063
|
-
},
|
|
2064
|
-
{
|
|
2065
|
-
"name": "fixed-headers",
|
|
2066
|
-
"description": "Controls whether the table applies fixed headers when in scroll containers.",
|
|
2067
|
-
"values": []
|
|
2068
|
-
},
|
|
2069
|
-
{
|
|
2070
|
-
"name": "layout-type",
|
|
2071
|
-
"description": "Controls the table layout algorithm.",
|
|
2072
|
-
"values": [{ "name": "TableLayoutType" }]
|
|
2073
|
-
},
|
|
2074
|
-
{
|
|
2075
|
-
"name": "wrap-content",
|
|
2076
|
-
"description": "Controls whether the content in each cell wraps or not (true by default).",
|
|
2077
|
-
"values": []
|
|
2078
|
-
},
|
|
2079
|
-
{
|
|
2080
|
-
"name": "resizable",
|
|
2081
|
-
"description": "Controls whether the columns are resizable or not.",
|
|
2082
|
-
"values": []
|
|
2083
|
-
},
|
|
2084
|
-
{
|
|
2085
|
-
"name": "min-resize-width",
|
|
2086
|
-
"description": "Gets/sets the minimum width that a column can be resized to by the user dragging the resize handle.",
|
|
2087
|
-
"values": []
|
|
2088
|
-
},
|
|
2089
|
-
{
|
|
2090
|
-
"name": "allow-row-click",
|
|
2091
|
-
"description": "Gets/sets whether the rows respond to (and emit) row click events.",
|
|
2008
|
+
"name": "target",
|
|
2009
|
+
"description": "The id of the element to attach the state layer to.",
|
|
2092
2010
|
"values": []
|
|
2093
2011
|
},
|
|
2094
2012
|
{
|
|
2095
|
-
"name": "
|
|
2096
|
-
"description": "
|
|
2013
|
+
"name": "disabled",
|
|
2014
|
+
"description": "Controls whether the state layer is disabled.",
|
|
2097
2015
|
"values": []
|
|
2098
|
-
},
|
|
2099
|
-
{
|
|
2100
|
-
"name": "select-checkbox-alignment",
|
|
2101
|
-
"description": "Controls the alignment of the select checkbox.",
|
|
2102
|
-
"values": [{ "name": "`${CellAlign}`" }]
|
|
2103
2016
|
}
|
|
2104
2017
|
],
|
|
2105
2018
|
"references": []
|
|
@@ -2191,6 +2104,93 @@
|
|
|
2191
2104
|
],
|
|
2192
2105
|
"references": []
|
|
2193
2106
|
},
|
|
2107
|
+
{
|
|
2108
|
+
"name": "forge-table",
|
|
2109
|
+
"description": "\n---\n\n\n### **Events:**\n - **forge-table-row-click** - Dispatched when a row is clicked. Only applies when `allow-row-click` is specified.\n- **forge-table-select** - Dispatched when a row is selected. Only applies when `select` is specified.\n- **forge-table-select-double** - Dispatched when a row is double-clicked. Only applies when `select` is specified.\n- **forge-table-select-all** - Dispatched when the select all checkbox is toggled. Only applies when `select` and `multiselect` is specified.\n- **forge-table-sort** - Dispatched when a column is sorted.\n- **forge-table-filter** - Dispatched when a column is filtered. Only applies when `filter` is specified.\n- **forge-table-initialized** - Dispatched when the table is initialized in the DOM for the first time.\n- **forge-table-column-resize** - Dispatched when a column is resized.\n\n### **Methods:**\n - **hideColumn(columnIndex: _number_): _void_** - Hides a column from the table.\n- **showColumn(columnIndex: _number_): _void_** - Shows a hidden column in th table.\n- **isColumnHidden(columnIndex: _number_): _boolean_** - Determines if a column at the given index is hidden or not.\n- **getSelectedRows(): _any[]_** - Returns the selected row instances.\n- **selectRow(data: _any_): _void_** - Selects a row in the table. Only applicable if `select` is true.\n- **selectRows(data: _any[]_, preserveExisting: _boolean_): _void_** - Selects one or more rows in the table. Only applicable if `select` is true.\n- **deselectRow(data: _any_): _void_** - Deselects a single row in the table.\n- **deselectRows(data: _any[]_): _void_** - Deselects one or more rows in the table.\n- **clearSelections(): _void_** - Clears all selected table rows.\n- **render(): _void_** - Forces the table to re-render based on its current configuration.\n- **expandRow(rowIndex: _any_, template: _TableViewTemplate_): _Promise<void>_** - Expands a collapsed row.\n- **collapseRow(rowIndex: _number_): _Promise<void>_** - Collapses an expanded row.\n- **isRowExpanded(rowIndex: _number_): _boolean_** - Checks if a row is expanded or not.\n- **selectRowsByIndex(indexes: _number | number[]_, preserveExisting: _boolean_): _void_** - Selects a rows by an index or array of indexes.\n- **deselectRowsByIndex(indexes: _number | number[]_): _void_** - Deselects a rows by an index or array of indexes.\n- **isRowSelected(rowData: _{ [key: string]: any }_): _boolean_** - Checks if a row is selected or not.",
|
|
2110
|
+
"attributes": [
|
|
2111
|
+
{
|
|
2112
|
+
"name": "select",
|
|
2113
|
+
"description": "Controls the visibility of the select column.",
|
|
2114
|
+
"values": []
|
|
2115
|
+
},
|
|
2116
|
+
{
|
|
2117
|
+
"name": "multiselect",
|
|
2118
|
+
"description": "Controls the visibility of the select all checkbox (only applied when `select` is `true`).",
|
|
2119
|
+
"values": []
|
|
2120
|
+
},
|
|
2121
|
+
{
|
|
2122
|
+
"name": "select-key",
|
|
2123
|
+
"description": "The row key for matching data to selections.",
|
|
2124
|
+
"values": [{ "name": "string[]" }]
|
|
2125
|
+
},
|
|
2126
|
+
{
|
|
2127
|
+
"name": "tooltip-select",
|
|
2128
|
+
"description": "The tooltip to display when hovering over the select column.",
|
|
2129
|
+
"values": [{ "name": "TableSelectTooltipCallback" }]
|
|
2130
|
+
},
|
|
2131
|
+
{
|
|
2132
|
+
"name": "tooltip-select-all",
|
|
2133
|
+
"description": "The tooltip to display when hovering over the select all checkbox.",
|
|
2134
|
+
"values": []
|
|
2135
|
+
},
|
|
2136
|
+
{
|
|
2137
|
+
"name": "dense",
|
|
2138
|
+
"description": "Controls whether the table is dense or not.",
|
|
2139
|
+
"values": []
|
|
2140
|
+
},
|
|
2141
|
+
{
|
|
2142
|
+
"name": "roomy",
|
|
2143
|
+
"description": "Controls whether the table is roomy or not.",
|
|
2144
|
+
"values": []
|
|
2145
|
+
},
|
|
2146
|
+
{
|
|
2147
|
+
"name": "filter",
|
|
2148
|
+
"description": "Controls whether the table shows its column filter row.",
|
|
2149
|
+
"values": []
|
|
2150
|
+
},
|
|
2151
|
+
{
|
|
2152
|
+
"name": "fixed-headers",
|
|
2153
|
+
"description": "Controls whether the table applies fixed headers when in scroll containers.",
|
|
2154
|
+
"values": []
|
|
2155
|
+
},
|
|
2156
|
+
{
|
|
2157
|
+
"name": "layout-type",
|
|
2158
|
+
"description": "Controls the table layout algorithm.",
|
|
2159
|
+
"values": [{ "name": "TableLayoutType" }]
|
|
2160
|
+
},
|
|
2161
|
+
{
|
|
2162
|
+
"name": "wrap-content",
|
|
2163
|
+
"description": "Controls whether the content in each cell wraps or not (true by default).",
|
|
2164
|
+
"values": []
|
|
2165
|
+
},
|
|
2166
|
+
{
|
|
2167
|
+
"name": "resizable",
|
|
2168
|
+
"description": "Controls whether the columns are resizable or not.",
|
|
2169
|
+
"values": []
|
|
2170
|
+
},
|
|
2171
|
+
{
|
|
2172
|
+
"name": "min-resize-width",
|
|
2173
|
+
"description": "Gets/sets the minimum width that a column can be resized to by the user dragging the resize handle.",
|
|
2174
|
+
"values": []
|
|
2175
|
+
},
|
|
2176
|
+
{
|
|
2177
|
+
"name": "allow-row-click",
|
|
2178
|
+
"description": "Gets/sets whether the rows respond to (and emit) row click events.",
|
|
2179
|
+
"values": []
|
|
2180
|
+
},
|
|
2181
|
+
{
|
|
2182
|
+
"name": "multi-column-sort",
|
|
2183
|
+
"description": "Gets/sets whether the table supports multi-column sorting.",
|
|
2184
|
+
"values": []
|
|
2185
|
+
},
|
|
2186
|
+
{
|
|
2187
|
+
"name": "select-checkbox-alignment",
|
|
2188
|
+
"description": "Controls the alignment of the select checkbox.",
|
|
2189
|
+
"values": [{ "name": "`${CellAlign}`" }]
|
|
2190
|
+
}
|
|
2191
|
+
],
|
|
2192
|
+
"references": []
|
|
2193
|
+
},
|
|
2194
2194
|
{
|
|
2195
2195
|
"name": "forge-time-picker",
|
|
2196
2196
|
"description": "\n---\n",
|
|
@@ -2473,6 +2473,28 @@
|
|
|
2473
2473
|
],
|
|
2474
2474
|
"references": []
|
|
2475
2475
|
},
|
|
2476
|
+
{
|
|
2477
|
+
"name": "forge-app-bar-help-button",
|
|
2478
|
+
"description": "\n---\n\n\n### **Events:**\n - **forge-menu-select** - Bubbles up the menu select from the internal menu component.",
|
|
2479
|
+
"attributes": [
|
|
2480
|
+
{
|
|
2481
|
+
"name": "icon",
|
|
2482
|
+
"description": "The name of an alternative icon to display.",
|
|
2483
|
+
"values": []
|
|
2484
|
+
},
|
|
2485
|
+
{
|
|
2486
|
+
"name": "aria-label",
|
|
2487
|
+
"description": "The aria-label to apply to the button.",
|
|
2488
|
+
"values": []
|
|
2489
|
+
},
|
|
2490
|
+
{
|
|
2491
|
+
"name": "aria-labelledby",
|
|
2492
|
+
"description": "The id of an element to use as the aria-labelledby attribute.",
|
|
2493
|
+
"values": []
|
|
2494
|
+
}
|
|
2495
|
+
],
|
|
2496
|
+
"references": []
|
|
2497
|
+
},
|
|
2476
2498
|
{
|
|
2477
2499
|
"name": "forge-app-bar",
|
|
2478
2500
|
"description": "\n---\n\n\n### **Events:**\n - **forge-app-bar-navigate** - Fires when the app bar is clicked.\n\n### **Slots:**\n - **logo** - Reserved for the brand logo.\n- **title** - Reserved for the application title. This will overwrite the `titleText` property/attribute.\n- **start** - Places content at the beginning of the app bar.\n- **center** - Places content in the center of the app bar.\n- **end** - Places content at the end of the app bar.\n\n### **CSS Properties:**\n - **--forge-app-bar-background** - The background color of the app bar. _(default: undefined)_\n- **--forge-app-bar-foreground** - The text color of the app bar. _(default: undefined)_\n- **--forge-app-bar-z-index** - The `z-index` of the app bar. _(default: undefined)_\n- **--forge-app-bar-elevation** - The elevation of the app bar. _(default: undefined)_\n- **--forge-app-bar-height** - The height of the app bar. _(default: undefined)_\n- **--forge-app-bar-row-padding** - The inline padding of the app bar. _(default: undefined)_\n- **--forge-app-bar-logo-gap** - The space between the logo and title. _(default: undefined)_\n- **--forge-app-bar-title-padding** - The padding around the title element. _(default: undefined)_\n- **--forge-app-bar-columns** - The grid column track sizes. _(default: undefined)_\n- **--forge-app-bar-transition-duration** - The transition duration for animations. _(default: undefined)_\n- **--forge-app-bar-transition-timing** - The transition timing function for animations. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root container element.\n- **title** - The title element.",
|
|
@@ -2505,28 +2527,6 @@
|
|
|
2505
2527
|
],
|
|
2506
2528
|
"references": []
|
|
2507
2529
|
},
|
|
2508
|
-
{
|
|
2509
|
-
"name": "forge-app-bar-help-button",
|
|
2510
|
-
"description": "\n---\n\n\n### **Events:**\n - **forge-menu-select** - Bubbles up the menu select from the internal menu component.",
|
|
2511
|
-
"attributes": [
|
|
2512
|
-
{
|
|
2513
|
-
"name": "icon",
|
|
2514
|
-
"description": "The name of an alternative icon to display.",
|
|
2515
|
-
"values": []
|
|
2516
|
-
},
|
|
2517
|
-
{
|
|
2518
|
-
"name": "aria-label",
|
|
2519
|
-
"description": "The aria-label to apply to the button.",
|
|
2520
|
-
"values": []
|
|
2521
|
-
},
|
|
2522
|
-
{
|
|
2523
|
-
"name": "aria-labelledby",
|
|
2524
|
-
"description": "The id of an element to use as the aria-labelledby attribute.",
|
|
2525
|
-
"values": []
|
|
2526
|
-
}
|
|
2527
|
-
],
|
|
2528
|
-
"references": []
|
|
2529
|
-
},
|
|
2530
2530
|
{
|
|
2531
2531
|
"name": "forge-app-bar-menu-button",
|
|
2532
2532
|
"description": "\n---\n",
|
|
@@ -2869,9 +2869,14 @@
|
|
|
2869
2869
|
"references": []
|
|
2870
2870
|
},
|
|
2871
2871
|
{
|
|
2872
|
-
"name": "forge-drawer",
|
|
2873
|
-
"description": "\n---\n\n\n### **Events:**\n - **forge-drawer-after-open** - Dispatched after the drawer has opened.\n- **forge-drawer-after-close** - Dispatched after the drawer has closed.\n\n### **Slots:**\n - _default_ - The content to display in the scrollable content container.\n- **header** - The header content above the main content.\n- **footer** - The footer content below the main content.\n\n### **CSS Properties:**\n - **--forge-drawer-width** - The width of the drawer. _(default: undefined)_\n- **--forge-drawer-background** - The background color of the drawer. _(default: undefined)_\n- **--forge-drawer-border-color** - The border of the drawer. _(default: undefined)_\n- **--forge-drawer-border-width** - The border width of the drawer. _(default: undefined)_\n- **--forge-drawer-transition-duration** - The transition duration of the drawer. _(default: undefined)_\n- **--forge-drawer-transition-easing** - The transition timing function of the drawer. _(default: undefined)_\n- **--forge-drawer-duration-close** - The duration of the drawer closing animation. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The component's root element.\n- **content** - The content container element.",
|
|
2872
|
+
"name": "forge-mini-drawer",
|
|
2873
|
+
"description": "\n---\n\n\n### **Events:**\n - **forge-drawer-after-open** - Dispatched after the drawer has opened.\n- **forge-drawer-after-close** - Dispatched after the drawer has closed.\n\n### **Slots:**\n - _default_ - The content to display in the scrollable content container.\n- **header** - The header content above the main content.\n- **footer** - The footer content below the main content.\n\n### **CSS Properties:**\n - **--forge-mini-drawer-width** - The width of the drawer. _(default: undefined)_\n- **--forge-mini-drawer-min-width** - The minimum width of the drawer. Defaults to match the width. _(default: undefined)_\n- **--forge-mini-drawer-hover-width** - The width of the drawer when hovered. _(default: undefined)_\n- **--forge-mini-drawer-transition-duration** - The transition duration of the drawer. _(default: undefined)_\n- **--forge-mini-drawer-transition-easing** - The transition timing function of the drawer. _(default: undefined)_\n- **--forge-mini-drawer-delay** - The delay before the drawer closes when the mouse leaves the drawer. _(default: undefined)_\n- **--forge-mini-drawer-hover-transition-duration** - The transition duration of the drawer when hovered. _(default: undefined)_\n- **--forge-mini-drawer-hover-transition-easing** - The transition timing function of the drawer when hovered. _(default: undefined)_\n- **--forge-mini-drawer-hover-transition-delay** - The delay before the drawer closes when the mouse leaves the drawer when hovered. _(default: undefined)_\n- **--forge-drawer-width** - The width of the drawer. _(default: undefined)_\n- **--forge-drawer-background** - The background color of the drawer. _(default: undefined)_\n- **--forge-drawer-border-color** - The border of the drawer. _(default: undefined)_\n- **--forge-drawer-border-width** - The border width of the drawer. _(default: undefined)_\n- **--forge-drawer-transition-duration** - The transition duration of the drawer. _(default: undefined)_\n- **--forge-drawer-transition-easing** - The transition timing function of the drawer. _(default: undefined)_\n- **--forge-drawer-duration-close** - The duration of the drawer closing animation. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The component's root element.\n- **container** - The container element around the content.\n- **content** - The content container element.",
|
|
2874
2874
|
"attributes": [
|
|
2875
|
+
{
|
|
2876
|
+
"name": "hover",
|
|
2877
|
+
"description": "The drawer will expand open when hovered.",
|
|
2878
|
+
"values": []
|
|
2879
|
+
},
|
|
2875
2880
|
{
|
|
2876
2881
|
"name": "open",
|
|
2877
2882
|
"description": "Toggles whether the drawer is visible or not.",
|
|
@@ -2886,14 +2891,9 @@
|
|
|
2886
2891
|
"references": []
|
|
2887
2892
|
},
|
|
2888
2893
|
{
|
|
2889
|
-
"name": "forge-
|
|
2890
|
-
"description": "\n---\n\n\n### **Events:**\n - **forge-drawer-after-open** - Dispatched after the drawer has opened.\n- **forge-drawer-after-close** - Dispatched after the drawer has closed.\n\n### **Slots:**\n - _default_ - The content to display in the scrollable content container.\n- **header** - The header content above the main content.\n- **footer** - The footer content below the main content.\n\n### **CSS Properties:**\n - **--forge-
|
|
2894
|
+
"name": "forge-drawer",
|
|
2895
|
+
"description": "\n---\n\n\n### **Events:**\n - **forge-drawer-after-open** - Dispatched after the drawer has opened.\n- **forge-drawer-after-close** - Dispatched after the drawer has closed.\n\n### **Slots:**\n - _default_ - The content to display in the scrollable content container.\n- **header** - The header content above the main content.\n- **footer** - The footer content below the main content.\n\n### **CSS Properties:**\n - **--forge-drawer-width** - The width of the drawer. _(default: undefined)_\n- **--forge-drawer-background** - The background color of the drawer. _(default: undefined)_\n- **--forge-drawer-border-color** - The border of the drawer. _(default: undefined)_\n- **--forge-drawer-border-width** - The border width of the drawer. _(default: undefined)_\n- **--forge-drawer-transition-duration** - The transition duration of the drawer. _(default: undefined)_\n- **--forge-drawer-transition-easing** - The transition timing function of the drawer. _(default: undefined)_\n- **--forge-drawer-duration-close** - The duration of the drawer closing animation. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The component's root element.\n- **content** - The content container element.",
|
|
2891
2896
|
"attributes": [
|
|
2892
|
-
{
|
|
2893
|
-
"name": "hover",
|
|
2894
|
-
"description": "The drawer will expand open when hovered.",
|
|
2895
|
-
"values": []
|
|
2896
|
-
},
|
|
2897
2897
|
{
|
|
2898
2898
|
"name": "open",
|
|
2899
2899
|
"description": "Toggles whether the drawer is visible or not.",
|
|
@@ -2989,63 +2989,6 @@
|
|
|
2989
2989
|
],
|
|
2990
2990
|
"references": []
|
|
2991
2991
|
},
|
|
2992
|
-
{
|
|
2993
|
-
"name": "forge-list-item",
|
|
2994
|
-
"description": "List items are individual rows of content inside of a list.\n---\n\n\n### **Events:**\n - **forge-list-item-select** - Fires when the list item is selected.\n\n### **Slots:**\n - _default_ - The primary text.\n- **secondary-text** - The secondary text.\n- **tertiary-text** - The tertiary text.\n- **start** - The start content.\n- **end** - The end element.\n\n### **CSS Properties:**\n - **--forge-list-item-background** - The background color. _(default: undefined)_\n- **--forge-list-item-shape** - The shape of the list item. _(default: undefined)_\n- **--forge-list-item-padding** - The padding inside of the container element. _(default: undefined)_\n- **--forge-list-item-wrap-padding** - The padding inside of the container element when `wrap` is enabled. _(default: undefined)_\n- **--forge-list-item-margin** - The margin around the host element. _(default: undefined)_\n- **--forge-list-item-height** - The height of the container. _(default: undefined)_\n- **--forge-list-item-indent** - The margin inline state when in the indented state. _(default: undefined)_\n- **--forge-list-item-cursor** - The cursor when interactive. _(default: undefined)_\n- **--forge-list-item-gap** - The gap between the slotted content. _(default: undefined)_\n- **--forge-list-item-text-color** - The text color of the text. _(default: undefined)_\n- **--forge-list-item-text-font-size** - The font size of the text. _(default: undefined)_\n- **--forge-list-item-text-font-weight** - The font weight of the text. _(default: undefined)_\n- **--forge-list-item-text-line-height** - The line height of the text. _(default: undefined)_\n- **--forge-list-item-selected-color** - The foreground color when in the selected state. _(default: undefined)_\n- **--forge-list-item-selected-background** - The background color when in the selected state. _(default: undefined)_\n- **--forge-list-item-selected-opacity** - The opacity of the background color when in the selected state. _(default: undefined)_\n- **--forge-list-item-start-selected-color** - The color of the start content when in the selected state. _(default: undefined)_\n- **--forge-list-item-end-selected-color** - The color of the end content when in the selected state. _(default: undefined)_\n- **--forge-list-item-selected-text-color** - The color of the text when in the selected state. _(default: undefined)_\n- **--forge-list-item-disabled-opacity** - The opacity of the element when in the disabled state. _(default: undefined)_\n- **--forge-list-item-disabled-cursor** - The cursor when in the disabled state. _(default: undefined)_\n- **--forge-list-item-one-line-height** - The line height when in the one/single line state. _(default: undefined)_\n- **--forge-list-item-two-line-height** - The line height when in the two line state. _(default: undefined)_\n- **--forge-list-item-three-line-height** - The line height when in the three line state. _(default: undefined)_\n- **--forge-list-item-dense-one-line-height** - The line height when in the dense one/single line state. _(default: undefined)_\n- **--forge-list-item-dense-two-line-height** - The line height when in the dense two line state. _(default: undefined)_\n- **--forge-list-item-dense-three-line-height** - The line height when in the dense three line state. _(default: undefined)_\n- **--forge-list-item-dense-font-size** - The font size when in the dense state. _(default: undefined)_\n- **--forge-list-item-dense-indent** - The margin inline state when in the dense indented state. _(default: undefined)_\n- **--forge-list-item-dense-gap** - The gap between the slotted content when in the dense state. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root container element.\n- **text-container** - The container for the text content.\n- **focus-indicator** - The forwarded focus indicator's internal indicator element.\n- **state-layer** - The forwarded state layer's internal surface element.",
|
|
2995
|
-
"attributes": [
|
|
2996
|
-
{
|
|
2997
|
-
"name": "selected",
|
|
2998
|
-
"description": "Applies the selected state to the list item.",
|
|
2999
|
-
"values": []
|
|
3000
|
-
},
|
|
3001
|
-
{
|
|
3002
|
-
"name": "active",
|
|
3003
|
-
"description": "Applies the active state to the list item by emulating its focused state.",
|
|
3004
|
-
"values": []
|
|
3005
|
-
},
|
|
3006
|
-
{
|
|
3007
|
-
"name": "value",
|
|
3008
|
-
"description": "The unique value of the list item.",
|
|
3009
|
-
"values": []
|
|
3010
|
-
},
|
|
3011
|
-
{
|
|
3012
|
-
"name": "dense",
|
|
3013
|
-
"description": "Applies the dense state to the list item.",
|
|
3014
|
-
"values": []
|
|
3015
|
-
},
|
|
3016
|
-
{
|
|
3017
|
-
"name": "indented",
|
|
3018
|
-
"description": "Applies the indented state by adding margin to the start of the list item.",
|
|
3019
|
-
"values": []
|
|
3020
|
-
},
|
|
3021
|
-
{
|
|
3022
|
-
"name": "two-line",
|
|
3023
|
-
"description": "Sets the list item height to support at least two lines of text.",
|
|
3024
|
-
"values": []
|
|
3025
|
-
},
|
|
3026
|
-
{
|
|
3027
|
-
"name": "three-line",
|
|
3028
|
-
"description": "Sets the list item height to support at least three lines of text.",
|
|
3029
|
-
"values": []
|
|
3030
|
-
},
|
|
3031
|
-
{
|
|
3032
|
-
"name": "wrap",
|
|
3033
|
-
"description": "Sets the list item to wrap its text content.",
|
|
3034
|
-
"values": []
|
|
3035
|
-
},
|
|
3036
|
-
{
|
|
3037
|
-
"name": "noninteractive",
|
|
3038
|
-
"description": "Controls whether the list item will automatically attach itself to interactive slotted elements or not.",
|
|
3039
|
-
"values": []
|
|
3040
|
-
},
|
|
3041
|
-
{
|
|
3042
|
-
"name": "focus-propagation",
|
|
3043
|
-
"description": "Controls whether the interactive element will receive focus if a non-interactive element is clicked within the list item.",
|
|
3044
|
-
"values": []
|
|
3045
|
-
}
|
|
3046
|
-
],
|
|
3047
|
-
"references": []
|
|
3048
|
-
},
|
|
3049
2992
|
{
|
|
3050
2993
|
"name": "forge-meter",
|
|
3051
2994
|
"description": "Meters display a scalar value within a defined range.\n---\n\n\n### **Slots:**\n - _default_ - The default slot for the meter's label.\n- **value** - A textual representation of the meter's value.\n\n### **CSS Properties:**\n - **--forge-meter-background** - The background color of the meter. _(default: undefined)_\n- **--forge-meter-color** - The color of the meter's bar. _(default: undefined)_\n- **--forge-meter-height** - The block size of the meter. _(default: undefined)_\n- **--forge-meter-shape** - The border radius of the meter. _(default: undefined)_\n- **--forge-meter-bar-inner-shape** - The border radius of the meter's bar. _(default: undefined)_\n- **--forge-meter-tickmarks** - The number of tickmarks to display. _(default: undefined)_\n- **--forge-meter-tickmark-opacity** - The opacity of the tickmarks. _(default: undefined)_\n- **--forge-meter-transition-duration** - The duration of transitions. _(default: undefined)_\n- **--forge-meter-transition-timing** - The timing function of transitions. _(default: undefined)_\n- **--forge-theme-success** - The color of the bar when the value is optimal. _(default: undefined)_\n- **--forge-theme-success-container-low** - The color of the track when the value is optimal. _(default: undefined)_\n- **--forge-theme-warning** - The color of the bar when the value is suboptimal. _(default: undefined)_\n- **--forge-theme-warning-container-low** - The color of the track when the value is suboptimal. _(default: undefined)_\n- **--forge-theme-error** - The color of the bar when the value is least optimal. _(default: undefined)_\n- **--forge-theme-error-container-low** - The color of the track when the value is least optimal. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root container element.\n- **track** - The element comprising the meter's background.\n- **bar** - The bar representing the value.",
|
|
@@ -3128,6 +3071,63 @@
|
|
|
3128
3071
|
],
|
|
3129
3072
|
"references": []
|
|
3130
3073
|
},
|
|
3074
|
+
{
|
|
3075
|
+
"name": "forge-list-item",
|
|
3076
|
+
"description": "List items are individual rows of content inside of a list.\n---\n\n\n### **Events:**\n - **forge-list-item-select** - Fires when the list item is selected.\n\n### **Slots:**\n - _default_ - The primary text.\n- **secondary-text** - The secondary text.\n- **tertiary-text** - The tertiary text.\n- **start** - The start content.\n- **end** - The end element.\n\n### **CSS Properties:**\n - **--forge-list-item-background** - The background color. _(default: undefined)_\n- **--forge-list-item-shape** - The shape of the list item. _(default: undefined)_\n- **--forge-list-item-padding** - The padding inside of the container element. _(default: undefined)_\n- **--forge-list-item-wrap-padding** - The padding inside of the container element when `wrap` is enabled. _(default: undefined)_\n- **--forge-list-item-margin** - The margin around the host element. _(default: undefined)_\n- **--forge-list-item-height** - The height of the container. _(default: undefined)_\n- **--forge-list-item-indent** - The margin inline state when in the indented state. _(default: undefined)_\n- **--forge-list-item-cursor** - The cursor when interactive. _(default: undefined)_\n- **--forge-list-item-gap** - The gap between the slotted content. _(default: undefined)_\n- **--forge-list-item-text-color** - The text color of the text. _(default: undefined)_\n- **--forge-list-item-text-font-size** - The font size of the text. _(default: undefined)_\n- **--forge-list-item-text-font-weight** - The font weight of the text. _(default: undefined)_\n- **--forge-list-item-text-line-height** - The line height of the text. _(default: undefined)_\n- **--forge-list-item-selected-color** - The foreground color when in the selected state. _(default: undefined)_\n- **--forge-list-item-selected-background** - The background color when in the selected state. _(default: undefined)_\n- **--forge-list-item-selected-opacity** - The opacity of the background color when in the selected state. _(default: undefined)_\n- **--forge-list-item-start-selected-color** - The color of the start content when in the selected state. _(default: undefined)_\n- **--forge-list-item-end-selected-color** - The color of the end content when in the selected state. _(default: undefined)_\n- **--forge-list-item-selected-text-color** - The color of the text when in the selected state. _(default: undefined)_\n- **--forge-list-item-disabled-opacity** - The opacity of the element when in the disabled state. _(default: undefined)_\n- **--forge-list-item-disabled-cursor** - The cursor when in the disabled state. _(default: undefined)_\n- **--forge-list-item-one-line-height** - The line height when in the one/single line state. _(default: undefined)_\n- **--forge-list-item-two-line-height** - The line height when in the two line state. _(default: undefined)_\n- **--forge-list-item-three-line-height** - The line height when in the three line state. _(default: undefined)_\n- **--forge-list-item-dense-one-line-height** - The line height when in the dense one/single line state. _(default: undefined)_\n- **--forge-list-item-dense-two-line-height** - The line height when in the dense two line state. _(default: undefined)_\n- **--forge-list-item-dense-three-line-height** - The line height when in the dense three line state. _(default: undefined)_\n- **--forge-list-item-dense-font-size** - The font size when in the dense state. _(default: undefined)_\n- **--forge-list-item-dense-indent** - The margin inline state when in the dense indented state. _(default: undefined)_\n- **--forge-list-item-dense-gap** - The gap between the slotted content when in the dense state. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root container element.\n- **text-container** - The container for the text content.\n- **focus-indicator** - The forwarded focus indicator's internal indicator element.\n- **state-layer** - The forwarded state layer's internal surface element.",
|
|
3077
|
+
"attributes": [
|
|
3078
|
+
{
|
|
3079
|
+
"name": "selected",
|
|
3080
|
+
"description": "Applies the selected state to the list item.",
|
|
3081
|
+
"values": []
|
|
3082
|
+
},
|
|
3083
|
+
{
|
|
3084
|
+
"name": "active",
|
|
3085
|
+
"description": "Applies the active state to the list item by emulating its focused state.",
|
|
3086
|
+
"values": []
|
|
3087
|
+
},
|
|
3088
|
+
{
|
|
3089
|
+
"name": "value",
|
|
3090
|
+
"description": "The unique value of the list item.",
|
|
3091
|
+
"values": []
|
|
3092
|
+
},
|
|
3093
|
+
{
|
|
3094
|
+
"name": "dense",
|
|
3095
|
+
"description": "Applies the dense state to the list item.",
|
|
3096
|
+
"values": []
|
|
3097
|
+
},
|
|
3098
|
+
{
|
|
3099
|
+
"name": "indented",
|
|
3100
|
+
"description": "Applies the indented state by adding margin to the start of the list item.",
|
|
3101
|
+
"values": []
|
|
3102
|
+
},
|
|
3103
|
+
{
|
|
3104
|
+
"name": "two-line",
|
|
3105
|
+
"description": "Sets the list item height to support at least two lines of text.",
|
|
3106
|
+
"values": []
|
|
3107
|
+
},
|
|
3108
|
+
{
|
|
3109
|
+
"name": "three-line",
|
|
3110
|
+
"description": "Sets the list item height to support at least three lines of text.",
|
|
3111
|
+
"values": []
|
|
3112
|
+
},
|
|
3113
|
+
{
|
|
3114
|
+
"name": "wrap",
|
|
3115
|
+
"description": "Sets the list item to wrap its text content.",
|
|
3116
|
+
"values": []
|
|
3117
|
+
},
|
|
3118
|
+
{
|
|
3119
|
+
"name": "noninteractive",
|
|
3120
|
+
"description": "Controls whether the list item will automatically attach itself to interactive slotted elements or not.",
|
|
3121
|
+
"values": []
|
|
3122
|
+
},
|
|
3123
|
+
{
|
|
3124
|
+
"name": "focus-propagation",
|
|
3125
|
+
"description": "Controls whether the interactive element will receive focus if a non-interactive element is clicked within the list item.",
|
|
3126
|
+
"values": []
|
|
3127
|
+
}
|
|
3128
|
+
],
|
|
3129
|
+
"references": []
|
|
3130
|
+
},
|
|
3131
3131
|
{
|
|
3132
3132
|
"name": "forge-meter-group",
|
|
3133
3133
|
"description": "Meter groups display several meters together on one track.\n---\n\n\n### **Slots:**\n - _default_ - The default slot for grouped `<forge-meter>` elements.\n- **label** - Positions a label above the meter group.\n- **value** - A textual representation of the meter's value.\n\n### **CSS Properties:**\n - **--forge-meter-group-background** - The background color of the meter group. _(default: undefined)_\n- **--forge-meter-group-height** - The block size of the meter group. _(default: undefined)_\n- **--forge-meter-group-shape** - The border radius of the meter group. _(default: undefined)_\n- **--forge-meter-group-tickmarks** - The number of tickmarks to display. _(default: undefined)_\n- **--forge-meter-group-tickmark-color** - The color of the tickmarks. _(default: undefined)_\n- **--forge-meter-group-tickmark-opacity** - The opacity of the tickmarks. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root container element.\n- **track** - The element comprising the meter group's background.",
|