@emuanalytics/flow-rdf-ui 4.1.10 → 4.1.11

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.
@@ -267,30 +267,115 @@
267
267
  },
268
268
  {
269
269
  "kind": "javascript-module",
270
- "path": "components/animation/animation.component.js",
270
+ "path": "components/autocomplete/autocomplete.component.js",
271
271
  "declarations": [
272
272
  {
273
273
  "kind": "class",
274
274
  "description": "",
275
- "name": "FlowUiAnimation",
275
+ "name": "FlowUiAutocomplete",
276
+ "cssParts": [
277
+ {
278
+ "description": "The form control that wraps the label, input, and help text.",
279
+ "name": "form-control"
280
+ },
281
+ {
282
+ "description": "The label's wrapper.",
283
+ "name": "form-control-label"
284
+ },
285
+ {
286
+ "description": "The select's wrapper.",
287
+ "name": "form-control-input"
288
+ },
289
+ {
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"
316
+ }
317
+ ],
276
318
  "slots": [
277
319
  {
278
- "description": "The element to animate. Avoid slotting in more than one element, as subsequent ones will be ignored. To animate multiple elements, either wrap them in a single container or use multiple `<flow-ui-animation>` elements.",
320
+ "description": "The listbox options. Must be `<flow-option>` elements. You can use `<flow-divider>` to group items visually.",
279
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"
280
342
  }
281
343
  ],
282
344
  "members": [
283
345
  {
284
346
  "kind": "field",
285
- "name": "animation",
347
+ "name": "dependencies",
286
348
  "type": {
287
- "text": "Animation | undefined"
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"
288
373
  },
289
374
  "privacy": "private"
290
375
  },
291
376
  {
292
377
  "kind": "field",
293
- "name": "hasStarted",
378
+ "name": "pendingChangeEvent",
294
379
  "type": {
295
380
  "text": "boolean"
296
381
  },
@@ -299,1087 +384,960 @@
299
384
  },
300
385
  {
301
386
  "kind": "field",
302
- "name": "defaultSlot",
387
+ "name": "pendingInputEvent",
303
388
  "type": {
304
- "text": "Promise<HTMLSlotElement>"
389
+ "text": "boolean"
305
390
  },
306
- "privacy": "private"
391
+ "privacy": "private",
392
+ "default": "false"
307
393
  },
308
394
  {
309
395
  "kind": "field",
310
- "name": "name",
396
+ "name": "hasOptions",
311
397
  "type": {
312
- "text": "string"
398
+ "text": "boolean"
313
399
  },
314
- "default": "'none'",
315
- "description": "The name of the built-in animation to use. For custom animations, use the `keyframes` prop.\nUse `getAnimationNames()` to retrieve a list of available animations.",
316
- "attribute": "name"
400
+ "privacy": "private",
401
+ "default": "false"
317
402
  },
318
403
  {
319
404
  "kind": "field",
320
- "name": "play",
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",
321
424
  "type": {
322
425
  "text": "boolean"
323
426
  },
324
427
  "default": "false",
325
- "description": "Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when\nthe animation finishes or gets canceled.",
326
- "attribute": "play",
428
+ "description": "Draws a filled autocomplete input",
429
+ "attribute": "filled",
327
430
  "reflects": true
328
431
  },
329
432
  {
330
433
  "kind": "field",
331
- "name": "delay",
434
+ "name": "pill",
332
435
  "type": {
333
- "text": "number"
436
+ "text": "boolean"
334
437
  },
335
- "default": "0",
336
- "description": "The number of milliseconds to delay the start of the animation.",
337
- "attribute": "delay"
438
+ "default": "false",
439
+ "description": "Draws a pill-style autocomplete input with rounded edges",
440
+ "attribute": "pill",
441
+ "reflects": true
338
442
  },
339
443
  {
340
444
  "kind": "field",
341
- "name": "direction",
445
+ "name": "label",
342
446
  "type": {
343
- "text": "PlaybackDirection"
447
+ "text": "string"
344
448
  },
345
- "default": "'normal'",
346
- "description": "Determines the direction of playback as well as the behavior when reaching the end of an iteration.\n[Learn more](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction)",
347
- "attribute": "direction"
449
+ "default": "''",
450
+ "description": "The autocomplete input's label. If you need to display HTML, use the `help-text` slot instead",
451
+ "attribute": "label"
348
452
  },
349
453
  {
350
454
  "kind": "field",
351
- "name": "duration",
455
+ "name": "helpText",
352
456
  "type": {
353
- "text": "number"
457
+ "text": "string"
354
458
  },
355
- "default": "1000",
356
- "description": "The number of milliseconds each iteration of the animation takes to complete.",
357
- "attribute": "duration"
459
+ "default": "''",
460
+ "description": "The autocomplete input's help text. If you need to display HTML, use the `help-text` slot instead",
461
+ "attribute": "help-text"
358
462
  },
359
463
  {
360
464
  "kind": "field",
361
- "name": "easing",
465
+ "name": "placeholder",
362
466
  "type": {
363
467
  "text": "string"
364
468
  },
365
- "default": "'linear'",
366
- "description": "The easing function to use for the animation. This can be a Shoelace easing function or a custom easing function\nsuch as `cubic-bezier(0, 1, .76, 1.14)`.",
367
- "attribute": "easing"
469
+ "default": "''",
470
+ "description": "The autocomplete input's placeholder text",
471
+ "attribute": "placeholder"
368
472
  },
369
473
  {
370
474
  "kind": "field",
371
- "name": "endDelay",
475
+ "name": "disabled",
372
476
  "type": {
373
- "text": "number"
477
+ "text": "boolean"
374
478
  },
375
- "default": "0",
376
- "description": "The number of milliseconds to delay after the active period of an animation sequence.",
377
- "attribute": "end-delay"
479
+ "default": "false",
480
+ "description": "Disables the autocomplete",
481
+ "attribute": "disabled",
482
+ "reflects": true
378
483
  },
379
484
  {
380
485
  "kind": "field",
381
- "name": "fill",
486
+ "name": "form",
382
487
  "type": {
383
- "text": "FillMode"
488
+ "text": "string"
384
489
  },
385
- "default": "'auto'",
386
- "description": "Sets how the animation applies styles to its target before and after its execution.",
387
- "attribute": "fill"
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"
388
492
  },
389
493
  {
390
494
  "kind": "field",
391
- "name": "iterations",
392
- "default": "Infinity",
393
- "description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
394
- "attribute": "iterations"
495
+ "name": "required",
496
+ "type": {
497
+ "text": "boolean"
498
+ },
499
+ "default": "false",
500
+ "description": "Makes the autocomplete a required field",
501
+ "attribute": "required",
502
+ "reflects": true
395
503
  },
396
504
  {
397
505
  "kind": "field",
398
- "name": "iterationStart",
506
+ "name": "inline",
399
507
  "type": {
400
- "text": "number"
508
+ "text": "boolean"
401
509
  },
402
- "default": "0",
403
- "description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
404
- "attribute": "iteration-start"
510
+ "default": "false",
511
+ "description": "Display the autocomplete in the 'inline' form control style",
512
+ "attribute": "inline",
513
+ "reflects": true
405
514
  },
406
515
  {
407
516
  "kind": "field",
408
- "name": "keyframes",
517
+ "name": "divider",
409
518
  "type": {
410
- "text": "Keyframe[] | undefined"
519
+ "text": "boolean"
411
520
  },
412
- "description": "The keyframes to use for the animation. If this is set, `name` will be ignored."
521
+ "default": "false",
522
+ "description": "Indicates that the control should display a divider",
523
+ "attribute": "divider",
524
+ "reflects": true
413
525
  },
414
526
  {
415
527
  "kind": "field",
416
- "name": "playbackRate",
528
+ "name": "hoist",
417
529
  "type": {
418
- "text": "number"
530
+ "text": "boolean"
419
531
  },
420
- "default": "1",
421
- "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.",
422
- "attribute": "playback-rate"
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"
423
535
  },
424
536
  {
425
537
  "kind": "field",
426
- "name": "currentTime",
538
+ "name": "placement",
427
539
  "type": {
428
- "text": "CSSNumberish"
540
+ "text": "'top' | 'bottom'"
429
541
  },
430
- "description": "Gets and sets the current animation time."
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
431
546
  },
432
547
  {
433
548
  "kind": "field",
434
- "name": "handleAnimationFinish",
435
- "privacy": "private"
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"
436
556
  },
437
557
  {
438
558
  "kind": "field",
439
- "name": "handleAnimationCancel",
440
- "privacy": "private"
441
- },
442
- {
443
- "kind": "method",
444
- "name": "handleSlotChange",
445
- "privacy": "private"
446
- },
447
- {
448
- "kind": "method",
449
- "name": "createAnimation",
450
- "privacy": "private"
451
- },
452
- {
453
- "kind": "method",
454
- "name": "destroyAnimation",
455
- "privacy": "private"
456
- },
457
- {
458
- "kind": "method",
459
- "name": "cancel",
460
- "description": "Clears all keyframe effects caused by this animation and aborts its playback."
461
- },
462
- {
463
- "kind": "method",
464
- "name": "finish",
465
- "description": "Sets the playback time to the end of the animation corresponding to the current playback direction."
466
- }
467
- ],
468
- "events": [
469
- {
470
- "description": "Emitted when the animation is canceled.",
471
- "name": "flow-ui-cancel",
472
- "reactName": "onFlowUiCancel"
473
- },
474
- {
475
- "description": "Emitted when the animation finishes.",
476
- "name": "flow-ui-finish",
477
- "reactName": "onFlowUiFinish"
559
+ "name": "displayWith",
560
+ "type": {
561
+ "text": "((value: string) => string) | ((value: string) => Promise<string>)"
562
+ },
563
+ "description": "Function for determining the `displayValue` for a given `value`.\nBy default, it will show the `value` itself.",
564
+ "attribute": "displayWith"
478
565
  },
479
566
  {
480
- "description": "Emitted when the animation starts or restarts.",
481
- "name": "flow-ui-start",
482
- "reactName": "onFlowUiStart"
483
- }
484
- ],
485
- "attributes": [
486
- {
487
- "name": "name",
567
+ "kind": "field",
568
+ "name": "debounceDelay",
488
569
  "type": {
489
- "text": "string"
570
+ "text": "number"
490
571
  },
491
- "default": "'none'",
492
- "description": "The name of the built-in animation to use. For custom animations, use the `keyframes` prop.\nUse `getAnimationNames()` to retrieve a list of available animations.",
493
- "fieldName": "name"
572
+ "default": "0",
573
+ "description": "Debounce delay",
574
+ "attribute": "debounce-delay",
575
+ "reflects": true
494
576
  },
495
577
  {
496
- "name": "play",
578
+ "kind": "field",
579
+ "name": "clearable",
497
580
  "type": {
498
581
  "text": "boolean"
499
582
  },
500
583
  "default": "false",
501
- "description": "Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when\nthe animation finishes or gets canceled.",
502
- "fieldName": "play"
584
+ "description": "Show the option to clear input",
585
+ "attribute": "clearable",
586
+ "reflects": true
503
587
  },
504
588
  {
505
- "name": "delay",
589
+ "kind": "field",
590
+ "name": "clearOnFocus",
506
591
  "type": {
507
- "text": "number"
592
+ "text": "boolean"
508
593
  },
509
- "default": "0",
510
- "description": "The number of milliseconds to delay the start of the animation.",
511
- "fieldName": "delay"
594
+ "default": "false",
595
+ "description": "Clear the value when the autocomplete is focused on",
596
+ "attribute": "clear-on-focus",
597
+ "reflects": true
512
598
  },
513
599
  {
514
- "name": "direction",
600
+ "kind": "field",
601
+ "name": "inputText",
515
602
  "type": {
516
- "text": "PlaybackDirection"
603
+ "text": "string"
517
604
  },
518
- "default": "'normal'",
519
- "description": "Determines the direction of playback as well as the behavior when reaching the end of an iteration.\n[Learn more](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction)",
520
- "fieldName": "direction"
605
+ "privacy": "private",
606
+ "default": "''",
607
+ "description": "Current value displayed by the control; this can be what the user is typing or the label of the selected option"
521
608
  },
522
609
  {
523
- "name": "duration",
610
+ "kind": "field",
611
+ "name": "selectedOption",
524
612
  "type": {
525
- "text": "number"
613
+ "text": "FlowOption | null"
526
614
  },
527
- "default": "1000",
528
- "description": "The number of milliseconds each iteration of the animation takes to complete.",
529
- "fieldName": "duration"
615
+ "privacy": "private",
616
+ "default": "null"
530
617
  },
531
618
  {
532
- "name": "easing",
619
+ "kind": "field",
620
+ "name": "currentOption",
533
621
  "type": {
534
- "text": "string"
622
+ "text": "FlowOption | null"
535
623
  },
536
- "default": "'linear'",
537
- "description": "The easing function to use for the animation. This can be a Shoelace easing function or a custom easing function\nsuch as `cubic-bezier(0, 1, .76, 1.14)`.",
538
- "fieldName": "easing"
624
+ "privacy": "private",
625
+ "default": "null"
539
626
  },
540
627
  {
541
- "name": "end-delay",
628
+ "kind": "field",
629
+ "name": "input",
542
630
  "type": {
543
- "text": "number"
631
+ "text": "HTMLInputElement"
544
632
  },
545
- "default": "0",
546
- "description": "The number of milliseconds to delay after the active period of an animation sequence.",
547
- "fieldName": "endDelay"
633
+ "privacy": "private"
548
634
  },
549
635
  {
550
- "name": "fill",
636
+ "kind": "field",
637
+ "name": "popup",
551
638
  "type": {
552
- "text": "FillMode"
639
+ "text": "FlowPopup"
553
640
  },
554
- "default": "'auto'",
555
- "description": "Sets how the animation applies styles to its target before and after its execution.",
556
- "fieldName": "fill"
641
+ "privacy": "private"
557
642
  },
558
643
  {
559
- "name": "iterations",
560
- "default": "Infinity",
561
- "description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
562
- "resolveInitializer": {
563
- "module": "src/components/animation/animation.component.ts"
644
+ "kind": "method",
645
+ "name": "getForm",
646
+ "return": {
647
+ "type": {
648
+ "text": "HTMLFormElement | null"
649
+ }
564
650
  },
565
- "fieldName": "iterations"
651
+ "description": "Gets the associated form, if one exists."
566
652
  },
567
653
  {
568
- "name": "iteration-start",
569
- "type": {
570
- "text": "number"
571
- },
572
- "default": "0",
573
- "description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
574
- "fieldName": "iterationStart"
654
+ "kind": "field",
655
+ "name": "validity",
656
+ "description": "Gets the validity state object.",
657
+ "readonly": true
575
658
  },
576
659
  {
577
- "name": "playback-rate",
578
- "type": {
579
- "text": "number"
580
- },
581
- "default": "1",
582
- "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.",
583
- "fieldName": "playbackRate"
584
- }
585
- ],
586
- "superclass": {
587
- "name": "FlowRdfElement",
588
- "module": "/src/internal/flow-ui-rdf-element"
589
- },
590
- "tagName": "flow-ui-animation",
591
- "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).",
592
- "customElement": true
593
- }
594
- ],
595
- "exports": [
596
- {
597
- "kind": "js",
598
- "name": "default",
599
- "declaration": {
600
- "name": "FlowUiAnimation",
601
- "module": "components/animation/animation.component.js"
602
- }
603
- }
604
- ]
605
- },
606
- {
607
- "kind": "javascript-module",
608
- "path": "components/animation/animation.js",
609
- "declarations": [],
610
- "exports": [
611
- {
612
- "kind": "js",
613
- "name": "*",
614
- "declaration": {
615
- "name": "*",
616
- "package": "./animation.component"
617
- }
618
- },
619
- {
620
- "kind": "js",
621
- "name": "default",
622
- "declaration": {
623
- "name": "FlowUiAnimation",
624
- "module": "components/animation/animation.js"
625
- }
626
- }
627
- ]
628
- },
629
- {
630
- "kind": "javascript-module",
631
- "path": "components/animation/animations.js",
632
- "declarations": [
633
- {
634
- "kind": "function",
635
- "name": "getAnimationNames",
636
- "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."
637
- },
638
- {
639
- "kind": "function",
640
- "name": "getEasingNames",
641
- "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."
642
- }
643
- ],
644
- "exports": [
645
- {
646
- "kind": "js",
647
- "name": "animations",
648
- "declaration": {
649
- "name": "animations",
650
- "module": "components/animation/animations.js"
651
- }
652
- },
653
- {
654
- "kind": "js",
655
- "name": "getAnimationNames",
656
- "declaration": {
657
- "name": "getAnimationNames",
658
- "module": "components/animation/animations.js"
659
- }
660
- },
661
- {
662
- "kind": "js",
663
- "name": "getEasingNames",
664
- "declaration": {
665
- "name": "getEasingNames",
666
- "module": "components/animation/animations.js"
667
- }
668
- }
669
- ]
670
- },
671
- {
672
- "kind": "javascript-module",
673
- "path": "components/autocomplete/autocomplete.component.js",
674
- "declarations": [
675
- {
676
- "kind": "class",
677
- "description": "",
678
- "name": "FlowUiAutocomplete",
679
- "cssParts": [
680
- {
681
- "description": "The form control that wraps the label, input, and help text.",
682
- "name": "form-control"
660
+ "kind": "field",
661
+ "name": "validationMessage",
662
+ "description": "Gets the validation message.",
663
+ "readonly": true
683
664
  },
684
665
  {
685
- "description": "The label's wrapper.",
686
- "name": "form-control-label"
666
+ "kind": "method",
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."
687
674
  },
688
675
  {
689
- "description": "The select's wrapper.",
690
- "name": "form-control-input"
676
+ "kind": "method",
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."
691
684
  },
692
685
  {
693
- "description": "The help text's wrapper.",
694
- "name": "form-control-help-text"
686
+ "kind": "method",
687
+ "name": "setCustomValidity",
688
+ "parameters": [
689
+ {
690
+ "name": "_",
691
+ "type": {
692
+ "text": "string"
693
+ }
694
+ }
695
+ ],
696
+ "description": "Sets a custom validation message. Pass an empty string to restore validity."
695
697
  },
696
698
  {
697
- "description": "The container the wraps the prefix, suffix, combobox, clear icon, and expand button.",
698
- "name": "combobox"
699
+ "kind": "method",
700
+ "name": "handleClearClick",
701
+ "parameters": [
702
+ {
703
+ "name": "event",
704
+ "type": {
705
+ "text": "MouseEvent"
706
+ }
707
+ }
708
+ ]
699
709
  },
700
710
  {
701
- "description": "The container that wraps the prefix slot.",
702
- "name": "prefix"
711
+ "kind": "method",
712
+ "name": "focus",
713
+ "description": "Focuses on the control"
703
714
  },
704
715
  {
705
- "description": "The container that wraps the suffix slot.",
706
- "name": "suffix"
716
+ "kind": "method",
717
+ "name": "blur",
718
+ "description": "Blurs from the control."
707
719
  },
708
720
  {
709
- "description": "The element that displays the selected option's label, an `<input>` element.",
710
- "name": "display-input"
721
+ "kind": "method",
722
+ "name": "show",
723
+ "description": "Shows the listbox."
711
724
  },
712
725
  {
713
- "description": "The listbox container where options are slotted.",
714
- "name": "listbox"
726
+ "kind": "method",
727
+ "name": "hide",
728
+ "description": "Hides the listbox."
715
729
  },
716
730
  {
717
- "description": "The clear button.",
718
- "name": "clear-button"
731
+ "kind": "method",
732
+ "name": "getInputText",
733
+ "description": "Gets the current value of the text input"
719
734
  }
720
735
  ],
721
- "slots": [
736
+ "events": [
722
737
  {
723
- "description": "The listbox options. Must be `<flow-option>` elements. You can use `<flow-divider>` to group items visually.",
724
- "name": ""
738
+ "description": "Emitted when the display value changes.",
739
+ "name": "flow-ui-input",
740
+ "reactName": "onFlowUiInput"
725
741
  },
726
742
  {
727
- "description": "The input's label. Alternatively, you can use the `label` attribute.",
728
- "name": "label"
743
+ "description": "Emitted when the input value changes.",
744
+ "name": "flow-ui-change",
745
+ "reactName": "onFlowUiChange"
729
746
  },
730
747
  {
731
- "description": "Used to prepend a presentational icon or similar element to the combobox.",
732
- "name": "prefix"
748
+ "description": "Emitted when the input is focused.",
749
+ "name": "flow-ui-focus",
750
+ "reactName": "onFlowUiFocus"
733
751
  },
734
752
  {
735
- "description": "Used to append a presentational icon or similar element to the combobox.",
736
- "name": "suffix"
753
+ "description": "Emitted when the input is blurred.",
754
+ "name": "flow-ui-blur",
755
+ "reactName": "onFlowUiBlur"
737
756
  },
738
757
  {
739
- "description": "An icon to use in lieu of the default clear icon.",
740
- "name": "clear-icon"
758
+ "description": "Emitted when the dropdown is shown.",
759
+ "name": "flow-ui-show",
760
+ "reactName": "onFlowUiShow"
741
761
  },
742
762
  {
743
- "description": "Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.",
744
- "name": "help-text"
745
- }
746
- ],
747
- "members": [
748
- {
749
- "kind": "field",
750
- "name": "dependencies",
751
- "type": {
752
- "text": "object"
753
- },
754
- "static": true,
755
- "default": "{\n 'flow-ui-popup': FlowPopup,\n 'flow-ui-icon': FlowIcon\n }"
763
+ "description": "Emitted when the dropdown is shown.",
764
+ "name": "flow-ui-after-show",
765
+ "reactName": "onFlowUiAfterShow"
756
766
  },
757
767
  {
758
- "kind": "field",
759
- "name": "hasSlotController",
760
- "privacy": "private",
761
- "readonly": true,
762
- "default": "new HasSlotController(this, 'help-text', 'label')"
768
+ "description": "Emitted when the dropdown is hidden.",
769
+ "name": "flow-ui-hide",
770
+ "reactName": "onFlowUiHide"
763
771
  },
764
772
  {
765
- "kind": "field",
766
- "name": "localize",
767
- "privacy": "private",
768
- "readonly": true,
769
- "default": "new LocalizeController(this)"
773
+ "description": "Emitted when the dropdown is hidden.",
774
+ "name": "flow-ui-after-hide",
775
+ "reactName": "onFlowUiAfterHide"
770
776
  },
771
777
  {
772
- "kind": "field",
773
- "name": "debouncedInput",
774
- "type": {
775
- "text": "(displayValue: string) => void"
776
- },
777
- "privacy": "private"
778
+ "description": "Emitted when the input is invalid.",
779
+ "name": "flow-ui-invalid",
780
+ "reactName": "onFlowUiInvalid"
778
781
  },
779
782
  {
780
- "kind": "field",
781
- "name": "pendingChangeEvent",
782
- "type": {
783
- "text": "boolean"
784
- },
785
- "privacy": "private",
786
- "default": "false"
783
+ "description": "Emitted when the input is valid.",
784
+ "name": "flow-ui-valid",
785
+ "reactName": "onFlowUiValid"
787
786
  },
788
787
  {
789
- "kind": "field",
790
- "name": "pendingInputEvent",
791
- "type": {
792
- "text": "boolean"
793
- },
794
- "privacy": "private",
795
- "default": "false"
788
+ "description": "Emitted when the input is validated.",
789
+ "name": "flow-ui-validate",
790
+ "reactName": "onFlowUiValidate"
796
791
  },
797
792
  {
798
- "kind": "field",
799
- "name": "hasOptions",
800
- "type": {
801
- "text": "boolean"
802
- },
803
- "privacy": "private",
804
- "default": "false"
793
+ "description": "Emitted when the input is validated and the validity state is updated.",
794
+ "name": "flow-ui-validate-complete",
795
+ "reactName": "onFlowUiValidateComplete"
805
796
  },
806
797
  {
807
- "kind": "field",
808
- "name": "formControlController",
809
- "privacy": "private",
810
- "readonly": true,
811
- "default": "new FormControlController(this, {\n assumeInteractionOn: ['flow-ui-blur', 'flow-ui-input']\n })"
798
+ "description": "Emitted when the input is validated and an error occurs.",
799
+ "name": "flow-ui-validate-error",
800
+ "reactName": "onFlowUiValidateError"
812
801
  },
813
802
  {
814
- "kind": "field",
803
+ "description": "Emitted when the input is validated and no errors occur.",
804
+ "name": "flow-ui-validate-success",
805
+ "reactName": "onFlowUiValidateSuccess"
806
+ }
807
+ ],
808
+ "attributes": [
809
+ {
815
810
  "name": "size",
816
811
  "type": {
817
812
  "text": "'small' | 'medium' | 'large'"
818
813
  },
819
814
  "default": "'medium'",
820
815
  "description": "The autocomplete's size",
821
- "attribute": "size",
822
- "reflects": true
816
+ "fieldName": "size"
823
817
  },
824
818
  {
825
- "kind": "field",
826
819
  "name": "filled",
827
820
  "type": {
828
821
  "text": "boolean"
829
822
  },
830
823
  "default": "false",
831
824
  "description": "Draws a filled autocomplete input",
832
- "attribute": "filled",
833
- "reflects": true
825
+ "fieldName": "filled"
834
826
  },
835
827
  {
836
- "kind": "field",
837
828
  "name": "pill",
838
829
  "type": {
839
830
  "text": "boolean"
840
831
  },
841
832
  "default": "false",
842
833
  "description": "Draws a pill-style autocomplete input with rounded edges",
843
- "attribute": "pill",
844
- "reflects": true
834
+ "fieldName": "pill"
845
835
  },
846
836
  {
847
- "kind": "field",
848
837
  "name": "label",
849
838
  "type": {
850
839
  "text": "string"
851
840
  },
852
841
  "default": "''",
853
842
  "description": "The autocomplete input's label. If you need to display HTML, use the `help-text` slot instead",
854
- "attribute": "label"
843
+ "fieldName": "label"
855
844
  },
856
845
  {
857
- "kind": "field",
858
- "name": "helpText",
846
+ "name": "help-text",
859
847
  "type": {
860
848
  "text": "string"
861
849
  },
862
850
  "default": "''",
863
851
  "description": "The autocomplete input's help text. If you need to display HTML, use the `help-text` slot instead",
864
- "attribute": "help-text"
852
+ "fieldName": "helpText"
865
853
  },
866
854
  {
867
- "kind": "field",
868
855
  "name": "placeholder",
869
856
  "type": {
870
857
  "text": "string"
871
858
  },
872
859
  "default": "''",
873
860
  "description": "The autocomplete input's placeholder text",
874
- "attribute": "placeholder"
861
+ "fieldName": "placeholder"
875
862
  },
876
863
  {
877
- "kind": "field",
878
864
  "name": "disabled",
879
865
  "type": {
880
866
  "text": "boolean"
881
867
  },
882
868
  "default": "false",
883
869
  "description": "Disables the autocomplete",
884
- "attribute": "disabled",
885
- "reflects": true
870
+ "fieldName": "disabled"
886
871
  },
887
872
  {
888
- "kind": "field",
889
873
  "name": "form",
890
874
  "type": {
891
875
  "text": "string"
892
876
  },
893
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.",
894
- "attribute": "form"
878
+ "fieldName": "form"
895
879
  },
896
880
  {
897
- "kind": "field",
898
881
  "name": "required",
899
882
  "type": {
900
883
  "text": "boolean"
901
884
  },
902
885
  "default": "false",
903
886
  "description": "Makes the autocomplete a required field",
904
- "attribute": "required",
905
- "reflects": true
887
+ "fieldName": "required"
906
888
  },
907
889
  {
908
- "kind": "field",
909
890
  "name": "inline",
910
891
  "type": {
911
892
  "text": "boolean"
912
893
  },
913
894
  "default": "false",
914
895
  "description": "Display the autocomplete in the 'inline' form control style",
915
- "attribute": "inline",
916
- "reflects": true
896
+ "fieldName": "inline"
917
897
  },
918
898
  {
919
- "kind": "field",
920
899
  "name": "divider",
921
900
  "type": {
922
901
  "text": "boolean"
923
902
  },
924
903
  "default": "false",
925
904
  "description": "Indicates that the control should display a divider",
926
- "attribute": "divider",
927
- "reflects": true
905
+ "fieldName": "divider"
928
906
  },
929
907
  {
930
- "kind": "field",
931
908
  "name": "hoist",
932
909
  "type": {
933
910
  "text": "boolean"
934
911
  },
935
912
  "default": "false",
936
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.",
937
- "attribute": "hoist"
914
+ "fieldName": "hoist"
938
915
  },
939
916
  {
940
- "kind": "field",
941
917
  "name": "placement",
942
918
  "type": {
943
919
  "text": "'top' | 'bottom'"
944
920
  },
945
921
  "default": "'bottom'",
946
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.",
947
- "attribute": "placement",
948
- "reflects": true
923
+ "fieldName": "placement"
949
924
  },
950
925
  {
951
- "kind": "field",
952
926
  "name": "value",
953
927
  "type": {
954
928
  "text": "string"
955
929
  },
956
930
  "default": "''",
957
931
  "description": "Current value of the control, selected from one of the valid options available",
958
- "attribute": "value"
932
+ "fieldName": "value"
959
933
  },
960
934
  {
961
- "kind": "field",
962
935
  "name": "displayWith",
963
936
  "type": {
964
937
  "text": "((value: string) => string) | ((value: string) => Promise<string>)"
965
938
  },
966
939
  "description": "Function for determining the `displayValue` for a given `value`.\nBy default, it will show the `value` itself.",
967
- "attribute": "displayWith"
940
+ "fieldName": "displayWith"
968
941
  },
969
942
  {
970
- "kind": "field",
971
- "name": "debounceDelay",
943
+ "name": "debounce-delay",
972
944
  "type": {
973
945
  "text": "number"
974
946
  },
975
947
  "default": "0",
976
948
  "description": "Debounce delay",
977
- "attribute": "debounce-delay",
978
- "reflects": true
949
+ "fieldName": "debounceDelay"
979
950
  },
980
951
  {
981
- "kind": "field",
982
952
  "name": "clearable",
983
953
  "type": {
984
954
  "text": "boolean"
985
955
  },
986
956
  "default": "false",
987
957
  "description": "Show the option to clear input",
988
- "attribute": "clearable",
989
- "reflects": true
958
+ "fieldName": "clearable"
990
959
  },
991
960
  {
992
- "kind": "field",
993
- "name": "clearOnFocus",
961
+ "name": "clear-on-focus",
994
962
  "type": {
995
963
  "text": "boolean"
996
964
  },
997
965
  "default": "false",
998
966
  "description": "Clear the value when the autocomplete is focused on",
999
- "attribute": "clear-on-focus",
1000
- "reflects": true
1001
- },
967
+ "fieldName": "clearOnFocus"
968
+ }
969
+ ],
970
+ "superclass": {
971
+ "name": "FlowRdfFormControl",
972
+ "module": "/src/internal/flow-ui-rdf-element"
973
+ },
974
+ "tagName": "flow-ui-autocomplete",
975
+ "summary": "The Autocomplete is a Text input enhanced by a panel of suggested options.",
976
+ "dependencies": [
977
+ "flow-ui-popup",
978
+ "flow-ui-icon"
979
+ ],
980
+ "customElement": true
981
+ }
982
+ ],
983
+ "exports": [
984
+ {
985
+ "kind": "js",
986
+ "name": "default",
987
+ "declaration": {
988
+ "name": "FlowUiAutocomplete",
989
+ "module": "components/autocomplete/autocomplete.component.js"
990
+ }
991
+ }
992
+ ]
993
+ },
994
+ {
995
+ "kind": "javascript-module",
996
+ "path": "components/autocomplete/autocomplete.js",
997
+ "declarations": [],
998
+ "exports": [
999
+ {
1000
+ "kind": "js",
1001
+ "name": "*",
1002
+ "declaration": {
1003
+ "name": "*",
1004
+ "package": "./autocomplete.component"
1005
+ }
1006
+ },
1007
+ {
1008
+ "kind": "js",
1009
+ "name": "default",
1010
+ "declaration": {
1011
+ "name": "FlowUiAutocomplete",
1012
+ "module": "components/autocomplete/autocomplete.js"
1013
+ }
1014
+ }
1015
+ ]
1016
+ },
1017
+ {
1018
+ "kind": "javascript-module",
1019
+ "path": "components/animation/animation.component.js",
1020
+ "declarations": [
1021
+ {
1022
+ "kind": "class",
1023
+ "description": "",
1024
+ "name": "FlowUiAnimation",
1025
+ "slots": [
1026
+ {
1027
+ "description": "The element to animate. Avoid slotting in more than one element, as subsequent ones will be ignored. To animate multiple elements, either wrap them in a single container or use multiple `<flow-ui-animation>` elements.",
1028
+ "name": ""
1029
+ }
1030
+ ],
1031
+ "members": [
1002
1032
  {
1003
1033
  "kind": "field",
1004
- "name": "inputText",
1034
+ "name": "animation",
1005
1035
  "type": {
1006
- "text": "string"
1036
+ "text": "Animation | undefined"
1007
1037
  },
1008
- "privacy": "private",
1009
- "default": "''",
1010
- "description": "Current value displayed by the control; this can be what the user is typing or the label of the selected option"
1038
+ "privacy": "private"
1011
1039
  },
1012
1040
  {
1013
1041
  "kind": "field",
1014
- "name": "selectedOption",
1042
+ "name": "hasStarted",
1015
1043
  "type": {
1016
- "text": "FlowOption | null"
1044
+ "text": "boolean"
1017
1045
  },
1018
1046
  "privacy": "private",
1019
- "default": "null"
1047
+ "default": "false"
1020
1048
  },
1021
1049
  {
1022
1050
  "kind": "field",
1023
- "name": "currentOption",
1051
+ "name": "defaultSlot",
1024
1052
  "type": {
1025
- "text": "FlowOption | null"
1053
+ "text": "Promise<HTMLSlotElement>"
1026
1054
  },
1027
- "privacy": "private",
1028
- "default": "null"
1055
+ "privacy": "private"
1029
1056
  },
1030
1057
  {
1031
1058
  "kind": "field",
1032
- "name": "input",
1059
+ "name": "name",
1033
1060
  "type": {
1034
- "text": "HTMLInputElement"
1061
+ "text": "string"
1035
1062
  },
1036
- "privacy": "private"
1063
+ "default": "'none'",
1064
+ "description": "The name of the built-in animation to use. For custom animations, use the `keyframes` prop.\nUse `getAnimationNames()` to retrieve a list of available animations.",
1065
+ "attribute": "name"
1037
1066
  },
1038
1067
  {
1039
1068
  "kind": "field",
1040
- "name": "popup",
1069
+ "name": "play",
1041
1070
  "type": {
1042
- "text": "FlowPopup"
1071
+ "text": "boolean"
1043
1072
  },
1044
- "privacy": "private"
1073
+ "default": "false",
1074
+ "description": "Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when\nthe animation finishes or gets canceled.",
1075
+ "attribute": "play",
1076
+ "reflects": true
1045
1077
  },
1046
1078
  {
1047
- "kind": "method",
1048
- "name": "getForm",
1049
- "return": {
1050
- "type": {
1051
- "text": "HTMLFormElement | null"
1052
- }
1079
+ "kind": "field",
1080
+ "name": "delay",
1081
+ "type": {
1082
+ "text": "number"
1053
1083
  },
1054
- "description": "Gets the associated form, if one exists."
1084
+ "default": "0",
1085
+ "description": "The number of milliseconds to delay the start of the animation.",
1086
+ "attribute": "delay"
1055
1087
  },
1056
1088
  {
1057
1089
  "kind": "field",
1058
- "name": "validity",
1059
- "description": "Gets the validity state object.",
1060
- "readonly": true
1090
+ "name": "direction",
1091
+ "type": {
1092
+ "text": "PlaybackDirection"
1093
+ },
1094
+ "default": "'normal'",
1095
+ "description": "Determines the direction of playback as well as the behavior when reaching the end of an iteration.\n[Learn more](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction)",
1096
+ "attribute": "direction"
1061
1097
  },
1062
1098
  {
1063
1099
  "kind": "field",
1064
- "name": "validationMessage",
1065
- "description": "Gets the validation message.",
1066
- "readonly": true
1067
- },
1068
- {
1069
- "kind": "method",
1070
- "name": "checkValidity",
1071
- "return": {
1072
- "type": {
1073
- "text": "boolean"
1074
- }
1100
+ "name": "duration",
1101
+ "type": {
1102
+ "text": "number"
1075
1103
  },
1076
- "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
1104
+ "default": "1000",
1105
+ "description": "The number of milliseconds each iteration of the animation takes to complete.",
1106
+ "attribute": "duration"
1077
1107
  },
1078
1108
  {
1079
- "kind": "method",
1080
- "name": "reportValidity",
1081
- "return": {
1082
- "type": {
1083
- "text": "boolean"
1084
- }
1109
+ "kind": "field",
1110
+ "name": "easing",
1111
+ "type": {
1112
+ "text": "string"
1085
1113
  },
1086
- "description": "Checks for validity and shows the browser's validation message if the control is invalid."
1087
- },
1088
- {
1089
- "kind": "method",
1090
- "name": "setCustomValidity",
1091
- "parameters": [
1092
- {
1093
- "name": "_",
1094
- "type": {
1095
- "text": "string"
1096
- }
1097
- }
1098
- ],
1099
- "description": "Sets a custom validation message. Pass an empty string to restore validity."
1100
- },
1101
- {
1102
- "kind": "method",
1103
- "name": "handleClearClick",
1104
- "parameters": [
1105
- {
1106
- "name": "event",
1107
- "type": {
1108
- "text": "MouseEvent"
1109
- }
1110
- }
1111
- ]
1112
- },
1113
- {
1114
- "kind": "method",
1115
- "name": "focus",
1116
- "description": "Focuses on the control"
1117
- },
1118
- {
1119
- "kind": "method",
1120
- "name": "blur",
1121
- "description": "Blurs from the control."
1122
- },
1123
- {
1124
- "kind": "method",
1125
- "name": "show",
1126
- "description": "Shows the listbox."
1127
- },
1128
- {
1129
- "kind": "method",
1130
- "name": "hide",
1131
- "description": "Hides the listbox."
1132
- },
1133
- {
1134
- "kind": "method",
1135
- "name": "getInputText",
1136
- "description": "Gets the current value of the text input"
1137
- }
1138
- ],
1139
- "events": [
1140
- {
1141
- "description": "Emitted when the display value changes.",
1142
- "name": "flow-ui-input",
1143
- "reactName": "onFlowUiInput"
1144
- },
1145
- {
1146
- "description": "Emitted when the input value changes.",
1147
- "name": "flow-ui-change",
1148
- "reactName": "onFlowUiChange"
1149
- },
1150
- {
1151
- "description": "Emitted when the input is focused.",
1152
- "name": "flow-ui-focus",
1153
- "reactName": "onFlowUiFocus"
1154
- },
1155
- {
1156
- "description": "Emitted when the input is blurred.",
1157
- "name": "flow-ui-blur",
1158
- "reactName": "onFlowUiBlur"
1159
- },
1160
- {
1161
- "description": "Emitted when the dropdown is shown.",
1162
- "name": "flow-ui-show",
1163
- "reactName": "onFlowUiShow"
1164
- },
1165
- {
1166
- "description": "Emitted when the dropdown is shown.",
1167
- "name": "flow-ui-after-show",
1168
- "reactName": "onFlowUiAfterShow"
1169
- },
1170
- {
1171
- "description": "Emitted when the dropdown is hidden.",
1172
- "name": "flow-ui-hide",
1173
- "reactName": "onFlowUiHide"
1174
- },
1175
- {
1176
- "description": "Emitted when the dropdown is hidden.",
1177
- "name": "flow-ui-after-hide",
1178
- "reactName": "onFlowUiAfterHide"
1179
- },
1180
- {
1181
- "description": "Emitted when the input is invalid.",
1182
- "name": "flow-ui-invalid",
1183
- "reactName": "onFlowUiInvalid"
1184
- },
1185
- {
1186
- "description": "Emitted when the input is valid.",
1187
- "name": "flow-ui-valid",
1188
- "reactName": "onFlowUiValid"
1189
- },
1190
- {
1191
- "description": "Emitted when the input is validated.",
1192
- "name": "flow-ui-validate",
1193
- "reactName": "onFlowUiValidate"
1194
- },
1195
- {
1196
- "description": "Emitted when the input is validated and the validity state is updated.",
1197
- "name": "flow-ui-validate-complete",
1198
- "reactName": "onFlowUiValidateComplete"
1199
- },
1200
- {
1201
- "description": "Emitted when the input is validated and an error occurs.",
1202
- "name": "flow-ui-validate-error",
1203
- "reactName": "onFlowUiValidateError"
1114
+ "default": "'linear'",
1115
+ "description": "The easing function to use for the animation. This can be a Shoelace easing function or a custom easing function\nsuch as `cubic-bezier(0, 1, .76, 1.14)`.",
1116
+ "attribute": "easing"
1204
1117
  },
1205
1118
  {
1206
- "description": "Emitted when the input is validated and no errors occur.",
1207
- "name": "flow-ui-validate-success",
1208
- "reactName": "onFlowUiValidateSuccess"
1209
- }
1210
- ],
1211
- "attributes": [
1212
- {
1213
- "name": "size",
1119
+ "kind": "field",
1120
+ "name": "endDelay",
1214
1121
  "type": {
1215
- "text": "'small' | 'medium' | 'large'"
1122
+ "text": "number"
1216
1123
  },
1217
- "default": "'medium'",
1218
- "description": "The autocomplete's size",
1219
- "fieldName": "size"
1124
+ "default": "0",
1125
+ "description": "The number of milliseconds to delay after the active period of an animation sequence.",
1126
+ "attribute": "end-delay"
1220
1127
  },
1221
1128
  {
1222
- "name": "filled",
1129
+ "kind": "field",
1130
+ "name": "fill",
1223
1131
  "type": {
1224
- "text": "boolean"
1132
+ "text": "FillMode"
1225
1133
  },
1226
- "default": "false",
1227
- "description": "Draws a filled autocomplete input",
1228
- "fieldName": "filled"
1134
+ "default": "'auto'",
1135
+ "description": "Sets how the animation applies styles to its target before and after its execution.",
1136
+ "attribute": "fill"
1229
1137
  },
1230
1138
  {
1231
- "name": "pill",
1232
- "type": {
1233
- "text": "boolean"
1234
- },
1235
- "default": "false",
1236
- "description": "Draws a pill-style autocomplete input with rounded edges",
1237
- "fieldName": "pill"
1139
+ "kind": "field",
1140
+ "name": "iterations",
1141
+ "default": "Infinity",
1142
+ "description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
1143
+ "attribute": "iterations"
1238
1144
  },
1239
1145
  {
1240
- "name": "label",
1146
+ "kind": "field",
1147
+ "name": "iterationStart",
1241
1148
  "type": {
1242
- "text": "string"
1149
+ "text": "number"
1243
1150
  },
1244
- "default": "''",
1245
- "description": "The autocomplete input's label. If you need to display HTML, use the `help-text` slot instead",
1246
- "fieldName": "label"
1151
+ "default": "0",
1152
+ "description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
1153
+ "attribute": "iteration-start"
1247
1154
  },
1248
1155
  {
1249
- "name": "help-text",
1156
+ "kind": "field",
1157
+ "name": "keyframes",
1250
1158
  "type": {
1251
- "text": "string"
1159
+ "text": "Keyframe[] | undefined"
1252
1160
  },
1253
- "default": "''",
1254
- "description": "The autocomplete input's help text. If you need to display HTML, use the `help-text` slot instead",
1255
- "fieldName": "helpText"
1161
+ "description": "The keyframes to use for the animation. If this is set, `name` will be ignored."
1256
1162
  },
1257
1163
  {
1258
- "name": "placeholder",
1164
+ "kind": "field",
1165
+ "name": "playbackRate",
1259
1166
  "type": {
1260
- "text": "string"
1167
+ "text": "number"
1261
1168
  },
1262
- "default": "''",
1263
- "description": "The autocomplete input's placeholder text",
1264
- "fieldName": "placeholder"
1169
+ "default": "1",
1170
+ "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.",
1171
+ "attribute": "playback-rate"
1265
1172
  },
1266
1173
  {
1267
- "name": "disabled",
1174
+ "kind": "field",
1175
+ "name": "currentTime",
1268
1176
  "type": {
1269
- "text": "boolean"
1177
+ "text": "CSSNumberish"
1270
1178
  },
1271
- "default": "false",
1272
- "description": "Disables the autocomplete",
1273
- "fieldName": "disabled"
1179
+ "description": "Gets and sets the current animation time."
1274
1180
  },
1275
1181
  {
1276
- "name": "form",
1182
+ "kind": "field",
1183
+ "name": "handleAnimationFinish",
1184
+ "privacy": "private"
1185
+ },
1186
+ {
1187
+ "kind": "field",
1188
+ "name": "handleAnimationCancel",
1189
+ "privacy": "private"
1190
+ },
1191
+ {
1192
+ "kind": "method",
1193
+ "name": "handleSlotChange",
1194
+ "privacy": "private"
1195
+ },
1196
+ {
1197
+ "kind": "method",
1198
+ "name": "createAnimation",
1199
+ "privacy": "private"
1200
+ },
1201
+ {
1202
+ "kind": "method",
1203
+ "name": "destroyAnimation",
1204
+ "privacy": "private"
1205
+ },
1206
+ {
1207
+ "kind": "method",
1208
+ "name": "cancel",
1209
+ "description": "Clears all keyframe effects caused by this animation and aborts its playback."
1210
+ },
1211
+ {
1212
+ "kind": "method",
1213
+ "name": "finish",
1214
+ "description": "Sets the playback time to the end of the animation corresponding to the current playback direction."
1215
+ }
1216
+ ],
1217
+ "events": [
1218
+ {
1219
+ "description": "Emitted when the animation is canceled.",
1220
+ "name": "flow-ui-cancel",
1221
+ "reactName": "onFlowUiCancel"
1222
+ },
1223
+ {
1224
+ "description": "Emitted when the animation finishes.",
1225
+ "name": "flow-ui-finish",
1226
+ "reactName": "onFlowUiFinish"
1227
+ },
1228
+ {
1229
+ "description": "Emitted when the animation starts or restarts.",
1230
+ "name": "flow-ui-start",
1231
+ "reactName": "onFlowUiStart"
1232
+ }
1233
+ ],
1234
+ "attributes": [
1235
+ {
1236
+ "name": "name",
1277
1237
  "type": {
1278
1238
  "text": "string"
1279
1239
  },
1280
- "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.",
1281
- "fieldName": "form"
1240
+ "default": "'none'",
1241
+ "description": "The name of the built-in animation to use. For custom animations, use the `keyframes` prop.\nUse `getAnimationNames()` to retrieve a list of available animations.",
1242
+ "fieldName": "name"
1282
1243
  },
1283
1244
  {
1284
- "name": "required",
1245
+ "name": "play",
1285
1246
  "type": {
1286
1247
  "text": "boolean"
1287
1248
  },
1288
1249
  "default": "false",
1289
- "description": "Makes the autocomplete a required field",
1290
- "fieldName": "required"
1250
+ "description": "Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when\nthe animation finishes or gets canceled.",
1251
+ "fieldName": "play"
1291
1252
  },
1292
1253
  {
1293
- "name": "inline",
1254
+ "name": "delay",
1294
1255
  "type": {
1295
- "text": "boolean"
1256
+ "text": "number"
1296
1257
  },
1297
- "default": "false",
1298
- "description": "Display the autocomplete in the 'inline' form control style",
1299
- "fieldName": "inline"
1258
+ "default": "0",
1259
+ "description": "The number of milliseconds to delay the start of the animation.",
1260
+ "fieldName": "delay"
1300
1261
  },
1301
1262
  {
1302
- "name": "divider",
1263
+ "name": "direction",
1303
1264
  "type": {
1304
- "text": "boolean"
1265
+ "text": "PlaybackDirection"
1305
1266
  },
1306
- "default": "false",
1307
- "description": "Indicates that the control should display a divider",
1308
- "fieldName": "divider"
1267
+ "default": "'normal'",
1268
+ "description": "Determines the direction of playback as well as the behavior when reaching the end of an iteration.\n[Learn more](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction)",
1269
+ "fieldName": "direction"
1309
1270
  },
1310
1271
  {
1311
- "name": "hoist",
1272
+ "name": "duration",
1312
1273
  "type": {
1313
- "text": "boolean"
1274
+ "text": "number"
1314
1275
  },
1315
- "default": "false",
1316
- "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.",
1317
- "fieldName": "hoist"
1276
+ "default": "1000",
1277
+ "description": "The number of milliseconds each iteration of the animation takes to complete.",
1278
+ "fieldName": "duration"
1318
1279
  },
1319
1280
  {
1320
- "name": "placement",
1281
+ "name": "easing",
1321
1282
  "type": {
1322
- "text": "'top' | 'bottom'"
1283
+ "text": "string"
1323
1284
  },
1324
- "default": "'bottom'",
1325
- "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.",
1326
- "fieldName": "placement"
1285
+ "default": "'linear'",
1286
+ "description": "The easing function to use for the animation. This can be a Shoelace easing function or a custom easing function\nsuch as `cubic-bezier(0, 1, .76, 1.14)`.",
1287
+ "fieldName": "easing"
1327
1288
  },
1328
1289
  {
1329
- "name": "value",
1290
+ "name": "end-delay",
1330
1291
  "type": {
1331
- "text": "string"
1292
+ "text": "number"
1332
1293
  },
1333
- "default": "''",
1334
- "description": "Current value of the control, selected from one of the valid options available",
1335
- "fieldName": "value"
1294
+ "default": "0",
1295
+ "description": "The number of milliseconds to delay after the active period of an animation sequence.",
1296
+ "fieldName": "endDelay"
1336
1297
  },
1337
1298
  {
1338
- "name": "displayWith",
1299
+ "name": "fill",
1339
1300
  "type": {
1340
- "text": "((value: string) => string) | ((value: string) => Promise<string>)"
1301
+ "text": "FillMode"
1341
1302
  },
1342
- "description": "Function for determining the `displayValue` for a given `value`.\nBy default, it will show the `value` itself.",
1343
- "fieldName": "displayWith"
1303
+ "default": "'auto'",
1304
+ "description": "Sets how the animation applies styles to its target before and after its execution.",
1305
+ "fieldName": "fill"
1344
1306
  },
1345
1307
  {
1346
- "name": "debounce-delay",
1347
- "type": {
1348
- "text": "number"
1308
+ "name": "iterations",
1309
+ "default": "Infinity",
1310
+ "description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
1311
+ "resolveInitializer": {
1312
+ "module": "src/components/animation/animation.component.ts"
1349
1313
  },
1350
- "default": "0",
1351
- "description": "Debounce delay",
1352
- "fieldName": "debounceDelay"
1314
+ "fieldName": "iterations"
1353
1315
  },
1354
1316
  {
1355
- "name": "clearable",
1317
+ "name": "iteration-start",
1356
1318
  "type": {
1357
- "text": "boolean"
1319
+ "text": "number"
1358
1320
  },
1359
- "default": "false",
1360
- "description": "Show the option to clear input",
1361
- "fieldName": "clearable"
1321
+ "default": "0",
1322
+ "description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
1323
+ "fieldName": "iterationStart"
1362
1324
  },
1363
1325
  {
1364
- "name": "clear-on-focus",
1326
+ "name": "playback-rate",
1365
1327
  "type": {
1366
- "text": "boolean"
1328
+ "text": "number"
1367
1329
  },
1368
- "default": "false",
1369
- "description": "Clear the value when the autocomplete is focused on",
1370
- "fieldName": "clearOnFocus"
1330
+ "default": "1",
1331
+ "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.",
1332
+ "fieldName": "playbackRate"
1371
1333
  }
1372
1334
  ],
1373
1335
  "superclass": {
1374
- "name": "FlowRdfFormControl",
1336
+ "name": "FlowRdfElement",
1375
1337
  "module": "/src/internal/flow-ui-rdf-element"
1376
1338
  },
1377
- "tagName": "flow-ui-autocomplete",
1378
- "summary": "The Autocomplete is a Text input enhanced by a panel of suggested options.",
1379
- "dependencies": [
1380
- "flow-ui-popup",
1381
- "flow-ui-icon"
1382
- ],
1339
+ "tagName": "flow-ui-animation",
1340
+ "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).",
1383
1341
  "customElement": true
1384
1342
  }
1385
1343
  ],
@@ -1388,15 +1346,15 @@
1388
1346
  "kind": "js",
1389
1347
  "name": "default",
1390
1348
  "declaration": {
1391
- "name": "FlowUiAutocomplete",
1392
- "module": "components/autocomplete/autocomplete.component.js"
1349
+ "name": "FlowUiAnimation",
1350
+ "module": "components/animation/animation.component.js"
1393
1351
  }
1394
1352
  }
1395
1353
  ]
1396
1354
  },
1397
1355
  {
1398
1356
  "kind": "javascript-module",
1399
- "path": "components/autocomplete/autocomplete.js",
1357
+ "path": "components/animation/animation.js",
1400
1358
  "declarations": [],
1401
1359
  "exports": [
1402
1360
  {
@@ -1404,15 +1362,57 @@
1404
1362
  "name": "*",
1405
1363
  "declaration": {
1406
1364
  "name": "*",
1407
- "package": "./autocomplete.component"
1365
+ "package": "./animation.component"
1366
+ }
1367
+ },
1368
+ {
1369
+ "kind": "js",
1370
+ "name": "default",
1371
+ "declaration": {
1372
+ "name": "FlowUiAnimation",
1373
+ "module": "components/animation/animation.js"
1374
+ }
1375
+ }
1376
+ ]
1377
+ },
1378
+ {
1379
+ "kind": "javascript-module",
1380
+ "path": "components/animation/animations.js",
1381
+ "declarations": [
1382
+ {
1383
+ "kind": "function",
1384
+ "name": "getAnimationNames",
1385
+ "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."
1386
+ },
1387
+ {
1388
+ "kind": "function",
1389
+ "name": "getEasingNames",
1390
+ "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."
1391
+ }
1392
+ ],
1393
+ "exports": [
1394
+ {
1395
+ "kind": "js",
1396
+ "name": "animations",
1397
+ "declaration": {
1398
+ "name": "animations",
1399
+ "module": "components/animation/animations.js"
1400
+ }
1401
+ },
1402
+ {
1403
+ "kind": "js",
1404
+ "name": "getAnimationNames",
1405
+ "declaration": {
1406
+ "name": "getAnimationNames",
1407
+ "module": "components/animation/animations.js"
1408
1408
  }
1409
1409
  },
1410
1410
  {
1411
1411
  "kind": "js",
1412
- "name": "default",
1412
+ "name": "getEasingNames",
1413
1413
  "declaration": {
1414
- "name": "FlowUiAutocomplete",
1415
- "module": "components/autocomplete/autocomplete.js"
1414
+ "name": "getEasingNames",
1415
+ "module": "components/animation/animations.js"
1416
1416
  }
1417
1417
  }
1418
1418
  ]
@@ -1741,129 +1741,6 @@
1741
1741
  }
1742
1742
  ]
1743
1743
  },
1744
- {
1745
- "kind": "javascript-module",
1746
- "path": "components/breadcrumb/breadcrumb.component.js",
1747
- "declarations": [
1748
- {
1749
- "kind": "class",
1750
- "description": "",
1751
- "name": "FlowUiBreadcrumb",
1752
- "cssParts": [
1753
- {
1754
- "description": "The component's base wrapper.",
1755
- "name": "base"
1756
- }
1757
- ],
1758
- "slots": [
1759
- {
1760
- "description": "One or more breadcrumb items to display.",
1761
- "name": ""
1762
- },
1763
- {
1764
- "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
1765
- "name": "separator"
1766
- }
1767
- ],
1768
- "members": [
1769
- {
1770
- "kind": "field",
1771
- "name": "localize",
1772
- "privacy": "private",
1773
- "readonly": true,
1774
- "default": "new LocalizeController(this)"
1775
- },
1776
- {
1777
- "kind": "field",
1778
- "name": "separatorDir",
1779
- "privacy": "private"
1780
- },
1781
- {
1782
- "kind": "field",
1783
- "name": "defaultSlot",
1784
- "type": {
1785
- "text": "HTMLSlotElement"
1786
- },
1787
- "privacy": "private"
1788
- },
1789
- {
1790
- "kind": "field",
1791
- "name": "separatorSlot",
1792
- "type": {
1793
- "text": "HTMLSlotElement"
1794
- },
1795
- "privacy": "private"
1796
- },
1797
- {
1798
- "kind": "field",
1799
- "name": "label",
1800
- "type": {
1801
- "text": "string"
1802
- },
1803
- "default": "''",
1804
- "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.",
1805
- "attribute": "label"
1806
- },
1807
- {
1808
- "kind": "method",
1809
- "name": "getSeparator",
1810
- "privacy": "private"
1811
- },
1812
- {
1813
- "kind": "method",
1814
- "name": "handleSlotChange",
1815
- "privacy": "private"
1816
- }
1817
- ],
1818
- "attributes": [
1819
- {
1820
- "name": "label",
1821
- "type": {
1822
- "text": "string"
1823
- },
1824
- "default": "''",
1825
- "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.",
1826
- "fieldName": "label"
1827
- }
1828
- ],
1829
- "superclass": {
1830
- "name": "FlowRdfElement",
1831
- "module": "/src/internal/flow-ui-rdf-element"
1832
- },
1833
- "tagName": "flow-ui-breadcrumb",
1834
- "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
1835
- "dependencies": [
1836
- "flow-ui-icon"
1837
- ],
1838
- "customElement": true
1839
- }
1840
- ],
1841
- "exports": [
1842
- {
1843
- "kind": "js",
1844
- "name": "default",
1845
- "declaration": {
1846
- "name": "FlowUiBreadcrumb",
1847
- "module": "components/breadcrumb/breadcrumb.component.js"
1848
- }
1849
- }
1850
- ]
1851
- },
1852
- {
1853
- "kind": "javascript-module",
1854
- "path": "components/breadcrumb/breadcrumb.js",
1855
- "declarations": [],
1856
- "exports": [
1857
- {
1858
- "kind": "js",
1859
- "name": "default",
1860
- "declaration": {
1861
- "name": "FlowUiBreadcrumb",
1862
- "module": "components/breadcrumb/breadcrumb.js"
1863
- }
1864
- }
1865
- ]
1866
- },
1867
1744
  {
1868
1745
  "kind": "javascript-module",
1869
1746
  "path": "components/base-control/base-control.component.js",
@@ -2325,6 +2202,129 @@
2325
2202
  }
2326
2203
  ]
2327
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"
2257
+ },
2258
+ {
2259
+ "kind": "field",
2260
+ "name": "label",
2261
+ "type": {
2262
+ "text": "string"
2263
+ },
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"
2267
+ },
2268
+ {
2269
+ "kind": "method",
2270
+ "name": "getSeparator",
2271
+ "privacy": "private"
2272
+ },
2273
+ {
2274
+ "kind": "method",
2275
+ "name": "handleSlotChange",
2276
+ "privacy": "private"
2277
+ }
2278
+ ],
2279
+ "attributes": [
2280
+ {
2281
+ "name": "label",
2282
+ "type": {
2283
+ "text": "string"
2284
+ },
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"
2288
+ }
2289
+ ],
2290
+ "superclass": {
2291
+ "name": "FlowRdfElement",
2292
+ "module": "/src/internal/flow-ui-rdf-element"
2293
+ },
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
+ ],
2299
+ "customElement": true
2300
+ }
2301
+ ],
2302
+ "exports": [
2303
+ {
2304
+ "kind": "js",
2305
+ "name": "default",
2306
+ "declaration": {
2307
+ "name": "FlowUiBreadcrumb",
2308
+ "module": "components/breadcrumb/breadcrumb.component.js"
2309
+ }
2310
+ }
2311
+ ]
2312
+ },
2313
+ {
2314
+ "kind": "javascript-module",
2315
+ "path": "components/breadcrumb/breadcrumb.js",
2316
+ "declarations": [],
2317
+ "exports": [
2318
+ {
2319
+ "kind": "js",
2320
+ "name": "default",
2321
+ "declaration": {
2322
+ "name": "FlowUiBreadcrumb",
2323
+ "module": "components/breadcrumb/breadcrumb.js"
2324
+ }
2325
+ }
2326
+ ]
2327
+ },
2328
2328
  {
2329
2329
  "kind": "javascript-module",
2330
2330
  "path": "components/breadcrumb-item/breadcrumb-item.component.js",
@@ -12654,7 +12654,7 @@
12654
12654
  "privacy": "private",
12655
12655
  "parameters": [
12656
12656
  {
12657
- "name": "ev",
12657
+ "name": "_ev",
12658
12658
  "type": {
12659
12659
  "text": "DragEvent"
12660
12660
  }
@@ -25838,6 +25838,6 @@
25838
25838
  ],
25839
25839
  "package": {
25840
25840
  "name": "@emuanalytics/flow-rdf-ui",
25841
- "version": "4.1.10"
25841
+ "version": "4.1.11"
25842
25842
  }
25843
25843
  }