@emuanalytics/flow-rdf-ui 4.1.21 → 4.1.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/dist/components/autocomplete/autocomplete.component.mjs +3 -2
  2. package/dist/components/list-item/list-item.component.mjs +5 -0
  3. package/dist/components/option/option.styles.mjs +5 -5
  4. package/dist/components/query-builder/query-builder.component.mjs +2 -0
  5. package/dist/custom-elements.json +1096 -1077
  6. package/dist/index.d.mts +4 -1
  7. package/dist/index.d.ts +4 -1
  8. package/dist/package.json.mjs +1 -1
  9. package/dist/vscode.html-custom-data.json +150 -141
  10. package/package.json +3 -3
  11. package/themes/dark.css +3 -3
  12. package/themes/dark.styles.js +3 -3
  13. package/themes/light.css +3 -3
  14. package/themes/light.styles.js +3 -3
package/dist/custom-elements.json CHANGED
@@ -267,46 +267,115 @@
267
267
  },
268
268
  {
269
269
  "kind": "javascript-module",
270
- "path": "components/avatar/avatar.component.js",
270
+ "path": "components/autocomplete/autocomplete.component.js",
271
271
  "declarations": [
272
272
  {
273
273
  "kind": "class",
274
274
  "description": "",
275
- "name": "FlowUiAvatar",
276
- "cssProperties": [
277
- {
278
- "description": "The size of the avatar.",
279
- "name": "--size"
280
- }
281
- ],
275
+ "name": "FlowUiAutocomplete",
282
276
  "cssParts": [
283
277
  {
284
- "description": "The component's base wrapper.",
285
- "name": "base"
278
+ "description": "The form control that wraps the label, input, and help text.",
279
+ "name": "form-control"
286
280
  },
287
281
  {
288
- "description": "The container that wraps the avatar's icon.",
289
- "name": "icon"
282
+ "description": "The label's wrapper.",
283
+ "name": "form-control-label"
290
284
  },
291
285
  {
292
- "description": "The container that wraps the avatar's initials.",
293
- "name": "initials"
286
+ "description": "The select's wrapper.",
287
+ "name": "form-control-input"
294
288
  },
295
289
  {
296
- "description": "The avatar image. Only shown when the `image` attribute is set.",
297
- "name": "image"
290
+ "description": "The help text's wrapper.",
291
+ "name": "form-control-help-text"
292
+ },
293
+ {
294
+ "description": "The container the wraps the prefix, suffix, combobox, clear icon, and expand button.",
295
+ "name": "combobox"
296
+ },
297
+ {
298
+ "description": "The container that wraps the prefix slot.",
299
+ "name": "prefix"
300
+ },
301
+ {
302
+ "description": "The container that wraps the suffix slot.",
303
+ "name": "suffix"
304
+ },
305
+ {
306
+ "description": "The element that displays the selected option's label, an `<input>` element.",
307
+ "name": "display-input"
308
+ },
309
+ {
310
+ "description": "The listbox container where options are slotted.",
311
+ "name": "listbox"
312
+ },
313
+ {
314
+ "description": "The clear button.",
315
+ "name": "clear-button"
298
316
  }
299
317
  ],
300
318
  "slots": [
301
319
  {
302
- "description": "The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.",
303
- "name": "icon"
320
+ "description": "The listbox options. Must be `<flow-option>` elements. You can use `<flow-divider>` to group items visually.",
321
+ "name": ""
322
+ },
323
+ {
324
+ "description": "The input's label. Alternatively, you can use the `label` attribute.",
325
+ "name": "label"
326
+ },
327
+ {
328
+ "description": "Used to prepend a presentational icon or similar element to the combobox.",
329
+ "name": "prefix"
330
+ },
331
+ {
332
+ "description": "Used to append a presentational icon or similar element to the combobox.",
333
+ "name": "suffix"
334
+ },
335
+ {
336
+ "description": "An icon to use in lieu of the default clear icon.",
337
+ "name": "clear-icon"
338
+ },
339
+ {
340
+ "description": "Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.",
341
+ "name": "help-text"
304
342
  }
305
343
  ],
306
344
  "members": [
307
345
  {
308
346
  "kind": "field",
309
- "name": "hasError",
347
+ "name": "dependencies",
348
+ "type": {
349
+ "text": "object"
350
+ },
351
+ "static": true,
352
+ "default": "{\n 'flow-ui-popup': FlowPopup,\n 'flow-ui-icon': FlowIcon\n }"
353
+ },
354
+ {
355
+ "kind": "field",
356
+ "name": "hasSlotController",
357
+ "privacy": "private",
358
+ "readonly": true,
359
+ "default": "new HasSlotController(this, 'help-text', 'label')"
360
+ },
361
+ {
362
+ "kind": "field",
363
+ "name": "localize",
364
+ "privacy": "private",
365
+ "readonly": true,
366
+ "default": "new LocalizeController(this)"
367
+ },
368
+ {
369
+ "kind": "field",
370
+ "name": "debouncedInput",
371
+ "type": {
372
+ "text": "(displayValue: string) => void"
373
+ },
374
+ "privacy": "private"
375
+ },
376
+ {
377
+ "kind": "field",
378
+ "name": "pendingChangeEvent",
310
379
  "type": {
311
380
  "text": "boolean"
312
381
  },
@@ -315,13 +384,61 @@
315
384
  },
316
385
  {
317
386
  "kind": "field",
318
- "name": "image",
387
+ "name": "pendingInputEvent",
319
388
  "type": {
320
- "text": "string"
389
+ "text": "boolean"
321
390
  },
322
- "default": "''",
323
- "description": "The image source to use for the avatar.",
324
- "attribute": "image"
391
+ "privacy": "private",
392
+ "default": "false"
393
+ },
394
+ {
395
+ "kind": "field",
396
+ "name": "hasOptions",
397
+ "type": {
398
+ "text": "boolean"
399
+ },
400
+ "privacy": "private",
401
+ "default": "false"
402
+ },
403
+ {
404
+ "kind": "field",
405
+ "name": "formControlController",
406
+ "privacy": "private",
407
+ "readonly": true,
408
+ "default": "new FormControlController(this, {\n assumeInteractionOn: ['flow-ui-blur', 'flow-ui-input']\n })"
409
+ },
410
+ {
411
+ "kind": "field",
412
+ "name": "size",
413
+ "type": {
414
+ "text": "'small' | 'medium' | 'large'"
415
+ },
416
+ "default": "'medium'",
417
+ "description": "The autocomplete's size",
418
+ "attribute": "size",
419
+ "reflects": true
420
+ },
421
+ {
422
+ "kind": "field",
423
+ "name": "filled",
424
+ "type": {
425
+ "text": "boolean"
426
+ },
427
+ "default": "false",
428
+ "description": "Draws a filled autocomplete input",
429
+ "attribute": "filled",
430
+ "reflects": true
431
+ },
432
+ {
433
+ "kind": "field",
434
+ "name": "pill",
435
+ "type": {
436
+ "text": "boolean"
437
+ },
438
+ "default": "false",
439
+ "description": "Draws a pill-style autocomplete input with rounded edges",
440
+ "attribute": "pill",
441
+ "reflects": true
325
442
  },
326
443
  {
327
444
  "kind": "field",
@@ -330,443 +447,362 @@
330
447
  "text": "string"
331
448
  },
332
449
  "default": "''",
333
- "description": "A label to use to describe the avatar to assistive devices.",
450
+ "description": "The autocomplete input's label. If you need to display HTML, use the `help-text` slot instead",
334
451
  "attribute": "label"
335
452
  },
336
453
  {
337
454
  "kind": "field",
338
- "name": "initials",
455
+ "name": "helpText",
339
456
  "type": {
340
457
  "text": "string"
341
458
  },
342
459
  "default": "''",
343
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
344
- "attribute": "initials"
460
+ "description": "The autocomplete input's help text. If you need to display HTML, use the `help-text` slot instead",
461
+ "attribute": "help-text"
345
462
  },
346
463
  {
347
464
  "kind": "field",
348
- "name": "loading",
465
+ "name": "placeholder",
349
466
  "type": {
350
- "text": "'eager' | 'lazy'"
467
+ "text": "string"
351
468
  },
352
- "default": "'eager'",
353
- "description": "Indicates how the browser should load the image.",
354
- "attribute": "loading"
469
+ "default": "''",
470
+ "description": "The autocomplete input's placeholder text",
471
+ "attribute": "placeholder"
355
472
  },
356
473
  {
357
474
  "kind": "field",
358
- "name": "shape",
475
+ "name": "disabled",
359
476
  "type": {
360
- "text": "'circle' | 'square' | 'rounded'"
477
+ "text": "boolean"
361
478
  },
362
- "default": "'circle'",
363
- "description": "The shape of the avatar.",
364
- "attribute": "shape",
479
+ "default": "false",
480
+ "description": "Disables the autocomplete",
481
+ "attribute": "disabled",
365
482
  "reflects": true
366
- }
367
- ],
368
- "attributes": [
483
+ },
369
484
  {
370
- "name": "image",
485
+ "kind": "field",
486
+ "name": "form",
371
487
  "type": {
372
488
  "text": "string"
373
489
  },
374
- "default": "''",
375
- "description": "The image source to use for the avatar.",
376
- "fieldName": "image"
490
+ "description": "The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\nvalue of this attribute must be an id of a form in the same document or shadow root as the button.",
491
+ "attribute": "form"
377
492
  },
378
493
  {
379
- "name": "label",
494
+ "kind": "field",
495
+ "name": "required",
380
496
  "type": {
381
- "text": "string"
497
+ "text": "boolean"
382
498
  },
383
- "default": "''",
384
- "description": "A label to use to describe the avatar to assistive devices.",
385
- "fieldName": "label"
499
+ "default": "false",
500
+ "description": "Makes the autocomplete a required field",
501
+ "attribute": "required",
502
+ "reflects": true
386
503
  },
387
504
  {
388
- "name": "initials",
505
+ "kind": "field",
506
+ "name": "inline",
389
507
  "type": {
390
- "text": "string"
508
+ "text": "boolean"
391
509
  },
392
- "default": "''",
393
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
394
- "fieldName": "initials"
510
+ "default": "false",
511
+ "description": "Display the autocomplete in the 'inline' form control style",
512
+ "attribute": "inline",
513
+ "reflects": true
395
514
  },
396
515
  {
397
- "name": "loading",
516
+ "kind": "field",
517
+ "name": "divider",
398
518
  "type": {
399
- "text": "'eager' | 'lazy'"
519
+ "text": "boolean"
400
520
  },
401
- "default": "'eager'",
402
- "description": "Indicates how the browser should load the image.",
403
- "fieldName": "loading"
521
+ "default": "false",
522
+ "description": "Indicates that the control should display a divider",
523
+ "attribute": "divider",
524
+ "reflects": true
404
525
  },
405
526
  {
406
- "name": "shape",
527
+ "kind": "field",
528
+ "name": "hoist",
407
529
  "type": {
408
- "text": "'circle' | 'square' | 'rounded'"
530
+ "text": "boolean"
409
531
  },
410
- "default": "'circle'",
411
- "description": "The shape of the avatar.",
412
- "fieldName": "shape"
413
- }
414
- ],
415
- "superclass": {
416
- "name": "FlowRdfElement",
417
- "module": "/src/internal/flow-ui-rdf-element"
418
- },
419
- "tagName": "flow-ui-avatar",
420
- "summary": "Avatars are used to represent a person or object.",
421
- "dependencies": [
422
- "flow-ui-icon"
423
- ],
424
- "customElement": true
425
- }
426
- ],
427
- "exports": [
428
- {
429
- "kind": "js",
430
- "name": "default",
431
- "declaration": {
432
- "name": "FlowUiAvatar",
433
- "module": "components/avatar/avatar.component.js"
434
- }
435
- }
436
- ]
437
- },
438
- {
439
- "kind": "javascript-module",
440
- "path": "components/avatar/avatar.js",
441
- "declarations": [],
442
- "exports": [
443
- {
444
- "kind": "js",
445
- "name": "default",
446
- "declaration": {
447
- "name": "FlowUiAvatar",
448
- "module": "components/avatar/avatar.js"
449
- }
450
- }
451
- ]
452
- },
453
- {
454
- "kind": "javascript-module",
455
- "path": "components/base-control/base-control.component.js",
456
- "declarations": [
457
- {
458
- "kind": "class",
459
- "description": "",
460
- "name": "FlowUiBaseControl",
461
- "cssParts": [
462
- {
463
- "description": "The form control that wraps the label, input, and help text.",
464
- "name": "form-control"
465
- },
466
- {
467
- "description": "The label's wrapper.",
468
- "name": "form-control-label"
469
- },
470
- {
471
- "description": "The input's wrapper.",
472
- "name": "form-control-input"
473
- },
474
- {
475
- "description": "The help text's wrapper.",
476
- "name": "form-control-help-text"
477
- },
478
- {
479
- "description": "The component's base wrapper.",
480
- "name": "base"
481
- },
482
- {
483
- "description": "The internal `<input>` control.",
484
- "name": "input"
485
- },
486
- {
487
- "description": "The container that wraps the prefix.",
488
- "name": "prefix"
489
- },
490
- {
491
- "description": "The clear button.",
492
- "name": "clear-button"
493
- },
494
- {
495
- "description": "The password toggle button.",
496
- "name": "password-toggle-button"
497
- },
498
- {
499
- "description": "The container that wraps the suffix.",
500
- "name": "suffix"
501
- }
502
- ],
503
- "slots": [
504
- {
505
- "description": "The input's label. Alternatively, you can use the `label` attribute.",
506
- "name": "label"
507
- },
508
- {
509
- "description": "Used to prepend a presentational icon or similar element to the input.",
510
- "name": "prefix"
511
- },
512
- {
513
- "description": "Used to append a presentational icon or similar element to the input.",
514
- "name": "suffix"
515
- },
516
- {
517
- "description": "An icon to use in lieu of the default clear icon.",
518
- "name": "clear-icon"
519
- },
520
- {
521
- "description": "An icon to use in lieu of the default show password icon.",
522
- "name": "show-password-icon"
523
- },
524
- {
525
- "description": "An icon to use in lieu of the default hide password icon.",
526
- "name": "hide-password-icon"
532
+ "default": "false",
533
+ "description": "Enable this option to prevent the listbox from being clipped when the component is placed inside a container with\n`overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.",
534
+ "attribute": "hoist"
527
535
  },
528
- {
529
- "description": "Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.",
530
- "name": "help-text"
531
- }
532
- ],
533
- "members": [
534
536
  {
535
537
  "kind": "field",
536
- "name": "formControlController",
537
- "privacy": "private",
538
- "readonly": true,
539
- "default": "new FormControlController(this, {\n assumeInteractionOn: ['flow-ui-blur', 'flow-ui-input']\n })"
538
+ "name": "placement",
539
+ "type": {
540
+ "text": "'top' | 'bottom'"
541
+ },
542
+ "default": "'bottom'",
543
+ "description": "The preferred placement of the autocomplete's menu. Note that the actual placement may vary as needed to keep the listbox\ninside of the viewport.",
544
+ "attribute": "placement",
545
+ "reflects": true
540
546
  },
541
547
  {
542
548
  "kind": "field",
543
- "name": "hasSlotController",
544
- "privacy": "private",
545
- "readonly": true,
546
- "default": "new HasSlotController(this, 'help-text', 'label')"
549
+ "name": "value",
550
+ "type": {
551
+ "text": "string"
552
+ },
553
+ "default": "''",
554
+ "description": "Current value of the control, selected from one of the valid options available",
555
+ "attribute": "value"
547
556
  },
548
557
  {
549
558
  "kind": "field",
550
- "name": "hasFocus",
559
+ "name": "displayWith",
551
560
  "type": {
552
- "text": "boolean"
561
+ "text": "((value: string) => string) | ((value: string) => Promise<string>)"
553
562
  },
554
- "privacy": "private",
555
- "default": "false"
563
+ "description": "Function for determining the `displayValue` for a given `value`.\nBy default, it will show the `value` itself.",
564
+ "attribute": "displayWith"
556
565
  },
557
566
  {
558
567
  "kind": "field",
559
- "name": "size",
568
+ "name": "debounceDelay",
560
569
  "type": {
561
- "text": "'small' | 'medium' | 'large'"
570
+ "text": "number"
562
571
  },
563
- "default": "'medium'",
564
- "description": "The input's size.",
565
- "attribute": "size",
572
+ "default": "0",
573
+ "description": "Debounce delay",
574
+ "attribute": "debounce-delay",
566
575
  "reflects": true
567
576
  },
568
577
  {
569
578
  "kind": "field",
570
- "name": "filled",
579
+ "name": "clearable",
571
580
  "type": {
572
581
  "text": "boolean"
573
582
  },
574
583
  "default": "false",
575
- "description": "Draws a filled input.",
576
- "attribute": "filled",
584
+ "description": "Show the option to clear input",
585
+ "attribute": "clearable",
577
586
  "reflects": true
578
587
  },
579
588
  {
580
589
  "kind": "field",
581
- "name": "pill",
590
+ "name": "clearOnFocus",
582
591
  "type": {
583
592
  "text": "boolean"
584
593
  },
585
594
  "default": "false",
586
- "description": "Draws a pill-style input with rounded edges.",
587
- "attribute": "pill",
595
+ "description": "Clear the value when the autocomplete is focused on",
596
+ "attribute": "clear-on-focus",
588
597
  "reflects": true
589
598
  },
590
599
  {
591
600
  "kind": "field",
592
- "name": "label",
593
- "type": {
594
- "text": "string"
595
- },
596
- "default": "''",
597
- "description": "The input's label. If you need to display HTML, use the `label` slot instead.",
598
- "attribute": "label"
599
- },
600
- {
601
- "kind": "field",
602
- "name": "helpText",
601
+ "name": "inputText",
603
602
  "type": {
604
603
  "text": "string"
605
604
  },
605
+ "privacy": "private",
606
606
  "default": "''",
607
- "description": "The input's help text. If you need to display HTML, use the `help-text` slot instead.",
608
- "attribute": "help-text"
607
+ "description": "Current value displayed by the control; this can be what the user is typing or the label of the selected option"
609
608
  },
610
609
  {
611
610
  "kind": "field",
612
- "name": "disabled",
611
+ "name": "selectedOption",
613
612
  "type": {
614
- "text": "boolean"
613
+ "text": "FlowOption | null"
615
614
  },
616
- "default": "false",
617
- "description": "Disables the input.",
618
- "attribute": "disabled",
619
- "reflects": true
615
+ "privacy": "private",
616
+ "default": "null"
620
617
  },
621
618
  {
622
619
  "kind": "field",
623
- "name": "form",
620
+ "name": "currentOption",
624
621
  "type": {
625
- "text": "string"
622
+ "text": "FlowOption | null"
626
623
  },
627
- "default": "''",
628
- "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
629
- "attribute": "form",
630
- "reflects": true
624
+ "privacy": "private",
625
+ "default": "null"
631
626
  },
632
627
  {
633
628
  "kind": "field",
634
- "name": "required",
629
+ "name": "input",
635
630
  "type": {
636
- "text": "boolean"
631
+ "text": "HTMLInputElement"
637
632
  },
638
- "default": "false",
639
- "description": "Makes the input a required field.",
640
- "attribute": "required",
641
- "reflects": true
633
+ "privacy": "private"
642
634
  },
643
635
  {
644
636
  "kind": "field",
645
- "name": "inline",
637
+ "name": "popup",
646
638
  "type": {
647
- "text": "boolean"
639
+ "text": "FlowPopup"
648
640
  },
649
- "default": "false",
650
- "description": "Display the input in the 'inline' form control style.",
651
- "attribute": "inline",
652
- "reflects": true
641
+ "privacy": "private"
653
642
  },
654
643
  {
655
- "kind": "field",
656
- "name": "divider",
657
- "type": {
658
- "text": "boolean"
644
+ "kind": "method",
645
+ "name": "getForm",
646
+ "return": {
647
+ "type": {
648
+ "text": "HTMLFormElement | null"
649
+ }
659
650
  },
660
- "default": "false",
661
- "description": "Indicates that the control should display a divider",
662
- "attribute": "divider",
663
- "reflects": true
651
+ "description": "Gets the associated form, if one exists."
664
652
  },
665
653
  {
666
654
  "kind": "field",
667
655
  "name": "validity",
668
- "description": "Gets the validity state object",
656
+ "description": "Gets the validity state object.",
669
657
  "readonly": true
670
658
  },
671
659
  {
672
660
  "kind": "field",
673
661
  "name": "validationMessage",
674
- "description": "Gets the validation message",
662
+ "description": "Gets the validation message.",
675
663
  "readonly": true
676
664
  },
677
665
  {
678
666
  "kind": "method",
679
- "name": "handleBlur",
680
- "privacy": "private"
681
- },
682
- {
683
- "kind": "method",
684
- "name": "handleFocus",
685
- "privacy": "private"
667
+ "name": "checkValidity",
668
+ "return": {
669
+ "type": {
670
+ "text": "boolean"
671
+ }
672
+ },
673
+ "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
686
674
  },
687
675
  {
688
676
  "kind": "method",
689
- "name": "focus",
677
+ "name": "reportValidity",
678
+ "return": {
679
+ "type": {
680
+ "text": "boolean"
681
+ }
682
+ },
683
+ "description": "Checks for validity and shows the browser's validation message if the control is invalid."
684
+ },
685
+ {
686
+ "kind": "method",
687
+ "name": "setCustomValidity",
690
688
  "parameters": [
691
689
  {
692
- "name": "options",
693
- "optional": true,
690
+ "name": "_",
694
691
  "type": {
695
- "text": "FocusOptions"
692
+ "text": "string"
696
693
  }
697
694
  }
698
695
  ],
699
- "description": "Sets focus on the input."
696
+ "description": "Sets a custom validation message. Pass an empty string to restore validity."
700
697
  },
701
698
  {
702
699
  "kind": "method",
703
- "name": "blur",
704
- "description": "Removes focus from the input."
700
+ "name": "handleClearClick",
701
+ "parameters": [
702
+ {
703
+ "name": "event",
704
+ "type": {
705
+ "text": "MouseEvent"
706
+ }
707
+ }
708
+ ]
705
709
  },
706
710
  {
707
711
  "kind": "method",
708
- "name": "checkValidity",
709
- "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
712
+ "name": "focus",
713
+ "description": "Focuses on the control"
710
714
  },
711
715
  {
712
716
  "kind": "method",
713
- "name": "getForm",
714
- "return": {
715
- "type": {
716
- "text": "HTMLFormElement | null"
717
- }
718
- },
719
- "description": "Gets the associated form, if one exists."
717
+ "name": "blur",
718
+ "description": "Blurs from the control."
720
719
  },
721
720
  {
722
721
  "kind": "method",
723
- "name": "reportValidity",
724
- "description": "Checks for validity and shows the browser's validation message if the control is invalid."
722
+ "name": "show",
723
+ "description": "Shows the listbox."
725
724
  },
726
725
  {
727
726
  "kind": "method",
728
- "name": "setCustomValidity",
729
- "parameters": [
730
- {
731
- "name": "message",
732
- "type": {
733
- "text": "string"
734
- }
735
- }
736
- ],
737
- "description": "Sets a custom validation message. Pass an empty string to restore validity."
727
+ "name": "hide",
728
+ "description": "Hides the listbox."
729
+ },
730
+ {
731
+ "kind": "method",
732
+ "name": "getInputText",
733
+ "description": "Gets the current value of the text input"
738
734
  }
739
735
  ],
740
736
  "events": [
741
737
  {
742
- "description": "Emitted when the control loses focus.",
743
- "name": "flow-ui-blur",
744
- "reactName": "onFlowUiBlur"
738
+ "description": "Emitted when the display value changes.",
739
+ "name": "flow-ui-input",
740
+ "reactName": "onFlowUiInput"
745
741
  },
746
742
  {
747
- "description": "Emitted when an alteration to the control's value is committed by the user.",
743
+ "description": "Emitted when the input value changes.",
748
744
  "name": "flow-ui-change",
749
745
  "reactName": "onFlowUiChange"
750
746
  },
751
747
  {
752
- "description": "Emitted when the clear button is activated.",
753
- "name": "flow-ui-clear",
754
- "reactName": "onFlowUiClear"
755
- },
756
- {
757
- "description": "Emitted when the control gains focus.",
748
+ "description": "Emitted when the input is focused.",
758
749
  "name": "flow-ui-focus",
759
750
  "reactName": "onFlowUiFocus"
760
751
  },
761
752
  {
762
- "description": "Emitted when the control receives input.",
763
- "name": "flow-ui-input",
764
- "reactName": "onFlowUiInput"
753
+ "description": "Emitted when the input is blurred.",
754
+ "name": "flow-ui-blur",
755
+ "reactName": "onFlowUiBlur"
765
756
  },
766
757
  {
767
- "description": "Emitted when the form control has been checked for validity and its constraints aren't satisfied.",
758
+ "description": "Emitted when the dropdown is shown.",
759
+ "name": "flow-ui-show",
760
+ "reactName": "onFlowUiShow"
761
+ },
762
+ {
763
+ "description": "Emitted when the dropdown is shown.",
764
+ "name": "flow-ui-after-show",
765
+ "reactName": "onFlowUiAfterShow"
766
+ },
767
+ {
768
+ "description": "Emitted when the dropdown is hidden.",
769
+ "name": "flow-ui-hide",
770
+ "reactName": "onFlowUiHide"
771
+ },
772
+ {
773
+ "description": "Emitted when the dropdown is hidden.",
774
+ "name": "flow-ui-after-hide",
775
+ "reactName": "onFlowUiAfterHide"
776
+ },
777
+ {
778
+ "description": "Emitted when the input is invalid.",
768
779
  "name": "flow-ui-invalid",
769
780
  "reactName": "onFlowUiInvalid"
781
+ },
782
+ {
783
+ "description": "Emitted when the input is valid.",
784
+ "name": "flow-ui-valid",
785
+ "reactName": "onFlowUiValid"
786
+ },
787
+ {
788
+ "description": "Emitted when the input is validated.",
789
+ "name": "flow-ui-validate",
790
+ "reactName": "onFlowUiValidate"
791
+ },
792
+ {
793
+ "description": "Emitted when the input is validated and the validity state is updated.",
794
+ "name": "flow-ui-validate-complete",
795
+ "reactName": "onFlowUiValidateComplete"
796
+ },
797
+ {
798
+ "description": "Emitted when the input is validated and an error occurs.",
799
+ "name": "flow-ui-validate-error",
800
+ "reactName": "onFlowUiValidateError"
801
+ },
802
+ {
803
+ "description": "Emitted when the input is validated and no errors occur.",
804
+ "name": "flow-ui-validate-success",
805
+ "reactName": "onFlowUiValidateSuccess"
770
806
  }
771
807
  ],
772
808
  "attributes": [
@@ -776,7 +812,7 @@
776
812
  "text": "'small' | 'medium' | 'large'"
777
813
  },
778
814
  "default": "'medium'",
779
- "description": "The input's size.",
815
+ "description": "The autocomplete's size",
780
816
  "fieldName": "size"
781
817
  },
782
818
  {
@@ -785,7 +821,7 @@
785
821
  "text": "boolean"
786
822
  },
787
823
  "default": "false",
788
- "description": "Draws a filled input.",
824
+ "description": "Draws a filled autocomplete input",
789
825
  "fieldName": "filled"
790
826
  },
791
827
  {
@@ -794,7 +830,7 @@
794
830
  "text": "boolean"
795
831
  },
796
832
  "default": "false",
797
- "description": "Draws a pill-style input with rounded edges.",
833
+ "description": "Draws a pill-style autocomplete input with rounded edges",
798
834
  "fieldName": "pill"
799
835
  },
800
836
  {
@@ -803,7 +839,7 @@
803
839
  "text": "string"
804
840
  },
805
841
  "default": "''",
806
- "description": "The input's label. If you need to display HTML, use the `label` slot instead.",
842
+ "description": "The autocomplete input's label. If you need to display HTML, use the `help-text` slot instead",
807
843
  "fieldName": "label"
808
844
  },
809
845
  {
@@ -812,16 +848,25 @@
812
848
  "text": "string"
813
849
  },
814
850
  "default": "''",
815
- "description": "The input's help text. If you need to display HTML, use the `help-text` slot instead.",
851
+ "description": "The autocomplete input's help text. If you need to display HTML, use the `help-text` slot instead",
816
852
  "fieldName": "helpText"
817
853
  },
854
+ {
855
+ "name": "placeholder",
856
+ "type": {
857
+ "text": "string"
858
+ },
859
+ "default": "''",
860
+ "description": "The autocomplete input's placeholder text",
861
+ "fieldName": "placeholder"
862
+ },
818
863
  {
819
864
  "name": "disabled",
820
865
  "type": {
821
866
  "text": "boolean"
822
867
  },
823
868
  "default": "false",
824
- "description": "Disables the input.",
869
+ "description": "Disables the autocomplete",
825
870
  "fieldName": "disabled"
826
871
  },
827
872
  {
@@ -829,8 +874,7 @@
829
874
  "type": {
830
875
  "text": "string"
831
876
  },
832
- "default": "''",
833
- "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
877
+ "description": "The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\nvalue of this attribute must be an id of a form in the same document or shadow root as the button.",
834
878
  "fieldName": "form"
835
879
  },
836
880
  {
@@ -839,7 +883,7 @@
839
883
  "text": "boolean"
840
884
  },
841
885
  "default": "false",
842
- "description": "Makes the input a required field.",
886
+ "description": "Makes the autocomplete a required field",
843
887
  "fieldName": "required"
844
888
  },
845
889
  {
@@ -848,7 +892,7 @@
848
892
  "text": "boolean"
849
893
  },
850
894
  "default": "false",
851
- "description": "Display the input in the 'inline' form control style.",
895
+ "description": "Display the autocomplete in the 'inline' form control style",
852
896
  "fieldName": "inline"
853
897
  },
854
898
  {
@@ -859,20 +903,79 @@
859
903
  "default": "false",
860
904
  "description": "Indicates that the control should display a divider",
861
905
  "fieldName": "divider"
906
+ },
907
+ {
908
+ "name": "hoist",
909
+ "type": {
910
+ "text": "boolean"
911
+ },
912
+ "default": "false",
913
+ "description": "Enable this option to prevent the listbox from being clipped when the component is placed inside a container with\n`overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.",
914
+ "fieldName": "hoist"
915
+ },
916
+ {
917
+ "name": "placement",
918
+ "type": {
919
+ "text": "'top' | 'bottom'"
920
+ },
921
+ "default": "'bottom'",
922
+ "description": "The preferred placement of the autocomplete's menu. Note that the actual placement may vary as needed to keep the listbox\ninside of the viewport.",
923
+ "fieldName": "placement"
924
+ },
925
+ {
926
+ "name": "value",
927
+ "type": {
928
+ "text": "string"
929
+ },
930
+ "default": "''",
931
+ "description": "Current value of the control, selected from one of the valid options available",
932
+ "fieldName": "value"
933
+ },
934
+ {
935
+ "name": "displayWith",
936
+ "type": {
937
+ "text": "((value: string) => string) | ((value: string) => Promise<string>)"
938
+ },
939
+ "description": "Function for determining the `displayValue` for a given `value`.\nBy default, it will show the `value` itself.",
940
+ "fieldName": "displayWith"
941
+ },
942
+ {
943
+ "name": "debounce-delay",
944
+ "type": {
945
+ "text": "number"
946
+ },
947
+ "default": "0",
948
+ "description": "Debounce delay",
949
+ "fieldName": "debounceDelay"
950
+ },
951
+ {
952
+ "name": "clearable",
953
+ "type": {
954
+ "text": "boolean"
955
+ },
956
+ "default": "false",
957
+ "description": "Show the option to clear input",
958
+ "fieldName": "clearable"
959
+ },
960
+ {
961
+ "name": "clear-on-focus",
962
+ "type": {
963
+ "text": "boolean"
964
+ },
965
+ "default": "false",
966
+ "description": "Clear the value when the autocomplete is focused on",
967
+ "fieldName": "clearOnFocus"
862
968
  }
863
969
  ],
864
970
  "superclass": {
865
971
  "name": "FlowRdfFormControl",
866
972
  "module": "/src/internal/flow-ui-rdf-element"
867
973
  },
868
- "tagName": "flow-ui-base-control",
869
- "summary": "Inputs collect data from the user.",
870
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/input",
871
- "status": "stable",
872
- "since": "2.0",
974
+ "tagName": "flow-ui-autocomplete",
975
+ "summary": "The Autocomplete is a Text input enhanced by a panel of suggested options.",
873
976
  "dependencies": [
874
- "flow-ui-icon",
875
- "flow-ui-icon-button"
977
+ "flow-ui-popup",
978
+ "flow-ui-icon"
876
979
  ],
877
980
  "customElement": true
878
981
  }
@@ -882,15 +985,15 @@
882
985
  "kind": "js",
883
986
  "name": "default",
884
987
  "declaration": {
885
- "name": "FlowUiBaseControl",
886
- "module": "components/base-control/base-control.component.js"
988
+ "name": "FlowUiAutocomplete",
989
+ "module": "components/autocomplete/autocomplete.component.js"
887
990
  }
888
991
  }
889
992
  ]
890
993
  },
891
994
  {
892
995
  "kind": "javascript-module",
893
- "path": "components/base-control/base-control.js",
996
+ "path": "components/autocomplete/autocomplete.js",
894
997
  "declarations": [],
895
998
  "exports": [
896
999
  {
@@ -898,27 +1001,27 @@
898
1001
  "name": "*",
899
1002
  "declaration": {
900
1003
  "name": "*",
901
- "package": "./base-control.component"
1004
+ "package": "./autocomplete.component"
902
1005
  }
903
1006
  },
904
1007
  {
905
1008
  "kind": "js",
906
1009
  "name": "default",
907
1010
  "declaration": {
908
- "name": "FlowUiBaseControl",
909
- "module": "components/base-control/base-control.js"
1011
+ "name": "FlowUiAutocomplete",
1012
+ "module": "components/autocomplete/autocomplete.js"
910
1013
  }
911
1014
  }
912
1015
  ]
913
1016
  },
914
1017
  {
915
1018
  "kind": "javascript-module",
916
- "path": "components/autocomplete/autocomplete.component.js",
1019
+ "path": "components/base-control/base-control.component.js",
917
1020
  "declarations": [
918
1021
  {
919
1022
  "kind": "class",
920
1023
  "description": "",
921
- "name": "FlowUiAutocomplete",
1024
+ "name": "FlowUiBaseControl",
922
1025
  "cssParts": [
923
1026
  {
924
1027
  "description": "The form control that wraps the label, input, and help text.",
@@ -929,7 +1032,7 @@
929
1032
  "name": "form-control-label"
930
1033
  },
931
1034
  {
932
- "description": "The select's wrapper.",
1035
+ "description": "The input's wrapper.",
933
1036
  "name": "form-control-input"
934
1037
  },
935
1038
  {
@@ -937,51 +1040,55 @@
937
1040
  "name": "form-control-help-text"
938
1041
  },
939
1042
  {
940
- "description": "The container the wraps the prefix, suffix, combobox, clear icon, and expand button.",
941
- "name": "combobox"
1043
+ "description": "The component's base wrapper.",
1044
+ "name": "base"
942
1045
  },
943
1046
  {
944
- "description": "The container that wraps the prefix slot.",
945
- "name": "prefix"
1047
+ "description": "The internal `<input>` control.",
1048
+ "name": "input"
946
1049
  },
947
1050
  {
948
- "description": "The container that wraps the suffix slot.",
949
- "name": "suffix"
1051
+ "description": "The container that wraps the prefix.",
1052
+ "name": "prefix"
950
1053
  },
951
1054
  {
952
- "description": "The element that displays the selected option's label, an `<input>` element.",
953
- "name": "display-input"
1055
+ "description": "The clear button.",
1056
+ "name": "clear-button"
954
1057
  },
955
1058
  {
956
- "description": "The listbox container where options are slotted.",
957
- "name": "listbox"
1059
+ "description": "The password toggle button.",
1060
+ "name": "password-toggle-button"
958
1061
  },
959
1062
  {
960
- "description": "The clear button.",
961
- "name": "clear-button"
1063
+ "description": "The container that wraps the suffix.",
1064
+ "name": "suffix"
962
1065
  }
963
1066
  ],
964
1067
  "slots": [
965
- {
966
- "description": "The listbox options. Must be `<flow-option>` elements. You can use `<flow-divider>` to group items visually.",
967
- "name": ""
968
- },
969
1068
  {
970
1069
  "description": "The input's label. Alternatively, you can use the `label` attribute.",
971
1070
  "name": "label"
972
1071
  },
973
1072
  {
974
- "description": "Used to prepend a presentational icon or similar element to the combobox.",
1073
+ "description": "Used to prepend a presentational icon or similar element to the input.",
975
1074
  "name": "prefix"
976
1075
  },
977
1076
  {
978
- "description": "Used to append a presentational icon or similar element to the combobox.",
1077
+ "description": "Used to append a presentational icon or similar element to the input.",
979
1078
  "name": "suffix"
980
1079
  },
981
1080
  {
982
1081
  "description": "An icon to use in lieu of the default clear icon.",
983
1082
  "name": "clear-icon"
984
1083
  },
1084
+ {
1085
+ "description": "An icon to use in lieu of the default show password icon.",
1086
+ "name": "show-password-icon"
1087
+ },
1088
+ {
1089
+ "description": "An icon to use in lieu of the default hide password icon.",
1090
+ "name": "hide-password-icon"
1091
+ },
985
1092
  {
986
1093
  "description": "Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.",
987
1094
  "name": "help-text"
@@ -990,69 +1097,27 @@
990
1097
  "members": [
991
1098
  {
992
1099
  "kind": "field",
993
- "name": "dependencies",
994
- "type": {
995
- "text": "object"
996
- },
997
- "static": true,
998
- "default": "{\n 'flow-ui-popup': FlowPopup,\n 'flow-ui-icon': FlowIcon\n }"
999
- },
1000
- {
1001
- "kind": "field",
1002
- "name": "hasSlotController",
1100
+ "name": "formControlController",
1003
1101
  "privacy": "private",
1004
1102
  "readonly": true,
1005
- "default": "new HasSlotController(this, 'help-text', 'label')"
1103
+ "default": "new FormControlController(this, {\n assumeInteractionOn: ['flow-ui-blur', 'flow-ui-input']\n })"
1006
1104
  },
1007
1105
  {
1008
1106
  "kind": "field",
1009
- "name": "localize",
1107
+ "name": "hasSlotController",
1010
1108
  "privacy": "private",
1011
1109
  "readonly": true,
1012
- "default": "new LocalizeController(this)"
1013
- },
1014
- {
1015
- "kind": "field",
1016
- "name": "debouncedInput",
1017
- "type": {
1018
- "text": "(displayValue: string) => void"
1019
- },
1020
- "privacy": "private"
1021
- },
1022
- {
1023
- "kind": "field",
1024
- "name": "pendingChangeEvent",
1025
- "type": {
1026
- "text": "boolean"
1027
- },
1028
- "privacy": "private",
1029
- "default": "false"
1030
- },
1031
- {
1032
- "kind": "field",
1033
- "name": "pendingInputEvent",
1034
- "type": {
1035
- "text": "boolean"
1036
- },
1037
- "privacy": "private",
1038
- "default": "false"
1110
+ "default": "new HasSlotController(this, 'help-text', 'label')"
1039
1111
  },
1040
1112
  {
1041
1113
  "kind": "field",
1042
- "name": "hasOptions",
1114
+ "name": "hasFocus",
1043
1115
  "type": {
1044
1116
  "text": "boolean"
1045
1117
  },
1046
1118
  "privacy": "private",
1047
1119
  "default": "false"
1048
1120
  },
1049
- {
1050
- "kind": "field",
1051
- "name": "formControlController",
1052
- "privacy": "private",
1053
- "readonly": true,
1054
- "default": "new FormControlController(this, {\n assumeInteractionOn: ['flow-ui-blur', 'flow-ui-input']\n })"
1055
- },
1056
1121
  {
1057
1122
  "kind": "field",
1058
1123
  "name": "size",
@@ -1060,7 +1125,7 @@
1060
1125
  "text": "'small' | 'medium' | 'large'"
1061
1126
  },
1062
1127
  "default": "'medium'",
1063
- "description": "The autocomplete's size",
1128
+ "description": "The input's size.",
1064
1129
  "attribute": "size",
1065
1130
  "reflects": true
1066
1131
  },
@@ -1071,7 +1136,7 @@
1071
1136
  "text": "boolean"
1072
1137
  },
1073
1138
  "default": "false",
1074
- "description": "Draws a filled autocomplete input",
1139
+ "description": "Draws a filled input.",
1075
1140
  "attribute": "filled",
1076
1141
  "reflects": true
1077
1142
  },
@@ -1082,7 +1147,7 @@
1082
1147
  "text": "boolean"
1083
1148
  },
1084
1149
  "default": "false",
1085
- "description": "Draws a pill-style autocomplete input with rounded edges",
1150
+ "description": "Draws a pill-style input with rounded edges.",
1086
1151
  "attribute": "pill",
1087
1152
  "reflects": true
1088
1153
  },
@@ -1093,7 +1158,7 @@
1093
1158
  "text": "string"
1094
1159
  },
1095
1160
  "default": "''",
1096
- "description": "The autocomplete input's label. If you need to display HTML, use the `help-text` slot instead",
1161
+ "description": "The input's label. If you need to display HTML, use the `label` slot instead.",
1097
1162
  "attribute": "label"
1098
1163
  },
1099
1164
  {
@@ -1103,19 +1168,9 @@
1103
1168
  "text": "string"
1104
1169
  },
1105
1170
  "default": "''",
1106
- "description": "The autocomplete input's help text. If you need to display HTML, use the `help-text` slot instead",
1171
+ "description": "The input's help text. If you need to display HTML, use the `help-text` slot instead.",
1107
1172
  "attribute": "help-text"
1108
1173
  },
1109
- {
1110
- "kind": "field",
1111
- "name": "placeholder",
1112
- "type": {
1113
- "text": "string"
1114
- },
1115
- "default": "''",
1116
- "description": "The autocomplete input's placeholder text",
1117
- "attribute": "placeholder"
1118
- },
1119
1174
  {
1120
1175
  "kind": "field",
1121
1176
  "name": "disabled",
@@ -1123,7 +1178,7 @@
1123
1178
  "text": "boolean"
1124
1179
  },
1125
1180
  "default": "false",
1126
- "description": "Disables the autocomplete",
1181
+ "description": "Disables the input.",
1127
1182
  "attribute": "disabled",
1128
1183
  "reflects": true
1129
1184
  },
@@ -1133,8 +1188,10 @@
1133
1188
  "type": {
1134
1189
  "text": "string"
1135
1190
  },
1136
- "description": "The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\nvalue of this attribute must be an id of a form in the same document or shadow root as the button.",
1137
- "attribute": "form"
1191
+ "default": "''",
1192
+ "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
1193
+ "attribute": "form",
1194
+ "reflects": true
1138
1195
  },
1139
1196
  {
1140
1197
  "kind": "field",
@@ -1143,7 +1200,7 @@
1143
1200
  "text": "boolean"
1144
1201
  },
1145
1202
  "default": "false",
1146
- "description": "Makes the autocomplete a required field",
1203
+ "description": "Makes the input a required field.",
1147
1204
  "attribute": "required",
1148
1205
  "reflects": true
1149
1206
  },
@@ -1154,7 +1211,7 @@
1154
1211
  "text": "boolean"
1155
1212
  },
1156
1213
  "default": "false",
1157
- "description": "Display the autocomplete in the 'inline' form control style",
1214
+ "description": "Display the input in the 'inline' form control style.",
1158
1215
  "attribute": "inline",
1159
1216
  "reflects": true
1160
1217
  },
@@ -1171,120 +1228,49 @@
1171
1228
  },
1172
1229
  {
1173
1230
  "kind": "field",
1174
- "name": "hoist",
1175
- "type": {
1176
- "text": "boolean"
1177
- },
1178
- "default": "false",
1179
- "description": "Enable this option to prevent the listbox from being clipped when the component is placed inside a container with\n`overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.",
1180
- "attribute": "hoist"
1181
- },
1182
- {
1183
- "kind": "field",
1184
- "name": "placement",
1185
- "type": {
1186
- "text": "'top' | 'bottom'"
1187
- },
1188
- "default": "'bottom'",
1189
- "description": "The preferred placement of the autocomplete's menu. Note that the actual placement may vary as needed to keep the listbox\ninside of the viewport.",
1190
- "attribute": "placement",
1191
- "reflects": true
1192
- },
1193
- {
1194
- "kind": "field",
1195
- "name": "value",
1196
- "type": {
1197
- "text": "string"
1198
- },
1199
- "default": "''",
1200
- "description": "Current value of the control, selected from one of the valid options available",
1201
- "attribute": "value"
1202
- },
1203
- {
1204
- "kind": "field",
1205
- "name": "displayWith",
1206
- "type": {
1207
- "text": "((value: string) => string) | ((value: string) => Promise<string>)"
1208
- },
1209
- "description": "Function for determining the `displayValue` for a given `value`.\nBy default, it will show the `value` itself.",
1210
- "attribute": "displayWith"
1211
- },
1212
- {
1213
- "kind": "field",
1214
- "name": "debounceDelay",
1215
- "type": {
1216
- "text": "number"
1217
- },
1218
- "default": "0",
1219
- "description": "Debounce delay",
1220
- "attribute": "debounce-delay",
1221
- "reflects": true
1222
- },
1223
- {
1224
- "kind": "field",
1225
- "name": "clearable",
1226
- "type": {
1227
- "text": "boolean"
1228
- },
1229
- "default": "false",
1230
- "description": "Show the option to clear input",
1231
- "attribute": "clearable",
1232
- "reflects": true
1231
+ "name": "validity",
1232
+ "description": "Gets the validity state object",
1233
+ "readonly": true
1233
1234
  },
1234
1235
  {
1235
1236
  "kind": "field",
1236
- "name": "clearOnFocus",
1237
- "type": {
1238
- "text": "boolean"
1239
- },
1240
- "default": "false",
1241
- "description": "Clear the value when the autocomplete is focused on",
1242
- "attribute": "clear-on-focus",
1243
- "reflects": true
1237
+ "name": "validationMessage",
1238
+ "description": "Gets the validation message",
1239
+ "readonly": true
1244
1240
  },
1245
1241
  {
1246
- "kind": "field",
1247
- "name": "inputText",
1248
- "type": {
1249
- "text": "string"
1250
- },
1251
- "privacy": "private",
1252
- "default": "''",
1253
- "description": "Current value displayed by the control; this can be what the user is typing or the label of the selected option"
1242
+ "kind": "method",
1243
+ "name": "handleBlur",
1244
+ "privacy": "private"
1254
1245
  },
1255
1246
  {
1256
- "kind": "field",
1257
- "name": "selectedOption",
1258
- "type": {
1259
- "text": "FlowOption | null"
1260
- },
1261
- "privacy": "private",
1262
- "default": "null"
1247
+ "kind": "method",
1248
+ "name": "handleFocus",
1249
+ "privacy": "private"
1263
1250
  },
1264
1251
  {
1265
- "kind": "field",
1266
- "name": "currentOption",
1267
- "type": {
1268
- "text": "FlowOption | null"
1269
- },
1270
- "privacy": "private",
1271
- "default": "null"
1252
+ "kind": "method",
1253
+ "name": "focus",
1254
+ "parameters": [
1255
+ {
1256
+ "name": "options",
1257
+ "optional": true,
1258
+ "type": {
1259
+ "text": "FocusOptions"
1260
+ }
1261
+ }
1262
+ ],
1263
+ "description": "Sets focus on the input."
1272
1264
  },
1273
1265
  {
1274
- "kind": "field",
1275
- "name": "input",
1276
- "type": {
1277
- "text": "HTMLInputElement"
1278
- },
1279
- "privacy": "private"
1266
+ "kind": "method",
1267
+ "name": "blur",
1268
+ "description": "Removes focus from the input."
1280
1269
  },
1281
1270
  {
1282
- "kind": "field",
1283
- "name": "popup",
1284
- "type": {
1285
- "text": "FlowPopup"
1286
- },
1287
- "privacy": "private"
1271
+ "kind": "method",
1272
+ "name": "checkValidity",
1273
+ "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
1288
1274
  },
1289
1275
  {
1290
1276
  "kind": "method",
@@ -1296,36 +1282,9 @@
1296
1282
  },
1297
1283
  "description": "Gets the associated form, if one exists."
1298
1284
  },
1299
- {
1300
- "kind": "field",
1301
- "name": "validity",
1302
- "description": "Gets the validity state object.",
1303
- "readonly": true
1304
- },
1305
- {
1306
- "kind": "field",
1307
- "name": "validationMessage",
1308
- "description": "Gets the validation message.",
1309
- "readonly": true
1310
- },
1311
- {
1312
- "kind": "method",
1313
- "name": "checkValidity",
1314
- "return": {
1315
- "type": {
1316
- "text": "boolean"
1317
- }
1318
- },
1319
- "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
1320
- },
1321
1285
  {
1322
1286
  "kind": "method",
1323
1287
  "name": "reportValidity",
1324
- "return": {
1325
- "type": {
1326
- "text": "boolean"
1327
- }
1328
- },
1329
1288
  "description": "Checks for validity and shows the browser's validation message if the control is invalid."
1330
1289
  },
1331
1290
  {
@@ -1333,296 +1292,430 @@
1333
1292
  "name": "setCustomValidity",
1334
1293
  "parameters": [
1335
1294
  {
1336
- "name": "_",
1295
+ "name": "message",
1337
1296
  "type": {
1338
1297
  "text": "string"
1339
1298
  }
1340
1299
  }
1341
1300
  ],
1342
1301
  "description": "Sets a custom validation message. Pass an empty string to restore validity."
1343
- },
1302
+ }
1303
+ ],
1304
+ "events": [
1344
1305
  {
1345
- "kind": "method",
1346
- "name": "handleClearClick",
1347
- "parameters": [
1348
- {
1349
- "name": "event",
1350
- "type": {
1351
- "text": "MouseEvent"
1352
- }
1353
- }
1354
- ]
1306
+ "description": "Emitted when the control loses focus.",
1307
+ "name": "flow-ui-blur",
1308
+ "reactName": "onFlowUiBlur"
1355
1309
  },
1356
1310
  {
1357
- "kind": "method",
1358
- "name": "focus",
1359
- "description": "Focuses on the control"
1311
+ "description": "Emitted when an alteration to the control's value is committed by the user.",
1312
+ "name": "flow-ui-change",
1313
+ "reactName": "onFlowUiChange"
1360
1314
  },
1361
1315
  {
1362
- "kind": "method",
1363
- "name": "blur",
1364
- "description": "Blurs from the control."
1316
+ "description": "Emitted when the clear button is activated.",
1317
+ "name": "flow-ui-clear",
1318
+ "reactName": "onFlowUiClear"
1365
1319
  },
1366
1320
  {
1367
- "kind": "method",
1368
- "name": "show",
1369
- "description": "Shows the listbox."
1321
+ "description": "Emitted when the control gains focus.",
1322
+ "name": "flow-ui-focus",
1323
+ "reactName": "onFlowUiFocus"
1370
1324
  },
1371
1325
  {
1372
- "kind": "method",
1373
- "name": "hide",
1374
- "description": "Hides the listbox."
1326
+ "description": "Emitted when the control receives input.",
1327
+ "name": "flow-ui-input",
1328
+ "reactName": "onFlowUiInput"
1375
1329
  },
1376
1330
  {
1377
- "kind": "method",
1378
- "name": "getInputText",
1379
- "description": "Gets the current value of the text input"
1331
+ "description": "Emitted when the form control has been checked for validity and its constraints aren't satisfied.",
1332
+ "name": "flow-ui-invalid",
1333
+ "reactName": "onFlowUiInvalid"
1380
1334
  }
1381
1335
  ],
1382
- "events": [
1336
+ "attributes": [
1383
1337
  {
1384
- "description": "Emitted when the display value changes.",
1385
- "name": "flow-ui-input",
1386
- "reactName": "onFlowUiInput"
1338
+ "name": "size",
1339
+ "type": {
1340
+ "text": "'small' | 'medium' | 'large'"
1341
+ },
1342
+ "default": "'medium'",
1343
+ "description": "The input's size.",
1344
+ "fieldName": "size"
1387
1345
  },
1388
1346
  {
1389
- "description": "Emitted when the input value changes.",
1390
- "name": "flow-ui-change",
1391
- "reactName": "onFlowUiChange"
1347
+ "name": "filled",
1348
+ "type": {
1349
+ "text": "boolean"
1350
+ },
1351
+ "default": "false",
1352
+ "description": "Draws a filled input.",
1353
+ "fieldName": "filled"
1392
1354
  },
1393
1355
  {
1394
- "description": "Emitted when the input is focused.",
1395
- "name": "flow-ui-focus",
1396
- "reactName": "onFlowUiFocus"
1356
+ "name": "pill",
1357
+ "type": {
1358
+ "text": "boolean"
1359
+ },
1360
+ "default": "false",
1361
+ "description": "Draws a pill-style input with rounded edges.",
1362
+ "fieldName": "pill"
1397
1363
  },
1398
1364
  {
1399
- "description": "Emitted when the input is blurred.",
1400
- "name": "flow-ui-blur",
1401
- "reactName": "onFlowUiBlur"
1365
+ "name": "label",
1366
+ "type": {
1367
+ "text": "string"
1368
+ },
1369
+ "default": "''",
1370
+ "description": "The input's label. If you need to display HTML, use the `label` slot instead.",
1371
+ "fieldName": "label"
1402
1372
  },
1403
1373
  {
1404
- "description": "Emitted when the dropdown is shown.",
1405
- "name": "flow-ui-show",
1406
- "reactName": "onFlowUiShow"
1374
+ "name": "help-text",
1375
+ "type": {
1376
+ "text": "string"
1377
+ },
1378
+ "default": "''",
1379
+ "description": "The input's help text. If you need to display HTML, use the `help-text` slot instead.",
1380
+ "fieldName": "helpText"
1407
1381
  },
1408
1382
  {
1409
- "description": "Emitted when the dropdown is shown.",
1410
- "name": "flow-ui-after-show",
1411
- "reactName": "onFlowUiAfterShow"
1383
+ "name": "disabled",
1384
+ "type": {
1385
+ "text": "boolean"
1386
+ },
1387
+ "default": "false",
1388
+ "description": "Disables the input.",
1389
+ "fieldName": "disabled"
1412
1390
  },
1413
1391
  {
1414
- "description": "Emitted when the dropdown is hidden.",
1415
- "name": "flow-ui-hide",
1416
- "reactName": "onFlowUiHide"
1392
+ "name": "form",
1393
+ "type": {
1394
+ "text": "string"
1395
+ },
1396
+ "default": "''",
1397
+ "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
1398
+ "fieldName": "form"
1417
1399
  },
1418
1400
  {
1419
- "description": "Emitted when the dropdown is hidden.",
1420
- "name": "flow-ui-after-hide",
1421
- "reactName": "onFlowUiAfterHide"
1401
+ "name": "required",
1402
+ "type": {
1403
+ "text": "boolean"
1404
+ },
1405
+ "default": "false",
1406
+ "description": "Makes the input a required field.",
1407
+ "fieldName": "required"
1422
1408
  },
1423
1409
  {
1424
- "description": "Emitted when the input is invalid.",
1425
- "name": "flow-ui-invalid",
1426
- "reactName": "onFlowUiInvalid"
1410
+ "name": "inline",
1411
+ "type": {
1412
+ "text": "boolean"
1413
+ },
1414
+ "default": "false",
1415
+ "description": "Display the input in the 'inline' form control style.",
1416
+ "fieldName": "inline"
1427
1417
  },
1428
1418
  {
1429
- "description": "Emitted when the input is valid.",
1430
- "name": "flow-ui-valid",
1431
- "reactName": "onFlowUiValid"
1432
- },
1419
+ "name": "divider",
1420
+ "type": {
1421
+ "text": "boolean"
1422
+ },
1423
+ "default": "false",
1424
+ "description": "Indicates that the control should display a divider",
1425
+ "fieldName": "divider"
1426
+ }
1427
+ ],
1428
+ "superclass": {
1429
+ "name": "FlowRdfFormControl",
1430
+ "module": "/src/internal/flow-ui-rdf-element"
1431
+ },
1432
+ "tagName": "flow-ui-base-control",
1433
+ "summary": "Inputs collect data from the user.",
1434
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/input",
1435
+ "status": "stable",
1436
+ "since": "2.0",
1437
+ "dependencies": [
1438
+ "flow-ui-icon",
1439
+ "flow-ui-icon-button"
1440
+ ],
1441
+ "customElement": true
1442
+ }
1443
+ ],
1444
+ "exports": [
1445
+ {
1446
+ "kind": "js",
1447
+ "name": "default",
1448
+ "declaration": {
1449
+ "name": "FlowUiBaseControl",
1450
+ "module": "components/base-control/base-control.component.js"
1451
+ }
1452
+ }
1453
+ ]
1454
+ },
1455
+ {
1456
+ "kind": "javascript-module",
1457
+ "path": "components/base-control/base-control.js",
1458
+ "declarations": [],
1459
+ "exports": [
1460
+ {
1461
+ "kind": "js",
1462
+ "name": "*",
1463
+ "declaration": {
1464
+ "name": "*",
1465
+ "package": "./base-control.component"
1466
+ }
1467
+ },
1468
+ {
1469
+ "kind": "js",
1470
+ "name": "default",
1471
+ "declaration": {
1472
+ "name": "FlowUiBaseControl",
1473
+ "module": "components/base-control/base-control.js"
1474
+ }
1475
+ }
1476
+ ]
1477
+ },
1478
+ {
1479
+ "kind": "javascript-module",
1480
+ "path": "components/breadcrumb/breadcrumb.component.js",
1481
+ "declarations": [
1482
+ {
1483
+ "kind": "class",
1484
+ "description": "",
1485
+ "name": "FlowUiBreadcrumb",
1486
+ "cssParts": [
1433
1487
  {
1434
- "description": "Emitted when the input is validated.",
1435
- "name": "flow-ui-validate",
1436
- "reactName": "onFlowUiValidate"
1488
+ "description": "The component's base wrapper.",
1489
+ "name": "base"
1490
+ }
1491
+ ],
1492
+ "slots": [
1493
+ {
1494
+ "description": "One or more breadcrumb items to display.",
1495
+ "name": ""
1437
1496
  },
1438
1497
  {
1439
- "description": "Emitted when the input is validated and the validity state is updated.",
1440
- "name": "flow-ui-validate-complete",
1441
- "reactName": "onFlowUiValidateComplete"
1498
+ "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
1499
+ "name": "separator"
1500
+ }
1501
+ ],
1502
+ "members": [
1503
+ {
1504
+ "kind": "field",
1505
+ "name": "localize",
1506
+ "privacy": "private",
1507
+ "readonly": true,
1508
+ "default": "new LocalizeController(this)"
1442
1509
  },
1443
1510
  {
1444
- "description": "Emitted when the input is validated and an error occurs.",
1445
- "name": "flow-ui-validate-error",
1446
- "reactName": "onFlowUiValidateError"
1511
+ "kind": "field",
1512
+ "name": "separatorDir",
1513
+ "privacy": "private"
1447
1514
  },
1448
1515
  {
1449
- "description": "Emitted when the input is validated and no errors occur.",
1450
- "name": "flow-ui-validate-success",
1451
- "reactName": "onFlowUiValidateSuccess"
1452
- }
1453
- ],
1454
- "attributes": [
1516
+ "kind": "field",
1517
+ "name": "defaultSlot",
1518
+ "type": {
1519
+ "text": "HTMLSlotElement"
1520
+ },
1521
+ "privacy": "private"
1522
+ },
1455
1523
  {
1456
- "name": "size",
1524
+ "kind": "field",
1525
+ "name": "separatorSlot",
1457
1526
  "type": {
1458
- "text": "'small' | 'medium' | 'large'"
1527
+ "text": "HTMLSlotElement"
1459
1528
  },
1460
- "default": "'medium'",
1461
- "description": "The autocomplete's size",
1462
- "fieldName": "size"
1529
+ "privacy": "private"
1463
1530
  },
1464
1531
  {
1465
- "name": "filled",
1532
+ "kind": "field",
1533
+ "name": "label",
1466
1534
  "type": {
1467
- "text": "boolean"
1535
+ "text": "string"
1468
1536
  },
1469
- "default": "false",
1470
- "description": "Draws a filled autocomplete input",
1471
- "fieldName": "filled"
1537
+ "default": "''",
1538
+ "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.",
1539
+ "attribute": "label"
1472
1540
  },
1473
1541
  {
1474
- "name": "pill",
1542
+ "kind": "method",
1543
+ "name": "getSeparator",
1544
+ "privacy": "private"
1545
+ },
1546
+ {
1547
+ "kind": "method",
1548
+ "name": "handleSlotChange",
1549
+ "privacy": "private"
1550
+ }
1551
+ ],
1552
+ "attributes": [
1553
+ {
1554
+ "name": "label",
1475
1555
  "type": {
1476
- "text": "boolean"
1556
+ "text": "string"
1477
1557
  },
1478
- "default": "false",
1479
- "description": "Draws a pill-style autocomplete input with rounded edges",
1480
- "fieldName": "pill"
1558
+ "default": "''",
1559
+ "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.",
1560
+ "fieldName": "label"
1561
+ }
1562
+ ],
1563
+ "superclass": {
1564
+ "name": "FlowRdfElement",
1565
+ "module": "/src/internal/flow-ui-rdf-element"
1566
+ },
1567
+ "tagName": "flow-ui-breadcrumb",
1568
+ "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
1569
+ "dependencies": [
1570
+ "flow-ui-icon"
1571
+ ],
1572
+ "customElement": true
1573
+ }
1574
+ ],
1575
+ "exports": [
1576
+ {
1577
+ "kind": "js",
1578
+ "name": "default",
1579
+ "declaration": {
1580
+ "name": "FlowUiBreadcrumb",
1581
+ "module": "components/breadcrumb/breadcrumb.component.js"
1582
+ }
1583
+ }
1584
+ ]
1585
+ },
1586
+ {
1587
+ "kind": "javascript-module",
1588
+ "path": "components/breadcrumb/breadcrumb.js",
1589
+ "declarations": [],
1590
+ "exports": [
1591
+ {
1592
+ "kind": "js",
1593
+ "name": "default",
1594
+ "declaration": {
1595
+ "name": "FlowUiBreadcrumb",
1596
+ "module": "components/breadcrumb/breadcrumb.js"
1597
+ }
1598
+ }
1599
+ ]
1600
+ },
1601
+ {
1602
+ "kind": "javascript-module",
1603
+ "path": "components/breadcrumb-item/breadcrumb-item.component.js",
1604
+ "declarations": [
1605
+ {
1606
+ "kind": "class",
1607
+ "description": "",
1608
+ "name": "FlowUiBreadcrumbItem",
1609
+ "cssParts": [
1610
+ {
1611
+ "description": "The component's base wrapper.",
1612
+ "name": "base"
1481
1613
  },
1482
1614
  {
1483
- "name": "label",
1484
- "type": {
1485
- "text": "string"
1486
- },
1487
- "default": "''",
1488
- "description": "The autocomplete input's label. If you need to display HTML, use the `help-text` slot instead",
1489
- "fieldName": "label"
1615
+ "description": "The breadcrumb item's label.",
1616
+ "name": "label"
1490
1617
  },
1491
1618
  {
1492
- "name": "help-text",
1493
- "type": {
1494
- "text": "string"
1495
- },
1496
- "default": "''",
1497
- "description": "The autocomplete input's help text. If you need to display HTML, use the `help-text` slot instead",
1498
- "fieldName": "helpText"
1619
+ "description": "The container that wraps the prefix.",
1620
+ "name": "prefix"
1499
1621
  },
1500
1622
  {
1501
- "name": "placeholder",
1502
- "type": {
1503
- "text": "string"
1504
- },
1505
- "default": "''",
1506
- "description": "The autocomplete input's placeholder text",
1507
- "fieldName": "placeholder"
1623
+ "description": "The container that wraps the suffix.",
1624
+ "name": "suffix"
1508
1625
  },
1509
1626
  {
1510
- "name": "disabled",
1511
- "type": {
1512
- "text": "boolean"
1513
- },
1514
- "default": "false",
1515
- "description": "Disables the autocomplete",
1516
- "fieldName": "disabled"
1517
- },
1627
+ "description": "The container that wraps the separator.",
1628
+ "name": "separator"
1629
+ }
1630
+ ],
1631
+ "slots": [
1518
1632
  {
1519
- "name": "form",
1520
- "type": {
1521
- "text": "string"
1522
- },
1523
- "description": "The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\nvalue of this attribute must be an id of a form in the same document or shadow root as the button.",
1524
- "fieldName": "form"
1633
+ "description": "The breadcrumb item's label.",
1634
+ "name": ""
1525
1635
  },
1526
1636
  {
1527
- "name": "required",
1528
- "type": {
1529
- "text": "boolean"
1530
- },
1531
- "default": "false",
1532
- "description": "Makes the autocomplete a required field",
1533
- "fieldName": "required"
1637
+ "description": "An optional prefix, usually an icon or icon button.",
1638
+ "name": "prefix"
1534
1639
  },
1535
1640
  {
1536
- "name": "inline",
1537
- "type": {
1538
- "text": "boolean"
1539
- },
1540
- "default": "false",
1541
- "description": "Display the autocomplete in the 'inline' form control style",
1542
- "fieldName": "inline"
1641
+ "description": "An optional suffix, usually an icon or icon button.",
1642
+ "name": "suffix"
1543
1643
  },
1544
1644
  {
1545
- "name": "divider",
1546
- "type": {
1547
- "text": "boolean"
1548
- },
1549
- "default": "false",
1550
- "description": "Indicates that the control should display a divider",
1551
- "fieldName": "divider"
1552
- },
1645
+ "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.",
1646
+ "name": "separator"
1647
+ }
1648
+ ],
1649
+ "members": [
1553
1650
  {
1554
- "name": "hoist",
1555
- "type": {
1556
- "text": "boolean"
1557
- },
1558
- "default": "false",
1559
- "description": "Enable this option to prevent the listbox from being clipped when the component is placed inside a container with\n`overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.",
1560
- "fieldName": "hoist"
1651
+ "kind": "field",
1652
+ "name": "hasSlotController",
1653
+ "privacy": "private",
1654
+ "readonly": true,
1655
+ "default": "new HasSlotController(this, 'prefix', 'suffix')"
1561
1656
  },
1562
1657
  {
1563
- "name": "placement",
1658
+ "kind": "field",
1659
+ "name": "href",
1564
1660
  "type": {
1565
- "text": "'top' | 'bottom'"
1661
+ "text": "string | undefined"
1566
1662
  },
1567
- "default": "'bottom'",
1568
- "description": "The preferred placement of the autocomplete's menu. Note that the actual placement may vary as needed to keep the listbox\ninside of the viewport.",
1569
- "fieldName": "placement"
1663
+ "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.",
1664
+ "attribute": "href"
1570
1665
  },
1571
1666
  {
1572
- "name": "value",
1667
+ "kind": "field",
1668
+ "name": "target",
1573
1669
  "type": {
1574
- "text": "string"
1670
+ "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
1575
1671
  },
1576
- "default": "''",
1577
- "description": "Current value of the control, selected from one of the valid options available",
1578
- "fieldName": "value"
1672
+ "description": "Tells the browser where to open the link. Only used when `href` is set.",
1673
+ "attribute": "target"
1579
1674
  },
1580
1675
  {
1581
- "name": "displayWith",
1676
+ "kind": "field",
1677
+ "name": "rel",
1582
1678
  "type": {
1583
- "text": "((value: string) => string) | ((value: string) => Promise<string>)"
1679
+ "text": "string"
1584
1680
  },
1585
- "description": "Function for determining the `displayValue` for a given `value`.\nBy default, it will show the `value` itself.",
1586
- "fieldName": "displayWith"
1587
- },
1681
+ "default": "'noreferrer noopener'",
1682
+ "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
1683
+ "attribute": "rel"
1684
+ }
1685
+ ],
1686
+ "attributes": [
1588
1687
  {
1589
- "name": "debounce-delay",
1688
+ "name": "href",
1590
1689
  "type": {
1591
- "text": "number"
1690
+ "text": "string | undefined"
1592
1691
  },
1593
- "default": "0",
1594
- "description": "Debounce delay",
1595
- "fieldName": "debounceDelay"
1692
+ "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.",
1693
+ "fieldName": "href"
1596
1694
  },
1597
1695
  {
1598
- "name": "clearable",
1696
+ "name": "target",
1599
1697
  "type": {
1600
- "text": "boolean"
1698
+ "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
1601
1699
  },
1602
- "default": "false",
1603
- "description": "Show the option to clear input",
1604
- "fieldName": "clearable"
1700
+ "description": "Tells the browser where to open the link. Only used when `href` is set.",
1701
+ "fieldName": "target"
1605
1702
  },
1606
1703
  {
1607
- "name": "clear-on-focus",
1704
+ "name": "rel",
1608
1705
  "type": {
1609
- "text": "boolean"
1706
+ "text": "string"
1610
1707
  },
1611
- "default": "false",
1612
- "description": "Clear the value when the autocomplete is focused on",
1613
- "fieldName": "clearOnFocus"
1708
+ "default": "'noreferrer noopener'",
1709
+ "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
1710
+ "fieldName": "rel"
1614
1711
  }
1615
1712
  ],
1616
1713
  "superclass": {
1617
- "name": "FlowRdfFormControl",
1714
+ "name": "FlowRdfElement",
1618
1715
  "module": "/src/internal/flow-ui-rdf-element"
1619
1716
  },
1620
- "tagName": "flow-ui-autocomplete",
1621
- "summary": "The Autocomplete is a Text input enhanced by a panel of suggested options.",
1622
- "dependencies": [
1623
- "flow-ui-popup",
1624
- "flow-ui-icon"
1625
- ],
1717
+ "tagName": "flow-ui-breadcrumb-item",
1718
+ "summary": "Breadcrumb Items are used inside [breadcrumbs](./flow-ui-breadcrumb) to represent different links.",
1626
1719
  "customElement": true
1627
1720
  }
1628
1721
  ],
@@ -1631,145 +1724,183 @@
1631
1724
  "kind": "js",
1632
1725
  "name": "default",
1633
1726
  "declaration": {
1634
- "name": "FlowUiAutocomplete",
1635
- "module": "components/autocomplete/autocomplete.component.js"
1727
+ "name": "FlowUiBreadcrumbItem",
1728
+ "module": "components/breadcrumb-item/breadcrumb-item.component.js"
1636
1729
  }
1637
1730
  }
1638
1731
  ]
1639
1732
  },
1640
1733
  {
1641
1734
  "kind": "javascript-module",
1642
- "path": "components/autocomplete/autocomplete.js",
1735
+ "path": "components/breadcrumb-item/breadcrumb-item.js",
1643
1736
  "declarations": [],
1644
1737
  "exports": [
1645
- {
1646
- "kind": "js",
1647
- "name": "*",
1648
- "declaration": {
1649
- "name": "*",
1650
- "package": "./autocomplete.component"
1651
- }
1652
- },
1653
1738
  {
1654
1739
  "kind": "js",
1655
1740
  "name": "default",
1656
1741
  "declaration": {
1657
- "name": "FlowUiAutocomplete",
1658
- "module": "components/autocomplete/autocomplete.js"
1742
+ "name": "FlowUiBreadcrumbItem",
1743
+ "module": "components/breadcrumb-item/breadcrumb-item.js"
1659
1744
  }
1660
1745
  }
1661
1746
  ]
1662
1747
  },
1663
1748
  {
1664
1749
  "kind": "javascript-module",
1665
- "path": "components/badge/badge.component.js",
1750
+ "path": "components/avatar/avatar.component.js",
1666
1751
  "declarations": [
1667
1752
  {
1668
1753
  "kind": "class",
1669
1754
  "description": "",
1670
- "name": "FlowUiBadge",
1755
+ "name": "FlowUiAvatar",
1756
+ "cssProperties": [
1757
+ {
1758
+ "description": "The size of the avatar.",
1759
+ "name": "--size"
1760
+ }
1761
+ ],
1671
1762
  "cssParts": [
1672
1763
  {
1673
1764
  "description": "The component's base wrapper.",
1674
1765
  "name": "base"
1766
+ },
1767
+ {
1768
+ "description": "The container that wraps the avatar's icon.",
1769
+ "name": "icon"
1770
+ },
1771
+ {
1772
+ "description": "The container that wraps the avatar's initials.",
1773
+ "name": "initials"
1774
+ },
1775
+ {
1776
+ "description": "The avatar image. Only shown when the `image` attribute is set.",
1777
+ "name": "image"
1675
1778
  }
1676
1779
  ],
1677
1780
  "slots": [
1678
1781
  {
1679
- "description": "The badge's content.",
1680
- "name": ""
1782
+ "description": "The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.",
1783
+ "name": "icon"
1681
1784
  }
1682
1785
  ],
1683
1786
  "members": [
1684
1787
  {
1685
1788
  "kind": "field",
1686
- "name": "variant",
1789
+ "name": "hasError",
1687
1790
  "type": {
1688
- "text": "'primary' | 'secondary' | 'success' | 'neutral' | 'warning' | 'danger'"
1791
+ "text": "boolean"
1689
1792
  },
1690
- "default": "'primary'",
1691
- "description": "The badge's theme variant.",
1692
- "attribute": "variant",
1693
- "reflects": true
1793
+ "privacy": "private",
1794
+ "default": "false"
1694
1795
  },
1695
1796
  {
1696
1797
  "kind": "field",
1697
- "name": "size",
1798
+ "name": "image",
1698
1799
  "type": {
1699
- "text": "'small' | 'medium' | 'large'"
1800
+ "text": "string"
1700
1801
  },
1701
- "default": "'medium'",
1702
- "description": "The badge size.",
1703
- "attribute": "size",
1704
- "reflects": true
1802
+ "default": "''",
1803
+ "description": "The image source to use for the avatar.",
1804
+ "attribute": "image"
1705
1805
  },
1706
1806
  {
1707
1807
  "kind": "field",
1708
- "name": "pill",
1808
+ "name": "label",
1709
1809
  "type": {
1710
- "text": "boolean"
1810
+ "text": "string"
1711
1811
  },
1712
- "default": "false",
1713
- "description": "Draws a pill-style badge with rounded edges.",
1714
- "attribute": "pill",
1715
- "reflects": true
1812
+ "default": "''",
1813
+ "description": "A label to use to describe the avatar to assistive devices.",
1814
+ "attribute": "label"
1815
+ },
1816
+ {
1817
+ "kind": "field",
1818
+ "name": "initials",
1819
+ "type": {
1820
+ "text": "string"
1821
+ },
1822
+ "default": "''",
1823
+ "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
1824
+ "attribute": "initials"
1825
+ },
1826
+ {
1827
+ "kind": "field",
1828
+ "name": "loading",
1829
+ "type": {
1830
+ "text": "'eager' | 'lazy'"
1831
+ },
1832
+ "default": "'eager'",
1833
+ "description": "Indicates how the browser should load the image.",
1834
+ "attribute": "loading"
1716
1835
  },
1717
1836
  {
1718
1837
  "kind": "field",
1719
- "name": "pulse",
1838
+ "name": "shape",
1720
1839
  "type": {
1721
- "text": "boolean"
1840
+ "text": "'circle' | 'square' | 'rounded'"
1722
1841
  },
1723
- "default": "false",
1724
- "description": "Makes the badge pulsate to draw attention.",
1725
- "attribute": "pulse",
1842
+ "default": "'circle'",
1843
+ "description": "The shape of the avatar.",
1844
+ "attribute": "shape",
1726
1845
  "reflects": true
1727
1846
  }
1728
1847
  ],
1729
1848
  "attributes": [
1730
1849
  {
1731
- "name": "variant",
1850
+ "name": "image",
1732
1851
  "type": {
1733
- "text": "'primary' | 'secondary' | 'success' | 'neutral' | 'warning' | 'danger'"
1852
+ "text": "string"
1734
1853
  },
1735
- "default": "'primary'",
1736
- "description": "The badge's theme variant.",
1737
- "fieldName": "variant"
1854
+ "default": "''",
1855
+ "description": "The image source to use for the avatar.",
1856
+ "fieldName": "image"
1738
1857
  },
1739
1858
  {
1740
- "name": "size",
1859
+ "name": "label",
1741
1860
  "type": {
1742
- "text": "'small' | 'medium' | 'large'"
1861
+ "text": "string"
1743
1862
  },
1744
- "default": "'medium'",
1745
- "description": "The badge size.",
1746
- "fieldName": "size"
1863
+ "default": "''",
1864
+ "description": "A label to use to describe the avatar to assistive devices.",
1865
+ "fieldName": "label"
1747
1866
  },
1748
1867
  {
1749
- "name": "pill",
1868
+ "name": "initials",
1750
1869
  "type": {
1751
- "text": "boolean"
1870
+ "text": "string"
1752
1871
  },
1753
- "default": "false",
1754
- "description": "Draws a pill-style badge with rounded edges.",
1755
- "fieldName": "pill"
1872
+ "default": "''",
1873
+ "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
1874
+ "fieldName": "initials"
1756
1875
  },
1757
1876
  {
1758
- "name": "pulse",
1877
+ "name": "loading",
1759
1878
  "type": {
1760
- "text": "boolean"
1879
+ "text": "'eager' | 'lazy'"
1761
1880
  },
1762
- "default": "false",
1763
- "description": "Makes the badge pulsate to draw attention.",
1764
- "fieldName": "pulse"
1881
+ "default": "'eager'",
1882
+ "description": "Indicates how the browser should load the image.",
1883
+ "fieldName": "loading"
1884
+ },
1885
+ {
1886
+ "name": "shape",
1887
+ "type": {
1888
+ "text": "'circle' | 'square' | 'rounded'"
1889
+ },
1890
+ "default": "'circle'",
1891
+ "description": "The shape of the avatar.",
1892
+ "fieldName": "shape"
1765
1893
  }
1766
1894
  ],
1767
1895
  "superclass": {
1768
1896
  "name": "FlowRdfElement",
1769
1897
  "module": "/src/internal/flow-ui-rdf-element"
1770
1898
  },
1771
- "tagName": "flow-ui-badge",
1772
- "summary": "Badges are used to draw attention and display statuses or counts.",
1899
+ "tagName": "flow-ui-avatar",
1900
+ "summary": "Avatars are used to represent a person or object.",
1901
+ "dependencies": [
1902
+ "flow-ui-icon"
1903
+ ],
1773
1904
  "customElement": true
1774
1905
  }
1775
1906
  ],
@@ -1778,23 +1909,23 @@
1778
1909
  "kind": "js",
1779
1910
  "name": "default",
1780
1911
  "declaration": {
1781
- "name": "FlowUiBadge",
1782
- "module": "components/badge/badge.component.js"
1912
+ "name": "FlowUiAvatar",
1913
+ "module": "components/avatar/avatar.component.js"
1783
1914
  }
1784
1915
  }
1785
1916
  ]
1786
1917
  },
1787
1918
  {
1788
1919
  "kind": "javascript-module",
1789
- "path": "components/badge/badge.js",
1920
+ "path": "components/avatar/avatar.js",
1790
1921
  "declarations": [],
1791
1922
  "exports": [
1792
1923
  {
1793
1924
  "kind": "js",
1794
1925
  "name": "default",
1795
1926
  "declaration": {
1796
- "name": "FlowUiBadge",
1797
- "module": "components/badge/badge.js"
1927
+ "name": "FlowUiAvatar",
1928
+ "module": "components/avatar/avatar.js"
1798
1929
  }
1799
1930
  }
1800
1931
  ]
@@ -2078,224 +2209,51 @@
2078
2209
  },
2079
2210
  "default": "0",
2080
2211
  "description": "The number of milliseconds to delay after the active period of an animation sequence.",
2081
- "fieldName": "endDelay"
2082
- },
2083
- {
2084
- "name": "fill",
2085
- "type": {
2086
- "text": "FillMode"
2087
- },
2088
- "default": "'auto'",
2089
- "description": "Sets how the animation applies styles to its target before and after its execution.",
2090
- "fieldName": "fill"
2091
- },
2092
- {
2093
- "name": "iterations",
2094
- "default": "Infinity",
2095
- "description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
2096
- "resolveInitializer": {
2097
- "module": "src/components/animation/animation.component.ts"
2098
- },
2099
- "fieldName": "iterations"
2100
- },
2101
- {
2102
- "name": "iteration-start",
2103
- "type": {
2104
- "text": "number"
2105
- },
2106
- "default": "0",
2107
- "description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
2108
- "fieldName": "iterationStart"
2109
- },
2110
- {
2111
- "name": "playback-rate",
2112
- "type": {
2113
- "text": "number"
2114
- },
2115
- "default": "1",
2116
- "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.",
2117
- "fieldName": "playbackRate"
2118
- }
2119
- ],
2120
- "superclass": {
2121
- "name": "FlowRdfElement",
2122
- "module": "/src/internal/flow-ui-rdf-element"
2123
- },
2124
- "tagName": "flow-ui-animation",
2125
- "summary": "Animate elements declaratively with over 100 animation presets. Powered by the [Web Animations API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API).",
2126
- "customElement": true
2127
- }
2128
- ],
2129
- "exports": [
2130
- {
2131
- "kind": "js",
2132
- "name": "default",
2133
- "declaration": {
2134
- "name": "FlowUiAnimation",
2135
- "module": "components/animation/animation.component.js"
2136
- }
2137
- }
2138
- ]
2139
- },
2140
- {
2141
- "kind": "javascript-module",
2142
- "path": "components/animation/animation.js",
2143
- "declarations": [],
2144
- "exports": [
2145
- {
2146
- "kind": "js",
2147
- "name": "*",
2148
- "declaration": {
2149
- "name": "*",
2150
- "package": "./animation.component"
2151
- }
2152
- },
2153
- {
2154
- "kind": "js",
2155
- "name": "default",
2156
- "declaration": {
2157
- "name": "FlowUiAnimation",
2158
- "module": "components/animation/animation.js"
2159
- }
2160
- }
2161
- ]
2162
- },
2163
- {
2164
- "kind": "javascript-module",
2165
- "path": "components/animation/animations.js",
2166
- "declarations": [
2167
- {
2168
- "kind": "function",
2169
- "name": "getAnimationNames",
2170
- "description": "Returns a list of all supported animation names.\n\nSupply the required animation as the `name` property of the\n`<flow-ui-animation>` component."
2171
- },
2172
- {
2173
- "kind": "function",
2174
- "name": "getEasingNames",
2175
- "description": "Returns a list of all supported easing method names.\n\nSupply the required easing method as the `easing` property of the\n`<flow-ui-animation>` component."
2176
- }
2177
- ],
2178
- "exports": [
2179
- {
2180
- "kind": "js",
2181
- "name": "animations",
2182
- "declaration": {
2183
- "name": "animations",
2184
- "module": "components/animation/animations.js"
2185
- }
2186
- },
2187
- {
2188
- "kind": "js",
2189
- "name": "getAnimationNames",
2190
- "declaration": {
2191
- "name": "getAnimationNames",
2192
- "module": "components/animation/animations.js"
2193
- }
2194
- },
2195
- {
2196
- "kind": "js",
2197
- "name": "getEasingNames",
2198
- "declaration": {
2199
- "name": "getEasingNames",
2200
- "module": "components/animation/animations.js"
2201
- }
2202
- }
2203
- ]
2204
- },
2205
- {
2206
- "kind": "javascript-module",
2207
- "path": "components/breadcrumb/breadcrumb.component.js",
2208
- "declarations": [
2209
- {
2210
- "kind": "class",
2211
- "description": "",
2212
- "name": "FlowUiBreadcrumb",
2213
- "cssParts": [
2214
- {
2215
- "description": "The component's base wrapper.",
2216
- "name": "base"
2217
- }
2218
- ],
2219
- "slots": [
2220
- {
2221
- "description": "One or more breadcrumb items to display.",
2222
- "name": ""
2223
- },
2224
- {
2225
- "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
2226
- "name": "separator"
2227
- }
2228
- ],
2229
- "members": [
2230
- {
2231
- "kind": "field",
2232
- "name": "localize",
2233
- "privacy": "private",
2234
- "readonly": true,
2235
- "default": "new LocalizeController(this)"
2236
- },
2237
- {
2238
- "kind": "field",
2239
- "name": "separatorDir",
2240
- "privacy": "private"
2241
- },
2242
- {
2243
- "kind": "field",
2244
- "name": "defaultSlot",
2245
- "type": {
2246
- "text": "HTMLSlotElement"
2247
- },
2248
- "privacy": "private"
2249
- },
2250
- {
2251
- "kind": "field",
2252
- "name": "separatorSlot",
2253
- "type": {
2254
- "text": "HTMLSlotElement"
2255
- },
2256
- "privacy": "private"
2212
+ "fieldName": "endDelay"
2257
2213
  },
2258
2214
  {
2259
- "kind": "field",
2260
- "name": "label",
2215
+ "name": "fill",
2261
2216
  "type": {
2262
- "text": "string"
2217
+ "text": "FillMode"
2263
2218
  },
2264
- "default": "''",
2265
- "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.",
2266
- "attribute": "label"
2219
+ "default": "'auto'",
2220
+ "description": "Sets how the animation applies styles to its target before and after its execution.",
2221
+ "fieldName": "fill"
2267
2222
  },
2268
2223
  {
2269
- "kind": "method",
2270
- "name": "getSeparator",
2271
- "privacy": "private"
2224
+ "name": "iterations",
2225
+ "default": "Infinity",
2226
+ "description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
2227
+ "resolveInitializer": {
2228
+ "module": "src/components/animation/animation.component.ts"
2229
+ },
2230
+ "fieldName": "iterations"
2272
2231
  },
2273
2232
  {
2274
- "kind": "method",
2275
- "name": "handleSlotChange",
2276
- "privacy": "private"
2277
- }
2278
- ],
2279
- "attributes": [
2233
+ "name": "iteration-start",
2234
+ "type": {
2235
+ "text": "number"
2236
+ },
2237
+ "default": "0",
2238
+ "description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
2239
+ "fieldName": "iterationStart"
2240
+ },
2280
2241
  {
2281
- "name": "label",
2242
+ "name": "playback-rate",
2282
2243
  "type": {
2283
- "text": "string"
2244
+ "text": "number"
2284
2245
  },
2285
- "default": "''",
2286
- "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.",
2287
- "fieldName": "label"
2246
+ "default": "1",
2247
+ "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.",
2248
+ "fieldName": "playbackRate"
2288
2249
  }
2289
2250
  ],
2290
2251
  "superclass": {
2291
2252
  "name": "FlowRdfElement",
2292
2253
  "module": "/src/internal/flow-ui-rdf-element"
2293
2254
  },
2294
- "tagName": "flow-ui-breadcrumb",
2295
- "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
2296
- "dependencies": [
2297
- "flow-ui-icon"
2298
- ],
2255
+ "tagName": "flow-ui-animation",
2256
+ "summary": "Animate elements declaratively with over 100 animation presets. Powered by the [Web Animations API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API).",
2299
2257
  "customElement": true
2300
2258
  }
2301
2259
  ],
@@ -2304,145 +2262,187 @@
2304
2262
  "kind": "js",
2305
2263
  "name": "default",
2306
2264
  "declaration": {
2307
- "name": "FlowUiBreadcrumb",
2308
- "module": "components/breadcrumb/breadcrumb.component.js"
2265
+ "name": "FlowUiAnimation",
2266
+ "module": "components/animation/animation.component.js"
2309
2267
  }
2310
2268
  }
2311
2269
  ]
2312
2270
  },
2313
2271
  {
2314
2272
  "kind": "javascript-module",
2315
- "path": "components/breadcrumb/breadcrumb.js",
2273
+ "path": "components/animation/animation.js",
2316
2274
  "declarations": [],
2317
2275
  "exports": [
2276
+ {
2277
+ "kind": "js",
2278
+ "name": "*",
2279
+ "declaration": {
2280
+ "name": "*",
2281
+ "package": "./animation.component"
2282
+ }
2283
+ },
2318
2284
  {
2319
2285
  "kind": "js",
2320
2286
  "name": "default",
2321
2287
  "declaration": {
2322
- "name": "FlowUiBreadcrumb",
2323
- "module": "components/breadcrumb/breadcrumb.js"
2288
+ "name": "FlowUiAnimation",
2289
+ "module": "components/animation/animation.js"
2324
2290
  }
2325
2291
  }
2326
2292
  ]
2327
2293
  },
2328
2294
  {
2329
2295
  "kind": "javascript-module",
2330
- "path": "components/breadcrumb-item/breadcrumb-item.component.js",
2296
+ "path": "components/animation/animations.js",
2297
+ "declarations": [
2298
+ {
2299
+ "kind": "function",
2300
+ "name": "getAnimationNames",
2301
+ "description": "Returns a list of all supported animation names.\n\nSupply the required animation as the `name` property of the\n`<flow-ui-animation>` component."
2302
+ },
2303
+ {
2304
+ "kind": "function",
2305
+ "name": "getEasingNames",
2306
+ "description": "Returns a list of all supported easing method names.\n\nSupply the required easing method as the `easing` property of the\n`<flow-ui-animation>` component."
2307
+ }
2308
+ ],
2309
+ "exports": [
2310
+ {
2311
+ "kind": "js",
2312
+ "name": "animations",
2313
+ "declaration": {
2314
+ "name": "animations",
2315
+ "module": "components/animation/animations.js"
2316
+ }
2317
+ },
2318
+ {
2319
+ "kind": "js",
2320
+ "name": "getAnimationNames",
2321
+ "declaration": {
2322
+ "name": "getAnimationNames",
2323
+ "module": "components/animation/animations.js"
2324
+ }
2325
+ },
2326
+ {
2327
+ "kind": "js",
2328
+ "name": "getEasingNames",
2329
+ "declaration": {
2330
+ "name": "getEasingNames",
2331
+ "module": "components/animation/animations.js"
2332
+ }
2333
+ }
2334
+ ]
2335
+ },
2336
+ {
2337
+ "kind": "javascript-module",
2338
+ "path": "components/badge/badge.component.js",
2331
2339
  "declarations": [
2332
2340
  {
2333
2341
  "kind": "class",
2334
2342
  "description": "",
2335
- "name": "FlowUiBreadcrumbItem",
2343
+ "name": "FlowUiBadge",
2336
2344
  "cssParts": [
2337
2345
  {
2338
2346
  "description": "The component's base wrapper.",
2339
2347
  "name": "base"
2340
- },
2341
- {
2342
- "description": "The breadcrumb item's label.",
2343
- "name": "label"
2344
- },
2345
- {
2346
- "description": "The container that wraps the prefix.",
2347
- "name": "prefix"
2348
- },
2349
- {
2350
- "description": "The container that wraps the suffix.",
2351
- "name": "suffix"
2352
- },
2353
- {
2354
- "description": "The container that wraps the separator.",
2355
- "name": "separator"
2356
2348
  }
2357
2349
  ],
2358
2350
  "slots": [
2359
2351
  {
2360
- "description": "The breadcrumb item's label.",
2352
+ "description": "The badge's content.",
2361
2353
  "name": ""
2362
- },
2363
- {
2364
- "description": "An optional prefix, usually an icon or icon button.",
2365
- "name": "prefix"
2366
- },
2367
- {
2368
- "description": "An optional suffix, usually an icon or icon button.",
2369
- "name": "suffix"
2370
- },
2371
- {
2372
- "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.",
2373
- "name": "separator"
2374
2354
  }
2375
2355
  ],
2376
2356
  "members": [
2377
2357
  {
2378
2358
  "kind": "field",
2379
- "name": "hasSlotController",
2380
- "privacy": "private",
2381
- "readonly": true,
2382
- "default": "new HasSlotController(this, 'prefix', 'suffix')"
2359
+ "name": "variant",
2360
+ "type": {
2361
+ "text": "'primary' | 'secondary' | 'success' | 'neutral' | 'warning' | 'danger'"
2362
+ },
2363
+ "default": "'primary'",
2364
+ "description": "The badge's theme variant.",
2365
+ "attribute": "variant",
2366
+ "reflects": true
2383
2367
  },
2384
2368
  {
2385
2369
  "kind": "field",
2386
- "name": "href",
2370
+ "name": "size",
2387
2371
  "type": {
2388
- "text": "string | undefined"
2372
+ "text": "'small' | 'medium' | 'large'"
2389
2373
  },
2390
- "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.",
2391
- "attribute": "href"
2374
+ "default": "'medium'",
2375
+ "description": "The badge size.",
2376
+ "attribute": "size",
2377
+ "reflects": true
2392
2378
  },
2393
2379
  {
2394
2380
  "kind": "field",
2395
- "name": "target",
2381
+ "name": "pill",
2396
2382
  "type": {
2397
- "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
2383
+ "text": "boolean"
2398
2384
  },
2399
- "description": "Tells the browser where to open the link. Only used when `href` is set.",
2400
- "attribute": "target"
2385
+ "default": "false",
2386
+ "description": "Draws a pill-style badge with rounded edges.",
2387
+ "attribute": "pill",
2388
+ "reflects": true
2401
2389
  },
2402
2390
  {
2403
2391
  "kind": "field",
2404
- "name": "rel",
2392
+ "name": "pulse",
2405
2393
  "type": {
2406
- "text": "string"
2394
+ "text": "boolean"
2407
2395
  },
2408
- "default": "'noreferrer noopener'",
2409
- "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
2410
- "attribute": "rel"
2396
+ "default": "false",
2397
+ "description": "Makes the badge pulsate to draw attention.",
2398
+ "attribute": "pulse",
2399
+ "reflects": true
2411
2400
  }
2412
2401
  ],
2413
2402
  "attributes": [
2414
2403
  {
2415
- "name": "href",
2404
+ "name": "variant",
2416
2405
  "type": {
2417
- "text": "string | undefined"
2406
+ "text": "'primary' | 'secondary' | 'success' | 'neutral' | 'warning' | 'danger'"
2418
2407
  },
2419
- "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.",
2420
- "fieldName": "href"
2408
+ "default": "'primary'",
2409
+ "description": "The badge's theme variant.",
2410
+ "fieldName": "variant"
2421
2411
  },
2422
2412
  {
2423
- "name": "target",
2413
+ "name": "size",
2424
2414
  "type": {
2425
- "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
2415
+ "text": "'small' | 'medium' | 'large'"
2426
2416
  },
2427
- "description": "Tells the browser where to open the link. Only used when `href` is set.",
2428
- "fieldName": "target"
2417
+ "default": "'medium'",
2418
+ "description": "The badge size.",
2419
+ "fieldName": "size"
2429
2420
  },
2430
2421
  {
2431
- "name": "rel",
2422
+ "name": "pill",
2432
2423
  "type": {
2433
- "text": "string"
2424
+ "text": "boolean"
2434
2425
  },
2435
- "default": "'noreferrer noopener'",
2436
- "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
2437
- "fieldName": "rel"
2426
+ "default": "false",
2427
+ "description": "Draws a pill-style badge with rounded edges.",
2428
+ "fieldName": "pill"
2429
+ },
2430
+ {
2431
+ "name": "pulse",
2432
+ "type": {
2433
+ "text": "boolean"
2434
+ },
2435
+ "default": "false",
2436
+ "description": "Makes the badge pulsate to draw attention.",
2437
+ "fieldName": "pulse"
2438
2438
  }
2439
2439
  ],
2440
2440
  "superclass": {
2441
2441
  "name": "FlowRdfElement",
2442
2442
  "module": "/src/internal/flow-ui-rdf-element"
2443
2443
  },
2444
- "tagName": "flow-ui-breadcrumb-item",
2445
- "summary": "Breadcrumb Items are used inside [breadcrumbs](./flow-ui-breadcrumb) to represent different links.",
2444
+ "tagName": "flow-ui-badge",
2445
+ "summary": "Badges are used to draw attention and display statuses or counts.",
2446
2446
  "customElement": true
2447
2447
  }
2448
2448
  ],
@@ -2451,23 +2451,23 @@
2451
2451
  "kind": "js",
2452
2452
  "name": "default",
2453
2453
  "declaration": {
2454
- "name": "FlowUiBreadcrumbItem",
2455
- "module": "components/breadcrumb-item/breadcrumb-item.component.js"
2454
+ "name": "FlowUiBadge",
2455
+ "module": "components/badge/badge.component.js"
2456
2456
  }
2457
2457
  }
2458
2458
  ]
2459
2459
  },
2460
2460
  {
2461
2461
  "kind": "javascript-module",
2462
- "path": "components/breadcrumb-item/breadcrumb-item.js",
2462
+ "path": "components/badge/badge.js",
2463
2463
  "declarations": [],
2464
2464
  "exports": [
2465
2465
  {
2466
2466
  "kind": "js",
2467
2467
  "name": "default",
2468
2468
  "declaration": {
2469
- "name": "FlowUiBreadcrumbItem",
2470
- "module": "components/breadcrumb-item/breadcrumb-item.js"
2469
+ "name": "FlowUiBadge",
2470
+ "module": "components/badge/badge.js"
2471
2471
  }
2472
2472
  }
2473
2473
  ]
@@ -10134,7 +10134,7 @@
10134
10134
  "text": "'small' | 'medium' | 'large'"
10135
10135
  },
10136
10136
  "default": "'medium'",
10137
- "description": "The form group's size. Child form control will automatically be set to the selected size.",
10137
+ "description": "The form group's size. Child form controls will automatically be set to the selected size.",
10138
10138
  "attribute": "size",
10139
10139
  "reflects": true
10140
10140
  },
@@ -10197,7 +10197,7 @@
10197
10197
  "text": "'small' | 'medium' | 'large'"
10198
10198
  },
10199
10199
  "default": "'medium'",
10200
- "description": "The form group's size. Child form control will automatically be set to the selected size.",
10200
+ "description": "The form group's size. Child form controls will automatically be set to the selected size.",
10201
10201
  "fieldName": "size"
10202
10202
  },
10203
10203
  {
@@ -12857,8 +12857,18 @@
12857
12857
  "text": "string"
12858
12858
  },
12859
12859
  "default": "'Edit'",
12860
+ "description": "The 'edit' menu item text. (default: 'Edit')",
12860
12861
  "attribute": "edit-menu-name"
12861
12862
  },
12863
+ {
12864
+ "kind": "field",
12865
+ "name": "placeholder",
12866
+ "type": {
12867
+ "text": "string"
12868
+ },
12869
+ "description": "The list item input control's placeholder text.",
12870
+ "attribute": "placeholder"
12871
+ },
12862
12872
  {
12863
12873
  "kind": "field",
12864
12874
  "name": "value",
@@ -13095,8 +13105,17 @@
13095
13105
  "text": "string"
13096
13106
  },
13097
13107
  "default": "'Edit'",
13108
+ "description": "The 'edit' menu item text. (default: 'Edit')",
13098
13109
  "fieldName": "editMenuName"
13099
13110
  },
13111
+ {
13112
+ "name": "placeholder",
13113
+ "type": {
13114
+ "text": "string"
13115
+ },
13116
+ "description": "The list item input control's placeholder text.",
13117
+ "fieldName": "placeholder"
13118
+ },
13100
13119
  {
13101
13120
  "name": "value",
13102
13121
  "type": {
@@ -25895,6 +25914,6 @@
25895
25914
  ],
25896
25915
  "package": {
25897
25916
  "name": "@emuanalytics/flow-rdf-ui",
25898
- "version": "4.1.21"
25917
+ "version": "4.1.23"
25899
25918
  }
25900
25919
  }