@emuanalytics/flow-rdf-ui 0.0.14 → 0.0.16

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.
@@ -4,342 +4,235 @@
4
4
  "modules": [
5
5
  {
6
6
  "kind": "javascript-module",
7
- "path": "components/animation/animation.js",
7
+ "path": "components/alert/alert.js",
8
8
  "declarations": [
9
9
  {
10
10
  "kind": "class",
11
11
  "description": "",
12
- "name": "FlowAnimation",
13
- "slots": [
14
- {
15
- "description": "The element to animate. Avoid slotting in more than one element, as subsequent ones will be ignored. To animate multiple elements, either wrap them in a single container or use multiple `<flow-ui-animation>` elements.",
16
- "name": ""
17
- }
18
- ],
19
- "members": [
12
+ "name": "FlowAlert",
13
+ "cssParts": [
20
14
  {
21
- "kind": "field",
22
- "name": "animation",
23
- "type": {
24
- "text": "Animation | undefined"
25
- },
26
- "privacy": "private"
15
+ "description": "The component's base wrapper.",
16
+ "name": "base"
27
17
  },
28
18
  {
29
- "kind": "field",
30
- "name": "hasStarted",
31
- "type": {
32
- "text": "boolean"
33
- },
34
- "privacy": "private",
35
- "default": "false"
19
+ "description": "The container that wraps the optional icon.",
20
+ "name": "icon"
36
21
  },
37
22
  {
38
- "kind": "field",
39
- "name": "defaultSlot",
40
- "type": {
41
- "text": "Promise<HTMLSlotElement>"
42
- }
23
+ "description": "The container that wraps the alert's main content.",
24
+ "name": "message"
43
25
  },
44
26
  {
45
- "kind": "field",
46
- "name": "name",
47
- "type": {
48
- "text": "string"
49
- },
50
- "default": "'none'",
51
- "description": "The name of the built-in animation to use. For custom animations, use the `keyframes` prop.",
52
- "attribute": "name"
27
+ "description": "The close button, an `<flow-ui-icon-button>`.",
28
+ "name": "close-button"
53
29
  },
54
30
  {
55
- "kind": "field",
56
- "name": "play",
57
- "type": {
58
- "text": "boolean"
59
- },
60
- "default": "false",
61
- "description": "Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when\nthe animation finishes or gets canceled.",
62
- "attribute": "play",
63
- "reflects": true
64
- },
31
+ "description": "The close button's exported `base` part.",
32
+ "name": "close-button__base"
33
+ }
34
+ ],
35
+ "slots": [
65
36
  {
66
- "kind": "field",
67
- "name": "delay",
68
- "type": {
69
- "text": "number"
70
- },
71
- "default": "0",
72
- "description": "The number of milliseconds to delay the start of the animation.",
73
- "attribute": "delay"
37
+ "description": "The alert's main content.",
38
+ "name": ""
74
39
  },
75
40
  {
76
- "kind": "field",
77
- "name": "direction",
78
- "type": {
79
- "text": "PlaybackDirection"
80
- },
81
- "default": "'normal'",
82
- "description": "Determines the direction of playback as well as the behavior when reaching the end of an iteration.\n[Learn more](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction)",
83
- "attribute": "direction"
84
- },
41
+ "description": "An icon to show in the alert. Works best with `<flow-ui-icon>`.",
42
+ "name": "icon"
43
+ }
44
+ ],
45
+ "members": [
85
46
  {
86
47
  "kind": "field",
87
- "name": "duration",
48
+ "name": "autoHideTimeout",
88
49
  "type": {
89
50
  "text": "number"
90
51
  },
91
- "default": "1000",
92
- "description": "The number of milliseconds each iteration of the animation takes to complete.",
93
- "attribute": "duration"
52
+ "privacy": "private"
94
53
  },
95
54
  {
96
55
  "kind": "field",
97
- "name": "easing",
98
- "type": {
99
- "text": "string"
100
- },
101
- "default": "'linear'",
102
- "description": "The easing function to use for the animation. This can be a Flo.w RDF UI easing function or a custom easing function\nsuch as `cubic-bezier(0, 1, .76, 1.14)`.",
103
- "attribute": "easing"
56
+ "name": "hasSlotController",
57
+ "privacy": "private",
58
+ "readonly": true,
59
+ "default": "new HasSlotController(this, 'icon', 'suffix')"
104
60
  },
105
61
  {
106
62
  "kind": "field",
107
- "name": "endDelay",
108
- "type": {
109
- "text": "number"
110
- },
111
- "default": "0",
112
- "description": "The number of milliseconds to delay after the active period of an animation sequence.",
113
- "attribute": "end-delay"
63
+ "name": "localize",
64
+ "privacy": "private",
65
+ "readonly": true,
66
+ "default": "new LocalizeController(this)"
114
67
  },
115
68
  {
116
69
  "kind": "field",
117
- "name": "fill",
70
+ "name": "base",
118
71
  "type": {
119
- "text": "FillMode"
120
- },
121
- "default": "'auto'",
122
- "description": "Sets how the animation applies styles to its target before and after its execution.",
123
- "attribute": "fill"
124
- },
125
- {
126
- "kind": "field",
127
- "name": "iterations",
128
- "default": "Infinity",
129
- "description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
130
- "attribute": "iterations"
72
+ "text": "HTMLElement"
73
+ }
131
74
  },
132
75
  {
133
76
  "kind": "field",
134
- "name": "iterationStart",
77
+ "name": "open",
135
78
  "type": {
136
- "text": "number"
79
+ "text": "boolean"
137
80
  },
138
- "default": "0",
139
- "description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
140
- "attribute": "iteration-start"
81
+ "default": "false",
82
+ "description": "Indicates whether or not the alert is open. You can toggle this attribute to show and hide the alert, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the alert's open state.",
83
+ "attribute": "open",
84
+ "reflects": true
141
85
  },
142
86
  {
143
87
  "kind": "field",
144
- "name": "keyframes",
88
+ "name": "closable",
145
89
  "type": {
146
- "text": "Keyframe[] | undefined"
90
+ "text": "boolean"
147
91
  },
148
- "description": "The keyframes to use for the animation. If this is set, `name` will be ignored."
92
+ "default": "false",
93
+ "description": "Enables a close button that allows the user to dismiss the alert.",
94
+ "attribute": "closable",
95
+ "reflects": true
149
96
  },
150
97
  {
151
98
  "kind": "field",
152
- "name": "playbackRate",
99
+ "name": "variant",
153
100
  "type": {
154
- "text": "number"
101
+ "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
155
102
  },
156
- "default": "1",
157
- "description": "Sets the animation's playback rate. The default is `1`, which plays the animation at a normal speed. Setting this\nto `2`, for example, will double the animation's speed. A negative value can be used to reverse the animation. This\nvalue can be changed without causing the animation to restart.",
158
- "attribute": "playback-rate"
103
+ "default": "'primary'",
104
+ "description": "The alert's theme variant.",
105
+ "attribute": "variant",
106
+ "reflects": true
159
107
  },
160
108
  {
161
109
  "kind": "field",
162
- "name": "currentTime",
163
- "type": {
164
- "text": "number"
165
- },
166
- "description": "Gets and sets the current animation time."
167
- },
168
- {
169
- "kind": "method",
170
- "name": "handleAnimationFinish",
171
- "privacy": "private"
172
- },
173
- {
174
- "kind": "method",
175
- "name": "handleAnimationCancel",
176
- "privacy": "private"
110
+ "name": "duration",
111
+ "default": "Infinity",
112
+ "description": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with\nthe alert before it closes (e.g. moves the mouse over it), the timer will restart. Defaults to `Infinity`, meaning\nthe alert will not close on its own.",
113
+ "attribute": "duration"
177
114
  },
178
115
  {
179
116
  "kind": "method",
180
- "name": "handleSlotChange",
117
+ "name": "restartAutoHide",
181
118
  "privacy": "private"
182
119
  },
183
120
  {
184
121
  "kind": "method",
185
- "name": "createAnimation",
122
+ "name": "handleCloseClick",
186
123
  "privacy": "private"
187
124
  },
188
125
  {
189
126
  "kind": "method",
190
- "name": "destroyAnimation",
127
+ "name": "handleMouseMove",
191
128
  "privacy": "private"
192
129
  },
193
130
  {
194
131
  "kind": "method",
195
- "name": "handleAnimationChange"
132
+ "name": "handleOpenChange"
196
133
  },
197
134
  {
198
135
  "kind": "method",
199
- "name": "handlePlayChange"
136
+ "name": "handleDurationChange"
200
137
  },
201
138
  {
202
139
  "kind": "method",
203
- "name": "handlePlaybackRateChange"
140
+ "name": "show",
141
+ "description": "Shows the alert."
204
142
  },
205
143
  {
206
144
  "kind": "method",
207
- "name": "cancel",
208
- "description": "Clears all keyframe effects caused by this animation and aborts its playback."
145
+ "name": "hide",
146
+ "description": "Hides the alert"
209
147
  },
210
148
  {
211
149
  "kind": "method",
212
- "name": "finish",
213
- "description": "Sets the playback time to the end of the animation corresponding to the current playback direction."
150
+ "name": "toast",
151
+ "description": "Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\ndismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\ncalling this method again. The returned promise will resolve after the alert is hidden."
214
152
  }
215
153
  ],
216
154
  "events": [
217
155
  {
218
- "description": "Emitted when the animation is canceled.",
219
- "name": "flow-ui-cancel",
220
- "reactName": "onFlowUiCancel"
156
+ "description": "Emitted when the alert opens.",
157
+ "name": "flow-ui-show",
158
+ "reactName": "onFlowUiShow"
221
159
  },
222
160
  {
223
- "description": "Emitted when the animation finishes.",
224
- "name": "flow-ui-finish",
225
- "reactName": "onFlowUiFinish"
161
+ "description": "Emitted after the alert opens and all animations are complete.",
162
+ "name": "flow-ui-after-show",
163
+ "reactName": "onFlowUiAfterShow"
226
164
  },
227
165
  {
228
- "description": "Emitted when the animation starts or restarts.",
229
- "name": "flow-ui-start",
230
- "reactName": "onFlowUiStart"
166
+ "description": "Emitted when the alert closes.",
167
+ "name": "flow-ui-hide",
168
+ "reactName": "onFlowUiHide"
169
+ },
170
+ {
171
+ "description": "Emitted after the alert closes and all animations are complete.",
172
+ "name": "flow-ui-after-hide",
173
+ "reactName": "onFlowUiAfterHide"
231
174
  }
232
175
  ],
233
176
  "attributes": [
234
177
  {
235
- "name": "name",
178
+ "name": "open",
236
179
  "type": {
237
- "text": "string"
180
+ "text": "boolean"
238
181
  },
239
- "default": "'none'",
240
- "description": "The name of the built-in animation to use. For custom animations, use the `keyframes` prop.",
241
- "fieldName": "name"
182
+ "default": "false",
183
+ "description": "Indicates whether or not the alert is open. You can toggle this attribute to show and hide the alert, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the alert's open state.",
184
+ "fieldName": "open"
242
185
  },
243
186
  {
244
- "name": "play",
187
+ "name": "closable",
245
188
  "type": {
246
189
  "text": "boolean"
247
190
  },
248
191
  "default": "false",
249
- "description": "Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when\nthe animation finishes or gets canceled.",
250
- "fieldName": "play"
192
+ "description": "Enables a close button that allows the user to dismiss the alert.",
193
+ "fieldName": "closable"
251
194
  },
252
195
  {
253
- "name": "delay",
196
+ "name": "variant",
254
197
  "type": {
255
- "text": "number"
198
+ "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
256
199
  },
257
- "default": "0",
258
- "description": "The number of milliseconds to delay the start of the animation.",
259
- "fieldName": "delay"
260
- },
261
- {
262
- "name": "direction",
263
- "type": {
264
- "text": "PlaybackDirection"
265
- },
266
- "default": "'normal'",
267
- "description": "Determines the direction of playback as well as the behavior when reaching the end of an iteration.\n[Learn more](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction)",
268
- "fieldName": "direction"
200
+ "default": "'primary'",
201
+ "description": "The alert's theme variant.",
202
+ "fieldName": "variant"
269
203
  },
270
204
  {
271
205
  "name": "duration",
272
- "type": {
273
- "text": "number"
274
- },
275
- "default": "1000",
276
- "description": "The number of milliseconds each iteration of the animation takes to complete.",
277
- "fieldName": "duration"
278
- },
279
- {
280
- "name": "easing",
281
- "type": {
282
- "text": "string"
283
- },
284
- "default": "'linear'",
285
- "description": "The easing function to use for the animation. This can be a Flo.w RDF UI easing function or a custom easing function\nsuch as `cubic-bezier(0, 1, .76, 1.14)`.",
286
- "fieldName": "easing"
287
- },
288
- {
289
- "name": "end-delay",
290
- "type": {
291
- "text": "number"
292
- },
293
- "default": "0",
294
- "description": "The number of milliseconds to delay after the active period of an animation sequence.",
295
- "fieldName": "endDelay"
296
- },
297
- {
298
- "name": "fill",
299
- "type": {
300
- "text": "FillMode"
301
- },
302
- "default": "'auto'",
303
- "description": "Sets how the animation applies styles to its target before and after its execution.",
304
- "fieldName": "fill"
305
- },
306
- {
307
- "name": "iterations",
308
206
  "default": "Infinity",
309
- "description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
207
+ "description": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with\nthe alert before it closes (e.g. moves the mouse over it), the timer will restart. Defaults to `Infinity`, meaning\nthe alert will not close on its own.",
310
208
  "resolveInitializer": {
311
- "module": "src/components/animation/animation.ts"
312
- },
313
- "fieldName": "iterations"
314
- },
315
- {
316
- "name": "iteration-start",
317
- "type": {
318
- "text": "number"
319
- },
320
- "default": "0",
321
- "description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
322
- "fieldName": "iterationStart"
323
- },
324
- {
325
- "name": "playback-rate",
326
- "type": {
327
- "text": "number"
209
+ "module": "src/components/alert/alert.ts"
328
210
  },
329
- "default": "1",
330
- "description": "Sets the animation's playback rate. The default is `1`, which plays the animation at a normal speed. Setting this\nto `2`, for example, will double the animation's speed. A negative value can be used to reverse the animation. This\nvalue can be changed without causing the animation to restart.",
331
- "fieldName": "playbackRate"
211
+ "fieldName": "duration"
332
212
  }
333
213
  ],
334
214
  "superclass": {
335
215
  "name": "FlowRdfElement",
336
216
  "module": "/src/internal/flow-ui-rdf-element"
337
217
  },
338
- "summary": "Animate elements declaratively with nearly 100 baked-in presets, or roll your own with custom keyframes. Powered by the [Web Animations API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API).",
339
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/animation",
218
+ "summary": "Alerts are used to display important messages inline or as toast notifications.",
219
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/alert",
340
220
  "status": "stable",
341
221
  "since": "2.0",
342
- "tagName": "flow-ui-animation",
222
+ "dependencies": [
223
+ "flow-ui-icon-button"
224
+ ],
225
+ "animations": [
226
+ {
227
+ "name": "alert.show",
228
+ "description": "The animation to use when showing the alert."
229
+ },
230
+ {
231
+ "name": "alert.hide",
232
+ "description": "The animation to use when hiding the alert."
233
+ }
234
+ ],
235
+ "tagName": "flow-ui-alert",
343
236
  "customElement": true
344
237
  }
345
238
  ],
@@ -348,308 +241,183 @@
348
241
  "kind": "js",
349
242
  "name": "default",
350
243
  "declaration": {
351
- "name": "FlowAnimation",
352
- "module": "components/animation/animation.js"
244
+ "name": "FlowAlert",
245
+ "module": "components/alert/alert.js"
353
246
  }
354
247
  },
355
248
  {
356
249
  "kind": "custom-element-definition",
357
- "name": "flow-ui-animation",
358
- "declaration": {
359
- "name": "FlowAnimation",
360
- "module": "components/animation/animation.js"
361
- }
362
- }
363
- ]
364
- },
365
- {
366
- "kind": "javascript-module",
367
- "path": "components/animation/animations.js",
368
- "declarations": [
369
- {
370
- "kind": "function",
371
- "name": "getAnimationNames",
372
- "description": "Gets a list of all supported animation names."
373
- },
374
- {
375
- "kind": "function",
376
- "name": "getEasingNames",
377
- "description": "Gets a list of all supported easing function names."
378
- }
379
- ],
380
- "exports": [
381
- {
382
- "kind": "js",
383
- "name": "animations",
384
- "declaration": {
385
- "name": "animations",
386
- "module": "components/animation/animations.js"
387
- }
388
- },
389
- {
390
- "kind": "js",
391
- "name": "getAnimationNames",
392
- "declaration": {
393
- "name": "getAnimationNames",
394
- "module": "components/animation/animations.js"
395
- }
396
- },
397
- {
398
- "kind": "js",
399
- "name": "getEasingNames",
400
- "declaration": {
401
- "name": "getEasingNames",
402
- "module": "components/animation/animations.js"
403
- }
404
- }
405
- ]
406
- },
407
- {
408
- "kind": "javascript-module",
409
- "path": "components/animation/index.js",
410
- "declarations": [],
411
- "exports": [
412
- {
413
- "kind": "js",
414
- "name": "FlowAnimation",
250
+ "name": "flow-ui-alert",
415
251
  "declaration": {
416
- "name": "default",
417
- "module": "./animation"
252
+ "name": "FlowAlert",
253
+ "module": "components/alert/alert.js"
418
254
  }
419
255
  }
420
256
  ]
421
257
  },
422
258
  {
423
259
  "kind": "javascript-module",
424
- "path": "components/alert/alert.js",
260
+ "path": "components/avatar/avatar.js",
425
261
  "declarations": [
426
262
  {
427
263
  "kind": "class",
428
264
  "description": "",
429
- "name": "FlowAlert",
265
+ "name": "FlowAvatar",
266
+ "cssProperties": [
267
+ {
268
+ "description": "The size of the avatar.",
269
+ "name": "--size"
270
+ }
271
+ ],
430
272
  "cssParts": [
431
273
  {
432
274
  "description": "The component's base wrapper.",
433
275
  "name": "base"
434
276
  },
435
277
  {
436
- "description": "The container that wraps the optional icon.",
278
+ "description": "The container that wraps the avatar's icon.",
437
279
  "name": "icon"
438
280
  },
439
281
  {
440
- "description": "The container that wraps the alert's main content.",
441
- "name": "message"
442
- },
443
- {
444
- "description": "The close button, an `<flow-ui-icon-button>`.",
445
- "name": "close-button"
282
+ "description": "The container that wraps the avatar's initials.",
283
+ "name": "initials"
446
284
  },
447
285
  {
448
- "description": "The close button's exported `base` part.",
449
- "name": "close-button__base"
286
+ "description": "The avatar image. Only shown when the `image` attribute is set.",
287
+ "name": "image"
450
288
  }
451
289
  ],
452
290
  "slots": [
453
291
  {
454
- "description": "The alert's main content.",
455
- "name": ""
456
- },
457
- {
458
- "description": "An icon to show in the alert. Works best with `<flow-ui-icon>`.",
292
+ "description": "The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.",
459
293
  "name": "icon"
460
294
  }
461
295
  ],
462
296
  "members": [
463
297
  {
464
298
  "kind": "field",
465
- "name": "autoHideTimeout",
299
+ "name": "hasError",
466
300
  "type": {
467
- "text": "number"
301
+ "text": "boolean"
468
302
  },
469
- "privacy": "private"
470
- },
471
- {
472
- "kind": "field",
473
- "name": "hasSlotController",
474
303
  "privacy": "private",
475
- "readonly": true,
476
- "default": "new HasSlotController(this, 'icon', 'suffix')"
304
+ "default": "false"
477
305
  },
478
306
  {
479
307
  "kind": "field",
480
- "name": "localize",
481
- "privacy": "private",
482
- "readonly": true,
483
- "default": "new LocalizeController(this)"
308
+ "name": "image",
309
+ "type": {
310
+ "text": "string"
311
+ },
312
+ "default": "''",
313
+ "description": "The image source to use for the avatar.",
314
+ "attribute": "image"
484
315
  },
485
316
  {
486
317
  "kind": "field",
487
- "name": "base",
318
+ "name": "label",
488
319
  "type": {
489
- "text": "HTMLElement"
490
- }
320
+ "text": "string"
321
+ },
322
+ "default": "''",
323
+ "description": "A label to use to describe the avatar to assistive devices.",
324
+ "attribute": "label"
491
325
  },
492
326
  {
493
327
  "kind": "field",
494
- "name": "open",
328
+ "name": "initials",
495
329
  "type": {
496
- "text": "boolean"
330
+ "text": "string"
497
331
  },
498
- "default": "false",
499
- "description": "Indicates whether or not the alert is open. You can toggle this attribute to show and hide the alert, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the alert's open state.",
500
- "attribute": "open",
501
- "reflects": true
332
+ "default": "''",
333
+ "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
334
+ "attribute": "initials"
502
335
  },
503
336
  {
504
337
  "kind": "field",
505
- "name": "closable",
338
+ "name": "loading",
506
339
  "type": {
507
- "text": "boolean"
340
+ "text": "'eager' | 'lazy'"
508
341
  },
509
- "default": "false",
510
- "description": "Enables a close button that allows the user to dismiss the alert.",
511
- "attribute": "closable",
512
- "reflects": true
342
+ "default": "'eager'",
343
+ "description": "Indicates how the browser should load the image.",
344
+ "attribute": "loading"
513
345
  },
514
346
  {
515
347
  "kind": "field",
516
- "name": "variant",
348
+ "name": "shape",
517
349
  "type": {
518
- "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
350
+ "text": "'circle' | 'square' | 'rounded'"
519
351
  },
520
- "default": "'primary'",
521
- "description": "The alert's theme variant.",
522
- "attribute": "variant",
352
+ "default": "'circle'",
353
+ "description": "The shape of the avatar.",
354
+ "attribute": "shape",
523
355
  "reflects": true
524
356
  },
525
- {
526
- "kind": "field",
527
- "name": "duration",
528
- "default": "Infinity",
529
- "description": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with\nthe alert before it closes (e.g. moves the mouse over it), the timer will restart. Defaults to `Infinity`, meaning\nthe alert will not close on its own.",
530
- "attribute": "duration"
531
- },
532
357
  {
533
358
  "kind": "method",
534
- "name": "restartAutoHide",
535
- "privacy": "private"
536
- },
359
+ "name": "handleImageChange"
360
+ }
361
+ ],
362
+ "attributes": [
537
363
  {
538
- "kind": "method",
539
- "name": "handleCloseClick",
540
- "privacy": "private"
541
- },
542
- {
543
- "kind": "method",
544
- "name": "handleMouseMove",
545
- "privacy": "private"
546
- },
547
- {
548
- "kind": "method",
549
- "name": "handleOpenChange"
550
- },
551
- {
552
- "kind": "method",
553
- "name": "handleDurationChange"
554
- },
555
- {
556
- "kind": "method",
557
- "name": "show",
558
- "description": "Shows the alert."
559
- },
560
- {
561
- "kind": "method",
562
- "name": "hide",
563
- "description": "Hides the alert"
564
- },
565
- {
566
- "kind": "method",
567
- "name": "toast",
568
- "description": "Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\ndismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\ncalling this method again. The returned promise will resolve after the alert is hidden."
569
- }
570
- ],
571
- "events": [
572
- {
573
- "description": "Emitted when the alert opens.",
574
- "name": "flow-ui-show",
575
- "reactName": "onFlowUiShow"
576
- },
577
- {
578
- "description": "Emitted after the alert opens and all animations are complete.",
579
- "name": "flow-ui-after-show",
580
- "reactName": "onFlowUiAfterShow"
581
- },
582
- {
583
- "description": "Emitted when the alert closes.",
584
- "name": "flow-ui-hide",
585
- "reactName": "onFlowUiHide"
364
+ "name": "image",
365
+ "type": {
366
+ "text": "string"
367
+ },
368
+ "default": "''",
369
+ "description": "The image source to use for the avatar.",
370
+ "fieldName": "image"
586
371
  },
587
372
  {
588
- "description": "Emitted after the alert closes and all animations are complete.",
589
- "name": "flow-ui-after-hide",
590
- "reactName": "onFlowUiAfterHide"
591
- }
592
- ],
593
- "attributes": [
594
- {
595
- "name": "open",
373
+ "name": "label",
596
374
  "type": {
597
- "text": "boolean"
375
+ "text": "string"
598
376
  },
599
- "default": "false",
600
- "description": "Indicates whether or not the alert is open. You can toggle this attribute to show and hide the alert, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the alert's open state.",
601
- "fieldName": "open"
377
+ "default": "''",
378
+ "description": "A label to use to describe the avatar to assistive devices.",
379
+ "fieldName": "label"
602
380
  },
603
381
  {
604
- "name": "closable",
382
+ "name": "initials",
605
383
  "type": {
606
- "text": "boolean"
384
+ "text": "string"
607
385
  },
608
- "default": "false",
609
- "description": "Enables a close button that allows the user to dismiss the alert.",
610
- "fieldName": "closable"
386
+ "default": "''",
387
+ "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
388
+ "fieldName": "initials"
611
389
  },
612
390
  {
613
- "name": "variant",
391
+ "name": "loading",
614
392
  "type": {
615
- "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
393
+ "text": "'eager' | 'lazy'"
616
394
  },
617
- "default": "'primary'",
618
- "description": "The alert's theme variant.",
619
- "fieldName": "variant"
395
+ "default": "'eager'",
396
+ "description": "Indicates how the browser should load the image.",
397
+ "fieldName": "loading"
620
398
  },
621
399
  {
622
- "name": "duration",
623
- "default": "Infinity",
624
- "description": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with\nthe alert before it closes (e.g. moves the mouse over it), the timer will restart. Defaults to `Infinity`, meaning\nthe alert will not close on its own.",
625
- "resolveInitializer": {
626
- "module": "src/components/alert/alert.ts"
400
+ "name": "shape",
401
+ "type": {
402
+ "text": "'circle' | 'square' | 'rounded'"
627
403
  },
628
- "fieldName": "duration"
404
+ "default": "'circle'",
405
+ "description": "The shape of the avatar.",
406
+ "fieldName": "shape"
629
407
  }
630
408
  ],
631
409
  "superclass": {
632
410
  "name": "FlowRdfElement",
633
411
  "module": "/src/internal/flow-ui-rdf-element"
634
412
  },
635
- "summary": "Alerts are used to display important messages inline or as toast notifications.",
636
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/alert",
413
+ "summary": "Avatars are used to represent a person or object.",
414
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/avatar",
637
415
  "status": "stable",
638
416
  "since": "2.0",
639
417
  "dependencies": [
640
- "flow-ui-icon-button"
641
- ],
642
- "animations": [
643
- {
644
- "name": "alert.show",
645
- "description": "The animation to use when showing the alert."
646
- },
647
- {
648
- "name": "alert.hide",
649
- "description": "The animation to use when hiding the alert."
650
- }
418
+ "flow-ui-icon"
651
419
  ],
652
- "tagName": "flow-ui-alert",
420
+ "tagName": "flow-ui-avatar",
653
421
  "customElement": true
654
422
  }
655
423
  ],
@@ -658,443 +426,358 @@
658
426
  "kind": "js",
659
427
  "name": "default",
660
428
  "declaration": {
661
- "name": "FlowAlert",
662
- "module": "components/alert/alert.js"
429
+ "name": "FlowAvatar",
430
+ "module": "components/avatar/avatar.js"
663
431
  }
664
432
  },
665
433
  {
666
434
  "kind": "custom-element-definition",
667
- "name": "flow-ui-alert",
435
+ "name": "flow-ui-avatar",
668
436
  "declaration": {
669
- "name": "FlowAlert",
670
- "module": "components/alert/alert.js"
437
+ "name": "FlowAvatar",
438
+ "module": "components/avatar/avatar.js"
671
439
  }
672
440
  }
673
441
  ]
674
442
  },
675
443
  {
676
444
  "kind": "javascript-module",
677
- "path": "components/breadcrumb/breadcrumb.js",
445
+ "path": "components/animation/animation.js",
678
446
  "declarations": [
679
447
  {
680
448
  "kind": "class",
681
449
  "description": "",
682
- "name": "FlowBreadcrumb",
683
- "cssParts": [
684
- {
685
- "description": "The component's base wrapper.",
686
- "name": "base"
687
- }
688
- ],
450
+ "name": "FlowAnimation",
689
451
  "slots": [
690
452
  {
691
- "description": "One or more breadcrumb items to display.",
453
+ "description": "The element to animate. Avoid slotting in more than one element, as subsequent ones will be ignored. To animate multiple elements, either wrap them in a single container or use multiple `<flow-ui-animation>` elements.",
692
454
  "name": ""
693
- },
694
- {
695
- "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
696
- "name": "separator"
697
455
  }
698
456
  ],
699
457
  "members": [
700
458
  {
701
459
  "kind": "field",
702
- "name": "localize",
703
- "privacy": "private",
704
- "readonly": true,
705
- "default": "new LocalizeController(this)"
460
+ "name": "animation",
461
+ "type": {
462
+ "text": "Animation | undefined"
463
+ },
464
+ "privacy": "private"
706
465
  },
707
466
  {
708
467
  "kind": "field",
709
- "name": "separatorDir",
710
- "privacy": "private"
468
+ "name": "hasStarted",
469
+ "type": {
470
+ "text": "boolean"
471
+ },
472
+ "privacy": "private",
473
+ "default": "false"
711
474
  },
712
475
  {
713
476
  "kind": "field",
714
477
  "name": "defaultSlot",
715
478
  "type": {
716
- "text": "HTMLSlotElement"
479
+ "text": "Promise<HTMLSlotElement>"
717
480
  }
718
481
  },
719
482
  {
720
483
  "kind": "field",
721
- "name": "separatorSlot",
484
+ "name": "name",
722
485
  "type": {
723
- "text": "HTMLSlotElement"
724
- }
486
+ "text": "string"
487
+ },
488
+ "default": "'none'",
489
+ "description": "The name of the built-in animation to use. For custom animations, use the `keyframes` prop.",
490
+ "attribute": "name"
725
491
  },
726
492
  {
727
493
  "kind": "field",
728
- "name": "label",
494
+ "name": "play",
729
495
  "type": {
730
- "text": "string"
496
+ "text": "boolean"
731
497
  },
732
- "default": "''",
733
- "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
734
- "attribute": "label"
498
+ "default": "false",
499
+ "description": "Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when\nthe animation finishes or gets canceled.",
500
+ "attribute": "play",
501
+ "reflects": true
735
502
  },
736
503
  {
737
- "kind": "method",
738
- "name": "getSeparator",
739
- "privacy": "private"
504
+ "kind": "field",
505
+ "name": "delay",
506
+ "type": {
507
+ "text": "number"
508
+ },
509
+ "default": "0",
510
+ "description": "The number of milliseconds to delay the start of the animation.",
511
+ "attribute": "delay"
740
512
  },
741
513
  {
742
- "kind": "method",
743
- "name": "handleSlotChange",
744
- "privacy": "private"
745
- }
746
- ],
747
- "attributes": [
514
+ "kind": "field",
515
+ "name": "direction",
516
+ "type": {
517
+ "text": "PlaybackDirection"
518
+ },
519
+ "default": "'normal'",
520
+ "description": "Determines the direction of playback as well as the behavior when reaching the end of an iteration.\n[Learn more](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction)",
521
+ "attribute": "direction"
522
+ },
748
523
  {
749
- "name": "label",
524
+ "kind": "field",
525
+ "name": "duration",
526
+ "type": {
527
+ "text": "number"
528
+ },
529
+ "default": "1000",
530
+ "description": "The number of milliseconds each iteration of the animation takes to complete.",
531
+ "attribute": "duration"
532
+ },
533
+ {
534
+ "kind": "field",
535
+ "name": "easing",
750
536
  "type": {
751
537
  "text": "string"
752
538
  },
753
- "default": "''",
754
- "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
755
- "fieldName": "label"
756
- }
757
- ],
758
- "superclass": {
759
- "name": "FlowRdfElement",
760
- "module": "/src/internal/flow-ui-rdf-element"
761
- },
762
- "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
763
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb",
764
- "status": "stable",
765
- "since": "2.0",
766
- "dependencies": [
767
- "flow-ui-icon"
768
- ],
769
- "tagName": "flow-ui-breadcrumb",
770
- "customElement": true
771
- }
772
- ],
773
- "exports": [
774
- {
775
- "kind": "js",
776
- "name": "default",
777
- "declaration": {
778
- "name": "FlowBreadcrumb",
779
- "module": "components/breadcrumb/breadcrumb.js"
780
- }
781
- },
782
- {
783
- "kind": "custom-element-definition",
784
- "name": "flow-ui-breadcrumb",
785
- "declaration": {
786
- "name": "FlowBreadcrumb",
787
- "module": "components/breadcrumb/breadcrumb.js"
788
- }
789
- }
790
- ]
791
- },
792
- {
793
- "kind": "javascript-module",
794
- "path": "components/breadcrumb-item/breadcrumb-item.js",
795
- "declarations": [
796
- {
797
- "kind": "class",
798
- "description": "",
799
- "name": "FlowBreadcrumbItem",
800
- "cssParts": [
801
- {
802
- "description": "The component's base wrapper.",
803
- "name": "base"
804
- },
805
- {
806
- "description": "The breadcrumb item's label.",
807
- "name": "label"
808
- },
809
- {
810
- "description": "The container that wraps the prefix.",
811
- "name": "prefix"
812
- },
813
- {
814
- "description": "The container that wraps the suffix.",
815
- "name": "suffix"
816
- },
817
- {
818
- "description": "The container that wraps the separator.",
819
- "name": "separator"
820
- }
821
- ],
822
- "slots": [
823
- {
824
- "description": "The breadcrumb item's label.",
825
- "name": ""
539
+ "default": "'linear'",
540
+ "description": "The easing function to use for the animation. This can be a Flo.w RDF UI easing function or a custom easing function\nsuch as `cubic-bezier(0, 1, .76, 1.14)`.",
541
+ "attribute": "easing"
826
542
  },
827
543
  {
828
- "description": "An optional prefix, usually an icon or icon button.",
829
- "name": "prefix"
544
+ "kind": "field",
545
+ "name": "endDelay",
546
+ "type": {
547
+ "text": "number"
548
+ },
549
+ "default": "0",
550
+ "description": "The number of milliseconds to delay after the active period of an animation sequence.",
551
+ "attribute": "end-delay"
830
552
  },
831
553
  {
832
- "description": "An optional suffix, usually an icon or icon button.",
833
- "name": "suffix"
554
+ "kind": "field",
555
+ "name": "fill",
556
+ "type": {
557
+ "text": "FillMode"
558
+ },
559
+ "default": "'auto'",
560
+ "description": "Sets how the animation applies styles to its target before and after its execution.",
561
+ "attribute": "fill"
834
562
  },
835
- {
836
- "description": "The separator to use for the breadcrumb item. This will only change the separator for this item. If you want to change it for all items in the group, set the separator on `<flow-ui-breadcrumb>` instead.",
837
- "name": "separator"
838
- }
839
- ],
840
- "members": [
841
563
  {
842
564
  "kind": "field",
843
- "name": "hasSlotController",
844
- "privacy": "private",
845
- "readonly": true,
846
- "default": "new HasSlotController(this, 'prefix', 'suffix')"
565
+ "name": "iterations",
566
+ "default": "Infinity",
567
+ "description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
568
+ "attribute": "iterations"
847
569
  },
848
570
  {
849
571
  "kind": "field",
850
- "name": "href",
572
+ "name": "iterationStart",
851
573
  "type": {
852
- "text": "string | undefined"
574
+ "text": "number"
853
575
  },
854
- "description": "Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered\ninternally. When unset, a button will be rendered instead.",
855
- "attribute": "href"
576
+ "default": "0",
577
+ "description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
578
+ "attribute": "iteration-start"
856
579
  },
857
580
  {
858
581
  "kind": "field",
859
- "name": "target",
582
+ "name": "keyframes",
860
583
  "type": {
861
- "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
584
+ "text": "Keyframe[] | undefined"
862
585
  },
863
- "description": "Tells the browser where to open the link. Only used when `href` is set.",
864
- "attribute": "target"
586
+ "description": "The keyframes to use for the animation. If this is set, `name` will be ignored."
865
587
  },
866
588
  {
867
589
  "kind": "field",
868
- "name": "rel",
590
+ "name": "playbackRate",
869
591
  "type": {
870
- "text": "string"
592
+ "text": "number"
871
593
  },
872
- "default": "'noreferrer noopener'",
873
- "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
874
- "attribute": "rel"
875
- }
876
- ],
877
- "attributes": [
594
+ "default": "1",
595
+ "description": "Sets the animation's playback rate. The default is `1`, which plays the animation at a normal speed. Setting this\nto `2`, for example, will double the animation's speed. A negative value can be used to reverse the animation. This\nvalue can be changed without causing the animation to restart.",
596
+ "attribute": "playback-rate"
597
+ },
878
598
  {
879
- "name": "href",
599
+ "kind": "field",
600
+ "name": "currentTime",
880
601
  "type": {
881
- "text": "string | undefined"
602
+ "text": "number"
882
603
  },
883
- "description": "Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered\ninternally. When unset, a button will be rendered instead.",
884
- "fieldName": "href"
604
+ "description": "Gets and sets the current animation time."
885
605
  },
886
606
  {
887
- "name": "target",
888
- "type": {
889
- "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
890
- },
891
- "description": "Tells the browser where to open the link. Only used when `href` is set.",
892
- "fieldName": "target"
607
+ "kind": "method",
608
+ "name": "handleAnimationFinish",
609
+ "privacy": "private"
893
610
  },
894
611
  {
895
- "name": "rel",
896
- "type": {
897
- "text": "string"
898
- },
899
- "default": "'noreferrer noopener'",
900
- "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
901
- "fieldName": "rel"
902
- }
903
- ],
904
- "superclass": {
905
- "name": "FlowRdfElement",
906
- "module": "/src/internal/flow-ui-rdf-element"
907
- },
908
- "summary": "Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.",
909
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb-item",
910
- "status": "stable",
911
- "since": "2.0",
912
- "tagName": "flow-ui-breadcrumb-item",
913
- "customElement": true
914
- }
915
- ],
916
- "exports": [
917
- {
918
- "kind": "js",
919
- "name": "default",
920
- "declaration": {
921
- "name": "FlowBreadcrumbItem",
922
- "module": "components/breadcrumb-item/breadcrumb-item.js"
923
- }
924
- },
925
- {
926
- "kind": "custom-element-definition",
927
- "name": "flow-ui-breadcrumb-item",
928
- "declaration": {
929
- "name": "FlowBreadcrumbItem",
930
- "module": "components/breadcrumb-item/breadcrumb-item.js"
931
- }
932
- }
933
- ]
934
- },
935
- {
936
- "kind": "javascript-module",
937
- "path": "components/avatar/avatar.js",
938
- "declarations": [
939
- {
940
- "kind": "class",
941
- "description": "",
942
- "name": "FlowAvatar",
943
- "cssProperties": [
612
+ "kind": "method",
613
+ "name": "handleAnimationCancel",
614
+ "privacy": "private"
615
+ },
944
616
  {
945
- "description": "The size of the avatar.",
946
- "name": "--size"
947
- }
948
- ],
949
- "cssParts": [
617
+ "kind": "method",
618
+ "name": "handleSlotChange",
619
+ "privacy": "private"
620
+ },
950
621
  {
951
- "description": "The component's base wrapper.",
952
- "name": "base"
622
+ "kind": "method",
623
+ "name": "createAnimation",
624
+ "privacy": "private"
953
625
  },
954
626
  {
955
- "description": "The container that wraps the avatar's icon.",
956
- "name": "icon"
627
+ "kind": "method",
628
+ "name": "destroyAnimation",
629
+ "privacy": "private"
957
630
  },
958
631
  {
959
- "description": "The container that wraps the avatar's initials.",
960
- "name": "initials"
632
+ "kind": "method",
633
+ "name": "handleAnimationChange"
961
634
  },
962
635
  {
963
- "description": "The avatar image. Only shown when the `image` attribute is set.",
964
- "name": "image"
636
+ "kind": "method",
637
+ "name": "handlePlayChange"
638
+ },
639
+ {
640
+ "kind": "method",
641
+ "name": "handlePlaybackRateChange"
642
+ },
643
+ {
644
+ "kind": "method",
645
+ "name": "cancel",
646
+ "description": "Clears all keyframe effects caused by this animation and aborts its playback."
647
+ },
648
+ {
649
+ "kind": "method",
650
+ "name": "finish",
651
+ "description": "Sets the playback time to the end of the animation corresponding to the current playback direction."
965
652
  }
966
653
  ],
967
- "slots": [
654
+ "events": [
968
655
  {
969
- "description": "The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.",
970
- "name": "icon"
656
+ "description": "Emitted when the animation is canceled.",
657
+ "name": "flow-ui-cancel",
658
+ "reactName": "onFlowUiCancel"
659
+ },
660
+ {
661
+ "description": "Emitted when the animation finishes.",
662
+ "name": "flow-ui-finish",
663
+ "reactName": "onFlowUiFinish"
664
+ },
665
+ {
666
+ "description": "Emitted when the animation starts or restarts.",
667
+ "name": "flow-ui-start",
668
+ "reactName": "onFlowUiStart"
971
669
  }
972
670
  ],
973
- "members": [
671
+ "attributes": [
974
672
  {
975
- "kind": "field",
976
- "name": "hasError",
673
+ "name": "name",
977
674
  "type": {
978
- "text": "boolean"
675
+ "text": "string"
979
676
  },
980
- "privacy": "private",
981
- "default": "false"
677
+ "default": "'none'",
678
+ "description": "The name of the built-in animation to use. For custom animations, use the `keyframes` prop.",
679
+ "fieldName": "name"
982
680
  },
983
681
  {
984
- "kind": "field",
985
- "name": "image",
682
+ "name": "play",
986
683
  "type": {
987
- "text": "string"
684
+ "text": "boolean"
988
685
  },
989
- "default": "''",
990
- "description": "The image source to use for the avatar.",
991
- "attribute": "image"
686
+ "default": "false",
687
+ "description": "Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when\nthe animation finishes or gets canceled.",
688
+ "fieldName": "play"
992
689
  },
993
690
  {
994
- "kind": "field",
995
- "name": "label",
691
+ "name": "delay",
996
692
  "type": {
997
- "text": "string"
693
+ "text": "number"
998
694
  },
999
- "default": "''",
1000
- "description": "A label to use to describe the avatar to assistive devices.",
1001
- "attribute": "label"
695
+ "default": "0",
696
+ "description": "The number of milliseconds to delay the start of the animation.",
697
+ "fieldName": "delay"
1002
698
  },
1003
699
  {
1004
- "kind": "field",
1005
- "name": "initials",
700
+ "name": "direction",
1006
701
  "type": {
1007
- "text": "string"
702
+ "text": "PlaybackDirection"
1008
703
  },
1009
- "default": "''",
1010
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
1011
- "attribute": "initials"
704
+ "default": "'normal'",
705
+ "description": "Determines the direction of playback as well as the behavior when reaching the end of an iteration.\n[Learn more](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction)",
706
+ "fieldName": "direction"
1012
707
  },
1013
708
  {
1014
- "kind": "field",
1015
- "name": "loading",
709
+ "name": "duration",
1016
710
  "type": {
1017
- "text": "'eager' | 'lazy'"
711
+ "text": "number"
1018
712
  },
1019
- "default": "'eager'",
1020
- "description": "Indicates how the browser should load the image.",
1021
- "attribute": "loading"
713
+ "default": "1000",
714
+ "description": "The number of milliseconds each iteration of the animation takes to complete.",
715
+ "fieldName": "duration"
1022
716
  },
1023
717
  {
1024
- "kind": "field",
1025
- "name": "shape",
718
+ "name": "easing",
1026
719
  "type": {
1027
- "text": "'circle' | 'square' | 'rounded'"
720
+ "text": "string"
1028
721
  },
1029
- "default": "'circle'",
1030
- "description": "The shape of the avatar.",
1031
- "attribute": "shape",
1032
- "reflects": true
722
+ "default": "'linear'",
723
+ "description": "The easing function to use for the animation. This can be a Flo.w RDF UI easing function or a custom easing function\nsuch as `cubic-bezier(0, 1, .76, 1.14)`.",
724
+ "fieldName": "easing"
1033
725
  },
1034
726
  {
1035
- "kind": "method",
1036
- "name": "handleImageChange"
1037
- }
1038
- ],
1039
- "attributes": [
1040
- {
1041
- "name": "image",
727
+ "name": "end-delay",
1042
728
  "type": {
1043
- "text": "string"
729
+ "text": "number"
1044
730
  },
1045
- "default": "''",
1046
- "description": "The image source to use for the avatar.",
1047
- "fieldName": "image"
731
+ "default": "0",
732
+ "description": "The number of milliseconds to delay after the active period of an animation sequence.",
733
+ "fieldName": "endDelay"
1048
734
  },
1049
735
  {
1050
- "name": "label",
736
+ "name": "fill",
1051
737
  "type": {
1052
- "text": "string"
738
+ "text": "FillMode"
1053
739
  },
1054
- "default": "''",
1055
- "description": "A label to use to describe the avatar to assistive devices.",
1056
- "fieldName": "label"
740
+ "default": "'auto'",
741
+ "description": "Sets how the animation applies styles to its target before and after its execution.",
742
+ "fieldName": "fill"
1057
743
  },
1058
744
  {
1059
- "name": "initials",
1060
- "type": {
1061
- "text": "string"
745
+ "name": "iterations",
746
+ "default": "Infinity",
747
+ "description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
748
+ "resolveInitializer": {
749
+ "module": "src/components/animation/animation.ts"
1062
750
  },
1063
- "default": "''",
1064
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
1065
- "fieldName": "initials"
751
+ "fieldName": "iterations"
1066
752
  },
1067
753
  {
1068
- "name": "loading",
754
+ "name": "iteration-start",
1069
755
  "type": {
1070
- "text": "'eager' | 'lazy'"
756
+ "text": "number"
1071
757
  },
1072
- "default": "'eager'",
1073
- "description": "Indicates how the browser should load the image.",
1074
- "fieldName": "loading"
758
+ "default": "0",
759
+ "description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
760
+ "fieldName": "iterationStart"
1075
761
  },
1076
762
  {
1077
- "name": "shape",
763
+ "name": "playback-rate",
1078
764
  "type": {
1079
- "text": "'circle' | 'square' | 'rounded'"
765
+ "text": "number"
1080
766
  },
1081
- "default": "'circle'",
1082
- "description": "The shape of the avatar.",
1083
- "fieldName": "shape"
767
+ "default": "1",
768
+ "description": "Sets the animation's playback rate. The default is `1`, which plays the animation at a normal speed. Setting this\nto `2`, for example, will double the animation's speed. A negative value can be used to reverse the animation. This\nvalue can be changed without causing the animation to restart.",
769
+ "fieldName": "playbackRate"
1084
770
  }
1085
771
  ],
1086
772
  "superclass": {
1087
773
  "name": "FlowRdfElement",
1088
774
  "module": "/src/internal/flow-ui-rdf-element"
1089
775
  },
1090
- "summary": "Avatars are used to represent a person or object.",
1091
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/avatar",
776
+ "summary": "Animate elements declaratively with nearly 100 baked-in presets, or roll your own with custom keyframes. Powered by the [Web Animations API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API).",
777
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/animation",
1092
778
  "status": "stable",
1093
779
  "since": "2.0",
1094
- "dependencies": [
1095
- "flow-ui-icon"
1096
- ],
1097
- "tagName": "flow-ui-avatar",
780
+ "tagName": "flow-ui-animation",
1098
781
  "customElement": true
1099
782
  }
1100
783
  ],
@@ -1103,122 +786,322 @@
1103
786
  "kind": "js",
1104
787
  "name": "default",
1105
788
  "declaration": {
1106
- "name": "FlowAvatar",
1107
- "module": "components/avatar/avatar.js"
789
+ "name": "FlowAnimation",
790
+ "module": "components/animation/animation.js"
1108
791
  }
1109
792
  },
1110
793
  {
1111
794
  "kind": "custom-element-definition",
1112
- "name": "flow-ui-avatar",
795
+ "name": "flow-ui-animation",
1113
796
  "declaration": {
1114
- "name": "FlowAvatar",
1115
- "module": "components/avatar/avatar.js"
797
+ "name": "FlowAnimation",
798
+ "module": "components/animation/animation.js"
1116
799
  }
1117
800
  }
1118
801
  ]
1119
802
  },
1120
803
  {
1121
804
  "kind": "javascript-module",
1122
- "path": "components/button/button.js",
805
+ "path": "components/animation/animations.js",
806
+ "declarations": [
807
+ {
808
+ "kind": "function",
809
+ "name": "getAnimationNames",
810
+ "description": "Gets a list of all supported animation names."
811
+ },
812
+ {
813
+ "kind": "function",
814
+ "name": "getEasingNames",
815
+ "description": "Gets a list of all supported easing function names."
816
+ }
817
+ ],
818
+ "exports": [
819
+ {
820
+ "kind": "js",
821
+ "name": "animations",
822
+ "declaration": {
823
+ "name": "animations",
824
+ "module": "components/animation/animations.js"
825
+ }
826
+ },
827
+ {
828
+ "kind": "js",
829
+ "name": "getAnimationNames",
830
+ "declaration": {
831
+ "name": "getAnimationNames",
832
+ "module": "components/animation/animations.js"
833
+ }
834
+ },
835
+ {
836
+ "kind": "js",
837
+ "name": "getEasingNames",
838
+ "declaration": {
839
+ "name": "getEasingNames",
840
+ "module": "components/animation/animations.js"
841
+ }
842
+ }
843
+ ]
844
+ },
845
+ {
846
+ "kind": "javascript-module",
847
+ "path": "components/animation/index.js",
848
+ "declarations": [],
849
+ "exports": [
850
+ {
851
+ "kind": "js",
852
+ "name": "FlowAnimation",
853
+ "declaration": {
854
+ "name": "default",
855
+ "module": "./animation"
856
+ }
857
+ }
858
+ ]
859
+ },
860
+ {
861
+ "kind": "javascript-module",
862
+ "path": "components/breadcrumb-item/breadcrumb-item.js",
1123
863
  "declarations": [
1124
864
  {
1125
865
  "kind": "class",
1126
866
  "description": "",
1127
- "name": "FlowButton",
867
+ "name": "FlowBreadcrumbItem",
1128
868
  "cssParts": [
1129
869
  {
1130
870
  "description": "The component's base wrapper.",
1131
871
  "name": "base"
1132
872
  },
1133
873
  {
1134
- "description": "The container that wraps the prefix.",
1135
- "name": "prefix"
874
+ "description": "The breadcrumb item's label.",
875
+ "name": "label"
1136
876
  },
1137
877
  {
1138
- "description": "The button's label.",
1139
- "name": "label"
878
+ "description": "The container that wraps the prefix.",
879
+ "name": "prefix"
1140
880
  },
1141
881
  {
1142
882
  "description": "The container that wraps the suffix.",
1143
883
  "name": "suffix"
1144
884
  },
1145
885
  {
1146
- "description": "The button's caret icon, an `<flow-ui-icon>` element.",
1147
- "name": "caret"
886
+ "description": "The container that wraps the separator.",
887
+ "name": "separator"
1148
888
  }
1149
889
  ],
1150
890
  "slots": [
1151
891
  {
1152
- "description": "The button's label.",
892
+ "description": "The breadcrumb item's label.",
1153
893
  "name": ""
1154
894
  },
1155
895
  {
1156
- "description": "A presentational prefix icon or similar element.",
896
+ "description": "An optional prefix, usually an icon or icon button.",
1157
897
  "name": "prefix"
1158
898
  },
1159
899
  {
1160
- "description": "A presentational suffix icon or similar element.",
900
+ "description": "An optional suffix, usually an icon or icon button.",
1161
901
  "name": "suffix"
902
+ },
903
+ {
904
+ "description": "The separator to use for the breadcrumb item. This will only change the separator for this item. If you want to change it for all items in the group, set the separator on `<flow-ui-breadcrumb>` instead.",
905
+ "name": "separator"
1162
906
  }
1163
907
  ],
1164
908
  "members": [
1165
- {
1166
- "kind": "field",
1167
- "name": "formControlController",
1168
- "privacy": "private",
1169
- "readonly": true,
1170
- "default": "new FormControlController(this, {\n form: input => {\n // Buttons support a form attribute that points to an arbitrary form, so if this attribute is set we need to query\n // the form from the same root using its id\n if (input.hasAttribute('form')) {\n const doc = input.getRootNode() as Document | ShadowRoot;\n const formId = input.getAttribute('form')!;\n return doc.getElementById(formId) as HTMLFormElement;\n }\n\n // Fall back to the closest containing form\n return input.closest('form');\n },\n assumeInteractionOn: ['click']\n })"
1171
- },
1172
909
  {
1173
910
  "kind": "field",
1174
911
  "name": "hasSlotController",
1175
912
  "privacy": "private",
1176
913
  "readonly": true,
1177
- "default": "new HasSlotController(this, '[default]', 'prefix', 'suffix')"
1178
- },
1179
- {
1180
- "kind": "field",
1181
- "name": "localize",
1182
- "privacy": "private",
1183
- "readonly": true,
1184
- "default": "new LocalizeController(this)"
1185
- },
1186
- {
1187
- "kind": "field",
1188
- "name": "button",
1189
- "type": {
1190
- "text": "HTMLButtonElement | HTMLLinkElement"
1191
- }
914
+ "default": "new HasSlotController(this, 'prefix', 'suffix')"
1192
915
  },
1193
916
  {
1194
917
  "kind": "field",
1195
- "name": "hasFocus",
918
+ "name": "href",
1196
919
  "type": {
1197
- "text": "boolean"
920
+ "text": "string | undefined"
1198
921
  },
1199
- "privacy": "private",
1200
- "default": "false"
922
+ "description": "Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered\ninternally. When unset, a button will be rendered instead.",
923
+ "attribute": "href"
1201
924
  },
1202
925
  {
1203
926
  "kind": "field",
1204
- "name": "invalid",
927
+ "name": "target",
1205
928
  "type": {
1206
- "text": "boolean"
929
+ "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
1207
930
  },
1208
- "default": "false"
931
+ "description": "Tells the browser where to open the link. Only used when `href` is set.",
932
+ "attribute": "target"
1209
933
  },
1210
934
  {
1211
935
  "kind": "field",
1212
- "name": "title",
936
+ "name": "rel",
1213
937
  "type": {
1214
938
  "text": "string"
1215
939
  },
1216
- "default": "''",
1217
- "attribute": "title"
1218
- },
1219
- {
1220
- "kind": "field",
1221
- "name": "variant",
940
+ "default": "'noreferrer noopener'",
941
+ "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
942
+ "attribute": "rel"
943
+ }
944
+ ],
945
+ "attributes": [
946
+ {
947
+ "name": "href",
948
+ "type": {
949
+ "text": "string | undefined"
950
+ },
951
+ "description": "Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered\ninternally. When unset, a button will be rendered instead.",
952
+ "fieldName": "href"
953
+ },
954
+ {
955
+ "name": "target",
956
+ "type": {
957
+ "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
958
+ },
959
+ "description": "Tells the browser where to open the link. Only used when `href` is set.",
960
+ "fieldName": "target"
961
+ },
962
+ {
963
+ "name": "rel",
964
+ "type": {
965
+ "text": "string"
966
+ },
967
+ "default": "'noreferrer noopener'",
968
+ "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
969
+ "fieldName": "rel"
970
+ }
971
+ ],
972
+ "superclass": {
973
+ "name": "FlowRdfElement",
974
+ "module": "/src/internal/flow-ui-rdf-element"
975
+ },
976
+ "summary": "Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.",
977
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb-item",
978
+ "status": "stable",
979
+ "since": "2.0",
980
+ "tagName": "flow-ui-breadcrumb-item",
981
+ "customElement": true
982
+ }
983
+ ],
984
+ "exports": [
985
+ {
986
+ "kind": "js",
987
+ "name": "default",
988
+ "declaration": {
989
+ "name": "FlowBreadcrumbItem",
990
+ "module": "components/breadcrumb-item/breadcrumb-item.js"
991
+ }
992
+ },
993
+ {
994
+ "kind": "custom-element-definition",
995
+ "name": "flow-ui-breadcrumb-item",
996
+ "declaration": {
997
+ "name": "FlowBreadcrumbItem",
998
+ "module": "components/breadcrumb-item/breadcrumb-item.js"
999
+ }
1000
+ }
1001
+ ]
1002
+ },
1003
+ {
1004
+ "kind": "javascript-module",
1005
+ "path": "components/button/button.js",
1006
+ "declarations": [
1007
+ {
1008
+ "kind": "class",
1009
+ "description": "",
1010
+ "name": "FlowButton",
1011
+ "cssParts": [
1012
+ {
1013
+ "description": "The component's base wrapper.",
1014
+ "name": "base"
1015
+ },
1016
+ {
1017
+ "description": "The container that wraps the prefix.",
1018
+ "name": "prefix"
1019
+ },
1020
+ {
1021
+ "description": "The button's label.",
1022
+ "name": "label"
1023
+ },
1024
+ {
1025
+ "description": "The container that wraps the suffix.",
1026
+ "name": "suffix"
1027
+ },
1028
+ {
1029
+ "description": "The button's caret icon, an `<flow-ui-icon>` element.",
1030
+ "name": "caret"
1031
+ }
1032
+ ],
1033
+ "slots": [
1034
+ {
1035
+ "description": "The button's label.",
1036
+ "name": ""
1037
+ },
1038
+ {
1039
+ "description": "A presentational prefix icon or similar element.",
1040
+ "name": "prefix"
1041
+ },
1042
+ {
1043
+ "description": "A presentational suffix icon or similar element.",
1044
+ "name": "suffix"
1045
+ }
1046
+ ],
1047
+ "members": [
1048
+ {
1049
+ "kind": "field",
1050
+ "name": "formControlController",
1051
+ "privacy": "private",
1052
+ "readonly": true,
1053
+ "default": "new FormControlController(this, {\n form: input => {\n // Buttons support a form attribute that points to an arbitrary form, so if this attribute is set we need to query\n // the form from the same root using its id\n if (input.hasAttribute('form')) {\n const doc = input.getRootNode() as Document | ShadowRoot;\n const formId = input.getAttribute('form')!;\n return doc.getElementById(formId) as HTMLFormElement;\n }\n\n // Fall back to the closest containing form\n return input.closest('form');\n },\n assumeInteractionOn: ['click']\n })"
1054
+ },
1055
+ {
1056
+ "kind": "field",
1057
+ "name": "hasSlotController",
1058
+ "privacy": "private",
1059
+ "readonly": true,
1060
+ "default": "new HasSlotController(this, '[default]', 'prefix', 'suffix')"
1061
+ },
1062
+ {
1063
+ "kind": "field",
1064
+ "name": "localize",
1065
+ "privacy": "private",
1066
+ "readonly": true,
1067
+ "default": "new LocalizeController(this)"
1068
+ },
1069
+ {
1070
+ "kind": "field",
1071
+ "name": "button",
1072
+ "type": {
1073
+ "text": "HTMLButtonElement | HTMLLinkElement"
1074
+ }
1075
+ },
1076
+ {
1077
+ "kind": "field",
1078
+ "name": "hasFocus",
1079
+ "type": {
1080
+ "text": "boolean"
1081
+ },
1082
+ "privacy": "private",
1083
+ "default": "false"
1084
+ },
1085
+ {
1086
+ "kind": "field",
1087
+ "name": "invalid",
1088
+ "type": {
1089
+ "text": "boolean"
1090
+ },
1091
+ "default": "false"
1092
+ },
1093
+ {
1094
+ "kind": "field",
1095
+ "name": "title",
1096
+ "type": {
1097
+ "text": "string"
1098
+ },
1099
+ "default": "''",
1100
+ "attribute": "title"
1101
+ },
1102
+ {
1103
+ "kind": "field",
1104
+ "name": "variant",
1222
1105
  "type": {
1223
1106
  "text": "'default' | 'primary' | 'secondary' | 'success' | 'neutral' | 'warning' | 'danger' | 'text'"
1224
1107
  },
@@ -1796,12 +1679,12 @@
1796
1679
  },
1797
1680
  {
1798
1681
  "kind": "javascript-module",
1799
- "path": "components/button-group/button-group.js",
1682
+ "path": "components/breadcrumb/breadcrumb.js",
1800
1683
  "declarations": [
1801
1684
  {
1802
1685
  "kind": "class",
1803
1686
  "description": "",
1804
- "name": "FlowButtonGroup",
1687
+ "name": "FlowBreadcrumb",
1805
1688
  "cssParts": [
1806
1689
  {
1807
1690
  "description": "The component's base wrapper.",
@@ -1810,11 +1693,27 @@
1810
1693
  ],
1811
1694
  "slots": [
1812
1695
  {
1813
- "description": "One or more `<flow-ui-button>` elements to display in the button group.",
1696
+ "description": "One or more breadcrumb items to display.",
1814
1697
  "name": ""
1698
+ },
1699
+ {
1700
+ "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
1701
+ "name": "separator"
1815
1702
  }
1816
1703
  ],
1817
1704
  "members": [
1705
+ {
1706
+ "kind": "field",
1707
+ "name": "localize",
1708
+ "privacy": "private",
1709
+ "readonly": true,
1710
+ "default": "new LocalizeController(this)"
1711
+ },
1712
+ {
1713
+ "kind": "field",
1714
+ "name": "separatorDir",
1715
+ "privacy": "private"
1716
+ },
1818
1717
  {
1819
1718
  "kind": "field",
1820
1719
  "name": "defaultSlot",
@@ -1824,11 +1723,10 @@
1824
1723
  },
1825
1724
  {
1826
1725
  "kind": "field",
1827
- "name": "disableRole",
1726
+ "name": "separatorSlot",
1828
1727
  "type": {
1829
- "text": "boolean"
1830
- },
1831
- "default": "false"
1728
+ "text": "HTMLSlotElement"
1729
+ }
1832
1730
  },
1833
1731
  {
1834
1732
  "kind": "field",
@@ -1837,109 +1735,43 @@
1837
1735
  "text": "string"
1838
1736
  },
1839
1737
  "default": "''",
1738
+ "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
1840
1739
  "attribute": "label"
1841
1740
  },
1842
- {
1843
- "kind": "field",
1844
- "name": "vertical",
1845
- "type": {
1846
- "text": "boolean"
1847
- },
1848
- "default": "false",
1849
- "description": "Use vertical layout for the button group.",
1850
- "attribute": "vertical",
1851
- "reflects": true
1852
- },
1853
- {
1854
- "kind": "method",
1855
- "name": "handleVerticalChange"
1856
- },
1857
- {
1858
- "kind": "method",
1859
- "name": "handleFocus",
1860
- "privacy": "private",
1861
- "parameters": [
1862
- {
1863
- "name": "event",
1864
- "type": {
1865
- "text": "Event"
1866
- }
1867
- }
1868
- ]
1869
- },
1870
1741
  {
1871
1742
  "kind": "method",
1872
- "name": "handleBlur",
1873
- "privacy": "private",
1874
- "parameters": [
1875
- {
1876
- "name": "event",
1877
- "type": {
1878
- "text": "Event"
1879
- }
1880
- }
1881
- ]
1743
+ "name": "getSeparator",
1744
+ "privacy": "private"
1882
1745
  },
1883
1746
  {
1884
1747
  "kind": "method",
1885
- "name": "handleMouseOver",
1886
- "privacy": "private",
1887
- "parameters": [
1888
- {
1889
- "name": "event",
1890
- "type": {
1891
- "text": "Event"
1892
- }
1893
- }
1894
- ]
1895
- },
1896
- {
1897
- "kind": "method",
1898
- "name": "handleMouseOut",
1899
- "privacy": "private",
1900
- "parameters": [
1901
- {
1902
- "name": "event",
1903
- "type": {
1904
- "text": "Event"
1905
- }
1906
- }
1907
- ]
1908
- },
1909
- {
1910
- "kind": "method",
1911
- "name": "handleSlotChange",
1912
- "privacy": "private"
1913
- }
1914
- ],
1915
- "attributes": [
1748
+ "name": "handleSlotChange",
1749
+ "privacy": "private"
1750
+ }
1751
+ ],
1752
+ "attributes": [
1916
1753
  {
1917
1754
  "name": "label",
1918
1755
  "type": {
1919
1756
  "text": "string"
1920
1757
  },
1921
1758
  "default": "''",
1759
+ "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
1922
1760
  "fieldName": "label"
1923
- },
1924
- {
1925
- "name": "vertical",
1926
- "type": {
1927
- "text": "boolean"
1928
- },
1929
- "default": "false",
1930
- "description": "Use vertical layout for the button group.",
1931
- "fieldName": "vertical"
1932
1761
  }
1933
1762
  ],
1934
1763
  "superclass": {
1935
1764
  "name": "FlowRdfElement",
1936
1765
  "module": "/src/internal/flow-ui-rdf-element"
1937
1766
  },
1938
- "summary": "Button groups can be used to group related buttons into sections.",
1939
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/button-group",
1767
+ "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
1768
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb",
1940
1769
  "status": "stable",
1941
1770
  "since": "2.0",
1942
- "tagName": "flow-ui-button-group",
1771
+ "dependencies": [
1772
+ "flow-ui-icon"
1773
+ ],
1774
+ "tagName": "flow-ui-breadcrumb",
1943
1775
  "customElement": true
1944
1776
  }
1945
1777
  ],
@@ -1948,16 +1780,16 @@
1948
1780
  "kind": "js",
1949
1781
  "name": "default",
1950
1782
  "declaration": {
1951
- "name": "FlowButtonGroup",
1952
- "module": "components/button-group/button-group.js"
1783
+ "name": "FlowBreadcrumb",
1784
+ "module": "components/breadcrumb/breadcrumb.js"
1953
1785
  }
1954
1786
  },
1955
1787
  {
1956
1788
  "kind": "custom-element-definition",
1957
- "name": "flow-ui-button-group",
1789
+ "name": "flow-ui-breadcrumb",
1958
1790
  "declaration": {
1959
- "name": "FlowButtonGroup",
1960
- "module": "components/button-group/button-group.js"
1791
+ "name": "FlowBreadcrumb",
1792
+ "module": "components/breadcrumb/breadcrumb.js"
1961
1793
  }
1962
1794
  }
1963
1795
  ]
@@ -2077,6 +1909,174 @@
2077
1909
  }
2078
1910
  ]
2079
1911
  },
1912
+ {
1913
+ "kind": "javascript-module",
1914
+ "path": "components/button-group/button-group.js",
1915
+ "declarations": [
1916
+ {
1917
+ "kind": "class",
1918
+ "description": "",
1919
+ "name": "FlowButtonGroup",
1920
+ "cssParts": [
1921
+ {
1922
+ "description": "The component's base wrapper.",
1923
+ "name": "base"
1924
+ }
1925
+ ],
1926
+ "slots": [
1927
+ {
1928
+ "description": "One or more `<flow-ui-button>` elements to display in the button group.",
1929
+ "name": ""
1930
+ }
1931
+ ],
1932
+ "members": [
1933
+ {
1934
+ "kind": "field",
1935
+ "name": "defaultSlot",
1936
+ "type": {
1937
+ "text": "HTMLSlotElement"
1938
+ }
1939
+ },
1940
+ {
1941
+ "kind": "field",
1942
+ "name": "disableRole",
1943
+ "type": {
1944
+ "text": "boolean"
1945
+ },
1946
+ "default": "false"
1947
+ },
1948
+ {
1949
+ "kind": "field",
1950
+ "name": "label",
1951
+ "type": {
1952
+ "text": "string"
1953
+ },
1954
+ "default": "''",
1955
+ "attribute": "label"
1956
+ },
1957
+ {
1958
+ "kind": "field",
1959
+ "name": "vertical",
1960
+ "type": {
1961
+ "text": "boolean"
1962
+ },
1963
+ "default": "false",
1964
+ "description": "Use vertical layout for the button group.",
1965
+ "attribute": "vertical",
1966
+ "reflects": true
1967
+ },
1968
+ {
1969
+ "kind": "method",
1970
+ "name": "handleVerticalChange"
1971
+ },
1972
+ {
1973
+ "kind": "method",
1974
+ "name": "handleFocus",
1975
+ "privacy": "private",
1976
+ "parameters": [
1977
+ {
1978
+ "name": "event",
1979
+ "type": {
1980
+ "text": "Event"
1981
+ }
1982
+ }
1983
+ ]
1984
+ },
1985
+ {
1986
+ "kind": "method",
1987
+ "name": "handleBlur",
1988
+ "privacy": "private",
1989
+ "parameters": [
1990
+ {
1991
+ "name": "event",
1992
+ "type": {
1993
+ "text": "Event"
1994
+ }
1995
+ }
1996
+ ]
1997
+ },
1998
+ {
1999
+ "kind": "method",
2000
+ "name": "handleMouseOver",
2001
+ "privacy": "private",
2002
+ "parameters": [
2003
+ {
2004
+ "name": "event",
2005
+ "type": {
2006
+ "text": "Event"
2007
+ }
2008
+ }
2009
+ ]
2010
+ },
2011
+ {
2012
+ "kind": "method",
2013
+ "name": "handleMouseOut",
2014
+ "privacy": "private",
2015
+ "parameters": [
2016
+ {
2017
+ "name": "event",
2018
+ "type": {
2019
+ "text": "Event"
2020
+ }
2021
+ }
2022
+ ]
2023
+ },
2024
+ {
2025
+ "kind": "method",
2026
+ "name": "handleSlotChange",
2027
+ "privacy": "private"
2028
+ }
2029
+ ],
2030
+ "attributes": [
2031
+ {
2032
+ "name": "label",
2033
+ "type": {
2034
+ "text": "string"
2035
+ },
2036
+ "default": "''",
2037
+ "fieldName": "label"
2038
+ },
2039
+ {
2040
+ "name": "vertical",
2041
+ "type": {
2042
+ "text": "boolean"
2043
+ },
2044
+ "default": "false",
2045
+ "description": "Use vertical layout for the button group.",
2046
+ "fieldName": "vertical"
2047
+ }
2048
+ ],
2049
+ "superclass": {
2050
+ "name": "FlowRdfElement",
2051
+ "module": "/src/internal/flow-ui-rdf-element"
2052
+ },
2053
+ "summary": "Button groups can be used to group related buttons into sections.",
2054
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/button-group",
2055
+ "status": "stable",
2056
+ "since": "2.0",
2057
+ "tagName": "flow-ui-button-group",
2058
+ "customElement": true
2059
+ }
2060
+ ],
2061
+ "exports": [
2062
+ {
2063
+ "kind": "js",
2064
+ "name": "default",
2065
+ "declaration": {
2066
+ "name": "FlowButtonGroup",
2067
+ "module": "components/button-group/button-group.js"
2068
+ }
2069
+ },
2070
+ {
2071
+ "kind": "custom-element-definition",
2072
+ "name": "flow-ui-button-group",
2073
+ "declaration": {
2074
+ "name": "FlowButtonGroup",
2075
+ "module": "components/button-group/button-group.js"
2076
+ }
2077
+ }
2078
+ ]
2079
+ },
2080
2080
  {
2081
2081
  "kind": "javascript-module",
2082
2082
  "path": "components/calendar/calendar.component.js",
@@ -13911,30 +13911,39 @@
13911
13911
  },
13912
13912
  {
13913
13913
  "kind": "javascript-module",
13914
- "path": "components/split-view-divider/split-view-divider.component.js",
13914
+ "path": "components/split-view-2/split-view-2.component.js",
13915
13915
  "declarations": [
13916
13916
  {
13917
13917
  "kind": "class",
13918
13918
  "description": "",
13919
- "name": "FlowPanelDivider",
13919
+ "name": "FlowSplitView",
13920
13920
  "members": [
13921
13921
  {
13922
13922
  "kind": "field",
13923
- "name": "dragCanceller",
13923
+ "name": "dragging",
13924
13924
  "type": {
13925
- "text": "(() => void) | undefined"
13925
+ "text": "boolean"
13926
+ },
13927
+ "privacy": "private",
13928
+ "default": "false"
13929
+ },
13930
+ {
13931
+ "kind": "field",
13932
+ "name": "grid",
13933
+ "type": {
13934
+ "text": "HTMLDivElement"
13926
13935
  },
13927
13936
  "privacy": "private"
13928
13937
  },
13929
13938
  {
13930
13939
  "kind": "field",
13931
- "name": "disabled",
13940
+ "name": "panelSizes",
13932
13941
  "type": {
13933
- "text": "boolean"
13942
+ "text": "string"
13934
13943
  },
13935
- "default": "false",
13936
- "attribute": "disabled",
13937
- "reflects": true
13944
+ "privacy": "public",
13945
+ "default": "'1fr'",
13946
+ "attribute": "panel-sizes"
13938
13947
  },
13939
13948
  {
13940
13949
  "kind": "field",
@@ -13942,13 +13951,20 @@
13942
13951
  "type": {
13943
13952
  "text": "boolean"
13944
13953
  },
13945
- "default": "false",
13954
+ "privacy": "public",
13955
+ "default": "true",
13946
13956
  "attribute": "vertical",
13947
13957
  "reflects": true
13948
13958
  },
13949
13959
  {
13950
- "kind": "method",
13951
- "name": "cancelDrag"
13960
+ "kind": "field",
13961
+ "name": "dividerWidth",
13962
+ "type": {
13963
+ "text": "string"
13964
+ },
13965
+ "privacy": "public",
13966
+ "default": "'2px'",
13967
+ "attribute": "dividerWidth"
13952
13968
  },
13953
13969
  {
13954
13970
  "kind": "method",
@@ -13958,15 +13974,169 @@
13958
13974
  {
13959
13975
  "name": "event",
13960
13976
  "type": {
13961
- "text": "PointerEvent"
13977
+ "text": "CustomEvent<{ x: number; y: number }>"
13962
13978
  }
13963
13979
  }
13964
13980
  ]
13965
13981
  },
13966
13982
  {
13967
13983
  "kind": "method",
13968
- "name": "closestElement",
13969
- "privacy": "private",
13984
+ "name": "handleDragStart",
13985
+ "privacy": "private"
13986
+ },
13987
+ {
13988
+ "kind": "method",
13989
+ "name": "handleDragEnd",
13990
+ "privacy": "private"
13991
+ },
13992
+ {
13993
+ "kind": "method",
13994
+ "name": "calculatePanelSizes",
13995
+ "privacy": "private"
13996
+ },
13997
+ {
13998
+ "kind": "method",
13999
+ "name": "dividerTempate",
14000
+ "privacy": "private"
14001
+ },
14002
+ {
14003
+ "kind": "method",
14004
+ "name": "panelTemplate",
14005
+ "privacy": "private",
14006
+ "parameters": [
14007
+ {
14008
+ "name": "panelIndex",
14009
+ "type": {
14010
+ "text": "number"
14011
+ }
14012
+ }
14013
+ ]
14014
+ }
14015
+ ],
14016
+ "attributes": [
14017
+ {
14018
+ "name": "panel-sizes",
14019
+ "type": {
14020
+ "text": "string"
14021
+ },
14022
+ "default": "'1fr'",
14023
+ "fieldName": "panelSizes"
14024
+ },
14025
+ {
14026
+ "name": "vertical",
14027
+ "type": {
14028
+ "text": "boolean"
14029
+ },
14030
+ "default": "true",
14031
+ "fieldName": "vertical"
14032
+ },
14033
+ {
14034
+ "name": "dividerWidth",
14035
+ "type": {
14036
+ "text": "string"
14037
+ },
14038
+ "default": "'2px'",
14039
+ "fieldName": "dividerWidth"
14040
+ }
14041
+ ],
14042
+ "superclass": {
14043
+ "name": "FlowRdfElement",
14044
+ "module": "/src/internal/flow-ui-rdf-element"
14045
+ }
14046
+ }
14047
+ ],
14048
+ "exports": [
14049
+ {
14050
+ "kind": "js",
14051
+ "name": "default",
14052
+ "declaration": {
14053
+ "name": "FlowSplitView",
14054
+ "module": "components/split-view-2/split-view-2.component.js"
14055
+ }
14056
+ }
14057
+ ]
14058
+ },
14059
+ {
14060
+ "kind": "javascript-module",
14061
+ "path": "components/split-view-2/split-view-2.js",
14062
+ "declarations": [],
14063
+ "exports": [
14064
+ {
14065
+ "kind": "js",
14066
+ "name": "*",
14067
+ "declaration": {
14068
+ "name": "*",
14069
+ "package": "./split-view-2.component.js"
14070
+ }
14071
+ },
14072
+ {
14073
+ "kind": "js",
14074
+ "name": "default",
14075
+ "declaration": {
14076
+ "name": "FlowSplitView",
14077
+ "module": "components/split-view-2/split-view-2.js"
14078
+ }
14079
+ }
14080
+ ]
14081
+ },
14082
+ {
14083
+ "kind": "javascript-module",
14084
+ "path": "components/split-view-divider/split-view-divider.component.js",
14085
+ "declarations": [
14086
+ {
14087
+ "kind": "class",
14088
+ "description": "",
14089
+ "name": "FlowPanelDivider",
14090
+ "members": [
14091
+ {
14092
+ "kind": "field",
14093
+ "name": "dragCanceller",
14094
+ "type": {
14095
+ "text": "(() => void) | undefined"
14096
+ },
14097
+ "privacy": "private"
14098
+ },
14099
+ {
14100
+ "kind": "field",
14101
+ "name": "disabled",
14102
+ "type": {
14103
+ "text": "boolean"
14104
+ },
14105
+ "default": "false",
14106
+ "attribute": "disabled",
14107
+ "reflects": true
14108
+ },
14109
+ {
14110
+ "kind": "field",
14111
+ "name": "vertical",
14112
+ "type": {
14113
+ "text": "boolean"
14114
+ },
14115
+ "default": "false",
14116
+ "attribute": "vertical",
14117
+ "reflects": true
14118
+ },
14119
+ {
14120
+ "kind": "method",
14121
+ "name": "cancelDrag"
14122
+ },
14123
+ {
14124
+ "kind": "method",
14125
+ "name": "handleDrag",
14126
+ "privacy": "private",
14127
+ "parameters": [
14128
+ {
14129
+ "name": "event",
14130
+ "type": {
14131
+ "text": "PointerEvent"
14132
+ }
14133
+ }
14134
+ ]
14135
+ },
14136
+ {
14137
+ "kind": "method",
14138
+ "name": "closestElement",
14139
+ "privacy": "private",
13970
14140
  "return": {
13971
14141
  "type": {
13972
14142
  "text": "Element | null"
@@ -14274,1220 +14444,1050 @@
14274
14444
  },
14275
14445
  {
14276
14446
  "kind": "javascript-module",
14277
- "path": "components/split-view-2/split-view-2.component.js",
14447
+ "path": "components/split-view-toggle-button/split-view-toggle-button.component.js",
14278
14448
  "declarations": [
14279
14449
  {
14280
14450
  "kind": "class",
14281
14451
  "description": "",
14282
- "name": "FlowSplitView",
14452
+ "name": "FlowSplitViewToggleButton",
14283
14453
  "members": [
14284
14454
  {
14285
14455
  "kind": "field",
14286
- "name": "dragging",
14456
+ "name": "parentPane",
14287
14457
  "type": {
14288
- "text": "boolean"
14458
+ "text": "FlowSplitViewPane | null"
14289
14459
  },
14290
14460
  "privacy": "private",
14291
- "default": "false"
14461
+ "default": "null"
14292
14462
  },
14293
14463
  {
14294
14464
  "kind": "field",
14295
- "name": "grid",
14465
+ "name": "parentPanelObserver",
14296
14466
  "type": {
14297
- "text": "HTMLDivElement"
14467
+ "text": "MutationObserver | null"
14298
14468
  },
14299
- "privacy": "private"
14469
+ "privacy": "private",
14470
+ "default": "null"
14300
14471
  },
14301
14472
  {
14302
14473
  "kind": "field",
14303
- "name": "panelSizes",
14474
+ "name": "name",
14304
14475
  "type": {
14305
- "text": "string"
14476
+ "text": "string | undefined"
14306
14477
  },
14307
- "privacy": "public",
14308
- "default": "'1fr'",
14309
- "attribute": "panel-sizes"
14478
+ "description": "The icon name to use for the button.\nDefaults to system icon `chevron-right`.",
14479
+ "attribute": "name",
14480
+ "default": "'chevron-right'",
14481
+ "inheritedFrom": {
14482
+ "name": "FlowIconButton",
14483
+ "module": "components/icon-button/icon-button.component.js"
14484
+ }
14310
14485
  },
14311
14486
  {
14312
14487
  "kind": "field",
14313
- "name": "vertical",
14488
+ "name": "closed",
14314
14489
  "type": {
14315
14490
  "text": "boolean"
14316
14491
  },
14317
- "privacy": "public",
14318
- "default": "true",
14319
- "attribute": "vertical",
14492
+ "default": "false",
14493
+ "description": "Set to control the open/closed state of the parent split pane.",
14494
+ "attribute": "closed",
14320
14495
  "reflects": true
14321
14496
  },
14322
- {
14323
- "kind": "field",
14324
- "name": "dividerWidth",
14325
- "type": {
14326
- "text": "string"
14327
- },
14328
- "privacy": "public",
14329
- "default": "'2px'",
14330
- "attribute": "dividerWidth"
14331
- },
14332
14497
  {
14333
14498
  "kind": "method",
14334
- "name": "handleDrag",
14335
- "privacy": "private",
14499
+ "name": "handleClick",
14500
+ "privacy": "protected",
14336
14501
  "parameters": [
14337
14502
  {
14338
14503
  "name": "event",
14339
14504
  "type": {
14340
- "text": "CustomEvent<{ x: number; y: number }>"
14505
+ "text": "MouseEvent"
14341
14506
  }
14342
14507
  }
14343
- ]
14344
- },
14345
- {
14346
- "kind": "method",
14347
- "name": "handleDragStart",
14348
- "privacy": "private"
14349
- },
14350
- {
14351
- "kind": "method",
14352
- "name": "handleDragEnd",
14353
- "privacy": "private"
14354
- },
14355
- {
14356
- "kind": "method",
14357
- "name": "calculatePanelSizes",
14358
- "privacy": "private"
14359
- },
14360
- {
14361
- "kind": "method",
14362
- "name": "dividerTempate",
14363
- "privacy": "private"
14508
+ ],
14509
+ "inheritedFrom": {
14510
+ "name": "FlowIconButton",
14511
+ "module": "components/icon-button/icon-button.component.js"
14512
+ }
14364
14513
  },
14365
14514
  {
14366
14515
  "kind": "method",
14367
- "name": "panelTemplate",
14516
+ "name": "closestElement",
14368
14517
  "privacy": "private",
14518
+ "return": {
14519
+ "type": {
14520
+ "text": "Element | null"
14521
+ }
14522
+ },
14369
14523
  "parameters": [
14370
14524
  {
14371
- "name": "panelIndex",
14525
+ "name": "selector",
14372
14526
  "type": {
14373
- "text": "number"
14527
+ "text": "string"
14528
+ }
14529
+ },
14530
+ {
14531
+ "name": "base",
14532
+ "default": "this",
14533
+ "type": {
14534
+ "text": "Element"
14374
14535
  }
14375
14536
  }
14376
14537
  ]
14377
- }
14378
- ],
14379
- "attributes": [
14538
+ },
14380
14539
  {
14381
- "name": "panel-sizes",
14382
- "type": {
14383
- "text": "string"
14384
- },
14385
- "default": "'1fr'",
14386
- "fieldName": "panelSizes"
14540
+ "kind": "field",
14541
+ "name": "hasSlotController",
14542
+ "privacy": "private",
14543
+ "readonly": true,
14544
+ "default": "new HasSlotController(this, 'tooltip')",
14545
+ "inheritedFrom": {
14546
+ "name": "FlowIconButton",
14547
+ "module": "components/icon-button/icon-button.component.js"
14548
+ }
14387
14549
  },
14388
14550
  {
14389
- "name": "vertical",
14551
+ "kind": "field",
14552
+ "name": "tooltipAnimating",
14390
14553
  "type": {
14391
14554
  "text": "boolean"
14392
14555
  },
14393
- "default": "true",
14394
- "fieldName": "vertical"
14556
+ "privacy": "private",
14557
+ "default": "false",
14558
+ "inheritedFrom": {
14559
+ "name": "FlowIconButton",
14560
+ "module": "components/icon-button/icon-button.component.js"
14561
+ }
14395
14562
  },
14396
14563
  {
14397
- "name": "dividerWidth",
14564
+ "kind": "field",
14565
+ "name": "button",
14398
14566
  "type": {
14399
- "text": "string"
14567
+ "text": "HTMLButtonElement | HTMLLinkElement"
14400
14568
  },
14401
- "default": "'2px'",
14402
- "fieldName": "dividerWidth"
14403
- }
14404
- ],
14405
- "superclass": {
14406
- "name": "FlowRdfElement",
14407
- "module": "/src/internal/flow-ui-rdf-element"
14408
- }
14409
- }
14410
- ],
14411
- "exports": [
14412
- {
14413
- "kind": "js",
14414
- "name": "default",
14415
- "declaration": {
14416
- "name": "FlowSplitView",
14417
- "module": "components/split-view-2/split-view-2.component.js"
14418
- }
14419
- }
14420
- ]
14421
- },
14422
- {
14423
- "kind": "javascript-module",
14424
- "path": "components/split-view-2/split-view-2.js",
14425
- "declarations": [],
14426
- "exports": [
14427
- {
14428
- "kind": "js",
14429
- "name": "*",
14430
- "declaration": {
14431
- "name": "*",
14432
- "package": "./split-view-2.component.js"
14433
- }
14434
- },
14435
- {
14436
- "kind": "js",
14437
- "name": "default",
14438
- "declaration": {
14439
- "name": "FlowSplitView",
14440
- "module": "components/split-view-2/split-view-2.js"
14441
- }
14442
- }
14443
- ]
14444
- },
14445
- {
14446
- "kind": "javascript-module",
14447
- "path": "components/stepper/stepper.component.js",
14448
- "declarations": [
14449
- {
14450
- "kind": "class",
14451
- "description": "",
14452
- "name": "FlowStepper",
14453
- "cssProperties": [
14454
- {
14455
- "description": "The tab panel's padding.",
14456
- "name": "--padding"
14457
- }
14458
- ],
14459
- "cssParts": [
14460
- {
14461
- "description": "The component's base wrapper.",
14462
- "name": "base"
14463
- }
14464
- ],
14465
- "slots": [
14466
- {
14467
- "description": "The tab panel's content.",
14468
- "name": ""
14469
- }
14470
- ],
14471
- "members": [
14569
+ "inheritedFrom": {
14570
+ "name": "FlowIconButton",
14571
+ "module": "components/icon-button/icon-button.component.js"
14572
+ }
14573
+ },
14472
14574
  {
14473
14575
  "kind": "field",
14474
- "name": "bodySlot",
14576
+ "name": "tooltipElem",
14475
14577
  "type": {
14476
- "text": "HTMLSlotElement"
14578
+ "text": "FlowTooltip"
14579
+ },
14580
+ "inheritedFrom": {
14581
+ "name": "FlowIconButton",
14582
+ "module": "components/icon-button/icon-button.component.js"
14477
14583
  }
14478
14584
  },
14479
14585
  {
14480
14586
  "kind": "field",
14481
- "name": "headerScrollContainer",
14587
+ "name": "confirmButton",
14482
14588
  "type": {
14483
- "text": "HTMLDivElement"
14589
+ "text": "HTMLButtonElement"
14590
+ },
14591
+ "inheritedFrom": {
14592
+ "name": "FlowIconButton",
14593
+ "module": "components/icon-button/icon-button.component.js"
14484
14594
  }
14485
14595
  },
14486
14596
  {
14487
14597
  "kind": "field",
14488
- "name": "attrId",
14598
+ "name": "hasFocus",
14489
14599
  "type": {
14490
- "text": "number"
14600
+ "text": "boolean"
14491
14601
  },
14492
14602
  "privacy": "private",
14493
- "readonly": true,
14494
- "default": "++id"
14603
+ "default": "false",
14604
+ "inheritedFrom": {
14605
+ "name": "FlowIconButton",
14606
+ "module": "components/icon-button/icon-button.component.js"
14607
+ }
14495
14608
  },
14496
14609
  {
14497
14610
  "kind": "field",
14498
- "name": "componentId",
14499
- "privacy": "private",
14500
- "readonly": true,
14501
- "default": "`flow-ui-stepper-${this.attrId}`"
14611
+ "name": "library",
14612
+ "type": {
14613
+ "text": "string | undefined"
14614
+ },
14615
+ "description": "The name of a registered custom icon library.",
14616
+ "attribute": "library",
14617
+ "inheritedFrom": {
14618
+ "name": "FlowIconButton",
14619
+ "module": "components/icon-button/icon-button.component.js"
14620
+ }
14502
14621
  },
14503
14622
  {
14504
14623
  "kind": "field",
14505
- "name": "activePanel",
14624
+ "name": "src",
14506
14625
  "type": {
14507
- "text": "FlowStepperPanel | undefined"
14626
+ "text": "string | undefined"
14508
14627
  },
14509
- "privacy": "private"
14628
+ "description": "An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and\ncan result in XSS attacks.",
14629
+ "attribute": "src",
14630
+ "inheritedFrom": {
14631
+ "name": "FlowIconButton",
14632
+ "module": "components/icon-button/icon-button.component.js"
14633
+ }
14510
14634
  },
14511
14635
  {
14512
14636
  "kind": "field",
14513
- "name": "mutationObserver",
14637
+ "name": "href",
14514
14638
  "type": {
14515
- "text": "MutationObserver"
14639
+ "text": "string | undefined"
14516
14640
  },
14517
- "privacy": "private"
14641
+ "description": "When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.",
14642
+ "attribute": "href",
14643
+ "inheritedFrom": {
14644
+ "name": "FlowIconButton",
14645
+ "module": "components/icon-button/icon-button.component.js"
14646
+ }
14518
14647
  },
14519
14648
  {
14520
14649
  "kind": "field",
14521
- "name": "panels",
14650
+ "name": "target",
14522
14651
  "type": {
14523
- "text": "FlowStepperPanel[]"
14652
+ "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
14524
14653
  },
14525
- "privacy": "private",
14526
- "default": "[]"
14527
- },
14528
- {
14529
- "kind": "method",
14530
- "name": "setComplete",
14531
- "parameters": [
14532
- {
14533
- "name": "panelName",
14534
- "type": {
14535
- "text": "string"
14536
- }
14537
- },
14538
- {
14539
- "name": "complete",
14540
- "default": "true"
14541
- }
14542
- ]
14654
+ "description": "Tells the browser where to open the link. Only used when `href` is set.",
14655
+ "attribute": "target",
14656
+ "inheritedFrom": {
14657
+ "name": "FlowIconButton",
14658
+ "module": "components/icon-button/icon-button.component.js"
14659
+ }
14543
14660
  },
14544
14661
  {
14545
- "kind": "method",
14546
- "name": "show",
14547
- "parameters": [
14548
- {
14549
- "name": "panelName",
14550
- "type": {
14551
- "text": "string"
14552
- }
14553
- }
14554
- ]
14662
+ "kind": "field",
14663
+ "name": "download",
14664
+ "type": {
14665
+ "text": "string | undefined"
14666
+ },
14667
+ "description": "Tells the browser to download the linked file as this filename. Only used when `href` is set.",
14668
+ "attribute": "download",
14669
+ "inheritedFrom": {
14670
+ "name": "FlowIconButton",
14671
+ "module": "components/icon-button/icon-button.component.js"
14672
+ }
14555
14673
  },
14556
14674
  {
14557
- "kind": "method",
14558
- "name": "syncPanels",
14559
- "privacy": "private"
14675
+ "kind": "field",
14676
+ "name": "label",
14677
+ "type": {
14678
+ "text": "string"
14679
+ },
14680
+ "default": "''",
14681
+ "description": "A description that gets read by assistive devices. For optimal accessibility, you should always include a label\nthat describes what the icon button does.",
14682
+ "attribute": "label",
14683
+ "inheritedFrom": {
14684
+ "name": "FlowIconButton",
14685
+ "module": "components/icon-button/icon-button.component.js"
14686
+ }
14560
14687
  },
14561
14688
  {
14562
- "kind": "method",
14563
- "name": "getAllPanels",
14564
- "privacy": "private"
14689
+ "kind": "field",
14690
+ "name": "tooltip",
14691
+ "type": {
14692
+ "text": "string"
14693
+ },
14694
+ "default": "''",
14695
+ "description": "Tooltip text that gets displayed when the user hovers over the icon button. If you need to display HTML, use the\n`tooltip` slot instead.",
14696
+ "attribute": "tooltip",
14697
+ "inheritedFrom": {
14698
+ "name": "FlowIconButton",
14699
+ "module": "components/icon-button/icon-button.component.js"
14700
+ }
14565
14701
  },
14566
- {
14567
- "kind": "method",
14568
- "name": "setActivePanel",
14569
- "privacy": "private",
14570
- "parameters": [
14571
- {
14572
- "name": "panel",
14573
- "type": {
14574
- "text": "FlowStepperPanel"
14575
- }
14576
- },
14577
- {
14578
- "name": "options",
14579
- "optional": true,
14580
- "type": {
14581
- "text": "{ emitEvents?: boolean; scrollBehavior?: 'auto' | 'smooth' }"
14582
- }
14583
- }
14584
- ]
14585
- },
14586
- {
14587
- "kind": "method",
14588
- "name": "renderHeaderItem",
14589
- "parameters": [
14590
- {
14591
- "name": "panel",
14592
- "type": {
14593
- "text": "FlowStepperPanel"
14594
- }
14595
- },
14596
- {
14597
- "name": "index",
14598
- "type": {
14599
- "text": "number"
14600
- }
14601
- }
14602
- ]
14603
- },
14604
- {
14605
- "kind": "method",
14606
- "name": "renderHeader"
14607
- }
14608
- ],
14609
- "superclass": {
14610
- "name": "FlowRdfElement",
14611
- "module": "/src/internal/flow-ui-rdf-element"
14612
- },
14613
- "summary": "Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.",
14614
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tab-panel",
14615
- "status": "stable",
14616
- "since": "2.0"
14617
- }
14618
- ],
14619
- "exports": [
14620
- {
14621
- "kind": "js",
14622
- "name": "default",
14623
- "declaration": {
14624
- "name": "FlowStepper",
14625
- "module": "components/stepper/stepper.component.js"
14626
- }
14627
- }
14628
- ]
14629
- },
14630
- {
14631
- "kind": "javascript-module",
14632
- "path": "components/stepper/stepper.js",
14633
- "declarations": [],
14634
- "exports": [
14635
- {
14636
- "kind": "js",
14637
- "name": "*",
14638
- "declaration": {
14639
- "name": "*",
14640
- "package": "./stepper.component"
14641
- }
14642
- },
14643
- {
14644
- "kind": "js",
14645
- "name": "default",
14646
- "declaration": {
14647
- "name": "FlowStepper",
14648
- "module": "components/stepper/stepper.js"
14649
- }
14650
- }
14651
- ]
14652
- },
14653
- {
14654
- "kind": "javascript-module",
14655
- "path": "components/stepper-panel/stepper-panel.component.js",
14656
- "declarations": [
14657
- {
14658
- "kind": "class",
14659
- "description": "",
14660
- "name": "FlowStepperPanel",
14661
- "cssProperties": [
14662
- {
14663
- "description": "The tab panel's padding.",
14664
- "name": "--padding"
14665
- }
14666
- ],
14667
- "cssParts": [
14668
- {
14669
- "description": "The component's base wrapper.",
14670
- "name": "base"
14671
- }
14672
- ],
14673
- "slots": [
14674
- {
14675
- "description": "The tab panel's content.",
14676
- "name": ""
14677
- }
14678
- ],
14679
- "members": [
14680
14702
  {
14681
14703
  "kind": "field",
14682
- "name": "attrId",
14704
+ "name": "tooltipPlacement",
14683
14705
  "type": {
14684
- "text": "number"
14706
+ "text": "| 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end'"
14685
14707
  },
14686
- "privacy": "private",
14687
- "readonly": true,
14688
- "default": "++id"
14708
+ "default": "'top'",
14709
+ "description": "The preferred placement of the tooltip. Note that the actual placement may vary as needed to keep the tooltip\ninside of the viewport.",
14710
+ "attribute": "tooltip-placement",
14711
+ "inheritedFrom": {
14712
+ "name": "FlowIconButton",
14713
+ "module": "components/icon-button/icon-button.component.js"
14714
+ }
14689
14715
  },
14690
14716
  {
14691
14717
  "kind": "field",
14692
- "name": "componentId",
14693
- "privacy": "private",
14694
- "readonly": true,
14695
- "default": "`flow-ui-stepper-panel-${this.attrId}`"
14718
+ "name": "tooltipDistance",
14719
+ "type": {
14720
+ "text": "number"
14721
+ },
14722
+ "default": "8",
14723
+ "description": "The distance in pixels from which to offset the tooltip away from the icon button.",
14724
+ "attribute": "tooltip-distance",
14725
+ "inheritedFrom": {
14726
+ "name": "FlowIconButton",
14727
+ "module": "components/icon-button/icon-button.component.js"
14728
+ }
14696
14729
  },
14697
14730
  {
14698
14731
  "kind": "field",
14699
- "name": "name",
14732
+ "name": "tooltipSkidding",
14700
14733
  "type": {
14701
- "text": "string"
14734
+ "text": "number"
14702
14735
  },
14703
- "default": "''",
14704
- "description": "The tab panel's name.",
14705
- "attribute": "name",
14706
- "reflects": true
14736
+ "default": "0",
14737
+ "description": "The distance in pixels from which to offset the tooltip along the icon button.",
14738
+ "attribute": "tooltip-skidding",
14739
+ "inheritedFrom": {
14740
+ "name": "FlowIconButton",
14741
+ "module": "components/icon-button/icon-button.component.js"
14742
+ }
14707
14743
  },
14708
14744
  {
14709
14745
  "kind": "field",
14710
- "name": "title",
14746
+ "name": "disabled",
14711
14747
  "type": {
14712
- "text": "string"
14748
+ "text": "boolean"
14713
14749
  },
14714
- "default": "''",
14715
- "attribute": "title",
14716
- "reflects": true
14750
+ "default": "false",
14751
+ "description": "Disables the button.",
14752
+ "attribute": "disabled",
14753
+ "reflects": true,
14754
+ "inheritedFrom": {
14755
+ "name": "FlowIconButton",
14756
+ "module": "components/icon-button/icon-button.component.js"
14757
+ }
14717
14758
  },
14718
14759
  {
14719
14760
  "kind": "field",
14720
- "name": "subTitle",
14761
+ "name": "confirm",
14721
14762
  "type": {
14722
14763
  "text": "string"
14723
14764
  },
14724
14765
  "default": "''",
14725
- "attribute": "sub-title",
14726
- "reflects": true
14766
+ "description": "Confirmation text that gets displayed in a tooltip when the user clicks the icon button.\n If you need to display HTML, use the `confirm` slot instead.",
14767
+ "attribute": "confirm",
14768
+ "inheritedFrom": {
14769
+ "name": "FlowIconButton",
14770
+ "module": "components/icon-button/icon-button.component.js"
14771
+ }
14727
14772
  },
14728
14773
  {
14729
- "kind": "field",
14730
- "name": "active",
14731
- "type": {
14732
- "text": "boolean"
14733
- },
14734
- "default": "false",
14735
- "description": "When true, the tab panel will be shown.",
14736
- "attribute": "active",
14737
- "reflects": true
14774
+ "kind": "method",
14775
+ "name": "handleBlur",
14776
+ "privacy": "private",
14777
+ "inheritedFrom": {
14778
+ "name": "FlowIconButton",
14779
+ "module": "components/icon-button/icon-button.component.js"
14780
+ }
14738
14781
  },
14739
14782
  {
14740
- "kind": "field",
14741
- "name": "complete",
14742
- "type": {
14743
- "text": "boolean"
14744
- },
14745
- "default": "false",
14746
- "description": "When true, the tab panel is marked as complete",
14747
- "attribute": "complete",
14748
- "reflects": true
14783
+ "kind": "method",
14784
+ "name": "handleFocus",
14785
+ "privacy": "private",
14786
+ "inheritedFrom": {
14787
+ "name": "FlowIconButton",
14788
+ "module": "components/icon-button/icon-button.component.js"
14789
+ }
14749
14790
  },
14750
14791
  {
14751
14792
  "kind": "method",
14752
- "name": "handleStateChange"
14753
- }
14754
- ],
14755
- "attributes": [
14793
+ "name": "click",
14794
+ "description": "Simulates a click on the icon button.",
14795
+ "inheritedFrom": {
14796
+ "name": "FlowIconButton",
14797
+ "module": "components/icon-button/icon-button.component.js"
14798
+ }
14799
+ },
14756
14800
  {
14757
- "name": "name",
14758
- "type": {
14759
- "text": "string"
14760
- },
14761
- "default": "''",
14762
- "description": "The tab panel's name.",
14763
- "fieldName": "name"
14801
+ "kind": "method",
14802
+ "name": "focus",
14803
+ "parameters": [
14804
+ {
14805
+ "name": "options",
14806
+ "optional": true,
14807
+ "type": {
14808
+ "text": "FocusOptions"
14809
+ }
14810
+ }
14811
+ ],
14812
+ "description": "Sets focus on the icon button.",
14813
+ "inheritedFrom": {
14814
+ "name": "FlowIconButton",
14815
+ "module": "components/icon-button/icon-button.component.js"
14816
+ }
14764
14817
  },
14765
14818
  {
14766
- "name": "title",
14767
- "type": {
14768
- "text": "string"
14769
- },
14770
- "default": "''",
14771
- "fieldName": "title"
14819
+ "kind": "method",
14820
+ "name": "blur",
14821
+ "description": "Removes focus from the icon button.",
14822
+ "inheritedFrom": {
14823
+ "name": "FlowIconButton",
14824
+ "module": "components/icon-button/icon-button.component.js"
14825
+ }
14772
14826
  },
14773
14827
  {
14774
- "name": "sub-title",
14775
- "type": {
14776
- "text": "string"
14777
- },
14778
- "default": "''",
14779
- "fieldName": "subTitle"
14828
+ "kind": "method",
14829
+ "name": "hideConfirm",
14830
+ "description": "Hide the confirmation tooltip if it is showing",
14831
+ "inheritedFrom": {
14832
+ "name": "FlowIconButton",
14833
+ "module": "components/icon-button/icon-button.component.js"
14834
+ }
14780
14835
  },
14781
14836
  {
14782
- "name": "active",
14837
+ "kind": "method",
14838
+ "name": "showConfirm",
14839
+ "description": "Show the confirmation tooltip",
14840
+ "inheritedFrom": {
14841
+ "name": "FlowIconButton",
14842
+ "module": "components/icon-button/icon-button.component.js"
14843
+ }
14844
+ },
14845
+ {
14846
+ "kind": "method",
14847
+ "name": "handleConfirmClick",
14848
+ "privacy": "private",
14849
+ "inheritedFrom": {
14850
+ "name": "FlowIconButton",
14851
+ "module": "components/icon-button/icon-button.component.js"
14852
+ }
14853
+ },
14854
+ {
14855
+ "kind": "method",
14856
+ "name": "renderWithTooltip",
14857
+ "privacy": "private",
14858
+ "parameters": [
14859
+ {
14860
+ "name": "contents",
14861
+ "type": {
14862
+ "text": "TemplateResult"
14863
+ }
14864
+ }
14865
+ ],
14866
+ "inheritedFrom": {
14867
+ "name": "FlowIconButton",
14868
+ "module": "components/icon-button/icon-button.component.js"
14869
+ }
14870
+ },
14871
+ {
14872
+ "kind": "method",
14873
+ "name": "renderWithConfirmation",
14874
+ "privacy": "private",
14875
+ "parameters": [
14876
+ {
14877
+ "name": "contents",
14878
+ "type": {
14879
+ "text": "TemplateResult"
14880
+ }
14881
+ }
14882
+ ],
14883
+ "inheritedFrom": {
14884
+ "name": "FlowIconButton",
14885
+ "module": "components/icon-button/icon-button.component.js"
14886
+ }
14887
+ }
14888
+ ],
14889
+ "attributes": [
14890
+ {
14891
+ "name": "name",
14783
14892
  "type": {
14784
- "text": "boolean"
14893
+ "text": "string | undefined"
14785
14894
  },
14786
- "default": "false",
14787
- "description": "When true, the tab panel will be shown.",
14788
- "fieldName": "active"
14895
+ "description": "The icon name to use for the button.\nDefaults to system icon `chevron-right`.",
14896
+ "fieldName": "name",
14897
+ "default": "'chevron-right'",
14898
+ "inheritedFrom": {
14899
+ "name": "FlowIconButton",
14900
+ "module": "src/components/icon-button/icon-button.component.ts"
14901
+ }
14789
14902
  },
14790
14903
  {
14791
- "name": "complete",
14904
+ "name": "closed",
14792
14905
  "type": {
14793
14906
  "text": "boolean"
14794
14907
  },
14795
14908
  "default": "false",
14796
- "description": "When true, the tab panel is marked as complete",
14797
- "fieldName": "complete"
14798
- }
14799
- ],
14800
- "superclass": {
14801
- "name": "FlowRdfElement",
14802
- "module": "/src/internal/flow-ui-rdf-element"
14803
- },
14804
- "summary": "Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.",
14805
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tab-panel",
14806
- "status": "stable",
14807
- "since": "2.0"
14808
- }
14809
- ],
14810
- "exports": [
14811
- {
14812
- "kind": "js",
14813
- "name": "default",
14814
- "declaration": {
14815
- "name": "FlowStepperPanel",
14816
- "module": "components/stepper-panel/stepper-panel.component.js"
14817
- }
14818
- }
14819
- ]
14820
- },
14821
- {
14822
- "kind": "javascript-module",
14823
- "path": "components/stepper-panel/stepper-panel.js",
14824
- "declarations": [],
14825
- "exports": [
14826
- {
14827
- "kind": "js",
14828
- "name": "*",
14829
- "declaration": {
14830
- "name": "*",
14831
- "package": "./stepper-panel.component"
14832
- }
14833
- },
14834
- {
14835
- "kind": "js",
14836
- "name": "default",
14837
- "declaration": {
14838
- "name": "FlowStepperPanel",
14839
- "module": "components/stepper-panel/stepper-panel.js"
14840
- }
14841
- }
14842
- ]
14843
- },
14844
- {
14845
- "kind": "javascript-module",
14846
- "path": "components/split-view-toggle-button/split-view-toggle-button.component.js",
14847
- "declarations": [
14848
- {
14849
- "kind": "class",
14850
- "description": "",
14851
- "name": "FlowSplitViewToggleButton",
14852
- "members": [
14853
- {
14854
- "kind": "field",
14855
- "name": "parentPane",
14856
- "type": {
14857
- "text": "FlowSplitViewPane | null"
14858
- },
14859
- "privacy": "private",
14860
- "default": "null"
14909
+ "description": "Set to control the open/closed state of the parent split pane.",
14910
+ "fieldName": "closed"
14861
14911
  },
14862
14912
  {
14863
- "kind": "field",
14864
- "name": "parentPanelObserver",
14913
+ "name": "library",
14865
14914
  "type": {
14866
- "text": "MutationObserver | null"
14915
+ "text": "string | undefined"
14867
14916
  },
14868
- "privacy": "private",
14869
- "default": "null"
14917
+ "description": "The name of a registered custom icon library.",
14918
+ "fieldName": "library",
14919
+ "inheritedFrom": {
14920
+ "name": "FlowIconButton",
14921
+ "module": "src/components/icon-button/icon-button.component.ts"
14922
+ }
14870
14923
  },
14871
14924
  {
14872
- "kind": "field",
14873
- "name": "name",
14925
+ "name": "src",
14874
14926
  "type": {
14875
14927
  "text": "string | undefined"
14876
14928
  },
14877
- "description": "The icon name to use for the button.\nDefaults to system icon `chevron-right`.",
14878
- "attribute": "name",
14879
- "default": "'chevron-right'",
14929
+ "description": "An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and\ncan result in XSS attacks.",
14930
+ "fieldName": "src",
14880
14931
  "inheritedFrom": {
14881
14932
  "name": "FlowIconButton",
14882
- "module": "components/icon-button/icon-button.component.js"
14933
+ "module": "src/components/icon-button/icon-button.component.ts"
14883
14934
  }
14884
14935
  },
14885
14936
  {
14886
- "kind": "field",
14887
- "name": "closed",
14937
+ "name": "href",
14888
14938
  "type": {
14889
- "text": "boolean"
14939
+ "text": "string | undefined"
14890
14940
  },
14891
- "default": "false",
14892
- "description": "Set to control the open/closed state of the parent split pane.",
14893
- "attribute": "closed",
14894
- "reflects": true
14895
- },
14896
- {
14897
- "kind": "method",
14898
- "name": "handleClick",
14899
- "privacy": "protected",
14900
- "parameters": [
14901
- {
14902
- "name": "event",
14903
- "type": {
14904
- "text": "MouseEvent"
14905
- }
14906
- }
14907
- ],
14941
+ "description": "When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.",
14942
+ "fieldName": "href",
14908
14943
  "inheritedFrom": {
14909
14944
  "name": "FlowIconButton",
14910
- "module": "components/icon-button/icon-button.component.js"
14945
+ "module": "src/components/icon-button/icon-button.component.ts"
14911
14946
  }
14912
14947
  },
14913
14948
  {
14914
- "kind": "method",
14915
- "name": "closestElement",
14916
- "privacy": "private",
14917
- "return": {
14918
- "type": {
14919
- "text": "Element | null"
14920
- }
14949
+ "name": "target",
14950
+ "type": {
14951
+ "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
14921
14952
  },
14922
- "parameters": [
14923
- {
14924
- "name": "selector",
14925
- "type": {
14926
- "text": "string"
14927
- }
14928
- },
14929
- {
14930
- "name": "base",
14931
- "default": "this",
14932
- "type": {
14933
- "text": "Element"
14934
- }
14935
- }
14936
- ]
14937
- },
14938
- {
14939
- "kind": "field",
14940
- "name": "hasSlotController",
14941
- "privacy": "private",
14942
- "readonly": true,
14943
- "default": "new HasSlotController(this, 'tooltip')",
14953
+ "description": "Tells the browser where to open the link. Only used when `href` is set.",
14954
+ "fieldName": "target",
14944
14955
  "inheritedFrom": {
14945
14956
  "name": "FlowIconButton",
14946
- "module": "components/icon-button/icon-button.component.js"
14957
+ "module": "src/components/icon-button/icon-button.component.ts"
14947
14958
  }
14948
14959
  },
14949
14960
  {
14950
- "kind": "field",
14951
- "name": "tooltipAnimating",
14961
+ "name": "download",
14952
14962
  "type": {
14953
- "text": "boolean"
14963
+ "text": "string | undefined"
14954
14964
  },
14955
- "privacy": "private",
14956
- "default": "false",
14965
+ "description": "Tells the browser to download the linked file as this filename. Only used when `href` is set.",
14966
+ "fieldName": "download",
14957
14967
  "inheritedFrom": {
14958
14968
  "name": "FlowIconButton",
14959
- "module": "components/icon-button/icon-button.component.js"
14969
+ "module": "src/components/icon-button/icon-button.component.ts"
14960
14970
  }
14961
14971
  },
14962
14972
  {
14963
- "kind": "field",
14964
- "name": "button",
14973
+ "name": "label",
14965
14974
  "type": {
14966
- "text": "HTMLButtonElement | HTMLLinkElement"
14975
+ "text": "string"
14967
14976
  },
14977
+ "default": "''",
14978
+ "description": "A description that gets read by assistive devices. For optimal accessibility, you should always include a label\nthat describes what the icon button does.",
14979
+ "fieldName": "label",
14968
14980
  "inheritedFrom": {
14969
14981
  "name": "FlowIconButton",
14970
- "module": "components/icon-button/icon-button.component.js"
14982
+ "module": "src/components/icon-button/icon-button.component.ts"
14971
14983
  }
14972
14984
  },
14973
14985
  {
14974
- "kind": "field",
14975
- "name": "tooltipElem",
14986
+ "name": "tooltip",
14976
14987
  "type": {
14977
- "text": "FlowTooltip"
14988
+ "text": "string"
14978
14989
  },
14990
+ "default": "''",
14991
+ "description": "Tooltip text that gets displayed when the user hovers over the icon button. If you need to display HTML, use the\n`tooltip` slot instead.",
14992
+ "fieldName": "tooltip",
14979
14993
  "inheritedFrom": {
14980
14994
  "name": "FlowIconButton",
14981
- "module": "components/icon-button/icon-button.component.js"
14995
+ "module": "src/components/icon-button/icon-button.component.ts"
14982
14996
  }
14983
14997
  },
14984
14998
  {
14985
- "kind": "field",
14986
- "name": "confirmButton",
14999
+ "name": "tooltip-placement",
14987
15000
  "type": {
14988
- "text": "HTMLButtonElement"
15001
+ "text": "| 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end'"
14989
15002
  },
15003
+ "default": "'top'",
15004
+ "description": "The preferred placement of the tooltip. Note that the actual placement may vary as needed to keep the tooltip\ninside of the viewport.",
15005
+ "fieldName": "tooltipPlacement",
14990
15006
  "inheritedFrom": {
14991
15007
  "name": "FlowIconButton",
14992
- "module": "components/icon-button/icon-button.component.js"
15008
+ "module": "src/components/icon-button/icon-button.component.ts"
14993
15009
  }
14994
15010
  },
14995
15011
  {
14996
- "kind": "field",
14997
- "name": "hasFocus",
15012
+ "name": "tooltip-distance",
14998
15013
  "type": {
14999
- "text": "boolean"
15014
+ "text": "number"
15000
15015
  },
15001
- "privacy": "private",
15002
- "default": "false",
15016
+ "default": "8",
15017
+ "description": "The distance in pixels from which to offset the tooltip away from the icon button.",
15018
+ "fieldName": "tooltipDistance",
15003
15019
  "inheritedFrom": {
15004
15020
  "name": "FlowIconButton",
15005
- "module": "components/icon-button/icon-button.component.js"
15021
+ "module": "src/components/icon-button/icon-button.component.ts"
15006
15022
  }
15007
15023
  },
15008
15024
  {
15009
- "kind": "field",
15010
- "name": "library",
15025
+ "name": "tooltip-skidding",
15011
15026
  "type": {
15012
- "text": "string | undefined"
15027
+ "text": "number"
15013
15028
  },
15014
- "description": "The name of a registered custom icon library.",
15015
- "attribute": "library",
15029
+ "default": "0",
15030
+ "description": "The distance in pixels from which to offset the tooltip along the icon button.",
15031
+ "fieldName": "tooltipSkidding",
15016
15032
  "inheritedFrom": {
15017
15033
  "name": "FlowIconButton",
15018
- "module": "components/icon-button/icon-button.component.js"
15034
+ "module": "src/components/icon-button/icon-button.component.ts"
15019
15035
  }
15020
15036
  },
15021
15037
  {
15022
- "kind": "field",
15023
- "name": "src",
15038
+ "name": "disabled",
15024
15039
  "type": {
15025
- "text": "string | undefined"
15040
+ "text": "boolean"
15026
15041
  },
15027
- "description": "An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and\ncan result in XSS attacks.",
15028
- "attribute": "src",
15042
+ "default": "false",
15043
+ "description": "Disables the button.",
15044
+ "fieldName": "disabled",
15029
15045
  "inheritedFrom": {
15030
15046
  "name": "FlowIconButton",
15031
- "module": "components/icon-button/icon-button.component.js"
15047
+ "module": "src/components/icon-button/icon-button.component.ts"
15032
15048
  }
15033
15049
  },
15034
15050
  {
15035
- "kind": "field",
15036
- "name": "href",
15051
+ "name": "confirm",
15037
15052
  "type": {
15038
- "text": "string | undefined"
15053
+ "text": "string"
15039
15054
  },
15040
- "description": "When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.",
15041
- "attribute": "href",
15055
+ "default": "''",
15056
+ "description": "Confirmation text that gets displayed in a tooltip when the user clicks the icon button.\n If you need to display HTML, use the `confirm` slot instead.",
15057
+ "fieldName": "confirm",
15042
15058
  "inheritedFrom": {
15043
15059
  "name": "FlowIconButton",
15044
- "module": "components/icon-button/icon-button.component.js"
15060
+ "module": "src/components/icon-button/icon-button.component.ts"
15045
15061
  }
15046
- },
15062
+ }
15063
+ ],
15064
+ "superclass": {
15065
+ "name": "FlowIconButton",
15066
+ "module": "/src/components/icon-button/icon-button.component"
15067
+ },
15068
+ "summary": "Use a split panel toggle button to control a parent panel's open/closed state",
15069
+ "dependencies": [
15070
+ "flow-ui-icon-button"
15071
+ ],
15072
+ "events": [
15047
15073
  {
15048
- "kind": "field",
15049
- "name": "target",
15050
- "type": {
15051
- "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
15052
- },
15053
- "description": "Tells the browser where to open the link. Only used when `href` is set.",
15054
- "attribute": "target",
15074
+ "description": "Emitted when the icon button loses focus.",
15075
+ "name": "flow-ui-blur",
15076
+ "reactName": "onFlowUiBlur",
15055
15077
  "inheritedFrom": {
15056
15078
  "name": "FlowIconButton",
15057
- "module": "components/icon-button/icon-button.component.js"
15079
+ "module": "src/components/icon-button/icon-button.component.ts"
15058
15080
  }
15059
15081
  },
15060
15082
  {
15061
- "kind": "field",
15062
- "name": "download",
15063
- "type": {
15064
- "text": "string | undefined"
15065
- },
15066
- "description": "Tells the browser to download the linked file as this filename. Only used when `href` is set.",
15067
- "attribute": "download",
15083
+ "description": "Emitted when the icon button gains focus.",
15084
+ "name": "flow-ui-focus",
15085
+ "reactName": "onFlowUiFocus",
15068
15086
  "inheritedFrom": {
15069
15087
  "name": "FlowIconButton",
15070
- "module": "components/icon-button/icon-button.component.js"
15088
+ "module": "src/components/icon-button/icon-button.component.ts"
15071
15089
  }
15072
- },
15090
+ }
15091
+ ]
15092
+ }
15093
+ ],
15094
+ "exports": [
15095
+ {
15096
+ "kind": "js",
15097
+ "name": "default",
15098
+ "declaration": {
15099
+ "name": "FlowSplitViewToggleButton",
15100
+ "module": "components/split-view-toggle-button/split-view-toggle-button.component.js"
15101
+ }
15102
+ }
15103
+ ]
15104
+ },
15105
+ {
15106
+ "kind": "javascript-module",
15107
+ "path": "components/split-view-toggle-button/split-view-toggle-button.js",
15108
+ "declarations": [],
15109
+ "exports": [
15110
+ {
15111
+ "kind": "js",
15112
+ "name": "*",
15113
+ "declaration": {
15114
+ "name": "*",
15115
+ "package": "./split-view-toggle-button.component.js"
15116
+ }
15117
+ },
15118
+ {
15119
+ "kind": "js",
15120
+ "name": "default",
15121
+ "declaration": {
15122
+ "name": "FlowSplitViewToggleButton",
15123
+ "module": "components/split-view-toggle-button/split-view-toggle-button.js"
15124
+ }
15125
+ }
15126
+ ]
15127
+ },
15128
+ {
15129
+ "kind": "javascript-module",
15130
+ "path": "components/stepper/stepper.component.js",
15131
+ "declarations": [
15132
+ {
15133
+ "kind": "class",
15134
+ "description": "",
15135
+ "name": "FlowStepper",
15136
+ "cssProperties": [
15137
+ {
15138
+ "description": "The tab panel's padding.",
15139
+ "name": "--padding"
15140
+ }
15141
+ ],
15142
+ "cssParts": [
15143
+ {
15144
+ "description": "The component's base wrapper.",
15145
+ "name": "base"
15146
+ }
15147
+ ],
15148
+ "slots": [
15149
+ {
15150
+ "description": "The tab panel's content.",
15151
+ "name": ""
15152
+ }
15153
+ ],
15154
+ "members": [
15073
15155
  {
15074
15156
  "kind": "field",
15075
- "name": "label",
15157
+ "name": "bodySlot",
15076
15158
  "type": {
15077
- "text": "string"
15078
- },
15079
- "default": "''",
15080
- "description": "A description that gets read by assistive devices. For optimal accessibility, you should always include a label\nthat describes what the icon button does.",
15081
- "attribute": "label",
15082
- "inheritedFrom": {
15083
- "name": "FlowIconButton",
15084
- "module": "components/icon-button/icon-button.component.js"
15159
+ "text": "HTMLSlotElement"
15085
15160
  }
15086
15161
  },
15087
15162
  {
15088
15163
  "kind": "field",
15089
- "name": "tooltip",
15164
+ "name": "headerScrollContainer",
15090
15165
  "type": {
15091
- "text": "string"
15092
- },
15093
- "default": "''",
15094
- "description": "Tooltip text that gets displayed when the user hovers over the icon button. If you need to display HTML, use the\n`tooltip` slot instead.",
15095
- "attribute": "tooltip",
15096
- "inheritedFrom": {
15097
- "name": "FlowIconButton",
15098
- "module": "components/icon-button/icon-button.component.js"
15166
+ "text": "HTMLDivElement"
15099
15167
  }
15100
15168
  },
15101
15169
  {
15102
15170
  "kind": "field",
15103
- "name": "tooltipPlacement",
15171
+ "name": "attrId",
15104
15172
  "type": {
15105
- "text": "| 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end'"
15173
+ "text": "number"
15106
15174
  },
15107
- "default": "'top'",
15108
- "description": "The preferred placement of the tooltip. Note that the actual placement may vary as needed to keep the tooltip\ninside of the viewport.",
15109
- "attribute": "tooltip-placement",
15110
- "inheritedFrom": {
15111
- "name": "FlowIconButton",
15112
- "module": "components/icon-button/icon-button.component.js"
15113
- }
15175
+ "privacy": "private",
15176
+ "readonly": true,
15177
+ "default": "++id"
15114
15178
  },
15115
15179
  {
15116
15180
  "kind": "field",
15117
- "name": "tooltipDistance",
15118
- "type": {
15119
- "text": "number"
15120
- },
15121
- "default": "8",
15122
- "description": "The distance in pixels from which to offset the tooltip away from the icon button.",
15123
- "attribute": "tooltip-distance",
15124
- "inheritedFrom": {
15125
- "name": "FlowIconButton",
15126
- "module": "components/icon-button/icon-button.component.js"
15127
- }
15181
+ "name": "componentId",
15182
+ "privacy": "private",
15183
+ "readonly": true,
15184
+ "default": "`flow-ui-stepper-${this.attrId}`"
15128
15185
  },
15129
15186
  {
15130
15187
  "kind": "field",
15131
- "name": "tooltipSkidding",
15188
+ "name": "activePanel",
15132
15189
  "type": {
15133
- "text": "number"
15190
+ "text": "FlowStepperPanel | undefined"
15134
15191
  },
15135
- "default": "0",
15136
- "description": "The distance in pixels from which to offset the tooltip along the icon button.",
15137
- "attribute": "tooltip-skidding",
15138
- "inheritedFrom": {
15139
- "name": "FlowIconButton",
15140
- "module": "components/icon-button/icon-button.component.js"
15141
- }
15192
+ "privacy": "private"
15142
15193
  },
15143
15194
  {
15144
15195
  "kind": "field",
15145
- "name": "disabled",
15196
+ "name": "mutationObserver",
15146
15197
  "type": {
15147
- "text": "boolean"
15198
+ "text": "MutationObserver"
15148
15199
  },
15149
- "default": "false",
15150
- "description": "Disables the button.",
15151
- "attribute": "disabled",
15152
- "reflects": true,
15153
- "inheritedFrom": {
15154
- "name": "FlowIconButton",
15155
- "module": "components/icon-button/icon-button.component.js"
15156
- }
15200
+ "privacy": "private"
15157
15201
  },
15158
15202
  {
15159
15203
  "kind": "field",
15160
- "name": "confirm",
15204
+ "name": "panels",
15161
15205
  "type": {
15162
- "text": "string"
15206
+ "text": "FlowStepperPanel[]"
15163
15207
  },
15164
- "default": "''",
15165
- "description": "Confirmation text that gets displayed in a tooltip when the user clicks the icon button.\n If you need to display HTML, use the `confirm` slot instead.",
15166
- "attribute": "confirm",
15167
- "inheritedFrom": {
15168
- "name": "FlowIconButton",
15169
- "module": "components/icon-button/icon-button.component.js"
15170
- }
15171
- },
15172
- {
15173
- "kind": "method",
15174
- "name": "handleBlur",
15175
- "privacy": "private",
15176
- "inheritedFrom": {
15177
- "name": "FlowIconButton",
15178
- "module": "components/icon-button/icon-button.component.js"
15179
- }
15180
- },
15181
- {
15182
- "kind": "method",
15183
- "name": "handleFocus",
15184
15208
  "privacy": "private",
15185
- "inheritedFrom": {
15186
- "name": "FlowIconButton",
15187
- "module": "components/icon-button/icon-button.component.js"
15188
- }
15189
- },
15190
- {
15191
- "kind": "method",
15192
- "name": "click",
15193
- "description": "Simulates a click on the icon button.",
15194
- "inheritedFrom": {
15195
- "name": "FlowIconButton",
15196
- "module": "components/icon-button/icon-button.component.js"
15197
- }
15209
+ "default": "[]"
15198
15210
  },
15199
15211
  {
15200
15212
  "kind": "method",
15201
- "name": "focus",
15213
+ "name": "setComplete",
15202
15214
  "parameters": [
15203
15215
  {
15204
- "name": "options",
15205
- "optional": true,
15216
+ "name": "panelName",
15206
15217
  "type": {
15207
- "text": "FocusOptions"
15218
+ "text": "string"
15208
15219
  }
15220
+ },
15221
+ {
15222
+ "name": "complete",
15223
+ "default": "true"
15209
15224
  }
15210
- ],
15211
- "description": "Sets focus on the icon button.",
15212
- "inheritedFrom": {
15213
- "name": "FlowIconButton",
15214
- "module": "components/icon-button/icon-button.component.js"
15215
- }
15225
+ ]
15216
15226
  },
15217
15227
  {
15218
15228
  "kind": "method",
15219
- "name": "blur",
15220
- "description": "Removes focus from the icon button.",
15221
- "inheritedFrom": {
15222
- "name": "FlowIconButton",
15223
- "module": "components/icon-button/icon-button.component.js"
15224
- }
15229
+ "name": "show",
15230
+ "parameters": [
15231
+ {
15232
+ "name": "panelName",
15233
+ "type": {
15234
+ "text": "string"
15235
+ }
15236
+ }
15237
+ ]
15225
15238
  },
15226
15239
  {
15227
15240
  "kind": "method",
15228
- "name": "hideConfirm",
15229
- "description": "Hide the confirmation tooltip if it is showing",
15230
- "inheritedFrom": {
15231
- "name": "FlowIconButton",
15232
- "module": "components/icon-button/icon-button.component.js"
15233
- }
15241
+ "name": "syncPanels",
15242
+ "privacy": "private"
15234
15243
  },
15235
15244
  {
15236
15245
  "kind": "method",
15237
- "name": "showConfirm",
15238
- "description": "Show the confirmation tooltip",
15239
- "inheritedFrom": {
15240
- "name": "FlowIconButton",
15241
- "module": "components/icon-button/icon-button.component.js"
15242
- }
15246
+ "name": "getAllPanels",
15247
+ "privacy": "private"
15243
15248
  },
15244
15249
  {
15245
15250
  "kind": "method",
15246
- "name": "handleConfirmClick",
15251
+ "name": "setActivePanel",
15247
15252
  "privacy": "private",
15248
- "inheritedFrom": {
15249
- "name": "FlowIconButton",
15250
- "module": "components/icon-button/icon-button.component.js"
15251
- }
15253
+ "parameters": [
15254
+ {
15255
+ "name": "panel",
15256
+ "type": {
15257
+ "text": "FlowStepperPanel"
15258
+ }
15259
+ },
15260
+ {
15261
+ "name": "options",
15262
+ "optional": true,
15263
+ "type": {
15264
+ "text": "{ emitEvents?: boolean; scrollBehavior?: 'auto' | 'smooth' }"
15265
+ }
15266
+ }
15267
+ ]
15252
15268
  },
15253
15269
  {
15254
15270
  "kind": "method",
15255
- "name": "renderWithTooltip",
15256
- "privacy": "private",
15271
+ "name": "renderHeaderItem",
15257
15272
  "parameters": [
15258
15273
  {
15259
- "name": "contents",
15274
+ "name": "panel",
15260
15275
  "type": {
15261
- "text": "TemplateResult"
15276
+ "text": "FlowStepperPanel"
15277
+ }
15278
+ },
15279
+ {
15280
+ "name": "index",
15281
+ "type": {
15282
+ "text": "number"
15262
15283
  }
15263
15284
  }
15264
- ],
15265
- "inheritedFrom": {
15266
- "name": "FlowIconButton",
15267
- "module": "components/icon-button/icon-button.component.js"
15268
- }
15285
+ ]
15269
15286
  },
15270
15287
  {
15271
- "kind": "method",
15272
- "name": "renderWithConfirmation",
15273
- "privacy": "private",
15274
- "parameters": [
15275
- {
15276
- "name": "contents",
15277
- "type": {
15278
- "text": "TemplateResult"
15279
- }
15280
- }
15281
- ],
15282
- "inheritedFrom": {
15283
- "name": "FlowIconButton",
15284
- "module": "components/icon-button/icon-button.component.js"
15285
- }
15288
+ "kind": "method",
15289
+ "name": "renderHeader"
15290
+ }
15291
+ ],
15292
+ "superclass": {
15293
+ "name": "FlowRdfElement",
15294
+ "module": "/src/internal/flow-ui-rdf-element"
15295
+ },
15296
+ "summary": "Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.",
15297
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tab-panel",
15298
+ "status": "stable",
15299
+ "since": "2.0"
15300
+ }
15301
+ ],
15302
+ "exports": [
15303
+ {
15304
+ "kind": "js",
15305
+ "name": "default",
15306
+ "declaration": {
15307
+ "name": "FlowStepper",
15308
+ "module": "components/stepper/stepper.component.js"
15309
+ }
15310
+ }
15311
+ ]
15312
+ },
15313
+ {
15314
+ "kind": "javascript-module",
15315
+ "path": "components/stepper/stepper.js",
15316
+ "declarations": [],
15317
+ "exports": [
15318
+ {
15319
+ "kind": "js",
15320
+ "name": "*",
15321
+ "declaration": {
15322
+ "name": "*",
15323
+ "package": "./stepper.component"
15324
+ }
15325
+ },
15326
+ {
15327
+ "kind": "js",
15328
+ "name": "default",
15329
+ "declaration": {
15330
+ "name": "FlowStepper",
15331
+ "module": "components/stepper/stepper.js"
15332
+ }
15333
+ }
15334
+ ]
15335
+ },
15336
+ {
15337
+ "kind": "javascript-module",
15338
+ "path": "components/stepper-panel/stepper-panel.component.js",
15339
+ "declarations": [
15340
+ {
15341
+ "kind": "class",
15342
+ "description": "",
15343
+ "name": "FlowStepperPanel",
15344
+ "cssProperties": [
15345
+ {
15346
+ "description": "The tab panel's padding.",
15347
+ "name": "--padding"
15286
15348
  }
15287
15349
  ],
15288
- "attributes": [
15350
+ "cssParts": [
15289
15351
  {
15290
- "name": "name",
15352
+ "description": "The component's base wrapper.",
15353
+ "name": "base"
15354
+ }
15355
+ ],
15356
+ "slots": [
15357
+ {
15358
+ "description": "The tab panel's content.",
15359
+ "name": ""
15360
+ }
15361
+ ],
15362
+ "members": [
15363
+ {
15364
+ "kind": "field",
15365
+ "name": "attrId",
15291
15366
  "type": {
15292
- "text": "string | undefined"
15367
+ "text": "number"
15293
15368
  },
15294
- "description": "The icon name to use for the button.\nDefaults to system icon `chevron-right`.",
15295
- "fieldName": "name",
15296
- "default": "'chevron-right'",
15297
- "inheritedFrom": {
15298
- "name": "FlowIconButton",
15299
- "module": "src/components/icon-button/icon-button.component.ts"
15300
- }
15369
+ "privacy": "private",
15370
+ "readonly": true,
15371
+ "default": "++id"
15301
15372
  },
15302
15373
  {
15303
- "name": "closed",
15304
- "type": {
15305
- "text": "boolean"
15306
- },
15307
- "default": "false",
15308
- "description": "Set to control the open/closed state of the parent split pane.",
15309
- "fieldName": "closed"
15374
+ "kind": "field",
15375
+ "name": "componentId",
15376
+ "privacy": "private",
15377
+ "readonly": true,
15378
+ "default": "`flow-ui-stepper-panel-${this.attrId}`"
15310
15379
  },
15311
15380
  {
15312
- "name": "library",
15381
+ "kind": "field",
15382
+ "name": "name",
15313
15383
  "type": {
15314
- "text": "string | undefined"
15384
+ "text": "string"
15315
15385
  },
15316
- "description": "The name of a registered custom icon library.",
15317
- "fieldName": "library",
15318
- "inheritedFrom": {
15319
- "name": "FlowIconButton",
15320
- "module": "src/components/icon-button/icon-button.component.ts"
15321
- }
15386
+ "default": "''",
15387
+ "description": "The tab panel's name.",
15388
+ "attribute": "name",
15389
+ "reflects": true
15322
15390
  },
15323
15391
  {
15324
- "name": "src",
15392
+ "kind": "field",
15393
+ "name": "title",
15325
15394
  "type": {
15326
- "text": "string | undefined"
15395
+ "text": "string"
15327
15396
  },
15328
- "description": "An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and\ncan result in XSS attacks.",
15329
- "fieldName": "src",
15330
- "inheritedFrom": {
15331
- "name": "FlowIconButton",
15332
- "module": "src/components/icon-button/icon-button.component.ts"
15333
- }
15397
+ "default": "''",
15398
+ "attribute": "title",
15399
+ "reflects": true
15334
15400
  },
15335
15401
  {
15336
- "name": "href",
15402
+ "kind": "field",
15403
+ "name": "subTitle",
15337
15404
  "type": {
15338
- "text": "string | undefined"
15405
+ "text": "string"
15339
15406
  },
15340
- "description": "When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.",
15341
- "fieldName": "href",
15342
- "inheritedFrom": {
15343
- "name": "FlowIconButton",
15344
- "module": "src/components/icon-button/icon-button.component.ts"
15345
- }
15407
+ "default": "''",
15408
+ "attribute": "sub-title",
15409
+ "reflects": true
15346
15410
  },
15347
15411
  {
15348
- "name": "target",
15412
+ "kind": "field",
15413
+ "name": "active",
15349
15414
  "type": {
15350
- "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
15415
+ "text": "boolean"
15351
15416
  },
15352
- "description": "Tells the browser where to open the link. Only used when `href` is set.",
15353
- "fieldName": "target",
15354
- "inheritedFrom": {
15355
- "name": "FlowIconButton",
15356
- "module": "src/components/icon-button/icon-button.component.ts"
15357
- }
15417
+ "default": "false",
15418
+ "description": "When true, the tab panel will be shown.",
15419
+ "attribute": "active",
15420
+ "reflects": true
15358
15421
  },
15359
15422
  {
15360
- "name": "download",
15423
+ "kind": "field",
15424
+ "name": "complete",
15361
15425
  "type": {
15362
- "text": "string | undefined"
15426
+ "text": "boolean"
15363
15427
  },
15364
- "description": "Tells the browser to download the linked file as this filename. Only used when `href` is set.",
15365
- "fieldName": "download",
15366
- "inheritedFrom": {
15367
- "name": "FlowIconButton",
15368
- "module": "src/components/icon-button/icon-button.component.ts"
15369
- }
15428
+ "default": "false",
15429
+ "description": "When true, the tab panel is marked as complete",
15430
+ "attribute": "complete",
15431
+ "reflects": true
15370
15432
  },
15371
15433
  {
15372
- "name": "label",
15434
+ "kind": "method",
15435
+ "name": "handleStateChange"
15436
+ }
15437
+ ],
15438
+ "attributes": [
15439
+ {
15440
+ "name": "name",
15373
15441
  "type": {
15374
15442
  "text": "string"
15375
15443
  },
15376
15444
  "default": "''",
15377
- "description": "A description that gets read by assistive devices. For optimal accessibility, you should always include a label\nthat describes what the icon button does.",
15378
- "fieldName": "label",
15379
- "inheritedFrom": {
15380
- "name": "FlowIconButton",
15381
- "module": "src/components/icon-button/icon-button.component.ts"
15382
- }
15445
+ "description": "The tab panel's name.",
15446
+ "fieldName": "name"
15383
15447
  },
15384
15448
  {
15385
- "name": "tooltip",
15449
+ "name": "title",
15386
15450
  "type": {
15387
15451
  "text": "string"
15388
15452
  },
15389
15453
  "default": "''",
15390
- "description": "Tooltip text that gets displayed when the user hovers over the icon button. If you need to display HTML, use the\n`tooltip` slot instead.",
15391
- "fieldName": "tooltip",
15392
- "inheritedFrom": {
15393
- "name": "FlowIconButton",
15394
- "module": "src/components/icon-button/icon-button.component.ts"
15395
- }
15396
- },
15397
- {
15398
- "name": "tooltip-placement",
15399
- "type": {
15400
- "text": "| 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end'"
15401
- },
15402
- "default": "'top'",
15403
- "description": "The preferred placement of the tooltip. Note that the actual placement may vary as needed to keep the tooltip\ninside of the viewport.",
15404
- "fieldName": "tooltipPlacement",
15405
- "inheritedFrom": {
15406
- "name": "FlowIconButton",
15407
- "module": "src/components/icon-button/icon-button.component.ts"
15408
- }
15409
- },
15410
- {
15411
- "name": "tooltip-distance",
15412
- "type": {
15413
- "text": "number"
15414
- },
15415
- "default": "8",
15416
- "description": "The distance in pixels from which to offset the tooltip away from the icon button.",
15417
- "fieldName": "tooltipDistance",
15418
- "inheritedFrom": {
15419
- "name": "FlowIconButton",
15420
- "module": "src/components/icon-button/icon-button.component.ts"
15421
- }
15454
+ "fieldName": "title"
15422
15455
  },
15423
15456
  {
15424
- "name": "tooltip-skidding",
15457
+ "name": "sub-title",
15425
15458
  "type": {
15426
- "text": "number"
15459
+ "text": "string"
15427
15460
  },
15428
- "default": "0",
15429
- "description": "The distance in pixels from which to offset the tooltip along the icon button.",
15430
- "fieldName": "tooltipSkidding",
15431
- "inheritedFrom": {
15432
- "name": "FlowIconButton",
15433
- "module": "src/components/icon-button/icon-button.component.ts"
15434
- }
15461
+ "default": "''",
15462
+ "fieldName": "subTitle"
15435
15463
  },
15436
15464
  {
15437
- "name": "disabled",
15465
+ "name": "active",
15438
15466
  "type": {
15439
15467
  "text": "boolean"
15440
15468
  },
15441
15469
  "default": "false",
15442
- "description": "Disables the button.",
15443
- "fieldName": "disabled",
15444
- "inheritedFrom": {
15445
- "name": "FlowIconButton",
15446
- "module": "src/components/icon-button/icon-button.component.ts"
15447
- }
15470
+ "description": "When true, the tab panel will be shown.",
15471
+ "fieldName": "active"
15448
15472
  },
15449
15473
  {
15450
- "name": "confirm",
15474
+ "name": "complete",
15451
15475
  "type": {
15452
- "text": "string"
15476
+ "text": "boolean"
15453
15477
  },
15454
- "default": "''",
15455
- "description": "Confirmation text that gets displayed in a tooltip when the user clicks the icon button.\n If you need to display HTML, use the `confirm` slot instead.",
15456
- "fieldName": "confirm",
15457
- "inheritedFrom": {
15458
- "name": "FlowIconButton",
15459
- "module": "src/components/icon-button/icon-button.component.ts"
15460
- }
15478
+ "default": "false",
15479
+ "description": "When true, the tab panel is marked as complete",
15480
+ "fieldName": "complete"
15461
15481
  }
15462
15482
  ],
15463
15483
  "superclass": {
15464
- "name": "FlowIconButton",
15465
- "module": "/src/components/icon-button/icon-button.component"
15484
+ "name": "FlowRdfElement",
15485
+ "module": "/src/internal/flow-ui-rdf-element"
15466
15486
  },
15467
- "summary": "Use a split panel toggle button to control a parent panel's open/closed state",
15468
- "dependencies": [
15469
- "flow-ui-icon-button"
15470
- ],
15471
- "events": [
15472
- {
15473
- "description": "Emitted when the icon button loses focus.",
15474
- "name": "flow-ui-blur",
15475
- "reactName": "onFlowUiBlur",
15476
- "inheritedFrom": {
15477
- "name": "FlowIconButton",
15478
- "module": "src/components/icon-button/icon-button.component.ts"
15479
- }
15480
- },
15481
- {
15482
- "description": "Emitted when the icon button gains focus.",
15483
- "name": "flow-ui-focus",
15484
- "reactName": "onFlowUiFocus",
15485
- "inheritedFrom": {
15486
- "name": "FlowIconButton",
15487
- "module": "src/components/icon-button/icon-button.component.ts"
15488
- }
15489
- }
15490
- ]
15487
+ "summary": "Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.",
15488
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tab-panel",
15489
+ "status": "stable",
15490
+ "since": "2.0"
15491
15491
  }
15492
15492
  ],
15493
15493
  "exports": [
@@ -15495,15 +15495,15 @@
15495
15495
  "kind": "js",
15496
15496
  "name": "default",
15497
15497
  "declaration": {
15498
- "name": "FlowSplitViewToggleButton",
15499
- "module": "components/split-view-toggle-button/split-view-toggle-button.component.js"
15498
+ "name": "FlowStepperPanel",
15499
+ "module": "components/stepper-panel/stepper-panel.component.js"
15500
15500
  }
15501
15501
  }
15502
15502
  ]
15503
15503
  },
15504
15504
  {
15505
15505
  "kind": "javascript-module",
15506
- "path": "components/split-view-toggle-button/split-view-toggle-button.js",
15506
+ "path": "components/stepper-panel/stepper-panel.js",
15507
15507
  "declarations": [],
15508
15508
  "exports": [
15509
15509
  {
@@ -15511,15 +15511,15 @@
15511
15511
  "name": "*",
15512
15512
  "declaration": {
15513
15513
  "name": "*",
15514
- "package": "./split-view-toggle-button.component.js"
15514
+ "package": "./stepper-panel.component"
15515
15515
  }
15516
15516
  },
15517
15517
  {
15518
15518
  "kind": "js",
15519
15519
  "name": "default",
15520
15520
  "declaration": {
15521
- "name": "FlowSplitViewToggleButton",
15522
- "module": "components/split-view-toggle-button/split-view-toggle-button.js"
15521
+ "name": "FlowStepperPanel",
15522
+ "module": "components/stepper-panel/stepper-panel.js"
15523
15523
  }
15524
15524
  }
15525
15525
  ]
@@ -16246,128 +16246,6 @@
16246
16246
  }
16247
16247
  ]
16248
16248
  },
16249
- {
16250
- "kind": "javascript-module",
16251
- "path": "components/tab-panel/tab-panel.js",
16252
- "declarations": [
16253
- {
16254
- "kind": "class",
16255
- "description": "",
16256
- "name": "FlowTabPanel",
16257
- "cssProperties": [
16258
- {
16259
- "description": "The tab panel's padding.",
16260
- "name": "--padding"
16261
- }
16262
- ],
16263
- "cssParts": [
16264
- {
16265
- "description": "The component's base wrapper.",
16266
- "name": "base"
16267
- }
16268
- ],
16269
- "slots": [
16270
- {
16271
- "description": "The tab panel's content.",
16272
- "name": ""
16273
- }
16274
- ],
16275
- "members": [
16276
- {
16277
- "kind": "field",
16278
- "name": "attrId",
16279
- "type": {
16280
- "text": "number"
16281
- },
16282
- "privacy": "private",
16283
- "readonly": true,
16284
- "default": "++id"
16285
- },
16286
- {
16287
- "kind": "field",
16288
- "name": "componentId",
16289
- "privacy": "private",
16290
- "readonly": true,
16291
- "default": "`flow-ui-tab-panel-${this.attrId}`"
16292
- },
16293
- {
16294
- "kind": "field",
16295
- "name": "name",
16296
- "type": {
16297
- "text": "string"
16298
- },
16299
- "default": "''",
16300
- "description": "The tab panel's name.",
16301
- "attribute": "name",
16302
- "reflects": true
16303
- },
16304
- {
16305
- "kind": "field",
16306
- "name": "active",
16307
- "type": {
16308
- "text": "boolean"
16309
- },
16310
- "default": "false",
16311
- "description": "When true, the tab panel will be shown.",
16312
- "attribute": "active",
16313
- "reflects": true
16314
- },
16315
- {
16316
- "kind": "method",
16317
- "name": "handleActiveChange"
16318
- }
16319
- ],
16320
- "attributes": [
16321
- {
16322
- "name": "name",
16323
- "type": {
16324
- "text": "string"
16325
- },
16326
- "default": "''",
16327
- "description": "The tab panel's name.",
16328
- "fieldName": "name"
16329
- },
16330
- {
16331
- "name": "active",
16332
- "type": {
16333
- "text": "boolean"
16334
- },
16335
- "default": "false",
16336
- "description": "When true, the tab panel will be shown.",
16337
- "fieldName": "active"
16338
- }
16339
- ],
16340
- "superclass": {
16341
- "name": "FlowRdfElement",
16342
- "module": "/src/internal/flow-ui-rdf-element"
16343
- },
16344
- "summary": "Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.",
16345
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tab-panel",
16346
- "status": "stable",
16347
- "since": "2.0",
16348
- "tagName": "flow-ui-tab-panel",
16349
- "customElement": true
16350
- }
16351
- ],
16352
- "exports": [
16353
- {
16354
- "kind": "js",
16355
- "name": "default",
16356
- "declaration": {
16357
- "name": "FlowTabPanel",
16358
- "module": "components/tab-panel/tab-panel.js"
16359
- }
16360
- },
16361
- {
16362
- "kind": "custom-element-definition",
16363
- "name": "flow-ui-tab-panel",
16364
- "declaration": {
16365
- "name": "FlowTabPanel",
16366
- "module": "components/tab-panel/tab-panel.js"
16367
- }
16368
- }
16369
- ]
16370
- },
16371
16249
  {
16372
16250
  "kind": "javascript-module",
16373
16251
  "path": "components/tab-group/tab-group.js",
@@ -16782,6 +16660,128 @@
16782
16660
  }
16783
16661
  ]
16784
16662
  },
16663
+ {
16664
+ "kind": "javascript-module",
16665
+ "path": "components/tab-panel/tab-panel.js",
16666
+ "declarations": [
16667
+ {
16668
+ "kind": "class",
16669
+ "description": "",
16670
+ "name": "FlowTabPanel",
16671
+ "cssProperties": [
16672
+ {
16673
+ "description": "The tab panel's padding.",
16674
+ "name": "--padding"
16675
+ }
16676
+ ],
16677
+ "cssParts": [
16678
+ {
16679
+ "description": "The component's base wrapper.",
16680
+ "name": "base"
16681
+ }
16682
+ ],
16683
+ "slots": [
16684
+ {
16685
+ "description": "The tab panel's content.",
16686
+ "name": ""
16687
+ }
16688
+ ],
16689
+ "members": [
16690
+ {
16691
+ "kind": "field",
16692
+ "name": "attrId",
16693
+ "type": {
16694
+ "text": "number"
16695
+ },
16696
+ "privacy": "private",
16697
+ "readonly": true,
16698
+ "default": "++id"
16699
+ },
16700
+ {
16701
+ "kind": "field",
16702
+ "name": "componentId",
16703
+ "privacy": "private",
16704
+ "readonly": true,
16705
+ "default": "`flow-ui-tab-panel-${this.attrId}`"
16706
+ },
16707
+ {
16708
+ "kind": "field",
16709
+ "name": "name",
16710
+ "type": {
16711
+ "text": "string"
16712
+ },
16713
+ "default": "''",
16714
+ "description": "The tab panel's name.",
16715
+ "attribute": "name",
16716
+ "reflects": true
16717
+ },
16718
+ {
16719
+ "kind": "field",
16720
+ "name": "active",
16721
+ "type": {
16722
+ "text": "boolean"
16723
+ },
16724
+ "default": "false",
16725
+ "description": "When true, the tab panel will be shown.",
16726
+ "attribute": "active",
16727
+ "reflects": true
16728
+ },
16729
+ {
16730
+ "kind": "method",
16731
+ "name": "handleActiveChange"
16732
+ }
16733
+ ],
16734
+ "attributes": [
16735
+ {
16736
+ "name": "name",
16737
+ "type": {
16738
+ "text": "string"
16739
+ },
16740
+ "default": "''",
16741
+ "description": "The tab panel's name.",
16742
+ "fieldName": "name"
16743
+ },
16744
+ {
16745
+ "name": "active",
16746
+ "type": {
16747
+ "text": "boolean"
16748
+ },
16749
+ "default": "false",
16750
+ "description": "When true, the tab panel will be shown.",
16751
+ "fieldName": "active"
16752
+ }
16753
+ ],
16754
+ "superclass": {
16755
+ "name": "FlowRdfElement",
16756
+ "module": "/src/internal/flow-ui-rdf-element"
16757
+ },
16758
+ "summary": "Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.",
16759
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tab-panel",
16760
+ "status": "stable",
16761
+ "since": "2.0",
16762
+ "tagName": "flow-ui-tab-panel",
16763
+ "customElement": true
16764
+ }
16765
+ ],
16766
+ "exports": [
16767
+ {
16768
+ "kind": "js",
16769
+ "name": "default",
16770
+ "declaration": {
16771
+ "name": "FlowTabPanel",
16772
+ "module": "components/tab-panel/tab-panel.js"
16773
+ }
16774
+ },
16775
+ {
16776
+ "kind": "custom-element-definition",
16777
+ "name": "flow-ui-tab-panel",
16778
+ "declaration": {
16779
+ "name": "FlowTabPanel",
16780
+ "module": "components/tab-panel/tab-panel.js"
16781
+ }
16782
+ }
16783
+ ]
16784
+ },
16785
16785
  {
16786
16786
  "kind": "javascript-module",
16787
16787
  "path": "components/tag/tag.js",
@@ -19760,6 +19760,6 @@
19760
19760
  ],
19761
19761
  "package": {
19762
19762
  "name": "@emuanalytics/flow-rdf-ui",
19763
- "version": "0.0.14"
19763
+ "version": "0.0.16"
19764
19764
  }
19765
19765
  }