@universal-material/web 3.0.119 → 3.0.120

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 (32) hide show
  1. package/custom-elements.json +1596 -1556
  2. package/field/field-base.d.ts.map +1 -1
  3. package/field/field-base.js +16 -14
  4. package/field/field-base.js.map +1 -1
  5. package/field/field-base.styles.d.ts.map +1 -1
  6. package/field/field-base.styles.js +0 -12
  7. package/field/field-base.styles.js.map +1 -1
  8. package/menu/menu.d.ts.map +1 -1
  9. package/menu/menu.js +27 -29
  10. package/menu/menu.js.map +1 -1
  11. package/menu/menu.styles.d.ts.map +1 -1
  12. package/menu/menu.styles.js +15 -3
  13. package/menu/menu.styles.js.map +1 -1
  14. package/navigation/side-navigation.d.ts.map +1 -1
  15. package/navigation/side-navigation.js +5 -15
  16. package/navigation/side-navigation.js.map +1 -1
  17. package/package.json +2 -1
  18. package/select/option.d.ts +0 -2
  19. package/select/option.d.ts.map +1 -1
  20. package/select/option.js +13 -23
  21. package/select/option.js.map +1 -1
  22. package/select/select-navigation-controller.d.ts +1 -1
  23. package/select/select-navigation-controller.d.ts.map +1 -1
  24. package/select/select-navigation-controller.js +14 -12
  25. package/select/select-navigation-controller.js.map +1 -1
  26. package/select/select.d.ts.map +1 -1
  27. package/select/select.js +14 -7
  28. package/select/select.js.map +1 -1
  29. package/shared/menu-field/menu-field-navigation-controller.d.ts +3 -3
  30. package/shared/menu-field/menu-field-navigation-controller.d.ts.map +1 -1
  31. package/shared/menu-field/menu-field-navigation-controller.js +11 -10
  32. package/shared/menu-field/menu-field-navigation-controller.js.map +1 -1
package/custom-elements.json CHANGED
@@ -344,12 +344,12 @@
344
344
  },
345
345
  {
346
346
  "kind": "javascript-module",
347
- "path": "src/app-bar/top-app-bar.styles.ts",
347
+ "path": "src/button/button-base.styles.ts",
348
348
  "declarations": [
349
349
  {
350
350
  "kind": "variable",
351
351
  "name": "styles",
352
- "default": "css `\n :host {\n display: block;\n background-color: var(--u-top-app-bar-bg-color, var(--u-color-body, var(--u-color-surface, rgb(254, 247, 255))));\n color: var(--u-top-app-bar-text-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n transition: background-color 100ms, inset 375ms cubic-bezier(0.19, 1, 0.22, 1);\n }\n\n :host([container-scrolled]) {\n background-color: var(--u-top-app-bar-constrast-bg-color, var(--u-color-surface-container, rgb(243, 237, 247)));\n }\n\n :host(:not([has-leading-icon])) .leading-icon {\n display: none;\n }\n\n :host(:not([has-trailing-icon])) .trailing-icon {\n display: none;\n }\n\n slot[name=leading-icon],\n slot[name=trailing-icon] {\n display: inline-flex;\n align-items: center;\n gap: var(--u-top-app-bar-icons-gap, 8px);\n }\n\n slot[name=leading-icon]::slotted(u-icon-button) {\n color: inherit;\n }\n\n :host([position=absolute]) .container {\n position: absolute;\n }\n\n :host([position=fixed]) .container {\n position: fixed;\n inset-inline: 0;\n inset-block-start: 0;\n inset-inline-start: var(--u-app-bar-offset, 0);\n }\n\n :host([position=absolute]),\n :host([position=fixed]) {\n padding-top: var(--_content-height);\n }\n :host([position=absolute]) .container,\n :host([position=fixed]) .container {\n z-index: var(--u-fixed-app-bar-z-index, 1010);\n }\n\n .extended-content {\n display: flex;\n align-items: flex-end;\n padding-inline: var(--u-extended-content-inline-padding, 16px);\n }\n\n :host([size=medium]) .extended-content {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-extended-content-medium-line-height, var(--u-headline-s-line-height, 2rem));\n font-size: var(--u-extended-content-medium-font-size, var(--u-headline-s-font-size, 1.5rem));\n letter-spacing: var(--u-extended-content-medium-letter-spacing, var(--u-headline-s-letter-spacing, 0rem));\n font-weight: var(--u-extended-content-medium-font-weight, var(--u-headline-s-font-weight, var(--u-font-weight-regular, 400)));\n height: var(--u-extended-content-medium-height, 3.5rem);\n padding-bottom: var(--u-extended-content-medium-padding-bottom, 24px);\n }\n\n :host([size=large]) .extended-content {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-extended-content-large-line-height, var(--u-headline-m-line-height, 2.25rem));\n font-size: var(--u-extended-content-large-font-size, var(--u-headline-m-font-size, 1.75rem));\n letter-spacing: var(--u-extended-content-large-letter-spacing, var(--u-headline-m-letter-spacing, 0rem));\n font-weight: var(--u-extended-content-large-font-weight, var(--u-headline-m-font-weight, var(--u-font-weight-regular, 400)));\n height: var(--u-extended-content-medium-large, 6rem);\n padding-bottom: var(--u-extended-content-large-padding-bottom, 28px);\n }\n\n .container {\n background: inherit;\n }\n\n .content {\n display: flex;\n align-items: center;\n background-color: inherit;\n transition: inherit;\n min-height: var(--u-top-app-bar-min-height, 56px);\n }\n @media (min-width: 840px) {\n .content {\n min-height: var(--u-top-app-bar-extended-min-height, 64px);\n }\n }\n\n .headline {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-top-app-bar-headline-line-height, var(--u-title-l-line-height, 1.75rem));\n font-size: var(--u-top-app-bar-headline-font-size, var(--u-title-l-font-size, 1.375rem));\n letter-spacing: var(--u-top-app-bar-headline-letter-spacing, var(--u-title-l-letter-spacing, 0rem));\n font-weight: var(--u-top-app-bar-headline-font-weight, var(--u-title-l-font-weight, var(--u-font-weight-regular, 400)));\n margin-inline: var(--u-headline-margin, 16px);\n }\n :host([has-leading-icon]) .headline {\n margin-inline-start: 0;\n }\n\n .leading-icon {\n margin-inline: var(--u-leading-icon-margin, 8px);\n }\n\n .trailing-icon {\n padding-inline: var(--u-trailing-icon-margin, 8px);\n margin-inline-start: auto;\n }\n`"
352
+ "default": "css `\n .icon {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 1em;\n height: 1em;\n line-height: 1em;\n }\n\n ::slotted([slot=icon]) {\n display: inline-block;\n }\n\n .content {\n pointer-events: none;\n }\n`"
353
353
  }
354
354
  ],
355
355
  "exports": [
@@ -358,300 +358,494 @@
358
358
  "name": "styles",
359
359
  "declaration": {
360
360
  "name": "styles",
361
- "module": "src/app-bar/top-app-bar.styles.ts"
361
+ "module": "src/button/button-base.styles.ts"
362
362
  }
363
363
  }
364
364
  ]
365
365
  },
366
366
  {
367
367
  "kind": "javascript-module",
368
- "path": "src/app-bar/top-app-bar.ts",
368
+ "path": "src/button/button-base.ts",
369
369
  "declarations": [
370
370
  {
371
371
  "kind": "class",
372
372
  "description": "",
373
- "name": "UmTopAppBar",
373
+ "name": "UmButtonBase",
374
374
  "members": [
375
375
  {
376
376
  "kind": "field",
377
- "name": "hasLeadingIcon",
377
+ "name": "formAssociated",
378
378
  "type": {
379
379
  "text": "boolean"
380
380
  },
381
- "default": "false",
382
- "description": "Whether the app bar has leading icon or not\n\n_Note:_ Readonly",
383
- "attribute": "has-leading-icon",
384
- "reflects": true
381
+ "static": true,
382
+ "default": "true"
385
383
  },
386
384
  {
387
385
  "kind": "field",
388
- "name": "hasTrailingIcon",
386
+ "name": "type",
389
387
  "type": {
390
- "text": "boolean"
388
+ "text": "string"
391
389
  },
392
- "default": "false",
393
- "description": "Whether the app bar has trailing icon or not\n\n_Note:_ Readonly",
394
- "attribute": "has-trailing-icon",
395
- "reflects": true
390
+ "default": "'submit'",
391
+ "attribute": "type"
396
392
  },
397
393
  {
398
394
  "kind": "field",
399
- "name": "position",
395
+ "name": "value",
400
396
  "type": {
401
- "text": "'fixed' | 'absolute' | 'static'"
397
+ "text": "string"
402
398
  },
403
- "default": "'fixed'",
404
- "attribute": "position",
399
+ "default": "''",
400
+ "attribute": "value",
405
401
  "reflects": true
406
402
  },
407
403
  {
408
404
  "kind": "field",
409
- "name": "size",
405
+ "name": "form",
410
406
  "type": {
411
- "text": "'small' | 'medium' | 'large'"
412
- },
413
- "default": "'small'",
414
- "attribute": "size",
415
- "reflects": true
407
+ "text": "HTMLFormElement | null"
408
+ }
416
409
  },
417
410
  {
418
411
  "kind": "field",
419
- "name": "headline",
412
+ "name": "#elementInternals",
413
+ "privacy": "private",
420
414
  "type": {
421
- "text": "string"
415
+ "text": "ElementInternals"
416
+ }
417
+ },
418
+ {
419
+ "kind": "method",
420
+ "name": "handleClick",
421
+ "privacy": "protected",
422
+ "return": {
423
+ "type": {
424
+ "text": "void"
425
+ }
422
426
  },
423
- "default": "''",
424
- "attribute": "headline"
427
+ "parameters": [
428
+ {
429
+ "name": "_",
430
+ "type": {
431
+ "text": "UIEvent"
432
+ }
433
+ }
434
+ ],
435
+ "inheritedFrom": {
436
+ "name": "UmButtonWrapper",
437
+ "module": "src/shared/button-wrapper.ts"
438
+ }
425
439
  },
426
440
  {
427
441
  "kind": "field",
428
- "name": "scrollContainer",
442
+ "name": "disabled",
429
443
  "type": {
430
- "text": "'none' | 'window' | string | undefined"
444
+ "text": "boolean"
431
445
  },
432
- "attribute": "scrollContainer",
433
- "reflects": true
446
+ "default": "false",
447
+ "description": "Whether the button is disabled or not.",
448
+ "attribute": "disabled",
449
+ "reflects": true,
450
+ "inheritedFrom": {
451
+ "name": "UmButtonWrapper",
452
+ "module": "src/shared/button-wrapper.ts"
453
+ }
434
454
  },
435
455
  {
436
456
  "kind": "field",
437
- "name": "containerScrolled",
457
+ "name": "renderRipple",
438
458
  "type": {
439
459
  "text": "boolean"
440
460
  },
441
- "default": "false",
442
- "attribute": "container-scrolled",
443
- "reflects": true
461
+ "default": "true",
462
+ "inheritedFrom": {
463
+ "name": "UmButtonWrapper",
464
+ "module": "src/shared/button-wrapper.ts"
465
+ }
444
466
  },
445
467
  {
446
468
  "kind": "field",
447
- "name": "assignedLeadingIcons",
469
+ "name": "href",
448
470
  "type": {
449
- "text": "HTMLElement[]"
471
+ "text": "string | undefined"
450
472
  },
451
- "privacy": "private"
473
+ "description": "The URL that the link button points to.",
474
+ "attribute": "href",
475
+ "inheritedFrom": {
476
+ "name": "UmButtonWrapper",
477
+ "module": "src/shared/button-wrapper.ts"
478
+ }
452
479
  },
453
480
  {
454
481
  "kind": "field",
455
- "name": "assignedTrailingIcons",
482
+ "name": "target",
456
483
  "type": {
457
- "text": "HTMLElement[]"
484
+ "text": "string | undefined"
458
485
  },
459
- "privacy": "private"
486
+ "description": "Where to display the linked `href` URL for a link button. Common options\ninclude `_blank` to open in a new tab.",
487
+ "attribute": "target",
488
+ "inheritedFrom": {
489
+ "name": "UmButtonWrapper",
490
+ "module": "src/shared/button-wrapper.ts"
491
+ }
460
492
  },
461
493
  {
462
494
  "kind": "field",
463
- "name": "_container",
495
+ "name": "name",
464
496
  "type": {
465
- "text": "HTMLElement"
497
+ "text": "string | undefined"
466
498
  },
467
- "privacy": "private"
499
+ "attribute": "name",
500
+ "inheritedFrom": {
501
+ "name": "UmButtonWrapper",
502
+ "module": "src/shared/button-wrapper.ts"
503
+ }
468
504
  },
469
505
  {
470
506
  "kind": "field",
471
- "name": "_extendedContent",
507
+ "name": "buttonElement",
472
508
  "type": {
473
509
  "text": "HTMLElement"
474
510
  },
475
- "privacy": "private"
511
+ "inheritedFrom": {
512
+ "name": "UmButtonWrapper",
513
+ "module": "src/shared/button-wrapper.ts"
514
+ }
476
515
  },
477
516
  {
478
517
  "kind": "field",
479
- "name": "_headlineElement",
518
+ "name": "ripple",
480
519
  "type": {
481
- "text": "HTMLElement"
520
+ "text": "UmRipple"
482
521
  },
483
- "privacy": "private"
522
+ "privacy": "private",
523
+ "inheritedFrom": {
524
+ "name": "UmButtonWrapper",
525
+ "module": "src/shared/button-wrapper.ts"
526
+ }
484
527
  },
485
528
  {
486
529
  "kind": "field",
487
- "name": "containerSizeObserver",
530
+ "name": "innerRole",
488
531
  "type": {
489
- "text": "ResizeObserver | null"
532
+ "text": "string | null"
490
533
  },
491
- "privacy": "private",
492
- "default": "null"
534
+ "privacy": "protected",
535
+ "default": "null",
536
+ "inheritedFrom": {
537
+ "name": "UmButtonWrapper",
538
+ "module": "src/shared/button-wrapper.ts"
539
+ }
493
540
  },
494
541
  {
495
542
  "kind": "field",
496
- "name": "scrollContainerElement",
543
+ "name": "pathname",
497
544
  "type": {
498
- "text": "{\n addEventListener: typeof window.addEventListener;\n removeEventListener: typeof window.removeEventListener;\n } | null"
545
+ "text": "string"
499
546
  },
547
+ "inheritedFrom": {
548
+ "name": "UmButtonWrapper",
549
+ "module": "src/shared/button-wrapper.ts"
550
+ }
551
+ },
552
+ {
553
+ "kind": "method",
554
+ "name": "renderButton",
500
555
  "privacy": "private",
501
- "default": "null"
556
+ "inheritedFrom": {
557
+ "name": "UmButtonWrapper",
558
+ "module": "src/shared/button-wrapper.ts"
559
+ }
502
560
  },
503
561
  {
504
562
  "kind": "method",
505
- "name": "getScrollContainer",
563
+ "name": "renderLink",
506
564
  "privacy": "private",
565
+ "inheritedFrom": {
566
+ "name": "UmButtonWrapper",
567
+ "module": "src/shared/button-wrapper.ts"
568
+ }
569
+ },
570
+ {
571
+ "kind": "method",
572
+ "name": "renderContent",
573
+ "privacy": "protected",
507
574
  "return": {
508
575
  "type": {
509
- "text": "| {\n addEventListener: typeof window.addEventListener;\n removeEventListener: typeof window.removeEventListener;\n }\n | undefined"
576
+ "text": "HTMLTemplateResult"
510
577
  }
511
578
  },
512
- "parameters": [
513
- {
514
- "name": "idOrElement",
515
- "type": {
516
- "text": "string | HTMLElement | undefined"
517
- }
518
- }
519
- ]
579
+ "inheritedFrom": {
580
+ "name": "UmButtonWrapper",
581
+ "module": "src/shared/button-wrapper.ts"
582
+ }
520
583
  },
521
584
  {
522
585
  "kind": "method",
523
- "name": "handleLeadingIconSlotChange",
524
- "privacy": "private"
586
+ "name": "focus",
587
+ "inheritedFrom": {
588
+ "name": "UmButtonWrapper",
589
+ "module": "src/shared/button-wrapper.ts"
590
+ }
525
591
  },
526
592
  {
527
593
  "kind": "method",
528
- "name": "handleTrailingIconSlotChange",
529
- "privacy": "private"
594
+ "name": "blur",
595
+ "inheritedFrom": {
596
+ "name": "UmButtonWrapper",
597
+ "module": "src/shared/button-wrapper.ts"
598
+ }
530
599
  },
531
600
  {
532
- "kind": "field",
533
- "name": "#updateScroll",
534
- "privacy": "private"
601
+ "kind": "method",
602
+ "name": "getAriaLabel",
603
+ "privacy": "protected",
604
+ "return": {
605
+ "type": {
606
+ "text": "string | null"
607
+ }
608
+ },
609
+ "inheritedFrom": {
610
+ "name": "UmButtonWrapper",
611
+ "module": "src/shared/button-wrapper.ts"
612
+ }
535
613
  },
536
614
  {
537
615
  "kind": "method",
538
- "name": "getScrollTop",
616
+ "name": "innerFocusHandler",
539
617
  "privacy": "private",
540
- "static": true,
541
618
  "return": {
542
619
  "type": {
543
- "text": "number"
620
+ "text": "void"
621
+ }
622
+ },
623
+ "inheritedFrom": {
624
+ "name": "UmButtonWrapper",
625
+ "module": "src/shared/button-wrapper.ts"
626
+ }
627
+ },
628
+ {
629
+ "kind": "method",
630
+ "name": "#innerClickHandler",
631
+ "return": {
632
+ "type": {
633
+ "text": "void"
544
634
  }
545
635
  },
546
636
  "parameters": [
547
637
  {
548
- "name": "container",
638
+ "name": "event",
549
639
  "type": {
550
- "text": "HTMLElement & Window"
640
+ "text": "MouseEvent"
551
641
  }
552
642
  }
553
- ]
554
- },
555
- {
556
- "kind": "method",
557
- "name": "setContentHeightProperty",
558
- "privacy": "private"
643
+ ],
644
+ "inheritedFrom": {
645
+ "name": "UmButtonWrapper",
646
+ "module": "src/shared/button-wrapper.ts"
647
+ }
559
648
  }
560
649
  ],
561
650
  "attributes": [
562
651
  {
563
- "name": "has-leading-icon",
652
+ "name": "type",
564
653
  "type": {
565
- "text": "boolean"
654
+ "text": "string"
566
655
  },
567
- "default": "false",
568
- "description": "Whether the app bar has leading icon or not\n\n_Note:_ Readonly",
569
- "fieldName": "hasLeadingIcon"
656
+ "default": "'submit'",
657
+ "fieldName": "type"
570
658
  },
571
659
  {
572
- "name": "has-trailing-icon",
660
+ "name": "value",
661
+ "type": {
662
+ "text": "string"
663
+ },
664
+ "default": "''",
665
+ "fieldName": "value"
666
+ },
667
+ {
668
+ "name": "disabled",
573
669
  "type": {
574
670
  "text": "boolean"
575
671
  },
576
672
  "default": "false",
577
- "description": "Whether the app bar has trailing icon or not\n\n_Note:_ Readonly",
578
- "fieldName": "hasTrailingIcon"
673
+ "description": "Whether the button is disabled or not.",
674
+ "fieldName": "disabled",
675
+ "inheritedFrom": {
676
+ "name": "UmButtonWrapper",
677
+ "module": "src/shared/button-wrapper.ts"
678
+ }
579
679
  },
580
680
  {
581
- "name": "position",
681
+ "name": "href",
582
682
  "type": {
583
- "text": "'fixed' | 'absolute' | 'static'"
683
+ "text": "string | undefined"
584
684
  },
585
- "default": "'fixed'",
586
- "fieldName": "position"
685
+ "description": "The URL that the link button points to.",
686
+ "fieldName": "href",
687
+ "inheritedFrom": {
688
+ "name": "UmButtonWrapper",
689
+ "module": "src/shared/button-wrapper.ts"
690
+ }
587
691
  },
588
692
  {
589
- "name": "size",
693
+ "name": "target",
590
694
  "type": {
591
- "text": "'small' | 'medium' | 'large'"
695
+ "text": "string | undefined"
592
696
  },
593
- "default": "'small'",
594
- "fieldName": "size"
697
+ "description": "Where to display the linked `href` URL for a link button. Common options\ninclude `_blank` to open in a new tab.",
698
+ "fieldName": "target",
699
+ "inheritedFrom": {
700
+ "name": "UmButtonWrapper",
701
+ "module": "src/shared/button-wrapper.ts"
702
+ }
595
703
  },
596
704
  {
597
- "name": "headline",
705
+ "name": "name",
598
706
  "type": {
599
- "text": "string"
707
+ "text": "string | undefined"
600
708
  },
601
- "default": "''",
602
- "fieldName": "headline"
603
- },
709
+ "fieldName": "name",
710
+ "inheritedFrom": {
711
+ "name": "UmButtonWrapper",
712
+ "module": "src/shared/button-wrapper.ts"
713
+ }
714
+ }
715
+ ],
716
+ "superclass": {
717
+ "name": "UmButtonWrapper",
718
+ "module": "/src/shared/button-wrapper.js"
719
+ }
720
+ }
721
+ ],
722
+ "exports": [
723
+ {
724
+ "kind": "js",
725
+ "name": "UmButtonBase",
726
+ "declaration": {
727
+ "name": "UmButtonBase",
728
+ "module": "src/button/button-base.ts"
729
+ }
730
+ }
731
+ ]
732
+ },
733
+ {
734
+ "kind": "javascript-module",
735
+ "path": "src/button/button-set.styles.ts",
736
+ "declarations": [
737
+ {
738
+ "kind": "variable",
739
+ "name": "styles",
740
+ "default": "css `\n :host([stack][alignment=start]) {\n align-items: flex-start;\n }\n\n :host([stack][alignment=center]) {\n align-items: center;\n }\n\n :host([stack][alignment=end]) {\n align-items: flex-end;\n }\n\n :host([stack]) {\n flex-direction: column;\n justify-content: flex-start;\n }\n`"
741
+ }
742
+ ],
743
+ "exports": [
744
+ {
745
+ "kind": "js",
746
+ "name": "styles",
747
+ "declaration": {
748
+ "name": "styles",
749
+ "module": "src/button/button-set.styles.ts"
750
+ }
751
+ }
752
+ ]
753
+ },
754
+ {
755
+ "kind": "javascript-module",
756
+ "path": "src/button/button-set.ts",
757
+ "declarations": [
758
+ {
759
+ "kind": "class",
760
+ "description": "",
761
+ "name": "UmButtonSet",
762
+ "members": [
604
763
  {
605
- "name": "scrollContainer",
764
+ "kind": "field",
765
+ "name": "stack",
606
766
  "type": {
607
- "text": "'none' | 'window' | string | undefined"
767
+ "text": "boolean"
608
768
  },
609
- "fieldName": "scrollContainer"
769
+ "default": "false",
770
+ "description": "Whether to render the buttons stacked or not",
771
+ "attribute": "stack",
772
+ "reflects": true
610
773
  },
611
774
  {
612
- "name": "container-scrolled",
775
+ "kind": "field",
776
+ "name": "alignment",
777
+ "type": {
778
+ "text": "'start' | 'center' | 'end'"
779
+ },
780
+ "default": "'end'",
781
+ "description": "Set the alignment of the set at the `start`, `center` or at the `end`.",
782
+ "attribute": "alignment",
783
+ "reflects": true,
784
+ "inheritedFrom": {
785
+ "name": "UmSetBase",
786
+ "module": "src/shared/sets/set-base.ts"
787
+ }
788
+ }
789
+ ],
790
+ "attributes": [
791
+ {
792
+ "name": "stack",
613
793
  "type": {
614
794
  "text": "boolean"
615
795
  },
616
796
  "default": "false",
617
- "fieldName": "containerScrolled"
797
+ "description": "Whether to render the buttons stacked or not",
798
+ "fieldName": "stack"
799
+ },
800
+ {
801
+ "name": "alignment",
802
+ "type": {
803
+ "text": "'start' | 'center' | 'end'"
804
+ },
805
+ "default": "'start'",
806
+ "description": "Set the alignment of the set at the `start`, `center` or at the `end`.",
807
+ "fieldName": "alignment",
808
+ "inheritedFrom": {
809
+ "name": "UmSetBase",
810
+ "module": "src/shared/sets/set-base.ts"
811
+ }
618
812
  }
619
813
  ],
620
814
  "superclass": {
621
- "name": "LitElement",
622
- "package": "lit"
815
+ "name": "UmSetBase",
816
+ "module": "/src/shared/sets/set-base.js"
623
817
  },
624
- "tagName": "u-top-app-bar",
818
+ "tagName": "u-button-set",
625
819
  "customElement": true
626
820
  }
627
821
  ],
628
822
  "exports": [
629
823
  {
630
824
  "kind": "js",
631
- "name": "UmTopAppBar",
825
+ "name": "UmButtonSet",
632
826
  "declaration": {
633
- "name": "UmTopAppBar",
634
- "module": "src/app-bar/top-app-bar.ts"
827
+ "name": "UmButtonSet",
828
+ "module": "src/button/button-set.ts"
635
829
  }
636
830
  },
637
831
  {
638
832
  "kind": "custom-element-definition",
639
- "name": "u-top-app-bar",
833
+ "name": "u-button-set",
640
834
  "declaration": {
641
- "name": "UmTopAppBar",
642
- "module": "src/app-bar/top-app-bar.ts"
835
+ "name": "UmButtonSet",
836
+ "module": "src/button/button-set.ts"
643
837
  }
644
838
  }
645
839
  ]
646
840
  },
647
841
  {
648
842
  "kind": "javascript-module",
649
- "path": "src/button/button-base.styles.ts",
843
+ "path": "src/button/button.styles.ts",
650
844
  "declarations": [
651
845
  {
652
846
  "kind": "variable",
653
847
  "name": "styles",
654
- "default": "css `\n .icon {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 1em;\n height: 1em;\n line-height: 1em;\n }\n\n ::slotted([slot=icon]) {\n display: inline-block;\n }\n\n .content {\n pointer-events: none;\n }\n`"
848
+ "default": "css `\n :host {\n --u-common-button-line-height: var(--u-label-large-line-height, 1.25rem);\n --u-common-button-font-size: var(--u-label-large-font-size, 0.875rem);\n --u-common-button-font-weight: var(--u-font-weight-medium, 500);\n --_common-button-height: var(--u-common-button-height, 2.5rem);\n --_common-button-padding: var(--u-common-button-padding, 24px);\n --_common-button-icon-size: var(--u-common-button-icon-size, 1.125rem);\n --_common-button-icon-padding: var(--u-common-button-icon-padding, 16px);\n --_common-button-icon-margin: var(--u-common-button-icon-margin, 8px);\n border-radius: var(--u-common-button-shape-corner, var(--u-shape-corner-full, 9999px));\n font-family: var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n height: var(--u-common-button-height, 40px);\n font-size: var(--u-common-button-font-size);\n font-weight: var(--u-common-button-font-weight);\n padding-inline: var(--_common-button-padding);\n box-sizing: border-box;\n }\n\n :host([variant=filled]),\n :host([variant=filled][color=primary]) {\n background-color: var(--u-filled-button-primary-container-color, var(--_color-primary));\n color: var(--u-filled-button-primary-text-color, var(--u-color-on-primary, rgb(255, 255, 255)));\n }\n\n :host([variant=filled][color=secondary]) {\n background-color: var(--u-filled-button-secondary-container-color, var(--u-color-secondary, rgb(98, 91, 113)));\n color: var(--u-filled-button-secondary-text-color, var(--u-color-on-secondary, rgb(255, 255, 255)));\n }\n\n :host([variant=filled][color=tertiary]) {\n background-color: var(--u-filled-button-tertiary-container-color, var(--u-color-tertiary, rgb(125, 82, 96)));\n color: var(--u-filled-button-tertiary-text-color, var(--u-color-on-tertiary, rgb(255, 255, 255)));\n }\n\n :host([variant=filled][color=error]) {\n background-color: var(--u-filled-button-error-container-color, var(--u-color-error, rgb(179, 38, 30)));\n color: var(--u-filled-button-error-text-color, var(--u-color-on-error, rgb(255, 255, 255)));\n }\n\n :host([variant=tonal]) {\n background-color: var(--u-tonal-button-bg-color, var(--u-color-secondary-container, rgb(232, 222, 248)));\n color: var(--u-tonal-button-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n }\n\n :host([variant=elevated]) {\n background-color: var(--u-elevated-button-bg-color, var(--u-color-surface-container-low, rgb(247, 242, 250)));\n color: var(--u-tonal-button-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n }\n\n @media (hover: hover) {\n :host([variant=filled]:hover:not(:focus-within):not(:active)),\n :host([variant=tonal]:hover:not(:focus-within):not(:active)) {\n --u-elevation-level: var(--u-filled-button-hover-elevation-level, 1);\n }\n }\n :host([variant=text]) {\n color: var(--u-text-button-text-color, var(--_color-primary));\n }\n\n :host([variant=outlined]) {\n color: var(--u-outlined-button-text-color, var(--u-text-button-text-color, var(--_color-primary)));\n border: 1px solid var(--u-outlined-button-outline-color, var(--u-color-outline, rgb(121, 116, 126)));\n }\n\n :host([variant=elevated]) {\n --u-elevation-level: var(--u-elevated-button-elevation-level, 1);\n color: var(--u-elevated-button-text-color, var(--_color-primary));\n }\n\n :host([disabled][variant=outlined]) {\n background-color: transparent !important;\n border-color: var(--u-outlined-button-disabled-border-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-outlined-button-disabled-border-opacity, 0.12))) !important;\n }\n\n @media (hover: hover) {\n :host([variant=elevated]:hover) {\n --u-elevation-level: var(--u-elevated-button-hover-elevation-level, 2);\n }\n }\n :host([has-icon]) {\n padding-inline: var(--_common-button-icon-padding) var(--_common-button-padding);\n }\n\n :host([has-icon][trailing-icon]) {\n padding-inline: var(--_common-button-padding) var(--_common-button-icon-padding);\n }\n\n :host(:not([has-icon])) .icon {\n display: none;\n }\n\n .icon {\n font-size: var(--_common-button-icon-size);\n margin-inline-end: var(--_common-button-icon-margin);\n }\n\n :host([trailing-icon]) .icon {\n margin-inline: var(--_common-button-icon-margin) 0;\n }\n`"
655
849
  }
656
850
  ],
657
851
  "exports": [
@@ -660,93 +854,182 @@
660
854
  "name": "styles",
661
855
  "declaration": {
662
856
  "name": "styles",
663
- "module": "src/button/button-base.styles.ts"
857
+ "module": "src/button/button.styles.ts"
664
858
  }
665
859
  }
666
860
  ]
667
861
  },
668
862
  {
669
863
  "kind": "javascript-module",
670
- "path": "src/button/button-base.ts",
864
+ "path": "src/button/button.ts",
671
865
  "declarations": [
672
866
  {
673
867
  "kind": "class",
674
868
  "description": "",
675
- "name": "UmButtonBase",
869
+ "name": "UmButton",
676
870
  "members": [
677
871
  {
678
872
  "kind": "field",
679
- "name": "formAssociated",
873
+ "name": "variant",
680
874
  "type": {
681
- "text": "boolean"
875
+ "text": "UmButtonVariant"
682
876
  },
683
- "static": true,
684
- "default": "true"
877
+ "default": "'filled'",
878
+ "description": "The Button variant to render",
879
+ "attribute": "variant",
880
+ "reflects": true
685
881
  },
686
882
  {
687
883
  "kind": "field",
688
- "name": "type",
884
+ "name": "color",
689
885
  "type": {
690
- "text": "string"
886
+ "text": "UmButtonColor"
691
887
  },
692
- "default": "'submit'",
693
- "attribute": "type"
888
+ "description": "The Button color\n\n1",
889
+ "attribute": "color",
890
+ "reflects": true
694
891
  },
695
892
  {
696
893
  "kind": "field",
697
- "name": "value",
894
+ "name": "trailingIcon",
698
895
  "type": {
699
- "text": "string"
896
+ "text": "boolean"
700
897
  },
701
- "default": "''",
702
- "attribute": "value",
898
+ "default": "false",
899
+ "attribute": "trailing-icon",
703
900
  "reflects": true
704
901
  },
705
902
  {
706
903
  "kind": "field",
707
- "name": "form",
708
- "type": {
709
- "text": "HTMLFormElement | null"
710
- }
711
- },
712
- {
713
- "kind": "field",
714
- "name": "#elementInternals",
715
- "privacy": "private",
904
+ "name": "hasIcon",
716
905
  "type": {
717
- "text": "ElementInternals"
718
- }
906
+ "text": "boolean"
907
+ },
908
+ "default": "false",
909
+ "description": "Whether the button has icon or not\n\n_Note:_ Readonly",
910
+ "attribute": "has-icon",
911
+ "reflects": true
719
912
  },
720
913
  {
721
914
  "kind": "method",
722
- "name": "handleClick",
915
+ "name": "renderContent",
723
916
  "privacy": "protected",
724
917
  "return": {
725
918
  "type": {
726
- "text": "void"
919
+ "text": "HTMLTemplateResult"
727
920
  }
728
921
  },
729
- "parameters": [
730
- {
731
- "name": "_",
732
- "type": {
733
- "text": "UIEvent"
734
- }
735
- }
736
- ],
737
922
  "inheritedFrom": {
738
923
  "name": "UmButtonWrapper",
739
924
  "module": "src/shared/button-wrapper.ts"
740
925
  }
741
926
  },
742
927
  {
743
- "kind": "field",
744
- "name": "disabled",
745
- "type": {
746
- "text": "boolean"
747
- },
748
- "default": "false",
749
- "description": "Whether the button is disabled or not.",
928
+ "kind": "method",
929
+ "name": "handleSlotChange",
930
+ "privacy": "private",
931
+ "parameters": [
932
+ {
933
+ "name": "e",
934
+ "type": {
935
+ "text": "Event"
936
+ }
937
+ }
938
+ ]
939
+ },
940
+ {
941
+ "kind": "field",
942
+ "name": "formAssociated",
943
+ "type": {
944
+ "text": "boolean"
945
+ },
946
+ "static": true,
947
+ "default": "true",
948
+ "inheritedFrom": {
949
+ "name": "UmButtonBase",
950
+ "module": "src/button/button-base.ts"
951
+ }
952
+ },
953
+ {
954
+ "kind": "field",
955
+ "name": "type",
956
+ "type": {
957
+ "text": "string"
958
+ },
959
+ "default": "'submit'",
960
+ "attribute": "type",
961
+ "inheritedFrom": {
962
+ "name": "UmButtonBase",
963
+ "module": "src/button/button-base.ts"
964
+ }
965
+ },
966
+ {
967
+ "kind": "field",
968
+ "name": "value",
969
+ "type": {
970
+ "text": "string"
971
+ },
972
+ "default": "''",
973
+ "attribute": "value",
974
+ "reflects": true,
975
+ "inheritedFrom": {
976
+ "name": "UmButtonBase",
977
+ "module": "src/button/button-base.ts"
978
+ }
979
+ },
980
+ {
981
+ "kind": "field",
982
+ "name": "form",
983
+ "type": {
984
+ "text": "HTMLFormElement | null"
985
+ },
986
+ "inheritedFrom": {
987
+ "name": "UmButtonBase",
988
+ "module": "src/button/button-base.ts"
989
+ }
990
+ },
991
+ {
992
+ "kind": "field",
993
+ "name": "#elementInternals",
994
+ "privacy": "private",
995
+ "type": {
996
+ "text": "ElementInternals"
997
+ },
998
+ "inheritedFrom": {
999
+ "name": "UmButtonBase",
1000
+ "module": "src/button/button-base.ts"
1001
+ }
1002
+ },
1003
+ {
1004
+ "kind": "method",
1005
+ "name": "handleClick",
1006
+ "privacy": "protected",
1007
+ "return": {
1008
+ "type": {
1009
+ "text": "void"
1010
+ }
1011
+ },
1012
+ "parameters": [
1013
+ {
1014
+ "name": "_",
1015
+ "type": {
1016
+ "text": "UIEvent"
1017
+ }
1018
+ }
1019
+ ],
1020
+ "inheritedFrom": {
1021
+ "name": "UmButtonWrapper",
1022
+ "module": "src/shared/button-wrapper.ts"
1023
+ }
1024
+ },
1025
+ {
1026
+ "kind": "field",
1027
+ "name": "disabled",
1028
+ "type": {
1029
+ "text": "boolean"
1030
+ },
1031
+ "default": "false",
1032
+ "description": "Whether the button is disabled or not.",
750
1033
  "attribute": "disabled",
751
1034
  "reflects": true,
752
1035
  "inheritedFrom": {
@@ -869,20 +1152,6 @@
869
1152
  "module": "src/shared/button-wrapper.ts"
870
1153
  }
871
1154
  },
872
- {
873
- "kind": "method",
874
- "name": "renderContent",
875
- "privacy": "protected",
876
- "return": {
877
- "type": {
878
- "text": "HTMLTemplateResult"
879
- }
880
- },
881
- "inheritedFrom": {
882
- "name": "UmButtonWrapper",
883
- "module": "src/shared/button-wrapper.ts"
884
- }
885
- },
886
1155
  {
887
1156
  "kind": "method",
888
1157
  "name": "focus",
@@ -950,13 +1219,51 @@
950
1219
  }
951
1220
  ],
952
1221
  "attributes": [
1222
+ {
1223
+ "name": "variant",
1224
+ "type": {
1225
+ "text": "UmButtonVariant"
1226
+ },
1227
+ "default": "'filled'",
1228
+ "description": "The Button variant to render",
1229
+ "fieldName": "variant"
1230
+ },
1231
+ {
1232
+ "name": "color",
1233
+ "type": {
1234
+ "text": "UmButtonColor"
1235
+ },
1236
+ "description": "The Button color\n\n1",
1237
+ "fieldName": "color"
1238
+ },
1239
+ {
1240
+ "name": "trailing-icon",
1241
+ "type": {
1242
+ "text": "boolean"
1243
+ },
1244
+ "default": "false",
1245
+ "fieldName": "trailingIcon"
1246
+ },
1247
+ {
1248
+ "name": "has-icon",
1249
+ "type": {
1250
+ "text": "boolean"
1251
+ },
1252
+ "default": "false",
1253
+ "description": "Whether the button has icon or not\n\n_Note:_ Readonly",
1254
+ "fieldName": "hasIcon"
1255
+ },
953
1256
  {
954
1257
  "name": "type",
955
1258
  "type": {
956
1259
  "text": "string"
957
1260
  },
958
1261
  "default": "'submit'",
959
- "fieldName": "type"
1262
+ "fieldName": "type",
1263
+ "inheritedFrom": {
1264
+ "name": "UmButtonBase",
1265
+ "module": "src/button/button-base.ts"
1266
+ }
960
1267
  },
961
1268
  {
962
1269
  "name": "value",
@@ -964,7 +1271,11 @@
964
1271
  "text": "string"
965
1272
  },
966
1273
  "default": "''",
967
- "fieldName": "value"
1274
+ "fieldName": "value",
1275
+ "inheritedFrom": {
1276
+ "name": "UmButtonBase",
1277
+ "module": "src/button/button-base.ts"
1278
+ }
968
1279
  },
969
1280
  {
970
1281
  "name": "disabled",
@@ -1016,30 +1327,40 @@
1016
1327
  }
1017
1328
  ],
1018
1329
  "superclass": {
1019
- "name": "UmButtonWrapper",
1020
- "module": "/src/shared/button-wrapper.js"
1021
- }
1330
+ "name": "UmButtonBase",
1331
+ "module": "/src/button/button-base.js"
1332
+ },
1333
+ "tagName": "u-button",
1334
+ "customElement": true
1022
1335
  }
1023
1336
  ],
1024
1337
  "exports": [
1025
1338
  {
1026
1339
  "kind": "js",
1027
- "name": "UmButtonBase",
1340
+ "name": "UmButton",
1028
1341
  "declaration": {
1029
- "name": "UmButtonBase",
1030
- "module": "src/button/button-base.ts"
1342
+ "name": "UmButton",
1343
+ "module": "src/button/button.ts"
1344
+ }
1345
+ },
1346
+ {
1347
+ "kind": "custom-element-definition",
1348
+ "name": "u-button",
1349
+ "declaration": {
1350
+ "name": "UmButton",
1351
+ "module": "src/button/button.ts"
1031
1352
  }
1032
1353
  }
1033
1354
  ]
1034
1355
  },
1035
1356
  {
1036
1357
  "kind": "javascript-module",
1037
- "path": "src/button/button-set.styles.ts",
1358
+ "path": "src/button/fab.styles.ts",
1038
1359
  "declarations": [
1039
1360
  {
1040
1361
  "kind": "variable",
1041
1362
  "name": "styles",
1042
- "default": "css `\n :host([stack][alignment=start]) {\n align-items: flex-start;\n }\n\n :host([stack][alignment=center]) {\n align-items: center;\n }\n\n :host([stack][alignment=end]) {\n align-items: flex-end;\n }\n\n :host([stack]) {\n flex-direction: column;\n justify-content: flex-start;\n }\n`"
1363
+ "default": "css `\n :host {\n aspect-ratio: 1;\n --u-elevation-level: var(--u-fab-button-elevation-level, 3);\n }\n\n :host([lowered]) {\n --u-elevation-level: var(--u-fab-button-elevation-level, 1);\n }\n\n @media (hover: hover) {\n :host(:hover:not(:focus-within):not(:active)) {\n --u-elevation-level: var(--u-fab-button-hover-elevation-level, 4);\n }\n :host(:hover:not(:focus-within):not(:active)[lowered]) {\n --u-elevation-level: var(--u-fab-button-elevation-level, 2);\n }\n }\n @media (hover: hover) {\n :host(:hover:not(:focus-within):not(:active)) {\n --u-elevation-level: var(--u-fab-button-hover-elevation-level, 4);\n }\n }\n :host([size=small]) {\n width: var(--u-fab-button-small-size, 40px);\n border-radius: var(--u-fab-button-medium-shape-corner, var(--u-shape-corner-medium, 12px));\n }\n\n :host([size=large]) {\n width: var(--u-fab-button-medium-size, 96px);\n border-radius: var(--u-fab-button-medium-shape-corner, var(--u-shape-corner-extra-large, 28px));\n }\n\n :host([extended]),\n :host([size=medium]) {\n width: var(--u-fab-button-medium-size, 56px);\n border-radius: var(--u-fab-button-medium-shape-corner, var(--u-shape-corner-large, 16px));\n }\n\n :host([size=large]) .icon {\n font-size: var(--u-fab-button-icon-size, 2rem);\n }\n\n :host([extended]) .icon,\n :host([size=small]) .icon,\n :host([size=medium]) .icon {\n font-size: var(--u-fab-button-icon-size, 1.5rem);\n }\n\n :host([extended]) {\n width: auto;\n height: var(--u-extended-fab-button-height, 56px);\n aspect-ratio: auto;\n min-width: var(--u-extended-fab-button-min-width, 80px);\n padding-inline: var(--u-extended-fab-button-padding, 16px 24px);\n }\n\n :host([extended]) .icon {\n margin-inline-end: var(--u-extended-fab-button-icon-margin, 12px);\n }\n\n :host([color=primary]) {\n background-color: var(--u-fab-button-primary-bg-color, var(--u-color-primary-container, rgb(234, 221, 255)));\n color: var(--u-fab-button-primary-text-color, var(--u-color-on-primary-container, rgb(33, 0, 93)));\n }\n\n :host([color=secondary]) {\n background-color: var(--u-fab-button-secondary-bg-color, var(--u-color-secondary-container, rgb(232, 222, 248)));\n color: var(--u-fab-button-secondary-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n }\n\n :host([color=tertiary]) {\n background-color: var(--u-fab-button-tertiary-bg-color, var(--u-color-tertiary-container, rgb(255, 216, 228)));\n color: var(--u-fab-button-tertiary-text-color, var(--u-color-on-tertiary-container, rgb(49, 17, 29)));\n }\n\n :host([color=branded]),\n :host([color=surface]) {\n background-color: var(--u-fab-button-surface-bg-color, var(--u-color-surface-container-high, rgb(236, 230, 240)));\n color: var(--u-fab-button-surface-text-color, var(--_color-primary));\n }\n\n :host([color=branded][lowered]),\n :host([color=surface][lowered]) {\n background-color: var(--u-fab-button-surface-bg-color, var(--u-color-surface-container-low, rgb(247, 242, 250)));\n }\n`"
1043
1364
  }
1044
1365
  ],
1045
1366
  "exports": [
@@ -1048,168 +1369,71 @@
1048
1369
  "name": "styles",
1049
1370
  "declaration": {
1050
1371
  "name": "styles",
1051
- "module": "src/button/button-set.styles.ts"
1372
+ "module": "src/button/fab.styles.ts"
1052
1373
  }
1053
1374
  }
1054
1375
  ]
1055
1376
  },
1056
1377
  {
1057
1378
  "kind": "javascript-module",
1058
- "path": "src/button/button-set.ts",
1379
+ "path": "src/button/fab.ts",
1059
1380
  "declarations": [
1060
1381
  {
1061
1382
  "kind": "class",
1062
1383
  "description": "",
1063
- "name": "UmButtonSet",
1384
+ "name": "UmFab",
1064
1385
  "members": [
1065
1386
  {
1066
1387
  "kind": "field",
1067
- "name": "stack",
1388
+ "name": "color",
1068
1389
  "type": {
1069
- "text": "boolean"
1390
+ "text": "UmFabColor"
1070
1391
  },
1071
- "default": "false",
1072
- "description": "Whether to render the buttons stacked or not",
1073
- "attribute": "stack",
1392
+ "default": "'primary'",
1393
+ "description": "The FAB color variant to render.",
1394
+ "attribute": "color",
1074
1395
  "reflects": true
1075
1396
  },
1076
1397
  {
1077
1398
  "kind": "field",
1078
- "name": "alignment",
1399
+ "name": "size",
1079
1400
  "type": {
1080
- "text": "'start' | 'center' | 'end'"
1401
+ "text": "UmFabSize"
1081
1402
  },
1082
- "default": "'end'",
1083
- "description": "Set the alignment of the set at the `start`, `center` or at the `end`.",
1084
- "attribute": "alignment",
1085
- "reflects": true,
1086
- "inheritedFrom": {
1087
- "name": "UmSetBase",
1088
- "module": "src/shared/sets/set-base.ts"
1089
- }
1090
- }
1091
- ],
1092
- "attributes": [
1403
+ "default": "'medium'",
1404
+ "description": "The size of the FAB.",
1405
+ "attribute": "size",
1406
+ "reflects": true
1407
+ },
1093
1408
  {
1094
- "name": "stack",
1409
+ "kind": "field",
1410
+ "name": "label",
1411
+ "type": {
1412
+ "text": "string | null"
1413
+ },
1414
+ "default": "null",
1415
+ "description": "The text to display the FAB.",
1416
+ "attribute": "label",
1417
+ "reflects": true
1418
+ },
1419
+ {
1420
+ "kind": "field",
1421
+ "name": "lowered",
1095
1422
  "type": {
1096
1423
  "text": "boolean"
1097
1424
  },
1098
1425
  "default": "false",
1099
- "description": "Whether to render the buttons stacked or not",
1100
- "fieldName": "stack"
1426
+ "description": "Lowers the FAB's elevation.",
1427
+ "attribute": "lowered",
1428
+ "reflects": true
1101
1429
  },
1102
1430
  {
1103
- "name": "alignment",
1431
+ "kind": "field",
1432
+ "name": "extended",
1104
1433
  "type": {
1105
- "text": "'start' | 'center' | 'end'"
1434
+ "text": "boolean"
1106
1435
  },
1107
- "default": "'start'",
1108
- "description": "Set the alignment of the set at the `start`, `center` or at the `end`.",
1109
- "fieldName": "alignment",
1110
- "inheritedFrom": {
1111
- "name": "UmSetBase",
1112
- "module": "src/shared/sets/set-base.ts"
1113
- }
1114
- }
1115
- ],
1116
- "superclass": {
1117
- "name": "UmSetBase",
1118
- "module": "/src/shared/sets/set-base.js"
1119
- },
1120
- "tagName": "u-button-set",
1121
- "customElement": true
1122
- }
1123
- ],
1124
- "exports": [
1125
- {
1126
- "kind": "js",
1127
- "name": "UmButtonSet",
1128
- "declaration": {
1129
- "name": "UmButtonSet",
1130
- "module": "src/button/button-set.ts"
1131
- }
1132
- },
1133
- {
1134
- "kind": "custom-element-definition",
1135
- "name": "u-button-set",
1136
- "declaration": {
1137
- "name": "UmButtonSet",
1138
- "module": "src/button/button-set.ts"
1139
- }
1140
- }
1141
- ]
1142
- },
1143
- {
1144
- "kind": "javascript-module",
1145
- "path": "src/button/button.styles.ts",
1146
- "declarations": [
1147
- {
1148
- "kind": "variable",
1149
- "name": "styles",
1150
- "default": "css `\n :host {\n --u-common-button-line-height: var(--u-label-large-line-height, 1.25rem);\n --u-common-button-font-size: var(--u-label-large-font-size, 0.875rem);\n --u-common-button-font-weight: var(--u-font-weight-medium, 500);\n --_common-button-height: var(--u-common-button-height, 2.5rem);\n --_common-button-padding: var(--u-common-button-padding, 24px);\n --_common-button-icon-size: var(--u-common-button-icon-size, 1.125rem);\n --_common-button-icon-padding: var(--u-common-button-icon-padding, 16px);\n --_common-button-icon-margin: var(--u-common-button-icon-margin, 8px);\n border-radius: var(--u-common-button-shape-corner, var(--u-shape-corner-full, 9999px));\n font-family: var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n height: var(--u-common-button-height, 40px);\n font-size: var(--u-common-button-font-size);\n font-weight: var(--u-common-button-font-weight);\n padding-inline: var(--_common-button-padding);\n box-sizing: border-box;\n }\n\n :host([variant=filled]),\n :host([variant=filled][color=primary]) {\n background-color: var(--u-filled-button-primary-container-color, var(--_color-primary));\n color: var(--u-filled-button-primary-text-color, var(--u-color-on-primary, rgb(255, 255, 255)));\n }\n\n :host([variant=filled][color=secondary]) {\n background-color: var(--u-filled-button-secondary-container-color, var(--u-color-secondary, rgb(98, 91, 113)));\n color: var(--u-filled-button-secondary-text-color, var(--u-color-on-secondary, rgb(255, 255, 255)));\n }\n\n :host([variant=filled][color=tertiary]) {\n background-color: var(--u-filled-button-tertiary-container-color, var(--u-color-tertiary, rgb(125, 82, 96)));\n color: var(--u-filled-button-tertiary-text-color, var(--u-color-on-tertiary, rgb(255, 255, 255)));\n }\n\n :host([variant=filled][color=error]) {\n background-color: var(--u-filled-button-error-container-color, var(--u-color-error, rgb(179, 38, 30)));\n color: var(--u-filled-button-error-text-color, var(--u-color-on-error, rgb(255, 255, 255)));\n }\n\n :host([variant=tonal]) {\n background-color: var(--u-tonal-button-bg-color, var(--u-color-secondary-container, rgb(232, 222, 248)));\n color: var(--u-tonal-button-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n }\n\n :host([variant=elevated]) {\n background-color: var(--u-elevated-button-bg-color, var(--u-color-surface-container-low, rgb(247, 242, 250)));\n color: var(--u-tonal-button-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n }\n\n @media (hover: hover) {\n :host([variant=filled]:hover:not(:focus-within):not(:active)),\n :host([variant=tonal]:hover:not(:focus-within):not(:active)) {\n --u-elevation-level: var(--u-filled-button-hover-elevation-level, 1);\n }\n }\n :host([variant=text]) {\n color: var(--u-text-button-text-color, var(--_color-primary));\n }\n\n :host([variant=outlined]) {\n color: var(--u-outlined-button-text-color, var(--u-text-button-text-color, var(--_color-primary)));\n border: 1px solid var(--u-outlined-button-outline-color, var(--u-color-outline, rgb(121, 116, 126)));\n }\n\n :host([variant=elevated]) {\n --u-elevation-level: var(--u-elevated-button-elevation-level, 1);\n color: var(--u-elevated-button-text-color, var(--_color-primary));\n }\n\n :host([disabled][variant=outlined]) {\n background-color: transparent !important;\n border-color: var(--u-outlined-button-disabled-border-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-outlined-button-disabled-border-opacity, 0.12))) !important;\n }\n\n @media (hover: hover) {\n :host([variant=elevated]:hover) {\n --u-elevation-level: var(--u-elevated-button-hover-elevation-level, 2);\n }\n }\n :host([has-icon]) {\n padding-inline: var(--_common-button-icon-padding) var(--_common-button-padding);\n }\n\n :host([has-icon][trailing-icon]) {\n padding-inline: var(--_common-button-padding) var(--_common-button-icon-padding);\n }\n\n :host(:not([has-icon])) .icon {\n display: none;\n }\n\n .icon {\n font-size: var(--_common-button-icon-size);\n margin-inline-end: var(--_common-button-icon-margin);\n }\n\n :host([trailing-icon]) .icon {\n margin-inline: var(--_common-button-icon-margin) 0;\n }\n`"
1151
- }
1152
- ],
1153
- "exports": [
1154
- {
1155
- "kind": "js",
1156
- "name": "styles",
1157
- "declaration": {
1158
- "name": "styles",
1159
- "module": "src/button/button.styles.ts"
1160
- }
1161
- }
1162
- ]
1163
- },
1164
- {
1165
- "kind": "javascript-module",
1166
- "path": "src/button/button.ts",
1167
- "declarations": [
1168
- {
1169
- "kind": "class",
1170
- "description": "",
1171
- "name": "UmButton",
1172
- "members": [
1173
- {
1174
- "kind": "field",
1175
- "name": "variant",
1176
- "type": {
1177
- "text": "UmButtonVariant"
1178
- },
1179
- "default": "'filled'",
1180
- "description": "The Button variant to render",
1181
- "attribute": "variant",
1182
- "reflects": true
1183
- },
1184
- {
1185
- "kind": "field",
1186
- "name": "color",
1187
- "type": {
1188
- "text": "UmButtonColor"
1189
- },
1190
- "description": "The Button color\n\n1",
1191
- "attribute": "color",
1192
- "reflects": true
1193
- },
1194
- {
1195
- "kind": "field",
1196
- "name": "trailingIcon",
1197
- "type": {
1198
- "text": "boolean"
1199
- },
1200
- "default": "false",
1201
- "attribute": "trailing-icon",
1202
- "reflects": true
1203
- },
1204
- {
1205
- "kind": "field",
1206
- "name": "hasIcon",
1207
- "type": {
1208
- "text": "boolean"
1209
- },
1210
- "default": "false",
1211
- "description": "Whether the button has icon or not\n\n_Note:_ Readonly",
1212
- "attribute": "has-icon",
1436
+ "attribute": "extended",
1213
1437
  "reflects": true
1214
1438
  },
1215
1439
  {
@@ -1226,19 +1450,6 @@
1226
1450
  "module": "src/shared/button-wrapper.ts"
1227
1451
  }
1228
1452
  },
1229
- {
1230
- "kind": "method",
1231
- "name": "handleSlotChange",
1232
- "privacy": "private",
1233
- "parameters": [
1234
- {
1235
- "name": "e",
1236
- "type": {
1237
- "text": "Event"
1238
- }
1239
- }
1240
- ]
1241
- },
1242
1453
  {
1243
1454
  "kind": "field",
1244
1455
  "name": "formAssociated",
@@ -1522,38 +1733,47 @@
1522
1733
  ],
1523
1734
  "attributes": [
1524
1735
  {
1525
- "name": "variant",
1736
+ "name": "color",
1526
1737
  "type": {
1527
- "text": "UmButtonVariant"
1738
+ "text": "UmFabColor"
1528
1739
  },
1529
- "default": "'filled'",
1530
- "description": "The Button variant to render",
1531
- "fieldName": "variant"
1740
+ "default": "'primary'",
1741
+ "description": "The FAB color variant to render.",
1742
+ "fieldName": "color"
1532
1743
  },
1533
1744
  {
1534
- "name": "color",
1745
+ "name": "size",
1535
1746
  "type": {
1536
- "text": "UmButtonColor"
1747
+ "text": "UmFabSize"
1537
1748
  },
1538
- "description": "The Button color\n\n1",
1539
- "fieldName": "color"
1749
+ "default": "'medium'",
1750
+ "description": "The size of the FAB.",
1751
+ "fieldName": "size"
1540
1752
  },
1541
1753
  {
1542
- "name": "trailing-icon",
1754
+ "name": "label",
1755
+ "type": {
1756
+ "text": "string | null"
1757
+ },
1758
+ "default": "null",
1759
+ "description": "The text to display the FAB.",
1760
+ "fieldName": "label"
1761
+ },
1762
+ {
1763
+ "name": "lowered",
1543
1764
  "type": {
1544
1765
  "text": "boolean"
1545
1766
  },
1546
1767
  "default": "false",
1547
- "fieldName": "trailingIcon"
1768
+ "description": "Lowers the FAB's elevation.",
1769
+ "fieldName": "lowered"
1548
1770
  },
1549
1771
  {
1550
- "name": "has-icon",
1772
+ "name": "extended",
1551
1773
  "type": {
1552
1774
  "text": "boolean"
1553
1775
  },
1554
- "default": "false",
1555
- "description": "Whether the button has icon or not\n\n_Note:_ Readonly",
1556
- "fieldName": "hasIcon"
1776
+ "fieldName": "extended"
1557
1777
  },
1558
1778
  {
1559
1779
  "name": "type",
@@ -1632,37 +1852,37 @@
1632
1852
  "name": "UmButtonBase",
1633
1853
  "module": "/src/button/button-base.js"
1634
1854
  },
1635
- "tagName": "u-button",
1855
+ "tagName": "u-fab",
1636
1856
  "customElement": true
1637
1857
  }
1638
1858
  ],
1639
1859
  "exports": [
1640
1860
  {
1641
1861
  "kind": "js",
1642
- "name": "UmButton",
1862
+ "name": "UmFab",
1643
1863
  "declaration": {
1644
- "name": "UmButton",
1645
- "module": "src/button/button.ts"
1864
+ "name": "UmFab",
1865
+ "module": "src/button/fab.ts"
1646
1866
  }
1647
1867
  },
1648
1868
  {
1649
1869
  "kind": "custom-element-definition",
1650
- "name": "u-button",
1870
+ "name": "u-fab",
1651
1871
  "declaration": {
1652
- "name": "UmButton",
1653
- "module": "src/button/button.ts"
1872
+ "name": "UmFab",
1873
+ "module": "src/button/fab.ts"
1654
1874
  }
1655
1875
  }
1656
1876
  ]
1657
1877
  },
1658
1878
  {
1659
1879
  "kind": "javascript-module",
1660
- "path": "src/button/fab.styles.ts",
1880
+ "path": "src/button/icon-button.styles.ts",
1661
1881
  "declarations": [
1662
1882
  {
1663
1883
  "kind": "variable",
1664
1884
  "name": "styles",
1665
- "default": "css `\n :host {\n aspect-ratio: 1;\n --u-elevation-level: var(--u-fab-button-elevation-level, 3);\n }\n\n :host([lowered]) {\n --u-elevation-level: var(--u-fab-button-elevation-level, 1);\n }\n\n @media (hover: hover) {\n :host(:hover:not(:focus-within):not(:active)) {\n --u-elevation-level: var(--u-fab-button-hover-elevation-level, 4);\n }\n :host(:hover:not(:focus-within):not(:active)[lowered]) {\n --u-elevation-level: var(--u-fab-button-elevation-level, 2);\n }\n }\n @media (hover: hover) {\n :host(:hover:not(:focus-within):not(:active)) {\n --u-elevation-level: var(--u-fab-button-hover-elevation-level, 4);\n }\n }\n :host([size=small]) {\n width: var(--u-fab-button-small-size, 40px);\n border-radius: var(--u-fab-button-medium-shape-corner, var(--u-shape-corner-medium, 12px));\n }\n\n :host([size=large]) {\n width: var(--u-fab-button-medium-size, 96px);\n border-radius: var(--u-fab-button-medium-shape-corner, var(--u-shape-corner-extra-large, 28px));\n }\n\n :host([extended]),\n :host([size=medium]) {\n width: var(--u-fab-button-medium-size, 56px);\n border-radius: var(--u-fab-button-medium-shape-corner, var(--u-shape-corner-large, 16px));\n }\n\n :host([size=large]) .icon {\n font-size: var(--u-fab-button-icon-size, 2rem);\n }\n\n :host([extended]) .icon,\n :host([size=small]) .icon,\n :host([size=medium]) .icon {\n font-size: var(--u-fab-button-icon-size, 1.5rem);\n }\n\n :host([extended]) {\n width: auto;\n height: var(--u-extended-fab-button-height, 56px);\n aspect-ratio: auto;\n min-width: var(--u-extended-fab-button-min-width, 80px);\n padding-inline: var(--u-extended-fab-button-padding, 16px 24px);\n }\n\n :host([extended]) .icon {\n margin-inline-end: var(--u-extended-fab-button-icon-margin, 12px);\n }\n\n :host([color=primary]) {\n background-color: var(--u-fab-button-primary-bg-color, var(--u-color-primary-container, rgb(234, 221, 255)));\n color: var(--u-fab-button-primary-text-color, var(--u-color-on-primary-container, rgb(33, 0, 93)));\n }\n\n :host([color=secondary]) {\n background-color: var(--u-fab-button-secondary-bg-color, var(--u-color-secondary-container, rgb(232, 222, 248)));\n color: var(--u-fab-button-secondary-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n }\n\n :host([color=tertiary]) {\n background-color: var(--u-fab-button-tertiary-bg-color, var(--u-color-tertiary-container, rgb(255, 216, 228)));\n color: var(--u-fab-button-tertiary-text-color, var(--u-color-on-tertiary-container, rgb(49, 17, 29)));\n }\n\n :host([color=branded]),\n :host([color=surface]) {\n background-color: var(--u-fab-button-surface-bg-color, var(--u-color-surface-container-high, rgb(236, 230, 240)));\n color: var(--u-fab-button-surface-text-color, var(--_color-primary));\n }\n\n :host([color=branded][lowered]),\n :host([color=surface][lowered]) {\n background-color: var(--u-fab-button-surface-bg-color, var(--u-color-surface-container-low, rgb(247, 242, 250)));\n }\n`"
1885
+ "default": "css `\n :host {\n --_icon-button-size: var(--u-icon-button-size, 2.5rem);\n --_color-surface-container-highest: var(--u-color-surface-container-highest, rgb(230, 224, 233));\n width: var(--_icon-button-size);\n height: var(--_icon-button-size);\n border-radius: var(--u-icon-button-shape-corner, 9999px);\n font-family: var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n }\n\n .icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: var(--u-icon-button-icon-size, 1.5rem);\n }\n .icon.icon-selected {\n display: none;\n }\n\n :host([selected][has-selection-icon]) .icon:not(.icon-selected) {\n display: none;\n }\n :host([selected][has-selection-icon]) .icon.icon-selected {\n display: inline-block;\n }\n\n :host([variant=filled]) {\n background-color: var(--u-filled-icon-button-unselected-bg-color, var(--_color-surface-container-highest));\n color: var(--u-filled-icon-button-unselected-text-color, var(--_color-primary));\n }\n\n :host([variant=tonal]) {\n background-color: var(--u-total-icon-button-unselected-bg-color, var(--_color-surface-container-highest));\n color: var(--u-tonal-icon-button-unselected-text-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n }\n\n :host([selected][variant=filled]),\n :host([variant=filled]:not([has-selection-icon])) {\n background-color: var(--u-filled-icon-button-bg-color, var(--_color-primary));\n color: var(--u-filled-icon-button-text-color, var(--u-color-on-primary, rgb(255, 255, 255)));\n }\n\n :host([selected][variant=tonal]),\n :host([variant=tonal]:not([has-selection-icon])) {\n background-color: var(--u-tonal-icon-button-bg-color, var(--u-color-secondary-container, rgb(232, 222, 248)));\n color: var(--u-tonal-icon-button-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n }\n\n :host([variant=standard]),\n :host([variant=outlined]) {\n color: var(--u-standard-icon-button-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n }\n\n :host([variant=outlined]) {\n border: 1px solid var(--u-color-outline, rgb(121, 116, 126));\n color: var(--u-outlined-icon-button-color, var(--u-standard-icon-button-color, var(--u-color-on-surface-variant, rgb(73, 69, 79))));\n }\n\n :host([selected][variant=outlined]) {\n border: none;\n background-color: var(--u-outlined-icon-button-selected-bg-color, var(--u-color-inverse-surface, rgb(50, 47, 53)));\n color: var(--u-outlined-icon-button-selected-text-color, var(--u-color-on-inverse-surface, rgb(245, 239, 247)));\n }\n\n :host([selected][variant=standard]) {\n color: var(--u-standard-icon-button-selected-text-color, var(--_color-primary));\n background-color: var(--u-standard-icon-button-selected-bg-color, transparent);\n }\n\n :host([disabled][variant=outlined]) {\n background-color: transparent !important;\n border-color: var(--u-outlined-icon-button-disabled-border-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-outlined-icon-button-disabled-border-opacity, 0.12))) !important;\n }\n`"
1666
1886
  }
1667
1887
  ],
1668
1888
  "exports": [
@@ -1671,72 +1891,78 @@
1671
1891
  "name": "styles",
1672
1892
  "declaration": {
1673
1893
  "name": "styles",
1674
- "module": "src/button/fab.styles.ts"
1894
+ "module": "src/button/icon-button.styles.ts"
1675
1895
  }
1676
1896
  }
1677
1897
  ]
1678
1898
  },
1679
1899
  {
1680
1900
  "kind": "javascript-module",
1681
- "path": "src/button/fab.ts",
1901
+ "path": "src/button/icon-button.ts",
1682
1902
  "declarations": [
1683
1903
  {
1684
1904
  "kind": "class",
1685
1905
  "description": "",
1686
- "name": "UmFab",
1906
+ "name": "UmIconButton",
1687
1907
  "members": [
1688
1908
  {
1689
1909
  "kind": "field",
1690
- "name": "color",
1910
+ "name": "variant",
1691
1911
  "type": {
1692
- "text": "UmFabColor"
1912
+ "text": "UmIconButtonVariant"
1693
1913
  },
1694
- "default": "'primary'",
1695
- "description": "The FAB color variant to render.",
1696
- "attribute": "color",
1914
+ "default": "'standard'",
1915
+ "attribute": "variant",
1697
1916
  "reflects": true
1698
1917
  },
1699
1918
  {
1700
1919
  "kind": "field",
1701
- "name": "size",
1920
+ "name": "toggle",
1702
1921
  "type": {
1703
- "text": "UmFabSize"
1922
+ "text": "boolean"
1704
1923
  },
1705
- "default": "'medium'",
1706
- "description": "The size of the FAB.",
1707
- "attribute": "size",
1708
- "reflects": true
1924
+ "default": "false",
1925
+ "description": "When true, the button will toggle between selected and unselected\nstates",
1926
+ "attribute": "toggle"
1709
1927
  },
1710
1928
  {
1711
1929
  "kind": "field",
1712
- "name": "label",
1930
+ "name": "hasSelectionIcon",
1713
1931
  "type": {
1714
- "text": "string | null"
1932
+ "text": "boolean"
1715
1933
  },
1716
- "default": "null",
1717
- "description": "The text to display the FAB.",
1718
- "attribute": "label",
1934
+ "default": "false",
1935
+ "attribute": "has-selection-icon",
1719
1936
  "reflects": true
1720
1937
  },
1721
1938
  {
1722
1939
  "kind": "field",
1723
- "name": "lowered",
1940
+ "name": "selected",
1724
1941
  "type": {
1725
1942
  "text": "boolean"
1726
1943
  },
1727
1944
  "default": "false",
1728
- "description": "Lowers the FAB's elevation.",
1729
- "attribute": "lowered",
1945
+ "description": "Sets the selected state. When false, displays the default icon. When true,\ndisplays the selected icon, or the default icon If no `slot=\"selected\"`\nicon is provided.",
1946
+ "attribute": "selected",
1730
1947
  "reflects": true
1731
1948
  },
1732
1949
  {
1733
1950
  "kind": "field",
1734
- "name": "extended",
1951
+ "name": "ariaLabelSelected",
1735
1952
  "type": {
1736
- "text": "boolean"
1953
+ "text": "string"
1737
1954
  },
1738
- "attribute": "extended",
1739
- "reflects": true
1955
+ "default": "''",
1956
+ "description": "The `aria-label` of the button when the button is toggleable and selected.",
1957
+ "attribute": "aria-label-selected"
1958
+ },
1959
+ {
1960
+ "kind": "field",
1961
+ "name": "selectedIcons",
1962
+ "type": {
1963
+ "text": "HTMLElement[]"
1964
+ },
1965
+ "privacy": "private"
1740
1966
  },
1741
1967
  {
1742
1968
  "kind": "method",
@@ -1753,20 +1979,61 @@
1753
1979
  }
1754
1980
  },
1755
1981
  {
1756
- "kind": "field",
1757
- "name": "formAssociated",
1758
- "type": {
1759
- "text": "boolean"
1982
+ "kind": "method",
1983
+ "name": "handleClick",
1984
+ "privacy": "protected",
1985
+ "return": {
1986
+ "type": {
1987
+ "text": "void"
1988
+ }
1760
1989
  },
1761
- "static": true,
1762
- "default": "true",
1990
+ "parameters": [
1991
+ {
1992
+ "name": "event",
1993
+ "type": {
1994
+ "text": "UIEvent"
1995
+ }
1996
+ }
1997
+ ],
1763
1998
  "inheritedFrom": {
1764
- "name": "UmButtonBase",
1765
- "module": "src/button/button-base.ts"
1999
+ "name": "UmButtonWrapper",
2000
+ "module": "src/shared/button-wrapper.ts"
1766
2001
  }
1767
2002
  },
1768
2003
  {
1769
- "kind": "field",
2004
+ "kind": "method",
2005
+ "name": "getAriaLabel",
2006
+ "privacy": "protected",
2007
+ "return": {
2008
+ "type": {
2009
+ "text": "string | null"
2010
+ }
2011
+ },
2012
+ "inheritedFrom": {
2013
+ "name": "UmButtonWrapper",
2014
+ "module": "src/shared/button-wrapper.ts"
2015
+ }
2016
+ },
2017
+ {
2018
+ "kind": "method",
2019
+ "name": "handleSlotChange",
2020
+ "privacy": "private"
2021
+ },
2022
+ {
2023
+ "kind": "field",
2024
+ "name": "formAssociated",
2025
+ "type": {
2026
+ "text": "boolean"
2027
+ },
2028
+ "static": true,
2029
+ "default": "true",
2030
+ "inheritedFrom": {
2031
+ "name": "UmButtonBase",
2032
+ "module": "src/button/button-base.ts"
2033
+ }
2034
+ },
2035
+ {
2036
+ "kind": "field",
1770
2037
  "name": "type",
1771
2038
  "type": {
1772
2039
  "text": "string"
@@ -1815,28 +2082,6 @@
1815
2082
  "module": "src/button/button-base.ts"
1816
2083
  }
1817
2084
  },
1818
- {
1819
- "kind": "method",
1820
- "name": "handleClick",
1821
- "privacy": "protected",
1822
- "return": {
1823
- "type": {
1824
- "text": "void"
1825
- }
1826
- },
1827
- "parameters": [
1828
- {
1829
- "name": "_",
1830
- "type": {
1831
- "text": "UIEvent"
1832
- }
1833
- }
1834
- ],
1835
- "inheritedFrom": {
1836
- "name": "UmButtonWrapper",
1837
- "module": "src/shared/button-wrapper.ts"
1838
- }
1839
- },
1840
2085
  {
1841
2086
  "kind": "field",
1842
2087
  "name": "disabled",
@@ -1983,20 +2228,6 @@
1983
2228
  "module": "src/shared/button-wrapper.ts"
1984
2229
  }
1985
2230
  },
1986
- {
1987
- "kind": "method",
1988
- "name": "getAriaLabel",
1989
- "privacy": "protected",
1990
- "return": {
1991
- "type": {
1992
- "text": "string | null"
1993
- }
1994
- },
1995
- "inheritedFrom": {
1996
- "name": "UmButtonWrapper",
1997
- "module": "src/shared/button-wrapper.ts"
1998
- }
1999
- },
2000
2231
  {
2001
2232
  "kind": "method",
2002
2233
  "name": "innerFocusHandler",
@@ -2033,49 +2264,57 @@
2033
2264
  }
2034
2265
  }
2035
2266
  ],
2267
+ "events": [
2268
+ {
2269
+ "name": "change",
2270
+ "type": {
2271
+ "text": "Event"
2272
+ }
2273
+ }
2274
+ ],
2036
2275
  "attributes": [
2037
2276
  {
2038
- "name": "color",
2277
+ "name": "variant",
2039
2278
  "type": {
2040
- "text": "UmFabColor"
2279
+ "text": "UmIconButtonVariant"
2041
2280
  },
2042
- "default": "'primary'",
2043
- "description": "The FAB color variant to render.",
2044
- "fieldName": "color"
2281
+ "default": "'standard'",
2282
+ "fieldName": "variant"
2045
2283
  },
2046
2284
  {
2047
- "name": "size",
2285
+ "name": "toggle",
2048
2286
  "type": {
2049
- "text": "UmFabSize"
2287
+ "text": "boolean"
2050
2288
  },
2051
- "default": "'medium'",
2052
- "description": "The size of the FAB.",
2053
- "fieldName": "size"
2289
+ "default": "false",
2290
+ "description": "When true, the button will toggle between selected and unselected\nstates",
2291
+ "fieldName": "toggle"
2054
2292
  },
2055
2293
  {
2056
- "name": "label",
2294
+ "name": "has-selection-icon",
2057
2295
  "type": {
2058
- "text": "string | null"
2296
+ "text": "boolean"
2059
2297
  },
2060
- "default": "null",
2061
- "description": "The text to display the FAB.",
2062
- "fieldName": "label"
2298
+ "default": "false",
2299
+ "fieldName": "hasSelectionIcon"
2063
2300
  },
2064
2301
  {
2065
- "name": "lowered",
2302
+ "name": "selected",
2066
2303
  "type": {
2067
2304
  "text": "boolean"
2068
2305
  },
2069
2306
  "default": "false",
2070
- "description": "Lowers the FAB's elevation.",
2071
- "fieldName": "lowered"
2307
+ "description": "Sets the selected state. When false, displays the default icon. When true,\ndisplays the selected icon, or the default icon If no `slot=\"selected\"`\nicon is provided.",
2308
+ "fieldName": "selected"
2072
2309
  },
2073
2310
  {
2074
- "name": "extended",
2311
+ "name": "aria-label-selected",
2075
2312
  "type": {
2076
- "text": "boolean"
2313
+ "text": "string"
2077
2314
  },
2078
- "fieldName": "extended"
2315
+ "default": "''",
2316
+ "description": "The `aria-label` of the button when the button is toggleable and selected.",
2317
+ "fieldName": "ariaLabelSelected"
2079
2318
  },
2080
2319
  {
2081
2320
  "name": "type",
@@ -2154,37 +2393,37 @@
2154
2393
  "name": "UmButtonBase",
2155
2394
  "module": "/src/button/button-base.js"
2156
2395
  },
2157
- "tagName": "u-fab",
2396
+ "tagName": "u-icon-button",
2158
2397
  "customElement": true
2159
2398
  }
2160
2399
  ],
2161
2400
  "exports": [
2162
2401
  {
2163
2402
  "kind": "js",
2164
- "name": "UmFab",
2403
+ "name": "UmIconButton",
2165
2404
  "declaration": {
2166
- "name": "UmFab",
2167
- "module": "src/button/fab.ts"
2405
+ "name": "UmIconButton",
2406
+ "module": "src/button/icon-button.ts"
2168
2407
  }
2169
2408
  },
2170
2409
  {
2171
2410
  "kind": "custom-element-definition",
2172
- "name": "u-fab",
2411
+ "name": "u-icon-button",
2173
2412
  "declaration": {
2174
- "name": "UmFab",
2175
- "module": "src/button/fab.ts"
2413
+ "name": "UmIconButton",
2414
+ "module": "src/button/icon-button.ts"
2176
2415
  }
2177
2416
  }
2178
2417
  ]
2179
2418
  },
2180
2419
  {
2181
2420
  "kind": "javascript-module",
2182
- "path": "src/button/icon-button.styles.ts",
2421
+ "path": "src/app-bar/top-app-bar.styles.ts",
2183
2422
  "declarations": [
2184
2423
  {
2185
2424
  "kind": "variable",
2186
2425
  "name": "styles",
2187
- "default": "css `\n :host {\n --_icon-button-size: var(--u-icon-button-size, 2.5rem);\n --_color-surface-container-highest: var(--u-color-surface-container-highest, rgb(230, 224, 233));\n width: var(--_icon-button-size);\n height: var(--_icon-button-size);\n border-radius: var(--u-icon-button-shape-corner, 9999px);\n font-family: var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n }\n\n .icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: var(--u-icon-button-icon-size, 1.5rem);\n }\n .icon.icon-selected {\n display: none;\n }\n\n :host([selected][has-selection-icon]) .icon:not(.icon-selected) {\n display: none;\n }\n :host([selected][has-selection-icon]) .icon.icon-selected {\n display: inline-block;\n }\n\n :host([variant=filled]) {\n background-color: var(--u-filled-icon-button-unselected-bg-color, var(--_color-surface-container-highest));\n color: var(--u-filled-icon-button-unselected-text-color, var(--_color-primary));\n }\n\n :host([variant=tonal]) {\n background-color: var(--u-total-icon-button-unselected-bg-color, var(--_color-surface-container-highest));\n color: var(--u-tonal-icon-button-unselected-text-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n }\n\n :host([selected][variant=filled]),\n :host([variant=filled]:not([has-selection-icon])) {\n background-color: var(--u-filled-icon-button-bg-color, var(--_color-primary));\n color: var(--u-filled-icon-button-text-color, var(--u-color-on-primary, rgb(255, 255, 255)));\n }\n\n :host([selected][variant=tonal]),\n :host([variant=tonal]:not([has-selection-icon])) {\n background-color: var(--u-tonal-icon-button-bg-color, var(--u-color-secondary-container, rgb(232, 222, 248)));\n color: var(--u-tonal-icon-button-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n }\n\n :host([variant=standard]),\n :host([variant=outlined]) {\n color: var(--u-standard-icon-button-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n }\n\n :host([variant=outlined]) {\n border: 1px solid var(--u-color-outline, rgb(121, 116, 126));\n color: var(--u-outlined-icon-button-color, var(--u-standard-icon-button-color, var(--u-color-on-surface-variant, rgb(73, 69, 79))));\n }\n\n :host([selected][variant=outlined]) {\n border: none;\n background-color: var(--u-outlined-icon-button-selected-bg-color, var(--u-color-inverse-surface, rgb(50, 47, 53)));\n color: var(--u-outlined-icon-button-selected-text-color, var(--u-color-on-inverse-surface, rgb(245, 239, 247)));\n }\n\n :host([selected][variant=standard]) {\n color: var(--u-standard-icon-button-selected-text-color, var(--_color-primary));\n background-color: var(--u-standard-icon-button-selected-bg-color, transparent);\n }\n\n :host([disabled][variant=outlined]) {\n background-color: transparent !important;\n border-color: var(--u-outlined-icon-button-disabled-border-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-outlined-icon-button-disabled-border-opacity, 0.12))) !important;\n }\n`"
2426
+ "default": "css `\n :host {\n display: block;\n background-color: var(--u-top-app-bar-bg-color, var(--u-color-body, var(--u-color-surface, rgb(254, 247, 255))));\n color: var(--u-top-app-bar-text-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n transition: background-color 100ms, inset 375ms cubic-bezier(0.19, 1, 0.22, 1);\n }\n\n :host([container-scrolled]) {\n background-color: var(--u-top-app-bar-constrast-bg-color, var(--u-color-surface-container, rgb(243, 237, 247)));\n }\n\n :host(:not([has-leading-icon])) .leading-icon {\n display: none;\n }\n\n :host(:not([has-trailing-icon])) .trailing-icon {\n display: none;\n }\n\n slot[name=leading-icon],\n slot[name=trailing-icon] {\n display: inline-flex;\n align-items: center;\n gap: var(--u-top-app-bar-icons-gap, 8px);\n }\n\n slot[name=leading-icon]::slotted(u-icon-button) {\n color: inherit;\n }\n\n :host([position=absolute]) .container {\n position: absolute;\n }\n\n :host([position=fixed]) .container {\n position: fixed;\n inset-inline: 0;\n inset-block-start: 0;\n inset-inline-start: var(--u-app-bar-offset, 0);\n }\n\n :host([position=absolute]),\n :host([position=fixed]) {\n padding-top: var(--_content-height);\n }\n :host([position=absolute]) .container,\n :host([position=fixed]) .container {\n z-index: var(--u-fixed-app-bar-z-index, 1010);\n }\n\n .extended-content {\n display: flex;\n align-items: flex-end;\n padding-inline: var(--u-extended-content-inline-padding, 16px);\n }\n\n :host([size=medium]) .extended-content {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-extended-content-medium-line-height, var(--u-headline-s-line-height, 2rem));\n font-size: var(--u-extended-content-medium-font-size, var(--u-headline-s-font-size, 1.5rem));\n letter-spacing: var(--u-extended-content-medium-letter-spacing, var(--u-headline-s-letter-spacing, 0rem));\n font-weight: var(--u-extended-content-medium-font-weight, var(--u-headline-s-font-weight, var(--u-font-weight-regular, 400)));\n height: var(--u-extended-content-medium-height, 3.5rem);\n padding-bottom: var(--u-extended-content-medium-padding-bottom, 24px);\n }\n\n :host([size=large]) .extended-content {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-extended-content-large-line-height, var(--u-headline-m-line-height, 2.25rem));\n font-size: var(--u-extended-content-large-font-size, var(--u-headline-m-font-size, 1.75rem));\n letter-spacing: var(--u-extended-content-large-letter-spacing, var(--u-headline-m-letter-spacing, 0rem));\n font-weight: var(--u-extended-content-large-font-weight, var(--u-headline-m-font-weight, var(--u-font-weight-regular, 400)));\n height: var(--u-extended-content-medium-large, 6rem);\n padding-bottom: var(--u-extended-content-large-padding-bottom, 28px);\n }\n\n .container {\n background: inherit;\n }\n\n .content {\n display: flex;\n align-items: center;\n background-color: inherit;\n transition: inherit;\n min-height: var(--u-top-app-bar-min-height, 56px);\n }\n @media (min-width: 840px) {\n .content {\n min-height: var(--u-top-app-bar-extended-min-height, 64px);\n }\n }\n\n .headline {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-top-app-bar-headline-line-height, var(--u-title-l-line-height, 1.75rem));\n font-size: var(--u-top-app-bar-headline-font-size, var(--u-title-l-font-size, 1.375rem));\n letter-spacing: var(--u-top-app-bar-headline-letter-spacing, var(--u-title-l-letter-spacing, 0rem));\n font-weight: var(--u-top-app-bar-headline-font-weight, var(--u-title-l-font-weight, var(--u-font-weight-regular, 400)));\n margin-inline: var(--u-headline-margin, 16px);\n }\n :host([has-leading-icon]) .headline {\n margin-inline-start: 0;\n }\n\n .leading-icon {\n margin-inline: var(--u-leading-icon-margin, 8px);\n }\n\n .trailing-icon {\n padding-inline: var(--u-trailing-icon-margin, 8px);\n margin-inline-start: auto;\n }\n`"
2188
2427
  }
2189
2428
  ],
2190
2429
  "exports": [
@@ -2193,926 +2432,469 @@
2193
2432
  "name": "styles",
2194
2433
  "declaration": {
2195
2434
  "name": "styles",
2196
- "module": "src/button/icon-button.styles.ts"
2435
+ "module": "src/app-bar/top-app-bar.styles.ts"
2197
2436
  }
2198
2437
  }
2199
2438
  ]
2200
2439
  },
2201
2440
  {
2202
2441
  "kind": "javascript-module",
2203
- "path": "src/button/icon-button.ts",
2442
+ "path": "src/app-bar/top-app-bar.ts",
2204
2443
  "declarations": [
2205
2444
  {
2206
2445
  "kind": "class",
2207
2446
  "description": "",
2208
- "name": "UmIconButton",
2447
+ "name": "UmTopAppBar",
2209
2448
  "members": [
2210
2449
  {
2211
2450
  "kind": "field",
2212
- "name": "variant",
2451
+ "name": "hasLeadingIcon",
2213
2452
  "type": {
2214
- "text": "UmIconButtonVariant"
2453
+ "text": "boolean"
2215
2454
  },
2216
- "default": "'standard'",
2217
- "attribute": "variant",
2455
+ "default": "false",
2456
+ "description": "Whether the app bar has leading icon or not\n\n_Note:_ Readonly",
2457
+ "attribute": "has-leading-icon",
2218
2458
  "reflects": true
2219
2459
  },
2220
2460
  {
2221
2461
  "kind": "field",
2222
- "name": "toggle",
2462
+ "name": "hasTrailingIcon",
2223
2463
  "type": {
2224
2464
  "text": "boolean"
2225
2465
  },
2226
2466
  "default": "false",
2227
- "description": "When true, the button will toggle between selected and unselected\nstates",
2228
- "attribute": "toggle"
2467
+ "description": "Whether the app bar has trailing icon or not\n\n_Note:_ Readonly",
2468
+ "attribute": "has-trailing-icon",
2469
+ "reflects": true
2229
2470
  },
2230
2471
  {
2231
2472
  "kind": "field",
2232
- "name": "hasSelectionIcon",
2473
+ "name": "position",
2233
2474
  "type": {
2234
- "text": "boolean"
2475
+ "text": "'fixed' | 'absolute' | 'static'"
2235
2476
  },
2236
- "default": "false",
2237
- "attribute": "has-selection-icon",
2477
+ "default": "'fixed'",
2478
+ "attribute": "position",
2238
2479
  "reflects": true
2239
2480
  },
2240
2481
  {
2241
2482
  "kind": "field",
2242
- "name": "selected",
2483
+ "name": "size",
2243
2484
  "type": {
2244
- "text": "boolean"
2485
+ "text": "'small' | 'medium' | 'large'"
2245
2486
  },
2246
- "default": "false",
2247
- "description": "Sets the selected state. When false, displays the default icon. When true,\ndisplays the selected icon, or the default icon If no `slot=\"selected\"`\nicon is provided.",
2248
- "attribute": "selected",
2487
+ "default": "'small'",
2488
+ "attribute": "size",
2249
2489
  "reflects": true
2250
2490
  },
2251
2491
  {
2252
2492
  "kind": "field",
2253
- "name": "ariaLabelSelected",
2493
+ "name": "headline",
2254
2494
  "type": {
2255
2495
  "text": "string"
2256
2496
  },
2257
2497
  "default": "''",
2258
- "description": "The `aria-label` of the button when the button is toggleable and selected.",
2259
- "attribute": "aria-label-selected"
2498
+ "attribute": "headline"
2260
2499
  },
2261
2500
  {
2262
2501
  "kind": "field",
2263
- "name": "selectedIcons",
2502
+ "name": "scrollContainer",
2264
2503
  "type": {
2265
- "text": "HTMLElement[]"
2504
+ "text": "'none' | 'window' | string | undefined"
2266
2505
  },
2267
- "privacy": "private"
2506
+ "attribute": "scrollContainer",
2507
+ "reflects": true
2268
2508
  },
2269
2509
  {
2270
- "kind": "method",
2271
- "name": "renderContent",
2272
- "privacy": "protected",
2273
- "return": {
2274
- "type": {
2275
- "text": "HTMLTemplateResult"
2276
- }
2510
+ "kind": "field",
2511
+ "name": "containerScrolled",
2512
+ "type": {
2513
+ "text": "boolean"
2277
2514
  },
2278
- "inheritedFrom": {
2279
- "name": "UmButtonWrapper",
2280
- "module": "src/shared/button-wrapper.ts"
2281
- }
2515
+ "default": "false",
2516
+ "attribute": "container-scrolled",
2517
+ "reflects": true
2282
2518
  },
2283
2519
  {
2284
- "kind": "method",
2285
- "name": "handleClick",
2286
- "privacy": "protected",
2287
- "return": {
2288
- "type": {
2289
- "text": "void"
2290
- }
2520
+ "kind": "field",
2521
+ "name": "assignedLeadingIcons",
2522
+ "type": {
2523
+ "text": "HTMLElement[]"
2291
2524
  },
2292
- "parameters": [
2293
- {
2294
- "name": "event",
2295
- "type": {
2296
- "text": "UIEvent"
2297
- }
2298
- }
2299
- ],
2300
- "inheritedFrom": {
2301
- "name": "UmButtonWrapper",
2302
- "module": "src/shared/button-wrapper.ts"
2303
- }
2525
+ "privacy": "private"
2304
2526
  },
2305
2527
  {
2306
- "kind": "method",
2307
- "name": "getAriaLabel",
2308
- "privacy": "protected",
2309
- "return": {
2310
- "type": {
2311
- "text": "string | null"
2312
- }
2528
+ "kind": "field",
2529
+ "name": "assignedTrailingIcons",
2530
+ "type": {
2531
+ "text": "HTMLElement[]"
2313
2532
  },
2314
- "inheritedFrom": {
2315
- "name": "UmButtonWrapper",
2316
- "module": "src/shared/button-wrapper.ts"
2317
- }
2533
+ "privacy": "private"
2318
2534
  },
2319
2535
  {
2320
- "kind": "method",
2321
- "name": "handleSlotChange",
2536
+ "kind": "field",
2537
+ "name": "_container",
2538
+ "type": {
2539
+ "text": "HTMLElement"
2540
+ },
2322
2541
  "privacy": "private"
2323
2542
  },
2324
2543
  {
2325
2544
  "kind": "field",
2326
- "name": "formAssociated",
2327
- "type": {
2328
- "text": "boolean"
2329
- },
2330
- "static": true,
2331
- "default": "true",
2332
- "inheritedFrom": {
2333
- "name": "UmButtonBase",
2334
- "module": "src/button/button-base.ts"
2335
- }
2336
- },
2337
- {
2338
- "kind": "field",
2339
- "name": "type",
2340
- "type": {
2341
- "text": "string"
2342
- },
2343
- "default": "'submit'",
2344
- "attribute": "type",
2345
- "inheritedFrom": {
2346
- "name": "UmButtonBase",
2347
- "module": "src/button/button-base.ts"
2348
- }
2349
- },
2350
- {
2351
- "kind": "field",
2352
- "name": "value",
2353
- "type": {
2354
- "text": "string"
2355
- },
2356
- "default": "''",
2357
- "attribute": "value",
2358
- "reflects": true,
2359
- "inheritedFrom": {
2360
- "name": "UmButtonBase",
2361
- "module": "src/button/button-base.ts"
2362
- }
2363
- },
2364
- {
2365
- "kind": "field",
2366
- "name": "form",
2367
- "type": {
2368
- "text": "HTMLFormElement | null"
2369
- },
2370
- "inheritedFrom": {
2371
- "name": "UmButtonBase",
2372
- "module": "src/button/button-base.ts"
2373
- }
2374
- },
2375
- {
2376
- "kind": "field",
2377
- "name": "#elementInternals",
2378
- "privacy": "private",
2379
- "type": {
2380
- "text": "ElementInternals"
2381
- },
2382
- "inheritedFrom": {
2383
- "name": "UmButtonBase",
2384
- "module": "src/button/button-base.ts"
2385
- }
2386
- },
2387
- {
2388
- "kind": "field",
2389
- "name": "disabled",
2390
- "type": {
2391
- "text": "boolean"
2392
- },
2393
- "default": "false",
2394
- "description": "Whether the button is disabled or not.",
2395
- "attribute": "disabled",
2396
- "reflects": true,
2397
- "inheritedFrom": {
2398
- "name": "UmButtonWrapper",
2399
- "module": "src/shared/button-wrapper.ts"
2400
- }
2401
- },
2402
- {
2403
- "kind": "field",
2404
- "name": "renderRipple",
2405
- "type": {
2406
- "text": "boolean"
2407
- },
2408
- "default": "true",
2409
- "inheritedFrom": {
2410
- "name": "UmButtonWrapper",
2411
- "module": "src/shared/button-wrapper.ts"
2412
- }
2413
- },
2414
- {
2415
- "kind": "field",
2416
- "name": "href",
2417
- "type": {
2418
- "text": "string | undefined"
2419
- },
2420
- "description": "The URL that the link button points to.",
2421
- "attribute": "href",
2422
- "inheritedFrom": {
2423
- "name": "UmButtonWrapper",
2424
- "module": "src/shared/button-wrapper.ts"
2425
- }
2426
- },
2427
- {
2428
- "kind": "field",
2429
- "name": "target",
2430
- "type": {
2431
- "text": "string | undefined"
2432
- },
2433
- "description": "Where to display the linked `href` URL for a link button. Common options\ninclude `_blank` to open in a new tab.",
2434
- "attribute": "target",
2435
- "inheritedFrom": {
2436
- "name": "UmButtonWrapper",
2437
- "module": "src/shared/button-wrapper.ts"
2438
- }
2439
- },
2440
- {
2441
- "kind": "field",
2442
- "name": "name",
2443
- "type": {
2444
- "text": "string | undefined"
2445
- },
2446
- "attribute": "name",
2447
- "inheritedFrom": {
2448
- "name": "UmButtonWrapper",
2449
- "module": "src/shared/button-wrapper.ts"
2450
- }
2451
- },
2452
- {
2453
- "kind": "field",
2454
- "name": "buttonElement",
2545
+ "name": "_extendedContent",
2455
2546
  "type": {
2456
2547
  "text": "HTMLElement"
2457
- },
2458
- "inheritedFrom": {
2459
- "name": "UmButtonWrapper",
2460
- "module": "src/shared/button-wrapper.ts"
2461
- }
2462
- },
2463
- {
2464
- "kind": "field",
2465
- "name": "ripple",
2466
- "type": {
2467
- "text": "UmRipple"
2468
- },
2469
- "privacy": "private",
2470
- "inheritedFrom": {
2471
- "name": "UmButtonWrapper",
2472
- "module": "src/shared/button-wrapper.ts"
2473
- }
2474
- },
2475
- {
2476
- "kind": "field",
2477
- "name": "innerRole",
2478
- "type": {
2479
- "text": "string | null"
2480
- },
2481
- "privacy": "protected",
2482
- "default": "null",
2483
- "inheritedFrom": {
2484
- "name": "UmButtonWrapper",
2485
- "module": "src/shared/button-wrapper.ts"
2486
- }
2487
- },
2488
- {
2489
- "kind": "field",
2490
- "name": "pathname",
2491
- "type": {
2492
- "text": "string"
2493
- },
2494
- "inheritedFrom": {
2495
- "name": "UmButtonWrapper",
2496
- "module": "src/shared/button-wrapper.ts"
2497
- }
2498
- },
2499
- {
2500
- "kind": "method",
2501
- "name": "renderButton",
2502
- "privacy": "private",
2503
- "inheritedFrom": {
2504
- "name": "UmButtonWrapper",
2505
- "module": "src/shared/button-wrapper.ts"
2506
- }
2507
- },
2508
- {
2509
- "kind": "method",
2510
- "name": "renderLink",
2511
- "privacy": "private",
2512
- "inheritedFrom": {
2513
- "name": "UmButtonWrapper",
2514
- "module": "src/shared/button-wrapper.ts"
2515
- }
2516
- },
2517
- {
2518
- "kind": "method",
2519
- "name": "focus",
2520
- "inheritedFrom": {
2521
- "name": "UmButtonWrapper",
2522
- "module": "src/shared/button-wrapper.ts"
2523
- }
2524
- },
2525
- {
2526
- "kind": "method",
2527
- "name": "blur",
2528
- "inheritedFrom": {
2529
- "name": "UmButtonWrapper",
2530
- "module": "src/shared/button-wrapper.ts"
2531
- }
2532
- },
2533
- {
2534
- "kind": "method",
2535
- "name": "innerFocusHandler",
2536
- "privacy": "private",
2537
- "return": {
2538
- "type": {
2539
- "text": "void"
2540
- }
2541
- },
2542
- "inheritedFrom": {
2543
- "name": "UmButtonWrapper",
2544
- "module": "src/shared/button-wrapper.ts"
2545
- }
2546
- },
2547
- {
2548
- "kind": "method",
2549
- "name": "#innerClickHandler",
2550
- "return": {
2551
- "type": {
2552
- "text": "void"
2553
- }
2554
- },
2555
- "parameters": [
2556
- {
2557
- "name": "event",
2558
- "type": {
2559
- "text": "MouseEvent"
2560
- }
2561
- }
2562
- ],
2563
- "inheritedFrom": {
2564
- "name": "UmButtonWrapper",
2565
- "module": "src/shared/button-wrapper.ts"
2566
- }
2567
- }
2568
- ],
2569
- "events": [
2570
- {
2571
- "name": "change",
2572
- "type": {
2573
- "text": "Event"
2574
- }
2575
- }
2576
- ],
2577
- "attributes": [
2578
- {
2579
- "name": "variant",
2580
- "type": {
2581
- "text": "UmIconButtonVariant"
2582
- },
2583
- "default": "'standard'",
2584
- "fieldName": "variant"
2585
- },
2586
- {
2587
- "name": "toggle",
2588
- "type": {
2589
- "text": "boolean"
2590
- },
2591
- "default": "false",
2592
- "description": "When true, the button will toggle between selected and unselected\nstates",
2593
- "fieldName": "toggle"
2594
- },
2595
- {
2596
- "name": "has-selection-icon",
2597
- "type": {
2598
- "text": "boolean"
2599
- },
2600
- "default": "false",
2601
- "fieldName": "hasSelectionIcon"
2602
- },
2603
- {
2604
- "name": "selected",
2605
- "type": {
2606
- "text": "boolean"
2607
- },
2608
- "default": "false",
2609
- "description": "Sets the selected state. When false, displays the default icon. When true,\ndisplays the selected icon, or the default icon If no `slot=\"selected\"`\nicon is provided.",
2610
- "fieldName": "selected"
2611
- },
2612
- {
2613
- "name": "aria-label-selected",
2614
- "type": {
2615
- "text": "string"
2616
- },
2617
- "default": "''",
2618
- "description": "The `aria-label` of the button when the button is toggleable and selected.",
2619
- "fieldName": "ariaLabelSelected"
2620
- },
2621
- {
2622
- "name": "type",
2623
- "type": {
2624
- "text": "string"
2625
- },
2626
- "default": "'submit'",
2627
- "fieldName": "type",
2628
- "inheritedFrom": {
2629
- "name": "UmButtonBase",
2630
- "module": "src/button/button-base.ts"
2631
- }
2632
- },
2633
- {
2634
- "name": "value",
2635
- "type": {
2636
- "text": "string"
2637
- },
2638
- "default": "''",
2639
- "fieldName": "value",
2640
- "inheritedFrom": {
2641
- "name": "UmButtonBase",
2642
- "module": "src/button/button-base.ts"
2643
- }
2644
- },
2645
- {
2646
- "name": "disabled",
2647
- "type": {
2648
- "text": "boolean"
2649
- },
2650
- "default": "false",
2651
- "description": "Whether the button is disabled or not.",
2652
- "fieldName": "disabled",
2653
- "inheritedFrom": {
2654
- "name": "UmButtonWrapper",
2655
- "module": "src/shared/button-wrapper.ts"
2656
- }
2657
- },
2658
- {
2659
- "name": "href",
2660
- "type": {
2661
- "text": "string | undefined"
2662
- },
2663
- "description": "The URL that the link button points to.",
2664
- "fieldName": "href",
2665
- "inheritedFrom": {
2666
- "name": "UmButtonWrapper",
2667
- "module": "src/shared/button-wrapper.ts"
2668
- }
2669
- },
2670
- {
2671
- "name": "target",
2672
- "type": {
2673
- "text": "string | undefined"
2674
- },
2675
- "description": "Where to display the linked `href` URL for a link button. Common options\ninclude `_blank` to open in a new tab.",
2676
- "fieldName": "target",
2677
- "inheritedFrom": {
2678
- "name": "UmButtonWrapper",
2679
- "module": "src/shared/button-wrapper.ts"
2680
- }
2681
- },
2682
- {
2683
- "name": "name",
2684
- "type": {
2685
- "text": "string | undefined"
2686
- },
2687
- "fieldName": "name",
2688
- "inheritedFrom": {
2689
- "name": "UmButtonWrapper",
2690
- "module": "src/shared/button-wrapper.ts"
2691
- }
2692
- }
2693
- ],
2694
- "superclass": {
2695
- "name": "UmButtonBase",
2696
- "module": "/src/button/button-base.js"
2697
- },
2698
- "tagName": "u-icon-button",
2699
- "customElement": true
2700
- }
2701
- ],
2702
- "exports": [
2703
- {
2704
- "kind": "js",
2705
- "name": "UmIconButton",
2706
- "declaration": {
2707
- "name": "UmIconButton",
2708
- "module": "src/button/icon-button.ts"
2709
- }
2710
- },
2711
- {
2712
- "kind": "custom-element-definition",
2713
- "name": "u-icon-button",
2714
- "declaration": {
2715
- "name": "UmIconButton",
2716
- "module": "src/button/icon-button.ts"
2717
- }
2718
- }
2719
- ]
2720
- },
2721
- {
2722
- "kind": "javascript-module",
2723
- "path": "src/checkbox/checkbox-list-item.ts",
2724
- "declarations": [
2725
- {
2726
- "kind": "class",
2727
- "description": "",
2728
- "name": "UmCheckboxListItem",
2729
- "mixins": [
2730
- {
2731
- "name": "mixinSelectionControlListItem",
2732
- "module": "/src/shared/selection-control/selection-control-list-item.js"
2733
- }
2734
- ],
2735
- "superclass": {
2736
- "name": "UmCheckbox",
2737
- "module": "/src/checkbox/checkbox.js"
2738
- },
2739
- "tagName": "u-checkbox-list-item",
2740
- "customElement": true,
2741
- "members": [
2742
- {
2743
- "kind": "field",
2744
- "name": "styles",
2745
- "type": {
2746
- "text": "array"
2747
- },
2748
- "static": true,
2749
- "default": "[\n (base as unknown as typeof LitElement).styles ?? [],\n css`\n :host {\n --u-list-item-block-padding: 0;\n display: block;\n }\n\n :host(:not([disabled])) {\n cursor: pointer;\n }\n `,\n ]",
2750
- "inheritedFrom": {
2751
- "name": "mixinSelectionControlListItem",
2752
- "module": "src/shared/selection-control/selection-control-list-item.ts"
2753
- }
2754
- },
2755
- {
2756
- "kind": "method",
2757
- "name": "render",
2758
- "return": {
2759
- "type": {
2760
- "text": "HTMLTemplateResult"
2761
- }
2762
- },
2763
- "inheritedFrom": {
2764
- "name": "mixinSelectionControlListItem",
2765
- "module": "src/shared/selection-control/selection-control-list-item.ts"
2766
- }
2767
- },
2768
- {
2769
- "kind": "field",
2770
- "name": "#indeterminate",
2771
- "privacy": "private",
2772
- "type": {
2773
- "text": "boolean"
2774
- },
2775
- "default": "false",
2776
- "inheritedFrom": {
2777
- "name": "UmCheckbox",
2778
- "module": "src/checkbox/checkbox.ts"
2779
- }
2780
- },
2781
- {
2782
- "kind": "field",
2783
- "name": "hideStateLayer",
2784
- "type": {
2785
- "text": "boolean"
2786
- },
2787
- "default": "false",
2788
- "attribute": "hide-state-layer",
2789
- "reflects": true,
2790
- "inheritedFrom": {
2791
- "name": "UmCheckbox",
2792
- "module": "src/checkbox/checkbox.ts"
2793
- }
2794
- },
2795
- {
2796
- "kind": "field",
2797
- "name": "indeterminate",
2798
- "type": {
2799
- "text": "boolean"
2800
- },
2801
- "attribute": "indeterminate",
2802
- "inheritedFrom": {
2803
- "name": "UmCheckbox",
2804
- "module": "src/checkbox/checkbox.ts"
2805
- }
2806
- },
2807
- {
2808
- "kind": "field",
2809
- "name": "checked",
2810
- "attribute": "checked",
2811
- "type": {
2812
- "text": "boolean"
2813
- },
2814
- "inheritedFrom": {
2815
- "name": "UmSelectionControl",
2816
- "module": "src/shared/selection-control/selection-control.ts"
2817
- }
2818
- },
2819
- {
2820
- "kind": "method",
2821
- "name": "renderIndicator",
2822
- "privacy": "protected",
2823
- "return": {
2824
- "type": {
2825
- "text": "HTMLTemplateResult"
2826
- }
2827
- },
2828
- "inheritedFrom": {
2829
- "name": "UmSelectionControl",
2830
- "module": "src/shared/selection-control/selection-control.ts"
2831
- }
2832
- },
2833
- {
2834
- "kind": "field",
2835
- "name": "formAssociated",
2836
- "type": {
2837
- "text": "boolean"
2838
- },
2839
- "static": true,
2840
- "default": "true",
2841
- "inheritedFrom": {
2842
- "name": "UmSelectionControl",
2843
- "module": "src/shared/selection-control/selection-control.ts"
2844
- }
2845
- },
2846
- {
2847
- "kind": "field",
2848
- "name": "elementInternals",
2849
- "type": {
2850
- "text": "ElementInternals"
2851
- },
2852
- "privacy": "protected",
2853
- "inheritedFrom": {
2854
- "name": "UmSelectionControl",
2855
- "module": "src/shared/selection-control/selection-control.ts"
2856
- }
2857
- },
2858
- {
2859
- "kind": "field",
2860
- "name": "name",
2861
- "type": {
2862
- "text": "string | undefined"
2863
- },
2864
- "default": "''",
2865
- "attribute": "name",
2866
- "inheritedFrom": {
2867
- "name": "UmSelectionControl",
2868
- "module": "src/shared/selection-control/selection-control.ts"
2869
- }
2870
- },
2871
- {
2872
- "kind": "field",
2873
- "name": "disabled",
2874
- "type": {
2875
- "text": "boolean"
2876
- },
2877
- "default": "false",
2878
- "attribute": "disabled",
2879
- "reflects": true,
2880
- "inheritedFrom": {
2881
- "name": "UmSelectionControl",
2882
- "module": "src/shared/selection-control/selection-control.ts"
2883
- }
2884
- },
2885
- {
2886
- "kind": "field",
2887
- "name": "input",
2888
- "type": {
2889
- "text": "HTMLInputElement"
2890
- },
2891
- "inheritedFrom": {
2892
- "name": "UmSelectionControl",
2893
- "module": "src/shared/selection-control/selection-control.ts"
2894
- }
2548
+ },
2549
+ "privacy": "private"
2895
2550
  },
2896
2551
  {
2897
2552
  "kind": "field",
2898
- "name": "form",
2553
+ "name": "_headlineElement",
2899
2554
  "type": {
2900
- "text": "HTMLFormElement | null"
2555
+ "text": "HTMLElement"
2901
2556
  },
2902
- "inheritedFrom": {
2903
- "name": "UmSelectionControl",
2904
- "module": "src/shared/selection-control/selection-control.ts"
2905
- }
2557
+ "privacy": "private"
2906
2558
  },
2907
2559
  {
2908
2560
  "kind": "field",
2909
- "name": "#checked",
2910
- "privacy": "private",
2561
+ "name": "containerSizeObserver",
2911
2562
  "type": {
2912
- "text": "boolean"
2563
+ "text": "ResizeObserver | null"
2913
2564
  },
2914
- "default": "false",
2915
- "inheritedFrom": {
2916
- "name": "UmSelectionControl",
2917
- "module": "src/shared/selection-control/selection-control.ts"
2918
- }
2565
+ "privacy": "private",
2566
+ "default": "null"
2919
2567
  },
2920
2568
  {
2921
2569
  "kind": "field",
2922
- "name": "inputType",
2570
+ "name": "scrollContainerElement",
2923
2571
  "type": {
2924
- "text": "'checkbox' | 'radio'"
2572
+ "text": "{\n addEventListener: typeof window.addEventListener;\n removeEventListener: typeof window.removeEventListener;\n } | null"
2925
2573
  },
2926
- "privacy": "protected",
2927
- "default": "'checkbox'",
2928
- "inheritedFrom": {
2929
- "name": "UmSelectionControl",
2930
- "module": "src/shared/selection-control/selection-control.ts"
2931
- }
2574
+ "privacy": "private",
2575
+ "default": "null"
2932
2576
  },
2933
2577
  {
2934
- "kind": "field",
2935
- "name": "renderRipple",
2936
- "type": {
2937
- "text": "boolean"
2578
+ "kind": "method",
2579
+ "name": "getScrollContainer",
2580
+ "privacy": "private",
2581
+ "return": {
2582
+ "type": {
2583
+ "text": "| {\n addEventListener: typeof window.addEventListener;\n removeEventListener: typeof window.removeEventListener;\n }\n | undefined"
2584
+ }
2938
2585
  },
2939
- "privacy": "protected",
2940
- "default": "true",
2941
- "inheritedFrom": {
2942
- "name": "UmSelectionControl",
2943
- "module": "src/shared/selection-control/selection-control.ts"
2944
- }
2586
+ "parameters": [
2587
+ {
2588
+ "name": "idOrElement",
2589
+ "type": {
2590
+ "text": "string | HTMLElement | undefined"
2591
+ }
2592
+ }
2593
+ ]
2945
2594
  },
2946
2595
  {
2947
- "kind": "field",
2948
- "name": "value",
2949
- "type": {
2950
- "text": "string"
2951
- },
2952
- "default": "'on'",
2953
- "description": "The element value to use in form submission when checked.",
2954
- "attribute": "value",
2955
- "inheritedFrom": {
2956
- "name": "UmSelectionControl",
2957
- "module": "src/shared/selection-control/selection-control.ts"
2958
- }
2596
+ "kind": "method",
2597
+ "name": "handleLeadingIconSlotChange",
2598
+ "privacy": "private"
2599
+ },
2600
+ {
2601
+ "kind": "method",
2602
+ "name": "handleTrailingIconSlotChange",
2603
+ "privacy": "private"
2959
2604
  },
2960
2605
  {
2961
2606
  "kind": "field",
2962
- "name": "_checkedAttribute",
2963
- "type": {
2964
- "text": "boolean"
2965
- },
2966
- "privacy": "private",
2967
- "default": "false",
2968
- "attribute": "checked",
2969
- "inheritedFrom": {
2970
- "name": "UmSelectionControl",
2971
- "module": "src/shared/selection-control/selection-control.ts"
2972
- }
2607
+ "name": "#updateScroll",
2608
+ "privacy": "private"
2973
2609
  },
2974
2610
  {
2975
2611
  "kind": "method",
2976
- "name": "#handleClick",
2612
+ "name": "getScrollTop",
2613
+ "privacy": "private",
2614
+ "static": true,
2615
+ "return": {
2616
+ "type": {
2617
+ "text": "number"
2618
+ }
2619
+ },
2977
2620
  "parameters": [
2978
2621
  {
2979
- "name": "e",
2622
+ "name": "container",
2980
2623
  "type": {
2981
- "text": "Event"
2624
+ "text": "HTMLElement & Window"
2982
2625
  }
2983
2626
  }
2984
- ],
2985
- "inheritedFrom": {
2986
- "name": "UmSelectionControl",
2987
- "module": "src/shared/selection-control/selection-control.ts"
2988
- }
2627
+ ]
2628
+ },
2629
+ {
2630
+ "kind": "method",
2631
+ "name": "setContentHeightProperty",
2632
+ "privacy": "private"
2989
2633
  }
2990
2634
  ],
2991
2635
  "attributes": [
2992
2636
  {
2993
- "name": "hide-state-layer",
2637
+ "name": "has-leading-icon",
2994
2638
  "type": {
2995
2639
  "text": "boolean"
2996
2640
  },
2997
2641
  "default": "false",
2998
- "fieldName": "hideStateLayer",
2999
- "inheritedFrom": {
3000
- "name": "UmCheckbox",
3001
- "module": "src/checkbox/checkbox.ts"
3002
- }
2642
+ "description": "Whether the app bar has leading icon or not\n\n_Note:_ Readonly",
2643
+ "fieldName": "hasLeadingIcon"
3003
2644
  },
3004
2645
  {
3005
- "name": "indeterminate",
2646
+ "name": "has-trailing-icon",
3006
2647
  "type": {
3007
2648
  "text": "boolean"
3008
2649
  },
3009
- "fieldName": "indeterminate",
3010
- "inheritedFrom": {
3011
- "name": "UmCheckbox",
3012
- "module": "src/checkbox/checkbox.ts"
3013
- }
2650
+ "default": "false",
2651
+ "description": "Whether the app bar has trailing icon or not\n\n_Note:_ Readonly",
2652
+ "fieldName": "hasTrailingIcon"
3014
2653
  },
3015
2654
  {
3016
- "name": "name",
2655
+ "name": "position",
3017
2656
  "type": {
3018
- "text": "string | undefined"
2657
+ "text": "'fixed' | 'absolute' | 'static'"
2658
+ },
2659
+ "default": "'fixed'",
2660
+ "fieldName": "position"
2661
+ },
2662
+ {
2663
+ "name": "size",
2664
+ "type": {
2665
+ "text": "'small' | 'medium' | 'large'"
2666
+ },
2667
+ "default": "'small'",
2668
+ "fieldName": "size"
2669
+ },
2670
+ {
2671
+ "name": "headline",
2672
+ "type": {
2673
+ "text": "string"
3019
2674
  },
3020
2675
  "default": "''",
3021
- "fieldName": "name",
3022
- "inheritedFrom": {
3023
- "name": "UmSelectionControl",
3024
- "module": "src/shared/selection-control/selection-control.ts"
3025
- }
2676
+ "fieldName": "headline"
3026
2677
  },
3027
2678
  {
3028
- "name": "disabled",
2679
+ "name": "scrollContainer",
2680
+ "type": {
2681
+ "text": "'none' | 'window' | string | undefined"
2682
+ },
2683
+ "fieldName": "scrollContainer"
2684
+ },
2685
+ {
2686
+ "name": "container-scrolled",
3029
2687
  "type": {
3030
2688
  "text": "boolean"
3031
2689
  },
3032
2690
  "default": "false",
3033
- "fieldName": "disabled",
3034
- "inheritedFrom": {
3035
- "name": "UmSelectionControl",
3036
- "module": "src/shared/selection-control/selection-control.ts"
3037
- }
3038
- },
2691
+ "fieldName": "containerScrolled"
2692
+ }
2693
+ ],
2694
+ "superclass": {
2695
+ "name": "LitElement",
2696
+ "package": "lit"
2697
+ },
2698
+ "tagName": "u-top-app-bar",
2699
+ "customElement": true
2700
+ }
2701
+ ],
2702
+ "exports": [
2703
+ {
2704
+ "kind": "js",
2705
+ "name": "UmTopAppBar",
2706
+ "declaration": {
2707
+ "name": "UmTopAppBar",
2708
+ "module": "src/app-bar/top-app-bar.ts"
2709
+ }
2710
+ },
2711
+ {
2712
+ "kind": "custom-element-definition",
2713
+ "name": "u-top-app-bar",
2714
+ "declaration": {
2715
+ "name": "UmTopAppBar",
2716
+ "module": "src/app-bar/top-app-bar.ts"
2717
+ }
2718
+ }
2719
+ ]
2720
+ },
2721
+ {
2722
+ "kind": "javascript-module",
2723
+ "path": "src/card/card-content.styles.ts",
2724
+ "declarations": [
2725
+ {
2726
+ "kind": "variable",
2727
+ "name": "styles",
2728
+ "default": "css `\n :host {\n display: block;\n }\n\n :host(:has(slot > *)) {\n display: none;\n }\n\n :host([has-content]) {\n padding: var(--u-card-padding, 16px);\n }\n\n slot {\n border-radius: inherit;\n }\n`"
2729
+ }
2730
+ ],
2731
+ "exports": [
2732
+ {
2733
+ "kind": "js",
2734
+ "name": "styles",
2735
+ "declaration": {
2736
+ "name": "styles",
2737
+ "module": "src/card/card-content.styles.ts"
2738
+ }
2739
+ }
2740
+ ]
2741
+ },
2742
+ {
2743
+ "kind": "javascript-module",
2744
+ "path": "src/card/card-content.ts",
2745
+ "declarations": [
2746
+ {
2747
+ "kind": "class",
2748
+ "description": "",
2749
+ "name": "UmCardContent",
2750
+ "members": [
3039
2751
  {
3040
- "name": "value",
2752
+ "kind": "field",
2753
+ "name": "hasContent",
3041
2754
  "type": {
3042
- "text": "string"
2755
+ "text": "boolean"
3043
2756
  },
3044
- "default": "'on'",
3045
- "description": "The element value to use in form submission when checked.",
3046
- "fieldName": "value",
3047
- "inheritedFrom": {
3048
- "name": "UmSelectionControl",
3049
- "module": "src/shared/selection-control/selection-control.ts"
3050
- }
2757
+ "default": "false",
2758
+ "attribute": "has-content",
2759
+ "reflects": true
3051
2760
  },
3052
2761
  {
3053
- "name": "checked",
3054
- "fieldName": "_checkedAttribute",
2762
+ "kind": "method",
2763
+ "name": "handleSlotChange",
2764
+ "privacy": "private",
2765
+ "parameters": [
2766
+ {
2767
+ "name": "e",
2768
+ "type": {
2769
+ "text": "Event"
2770
+ }
2771
+ }
2772
+ ]
2773
+ }
2774
+ ],
2775
+ "attributes": [
2776
+ {
2777
+ "name": "has-content",
3055
2778
  "type": {
3056
2779
  "text": "boolean"
3057
2780
  },
3058
2781
  "default": "false",
3059
- "inheritedFrom": {
3060
- "name": "UmSelectionControl",
3061
- "module": "src/shared/selection-control/selection-control.ts"
3062
- }
2782
+ "fieldName": "hasContent"
3063
2783
  }
3064
2784
  ],
3065
- "events": [
2785
+ "superclass": {
2786
+ "name": "LitElement",
2787
+ "package": "lit"
2788
+ },
2789
+ "tagName": "u-card-content",
2790
+ "customElement": true
2791
+ }
2792
+ ],
2793
+ "exports": [
2794
+ {
2795
+ "kind": "js",
2796
+ "name": "UmCardContent",
2797
+ "declaration": {
2798
+ "name": "UmCardContent",
2799
+ "module": "src/card/card-content.ts"
2800
+ }
2801
+ },
2802
+ {
2803
+ "kind": "custom-element-definition",
2804
+ "name": "u-card-content",
2805
+ "declaration": {
2806
+ "name": "UmCardContent",
2807
+ "module": "src/card/card-content.ts"
2808
+ }
2809
+ }
2810
+ ]
2811
+ },
2812
+ {
2813
+ "kind": "javascript-module",
2814
+ "path": "src/card/card-media.styles.ts",
2815
+ "declarations": [
2816
+ {
2817
+ "kind": "variable",
2818
+ "name": "styles",
2819
+ "default": "css `\n :host {\n display: block;\n aspect-ratio: 1;\n border-radius: var(--u-card-shape-corner, var(--u-shape-corner-medium, 12px));\n }\n\n :host([wide]) {\n aspect-ratio: 16/9;\n }\n`"
2820
+ }
2821
+ ],
2822
+ "exports": [
2823
+ {
2824
+ "kind": "js",
2825
+ "name": "styles",
2826
+ "declaration": {
2827
+ "name": "styles",
2828
+ "module": "src/card/card-media.styles.ts"
2829
+ }
2830
+ }
2831
+ ]
2832
+ },
2833
+ {
2834
+ "kind": "javascript-module",
2835
+ "path": "src/card/card-media.ts",
2836
+ "declarations": [
2837
+ {
2838
+ "kind": "class",
2839
+ "description": "",
2840
+ "name": "UmCardMedia",
2841
+ "members": [
3066
2842
  {
3067
- "name": "input",
2843
+ "kind": "field",
2844
+ "name": "wide",
3068
2845
  "type": {
3069
- "text": "InputEvent"
2846
+ "text": "boolean"
3070
2847
  },
3071
- "inheritedFrom": {
3072
- "name": "UmSelectionControl",
3073
- "module": "src/shared/selection-control/selection-control.ts"
3074
- }
3075
- },
2848
+ "default": "false",
2849
+ "attribute": "wide",
2850
+ "reflects": true
2851
+ }
2852
+ ],
2853
+ "attributes": [
3076
2854
  {
3077
- "name": "change",
2855
+ "name": "wide",
3078
2856
  "type": {
3079
- "text": "Event"
2857
+ "text": "boolean"
3080
2858
  },
3081
- "inheritedFrom": {
3082
- "name": "UmSelectionControl",
3083
- "module": "src/shared/selection-control/selection-control.ts"
3084
- }
2859
+ "default": "false",
2860
+ "fieldName": "wide"
3085
2861
  }
3086
- ]
2862
+ ],
2863
+ "superclass": {
2864
+ "name": "LitElement",
2865
+ "package": "lit"
2866
+ },
2867
+ "tagName": "u-card-media",
2868
+ "customElement": true
3087
2869
  }
3088
2870
  ],
3089
2871
  "exports": [
3090
2872
  {
3091
2873
  "kind": "js",
3092
- "name": "UmCheckboxListItem",
2874
+ "name": "UmCardMedia",
3093
2875
  "declaration": {
3094
- "name": "UmCheckboxListItem",
3095
- "module": "src/checkbox/checkbox-list-item.ts"
2876
+ "name": "UmCardMedia",
2877
+ "module": "src/card/card-media.ts"
3096
2878
  }
3097
2879
  },
3098
2880
  {
3099
2881
  "kind": "custom-element-definition",
3100
- "name": "u-checkbox-list-item",
2882
+ "name": "u-card-media",
3101
2883
  "declaration": {
3102
- "name": "UmCheckboxListItem",
3103
- "module": "src/checkbox/checkbox-list-item.ts"
2884
+ "name": "UmCardMedia",
2885
+ "module": "src/card/card-media.ts"
3104
2886
  }
3105
2887
  }
3106
2888
  ]
3107
2889
  },
3108
2890
  {
3109
2891
  "kind": "javascript-module",
3110
- "path": "src/checkbox/checkbox.styles.ts",
2892
+ "path": "src/card/card.styles.ts",
3111
2893
  "declarations": [
3112
2894
  {
3113
2895
  "kind": "variable",
3114
2896
  "name": "styles",
3115
- "default": "css `\n :host {\n --_state-layer-padding: var(--u-checkbox-state-layer-padding, 4px);\n --_input-size: calc(var(--_width) - var(--_state-layer-padding) * 2);\n --_indicator-color: var(--u-checkbox-indicator-unselected-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n display: inline-block;\n vertical-align: middle;\n }\n\n .container {\n cursor: pointer;\n position: relative;\n width: var(--_width);\n height: var(--_height);\n padding: var(--_state-layer-padding);\n border-radius: var(--u-shape-corner-full, 9999px);\n }\n\n :host([hide-state-layer]) .container {\n width: var(--_indicator-size);\n height: var(--_indicator-size);\n padding: 0;\n }\n :host([hide-state-layer]) u-ripple {\n display: none;\n }\n\n input {\n cursor: pointer;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n border-radius: inherit;\n appearance: none;\n pointer-events: none;\n }\n\n u-ripple {\n padding: var(--_state-layer-padding);\n }\n\n .indicator-container {\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n inset: 0;\n pointer-events: none;\n }\n\n input:checked ~ .indicator-container {\n --_indicator-color: var(--u-checkbox-indicator-selected-color, var(--u-color-primary, rgb(103, 80, 164)));\n }\n\n :host([disabled]) {\n opacity: var(--u-checkbox-disabled-state-opacity, 0.38);\n }\n :host([disabled]) input,\n :host([disabled]) .container {\n cursor: default;\n }\n :host([disabled]) .indicator-container {\n --_indicator-color: var(--u-checkbox-indicator-disabled-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n }\n\n :host {\n --_indicator-size: var(--u-checkbox-indicator-size, 1.125rem);\n --_width: var(--u-checkbox-size, 3rem);\n --_height: var(--_width);\n }\n\n .border {\n width: var(--_indicator-size);\n height: var(--_indicator-size);\n box-shadow: 0 0 0 var(--u-checkbox-indicator-border-width, 0.125rem) var(--_indicator-color) inset;\n border-radius: var(--u-checkbox-indicator-shaper-coner, 2px);\n transition: box-shadow 175ms 175ms;\n }\n\n .indicator {\n position: absolute;\n display: flex;\n justify-content: center;\n width: var(--_indicator-size);\n height: var(--_indicator-size);\n overflow: hidden;\n clip: rect(0, 0, var(--_indicator-size), 0);\n transition: clip 275ms;\n }\n .indicator::before {\n position: relative;\n top: 25%;\n box-sizing: border-box;\n display: block;\n width: 0.75rem;\n height: 0.35rem;\n content: \"\";\n border: var(--u-checkbox-indicator-border-width, 0.125rem) solid var(--u-color-on-primary, rgb(255, 255, 255));\n border-top-style: none;\n border-right-style: none;\n transform: rotate(-45deg);\n transition: border 175ms, transform 175ms;\n }\n\n input.indeterminate ~ .indicator-container .border,\n input:checked ~ .indicator-container .border {\n box-shadow: 0 0 0 calc(var(--_indicator-size) / 2) var(--_indicator-color) inset;\n transition: box-shadow 175ms;\n }\n input.indeterminate ~ .indicator-container .indicator,\n input:checked ~ .indicator-container .indicator {\n clip: rect(0, var(--_indicator-size), var(--_indicator-size), 0);\n transition: clip 175ms 175ms;\n }\n\n input.indeterminate ~ .indicator-container {\n --_indicator-color: var(--u-checkbox-indicator-indeterminate-color, var(--u-color-primary, rgb(103, 80, 164)));\n }\n input.indeterminate ~ .indicator-container .indicator::before {\n border-left-style: none;\n transform: rotate(0);\n width: 0.6rem;\n }\n`"
2897
+ "default": "css `\n :host {\n display: block;\n position: relative;\n border-radius: var(--u-card-shape-corner, var(--u-shape-corner-medium, 12px));\n }\n\n :host([variant=elevated]) {\n --u-current-bg-color: var(--u-card-elevated-bg-color, var(--u-color-surface-container-low, rgb(247, 242, 250)));\n background-color: var(--u-current-bg-color);\n }\n :host([variant=elevated]) u-elevation {\n --u-elevation-level: var(--u-elevated-card-elevation-level, 1);\n }\n\n :host([variant=filled]) {\n --u-current-bg-color: var(--u-card-filled-bg-color, var(--u-color-surface-container-highest, rgb(230, 224, 233)));\n background-color: var(--u-current-bg-color);\n }\n\n :host([variant=outlined]) {\n border: var(--u-outlined-card-outline-width, 1px) solid var(--u-outlined-card-outline-color, var(--u-color-outline-variant, rgb(202, 196, 208)));\n }\n\n u-card-content,\n slot {\n border-radius: inherit;\n }\n`"
3116
2898
  }
3117
2899
  ],
3118
2900
  "exports": [
@@ -3121,20 +2903,117 @@
3121
2903
  "name": "styles",
3122
2904
  "declaration": {
3123
2905
  "name": "styles",
3124
- "module": "src/checkbox/checkbox.styles.ts"
2906
+ "module": "src/card/card.styles.ts"
3125
2907
  }
3126
2908
  }
3127
2909
  ]
3128
2910
  },
3129
2911
  {
3130
2912
  "kind": "javascript-module",
3131
- "path": "src/checkbox/checkbox.ts",
2913
+ "path": "src/card/card.ts",
3132
2914
  "declarations": [
3133
2915
  {
3134
2916
  "kind": "class",
3135
2917
  "description": "",
3136
- "name": "UmCheckbox",
2918
+ "name": "UmCard",
2919
+ "members": [
2920
+ {
2921
+ "kind": "field",
2922
+ "name": "variant",
2923
+ "type": {
2924
+ "text": "UmCardVariant"
2925
+ },
2926
+ "default": "'filled'",
2927
+ "description": "The Card variant to render.",
2928
+ "attribute": "variant",
2929
+ "reflects": true
2930
+ }
2931
+ ],
2932
+ "attributes": [
2933
+ {
2934
+ "name": "variant",
2935
+ "type": {
2936
+ "text": "UmCardVariant"
2937
+ },
2938
+ "default": "'filled'",
2939
+ "description": "The Card variant to render.",
2940
+ "fieldName": "variant"
2941
+ }
2942
+ ],
2943
+ "superclass": {
2944
+ "name": "LitElement",
2945
+ "package": "lit"
2946
+ },
2947
+ "tagName": "u-card",
2948
+ "customElement": true
2949
+ }
2950
+ ],
2951
+ "exports": [
2952
+ {
2953
+ "kind": "js",
2954
+ "name": "UmCard",
2955
+ "declaration": {
2956
+ "name": "UmCard",
2957
+ "module": "src/card/card.ts"
2958
+ }
2959
+ },
2960
+ {
2961
+ "kind": "custom-element-definition",
2962
+ "name": "u-card",
2963
+ "declaration": {
2964
+ "name": "UmCard",
2965
+ "module": "src/card/card.ts"
2966
+ }
2967
+ }
2968
+ ]
2969
+ },
2970
+ {
2971
+ "kind": "javascript-module",
2972
+ "path": "src/checkbox/checkbox-list-item.ts",
2973
+ "declarations": [
2974
+ {
2975
+ "kind": "class",
2976
+ "description": "",
2977
+ "name": "UmCheckboxListItem",
2978
+ "mixins": [
2979
+ {
2980
+ "name": "mixinSelectionControlListItem",
2981
+ "module": "/src/shared/selection-control/selection-control-list-item.js"
2982
+ }
2983
+ ],
2984
+ "superclass": {
2985
+ "name": "UmCheckbox",
2986
+ "module": "/src/checkbox/checkbox.js"
2987
+ },
2988
+ "tagName": "u-checkbox-list-item",
2989
+ "customElement": true,
3137
2990
  "members": [
2991
+ {
2992
+ "kind": "field",
2993
+ "name": "styles",
2994
+ "type": {
2995
+ "text": "array"
2996
+ },
2997
+ "static": true,
2998
+ "default": "[\n (base as unknown as typeof LitElement).styles ?? [],\n css`\n :host {\n --u-list-item-block-padding: 0;\n display: block;\n }\n\n :host(:not([disabled])) {\n cursor: pointer;\n }\n `,\n ]",
2999
+ "inheritedFrom": {
3000
+ "name": "mixinSelectionControlListItem",
3001
+ "module": "src/shared/selection-control/selection-control-list-item.ts"
3002
+ }
3003
+ },
3004
+ {
3005
+ "kind": "method",
3006
+ "name": "render",
3007
+ "return": {
3008
+ "type": {
3009
+ "text": "HTMLTemplateResult"
3010
+ }
3011
+ },
3012
+ "inheritedFrom": {
3013
+ "name": "mixinSelectionControlListItem",
3014
+ "module": "src/shared/selection-control/selection-control-list-item.ts"
3015
+ }
3016
+ },
3138
3017
  {
3139
3018
  "kind": "field",
3140
3019
  "name": "#indeterminate",
@@ -3142,7 +3021,11 @@
3142
3021
  "type": {
3143
3022
  "text": "boolean"
3144
3023
  },
3145
- "default": "false"
3024
+ "default": "false",
3025
+ "inheritedFrom": {
3026
+ "name": "UmCheckbox",
3027
+ "module": "src/checkbox/checkbox.ts"
3028
+ }
3146
3029
  },
3147
3030
  {
3148
3031
  "kind": "field",
@@ -3152,7 +3035,11 @@
3152
3035
  },
3153
3036
  "default": "false",
3154
3037
  "attribute": "hide-state-layer",
3155
- "reflects": true
3038
+ "reflects": true,
3039
+ "inheritedFrom": {
3040
+ "name": "UmCheckbox",
3041
+ "module": "src/checkbox/checkbox.ts"
3042
+ }
3156
3043
  },
3157
3044
  {
3158
3045
  "kind": "field",
@@ -3160,7 +3047,11 @@
3160
3047
  "type": {
3161
3048
  "text": "boolean"
3162
3049
  },
3163
- "attribute": "indeterminate"
3050
+ "attribute": "indeterminate",
3051
+ "inheritedFrom": {
3052
+ "name": "UmCheckbox",
3053
+ "module": "src/checkbox/checkbox.ts"
3054
+ }
3164
3055
  },
3165
3056
  {
3166
3057
  "kind": "field",
@@ -3353,14 +3244,22 @@
3353
3244
  "text": "boolean"
3354
3245
  },
3355
3246
  "default": "false",
3356
- "fieldName": "hideStateLayer"
3247
+ "fieldName": "hideStateLayer",
3248
+ "inheritedFrom": {
3249
+ "name": "UmCheckbox",
3250
+ "module": "src/checkbox/checkbox.ts"
3251
+ }
3357
3252
  },
3358
3253
  {
3359
3254
  "name": "indeterminate",
3360
3255
  "type": {
3361
3256
  "text": "boolean"
3362
3257
  },
3363
- "fieldName": "indeterminate"
3258
+ "fieldName": "indeterminate",
3259
+ "inheritedFrom": {
3260
+ "name": "UmCheckbox",
3261
+ "module": "src/checkbox/checkbox.ts"
3262
+ }
3364
3263
  },
3365
3264
  {
3366
3265
  "name": "name",
@@ -3412,12 +3311,6 @@
3412
3311
  }
3413
3312
  }
3414
3313
  ],
3415
- "superclass": {
3416
- "name": "UmSelectionControl",
3417
- "module": "/src/shared/selection-control/selection-control.js"
3418
- },
3419
- "tagName": "u-checkbox",
3420
- "customElement": true,
3421
3314
  "events": [
3422
3315
  {
3423
3316
  "name": "input",
@@ -3445,30 +3338,30 @@
3445
3338
  "exports": [
3446
3339
  {
3447
3340
  "kind": "js",
3448
- "name": "UmCheckbox",
3341
+ "name": "UmCheckboxListItem",
3449
3342
  "declaration": {
3450
- "name": "UmCheckbox",
3451
- "module": "src/checkbox/checkbox.ts"
3343
+ "name": "UmCheckboxListItem",
3344
+ "module": "src/checkbox/checkbox-list-item.ts"
3452
3345
  }
3453
3346
  },
3454
3347
  {
3455
3348
  "kind": "custom-element-definition",
3456
- "name": "u-checkbox",
3349
+ "name": "u-checkbox-list-item",
3457
3350
  "declaration": {
3458
- "name": "UmCheckbox",
3459
- "module": "src/checkbox/checkbox.ts"
3351
+ "name": "UmCheckboxListItem",
3352
+ "module": "src/checkbox/checkbox-list-item.ts"
3460
3353
  }
3461
3354
  }
3462
3355
  ]
3463
3356
  },
3464
3357
  {
3465
3358
  "kind": "javascript-module",
3466
- "path": "src/card/card-content.styles.ts",
3359
+ "path": "src/checkbox/checkbox.styles.ts",
3467
3360
  "declarations": [
3468
3361
  {
3469
3362
  "kind": "variable",
3470
3363
  "name": "styles",
3471
- "default": "css `\n :host {\n display: block;\n }\n\n :host(:has(slot > *)) {\n display: none;\n }\n\n :host([has-content]) {\n padding: var(--u-card-padding, 16px);\n }\n\n slot {\n border-radius: inherit;\n }\n`"
3364
+ "default": "css `\n :host {\n --_state-layer-padding: var(--u-checkbox-state-layer-padding, 4px);\n --_input-size: calc(var(--_width) - var(--_state-layer-padding) * 2);\n --_indicator-color: var(--u-checkbox-indicator-unselected-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n display: inline-block;\n vertical-align: middle;\n }\n\n .container {\n cursor: pointer;\n position: relative;\n width: var(--_width);\n height: var(--_height);\n padding: var(--_state-layer-padding);\n border-radius: var(--u-shape-corner-full, 9999px);\n }\n\n :host([hide-state-layer]) .container {\n width: var(--_indicator-size);\n height: var(--_indicator-size);\n padding: 0;\n }\n :host([hide-state-layer]) u-ripple {\n display: none;\n }\n\n input {\n cursor: pointer;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n border-radius: inherit;\n appearance: none;\n pointer-events: none;\n }\n\n u-ripple {\n padding: var(--_state-layer-padding);\n }\n\n .indicator-container {\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n inset: 0;\n pointer-events: none;\n }\n\n input:checked ~ .indicator-container {\n --_indicator-color: var(--u-checkbox-indicator-selected-color, var(--u-color-primary, rgb(103, 80, 164)));\n }\n\n :host([disabled]) {\n opacity: var(--u-checkbox-disabled-state-opacity, 0.38);\n }\n :host([disabled]) input,\n :host([disabled]) .container {\n cursor: default;\n }\n :host([disabled]) .indicator-container {\n --_indicator-color: var(--u-checkbox-indicator-disabled-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n }\n\n :host {\n --_indicator-size: var(--u-checkbox-indicator-size, 1.125rem);\n --_width: var(--u-checkbox-size, 3rem);\n --_height: var(--_width);\n }\n\n .border {\n width: var(--_indicator-size);\n height: var(--_indicator-size);\n box-shadow: 0 0 0 var(--u-checkbox-indicator-border-width, 0.125rem) var(--_indicator-color) inset;\n border-radius: var(--u-checkbox-indicator-shaper-coner, 2px);\n transition: box-shadow 175ms 175ms;\n }\n\n .indicator {\n position: absolute;\n display: flex;\n justify-content: center;\n width: var(--_indicator-size);\n height: var(--_indicator-size);\n overflow: hidden;\n clip: rect(0, 0, var(--_indicator-size), 0);\n transition: clip 275ms;\n }\n .indicator::before {\n position: relative;\n top: 25%;\n box-sizing: border-box;\n display: block;\n width: 0.75rem;\n height: 0.35rem;\n content: \"\";\n border: var(--u-checkbox-indicator-border-width, 0.125rem) solid var(--u-color-on-primary, rgb(255, 255, 255));\n border-top-style: none;\n border-right-style: none;\n transform: rotate(-45deg);\n transition: border 175ms, transform 175ms;\n }\n\n input.indeterminate ~ .indicator-container .border,\n input:checked ~ .indicator-container .border {\n box-shadow: 0 0 0 calc(var(--_indicator-size) / 2) var(--_indicator-color) inset;\n transition: box-shadow 175ms;\n }\n input.indeterminate ~ .indicator-container .indicator,\n input:checked ~ .indicator-container .indicator {\n clip: rect(0, var(--_indicator-size), var(--_indicator-size), 0);\n transition: clip 175ms 175ms;\n }\n\n input.indeterminate ~ .indicator-container {\n --_indicator-color: var(--u-checkbox-indicator-indeterminate-color, var(--u-color-primary, rgb(103, 80, 164)));\n }\n input.indeterminate ~ .indicator-container .indicator::before {\n border-left-style: none;\n transform: rotate(0);\n width: 0.6rem;\n }\n`"
3472
3365
  }
3473
3366
  ],
3474
3367
  "exports": [
@@ -3477,235 +3370,342 @@
3477
3370
  "name": "styles",
3478
3371
  "declaration": {
3479
3372
  "name": "styles",
3480
- "module": "src/card/card-content.styles.ts"
3373
+ "module": "src/checkbox/checkbox.styles.ts"
3481
3374
  }
3482
3375
  }
3483
3376
  ]
3484
3377
  },
3485
3378
  {
3486
3379
  "kind": "javascript-module",
3487
- "path": "src/card/card-content.ts",
3380
+ "path": "src/checkbox/checkbox.ts",
3488
3381
  "declarations": [
3489
3382
  {
3490
3383
  "kind": "class",
3491
3384
  "description": "",
3492
- "name": "UmCardContent",
3385
+ "name": "UmCheckbox",
3493
3386
  "members": [
3494
3387
  {
3495
3388
  "kind": "field",
3496
- "name": "hasContent",
3389
+ "name": "#indeterminate",
3390
+ "privacy": "private",
3391
+ "type": {
3392
+ "text": "boolean"
3393
+ },
3394
+ "default": "false"
3395
+ },
3396
+ {
3397
+ "kind": "field",
3398
+ "name": "hideStateLayer",
3497
3399
  "type": {
3498
3400
  "text": "boolean"
3499
3401
  },
3500
3402
  "default": "false",
3501
- "attribute": "has-content",
3403
+ "attribute": "hide-state-layer",
3502
3404
  "reflects": true
3503
3405
  },
3406
+ {
3407
+ "kind": "field",
3408
+ "name": "indeterminate",
3409
+ "type": {
3410
+ "text": "boolean"
3411
+ },
3412
+ "attribute": "indeterminate"
3413
+ },
3414
+ {
3415
+ "kind": "field",
3416
+ "name": "checked",
3417
+ "attribute": "checked",
3418
+ "type": {
3419
+ "text": "boolean"
3420
+ },
3421
+ "inheritedFrom": {
3422
+ "name": "UmSelectionControl",
3423
+ "module": "src/shared/selection-control/selection-control.ts"
3424
+ }
3425
+ },
3504
3426
  {
3505
3427
  "kind": "method",
3506
- "name": "handleSlotChange",
3507
- "privacy": "private",
3508
- "parameters": [
3509
- {
3510
- "name": "e",
3511
- "type": {
3512
- "text": "Event"
3513
- }
3428
+ "name": "renderIndicator",
3429
+ "privacy": "protected",
3430
+ "return": {
3431
+ "type": {
3432
+ "text": "HTMLTemplateResult"
3514
3433
  }
3515
- ]
3516
- }
3517
- ],
3518
- "attributes": [
3434
+ },
3435
+ "inheritedFrom": {
3436
+ "name": "UmSelectionControl",
3437
+ "module": "src/shared/selection-control/selection-control.ts"
3438
+ }
3439
+ },
3519
3440
  {
3520
- "name": "has-content",
3441
+ "kind": "field",
3442
+ "name": "formAssociated",
3443
+ "type": {
3444
+ "text": "boolean"
3445
+ },
3446
+ "static": true,
3447
+ "default": "true",
3448
+ "inheritedFrom": {
3449
+ "name": "UmSelectionControl",
3450
+ "module": "src/shared/selection-control/selection-control.ts"
3451
+ }
3452
+ },
3453
+ {
3454
+ "kind": "field",
3455
+ "name": "elementInternals",
3456
+ "type": {
3457
+ "text": "ElementInternals"
3458
+ },
3459
+ "privacy": "protected",
3460
+ "inheritedFrom": {
3461
+ "name": "UmSelectionControl",
3462
+ "module": "src/shared/selection-control/selection-control.ts"
3463
+ }
3464
+ },
3465
+ {
3466
+ "kind": "field",
3467
+ "name": "name",
3468
+ "type": {
3469
+ "text": "string | undefined"
3470
+ },
3471
+ "default": "''",
3472
+ "attribute": "name",
3473
+ "inheritedFrom": {
3474
+ "name": "UmSelectionControl",
3475
+ "module": "src/shared/selection-control/selection-control.ts"
3476
+ }
3477
+ },
3478
+ {
3479
+ "kind": "field",
3480
+ "name": "disabled",
3521
3481
  "type": {
3522
3482
  "text": "boolean"
3523
3483
  },
3524
3484
  "default": "false",
3525
- "fieldName": "hasContent"
3526
- }
3527
- ],
3528
- "superclass": {
3529
- "name": "LitElement",
3530
- "package": "lit"
3531
- },
3532
- "tagName": "u-card-content",
3533
- "customElement": true
3534
- }
3535
- ],
3536
- "exports": [
3537
- {
3538
- "kind": "js",
3539
- "name": "UmCardContent",
3540
- "declaration": {
3541
- "name": "UmCardContent",
3542
- "module": "src/card/card-content.ts"
3543
- }
3544
- },
3545
- {
3546
- "kind": "custom-element-definition",
3547
- "name": "u-card-content",
3548
- "declaration": {
3549
- "name": "UmCardContent",
3550
- "module": "src/card/card-content.ts"
3551
- }
3552
- }
3553
- ]
3554
- },
3555
- {
3556
- "kind": "javascript-module",
3557
- "path": "src/card/card-media.styles.ts",
3558
- "declarations": [
3559
- {
3560
- "kind": "variable",
3561
- "name": "styles",
3562
- "default": "css `\n :host {\n display: block;\n aspect-ratio: 1;\n border-radius: var(--u-card-shape-corner, var(--u-shape-corner-medium, 12px));\n }\n\n :host([wide]) {\n aspect-ratio: 16/9;\n }\n`"
3563
- }
3564
- ],
3565
- "exports": [
3566
- {
3567
- "kind": "js",
3568
- "name": "styles",
3569
- "declaration": {
3570
- "name": "styles",
3571
- "module": "src/card/card-media.styles.ts"
3572
- }
3573
- }
3574
- ]
3575
- },
3576
- {
3577
- "kind": "javascript-module",
3578
- "path": "src/card/card-media.ts",
3579
- "declarations": [
3580
- {
3581
- "kind": "class",
3582
- "description": "",
3583
- "name": "UmCardMedia",
3584
- "members": [
3485
+ "attribute": "disabled",
3486
+ "reflects": true,
3487
+ "inheritedFrom": {
3488
+ "name": "UmSelectionControl",
3489
+ "module": "src/shared/selection-control/selection-control.ts"
3490
+ }
3491
+ },
3492
+ {
3493
+ "kind": "field",
3494
+ "name": "input",
3495
+ "type": {
3496
+ "text": "HTMLInputElement"
3497
+ },
3498
+ "inheritedFrom": {
3499
+ "name": "UmSelectionControl",
3500
+ "module": "src/shared/selection-control/selection-control.ts"
3501
+ }
3502
+ },
3503
+ {
3504
+ "kind": "field",
3505
+ "name": "form",
3506
+ "type": {
3507
+ "text": "HTMLFormElement | null"
3508
+ },
3509
+ "inheritedFrom": {
3510
+ "name": "UmSelectionControl",
3511
+ "module": "src/shared/selection-control/selection-control.ts"
3512
+ }
3513
+ },
3514
+ {
3515
+ "kind": "field",
3516
+ "name": "#checked",
3517
+ "privacy": "private",
3518
+ "type": {
3519
+ "text": "boolean"
3520
+ },
3521
+ "default": "false",
3522
+ "inheritedFrom": {
3523
+ "name": "UmSelectionControl",
3524
+ "module": "src/shared/selection-control/selection-control.ts"
3525
+ }
3526
+ },
3527
+ {
3528
+ "kind": "field",
3529
+ "name": "inputType",
3530
+ "type": {
3531
+ "text": "'checkbox' | 'radio'"
3532
+ },
3533
+ "privacy": "protected",
3534
+ "default": "'checkbox'",
3535
+ "inheritedFrom": {
3536
+ "name": "UmSelectionControl",
3537
+ "module": "src/shared/selection-control/selection-control.ts"
3538
+ }
3539
+ },
3540
+ {
3541
+ "kind": "field",
3542
+ "name": "renderRipple",
3543
+ "type": {
3544
+ "text": "boolean"
3545
+ },
3546
+ "privacy": "protected",
3547
+ "default": "true",
3548
+ "inheritedFrom": {
3549
+ "name": "UmSelectionControl",
3550
+ "module": "src/shared/selection-control/selection-control.ts"
3551
+ }
3552
+ },
3585
3553
  {
3586
3554
  "kind": "field",
3587
- "name": "wide",
3555
+ "name": "value",
3556
+ "type": {
3557
+ "text": "string"
3558
+ },
3559
+ "default": "'on'",
3560
+ "description": "The element value to use in form submission when checked.",
3561
+ "attribute": "value",
3562
+ "inheritedFrom": {
3563
+ "name": "UmSelectionControl",
3564
+ "module": "src/shared/selection-control/selection-control.ts"
3565
+ }
3566
+ },
3567
+ {
3568
+ "kind": "field",
3569
+ "name": "_checkedAttribute",
3588
3570
  "type": {
3589
3571
  "text": "boolean"
3590
3572
  },
3573
+ "privacy": "private",
3591
3574
  "default": "false",
3592
- "attribute": "wide",
3593
- "reflects": true
3575
+ "attribute": "checked",
3576
+ "inheritedFrom": {
3577
+ "name": "UmSelectionControl",
3578
+ "module": "src/shared/selection-control/selection-control.ts"
3579
+ }
3580
+ },
3581
+ {
3582
+ "kind": "method",
3583
+ "name": "#handleClick",
3584
+ "parameters": [
3585
+ {
3586
+ "name": "e",
3587
+ "type": {
3588
+ "text": "Event"
3589
+ }
3590
+ }
3591
+ ],
3592
+ "inheritedFrom": {
3593
+ "name": "UmSelectionControl",
3594
+ "module": "src/shared/selection-control/selection-control.ts"
3595
+ }
3594
3596
  }
3595
3597
  ],
3596
3598
  "attributes": [
3597
3599
  {
3598
- "name": "wide",
3600
+ "name": "hide-state-layer",
3599
3601
  "type": {
3600
3602
  "text": "boolean"
3601
3603
  },
3602
3604
  "default": "false",
3603
- "fieldName": "wide"
3605
+ "fieldName": "hideStateLayer"
3606
+ },
3607
+ {
3608
+ "name": "indeterminate",
3609
+ "type": {
3610
+ "text": "boolean"
3611
+ },
3612
+ "fieldName": "indeterminate"
3613
+ },
3614
+ {
3615
+ "name": "name",
3616
+ "type": {
3617
+ "text": "string | undefined"
3618
+ },
3619
+ "default": "''",
3620
+ "fieldName": "name",
3621
+ "inheritedFrom": {
3622
+ "name": "UmSelectionControl",
3623
+ "module": "src/shared/selection-control/selection-control.ts"
3624
+ }
3625
+ },
3626
+ {
3627
+ "name": "disabled",
3628
+ "type": {
3629
+ "text": "boolean"
3630
+ },
3631
+ "default": "false",
3632
+ "fieldName": "disabled",
3633
+ "inheritedFrom": {
3634
+ "name": "UmSelectionControl",
3635
+ "module": "src/shared/selection-control/selection-control.ts"
3636
+ }
3637
+ },
3638
+ {
3639
+ "name": "value",
3640
+ "type": {
3641
+ "text": "string"
3642
+ },
3643
+ "default": "'on'",
3644
+ "description": "The element value to use in form submission when checked.",
3645
+ "fieldName": "value",
3646
+ "inheritedFrom": {
3647
+ "name": "UmSelectionControl",
3648
+ "module": "src/shared/selection-control/selection-control.ts"
3649
+ }
3650
+ },
3651
+ {
3652
+ "name": "checked",
3653
+ "fieldName": "_checkedAttribute",
3654
+ "type": {
3655
+ "text": "boolean"
3656
+ },
3657
+ "default": "false",
3658
+ "inheritedFrom": {
3659
+ "name": "UmSelectionControl",
3660
+ "module": "src/shared/selection-control/selection-control.ts"
3661
+ }
3604
3662
  }
3605
3663
  ],
3606
3664
  "superclass": {
3607
- "name": "LitElement",
3608
- "package": "lit"
3665
+ "name": "UmSelectionControl",
3666
+ "module": "/src/shared/selection-control/selection-control.js"
3609
3667
  },
3610
- "tagName": "u-card-media",
3611
- "customElement": true
3612
- }
3613
- ],
3614
- "exports": [
3615
- {
3616
- "kind": "js",
3617
- "name": "UmCardMedia",
3618
- "declaration": {
3619
- "name": "UmCardMedia",
3620
- "module": "src/card/card-media.ts"
3621
- }
3622
- },
3623
- {
3624
- "kind": "custom-element-definition",
3625
- "name": "u-card-media",
3626
- "declaration": {
3627
- "name": "UmCardMedia",
3628
- "module": "src/card/card-media.ts"
3629
- }
3630
- }
3631
- ]
3632
- },
3633
- {
3634
- "kind": "javascript-module",
3635
- "path": "src/card/card.styles.ts",
3636
- "declarations": [
3637
- {
3638
- "kind": "variable",
3639
- "name": "styles",
3640
- "default": "css `\n :host {\n display: block;\n position: relative;\n border-radius: var(--u-card-shape-corner, var(--u-shape-corner-medium, 12px));\n }\n\n :host([variant=elevated]) {\n --u-current-bg-color: var(--u-card-elevated-bg-color, var(--u-color-surface-container-low, rgb(247, 242, 250)));\n background-color: var(--u-current-bg-color);\n }\n :host([variant=elevated]) u-elevation {\n --u-elevation-level: var(--u-elevated-card-elevation-level, 1);\n }\n\n :host([variant=filled]) {\n --u-current-bg-color: var(--u-card-filled-bg-color, var(--u-color-surface-container-highest, rgb(230, 224, 233)));\n background-color: var(--u-current-bg-color);\n }\n\n :host([variant=outlined]) {\n border: var(--u-outlined-card-outline-width, 1px) solid var(--u-outlined-card-outline-color, var(--u-color-outline-variant, rgb(202, 196, 208)));\n }\n\n u-card-content,\n slot {\n border-radius: inherit;\n }\n`"
3641
- }
3642
- ],
3643
- "exports": [
3644
- {
3645
- "kind": "js",
3646
- "name": "styles",
3647
- "declaration": {
3648
- "name": "styles",
3649
- "module": "src/card/card.styles.ts"
3650
- }
3651
- }
3652
- ]
3653
- },
3654
- {
3655
- "kind": "javascript-module",
3656
- "path": "src/card/card.ts",
3657
- "declarations": [
3658
- {
3659
- "kind": "class",
3660
- "description": "",
3661
- "name": "UmCard",
3662
- "members": [
3668
+ "tagName": "u-checkbox",
3669
+ "customElement": true,
3670
+ "events": [
3663
3671
  {
3664
- "kind": "field",
3665
- "name": "variant",
3672
+ "name": "input",
3666
3673
  "type": {
3667
- "text": "UmCardVariant"
3674
+ "text": "InputEvent"
3668
3675
  },
3669
- "default": "'filled'",
3670
- "description": "The Card variant to render.",
3671
- "attribute": "variant",
3672
- "reflects": true
3673
- }
3674
- ],
3675
- "attributes": [
3676
+ "inheritedFrom": {
3677
+ "name": "UmSelectionControl",
3678
+ "module": "src/shared/selection-control/selection-control.ts"
3679
+ }
3680
+ },
3676
3681
  {
3677
- "name": "variant",
3682
+ "name": "change",
3678
3683
  "type": {
3679
- "text": "UmCardVariant"
3684
+ "text": "Event"
3680
3685
  },
3681
- "default": "'filled'",
3682
- "description": "The Card variant to render.",
3683
- "fieldName": "variant"
3686
+ "inheritedFrom": {
3687
+ "name": "UmSelectionControl",
3688
+ "module": "src/shared/selection-control/selection-control.ts"
3689
+ }
3684
3690
  }
3685
- ],
3686
- "superclass": {
3687
- "name": "LitElement",
3688
- "package": "lit"
3689
- },
3690
- "tagName": "u-card",
3691
- "customElement": true
3691
+ ]
3692
3692
  }
3693
3693
  ],
3694
3694
  "exports": [
3695
3695
  {
3696
3696
  "kind": "js",
3697
- "name": "UmCard",
3697
+ "name": "UmCheckbox",
3698
3698
  "declaration": {
3699
- "name": "UmCard",
3700
- "module": "src/card/card.ts"
3699
+ "name": "UmCheckbox",
3700
+ "module": "src/checkbox/checkbox.ts"
3701
3701
  }
3702
3702
  },
3703
3703
  {
3704
3704
  "kind": "custom-element-definition",
3705
- "name": "u-card",
3705
+ "name": "u-checkbox",
3706
3706
  "declaration": {
3707
- "name": "UmCard",
3708
- "module": "src/card/card.ts"
3707
+ "name": "UmCheckbox",
3708
+ "module": "src/checkbox/checkbox.ts"
3709
3709
  }
3710
3710
  }
3711
3711
  ]
@@ -4771,7 +4771,7 @@
4771
4771
  "kind": "field",
4772
4772
  "name": "supportingText",
4773
4773
  "type": {
4774
- "text": "| string\n | undefined"
4774
+ "text": "string | undefined"
4775
4775
  },
4776
4776
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
4777
4777
  "attribute": "supporting-text",
@@ -5136,7 +5136,7 @@
5136
5136
  {
5137
5137
  "name": "supporting-text",
5138
5138
  "type": {
5139
- "text": "| string\n | undefined"
5139
+ "text": "string | undefined"
5140
5140
  },
5141
5141
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
5142
5142
  "fieldName": "supportingText",
@@ -6198,7 +6198,7 @@
6198
6198
  {
6199
6199
  "kind": "variable",
6200
6200
  "name": "styles",
6201
- "default": "css `\n :host {\n --_control-line-height: var(--u-field-control-line-height, 1.5rem);\n --_label-line-height: var(--u-field-label-line-height, 1rem);\n --_field-icon-size: var(--u-field-icon-size, 1.5rem);\n --_field-control-padding: var(--u-field-control-padding, 16px);\n --_field-control-inline-padding: var(--u-field-control-inline-padding, var(--_field-control-padding));\n --_field-control-block-padding: var(--u-field-control-block-padding, var(--_field-control-padding));\n --_field-min-height: var(--u-field-min-height, 56px);\n --_field-placeholder-color: var(--u-field-placeholder-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n --_disabled-color: var(--u-field-disabled-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-field-disabled-opacity, .38)));\n --_disabled-bg-color: var(--u-filled-field-disabled-bg-color, rgba(var(--u-color-on-surface-rgb, ), var(--u-filled-field-background-disabled-opacity, .12)));\n --_color-primary: var(--u-color-primary, rgb(103, 80, 164));\n --_color-error: var(--u-field-error-color, var(--u-color-error, rgb(179, 38, 30)));\n --_active-indicator-opacity: 1;\n --_vertical-padding: var(--u-field-vertical-padding, 8px);\n --_icon-size: var(--u-field-icon-size, 1.5rem);\n --_icon-padding: var(--u-field-icon-padding, 12px);\n --_icon-color: var(--u-icon-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n --_focus-border-width: var(--u-text-field-focus-border-width, 2px);\n --_field-control-leading-padding: var(--_field-control-inline-padding);\n --_outlined-label-margin: var(--u-outlined-field-label-margin, 12px);\n --_outlined-label-padding: var(--u-outlined-field-label-padding, 4px);\n --u-label-input-start: auto;\n --u-label-input-span-leading-offset: 0;\n --u-label-input-span-trailing-offset: 0;\n --u-text-field-horizontal-padding: 12px;\n display: block;\n }\n\n .container {\n display: flex;\n align-items: center;\n position: relative;\n }\n .container::before, .container::after {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n pointer-events: none;\n }\n .container::before {\n background: var(--u-color-on-surface, rgb(29, 27, 32));\n transition: opacity 150ms;\n opacity: 0;\n }\n .container::after {\n border-width: var(--u-field-border-width, 1px);\n border-color: var(--u-field-border-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n }\n\n @media (hover: hover) {\n :host(:not([disabled]):not([invalid]):hover) .container.filled::before {\n opacity: var(--u-state-hover-opacity, 0.08);\n }\n :host(:not([disabled]):not([invalid]):not(:focus-within):hover) .container::after {\n border-color: var(--u-field-hover-border-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n }\n }\n .icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: var(--_icon-size);\n color: var(--_icon-color);\n font-size: var(--_icon-size);\n line-height: var(--_icon-size);\n }\n .icon::slotted(*) {\n flex-shrink: 0;\n }\n\n .leading-icon {\n margin-inline-start: var(--_icon-padding);\n }\n\n .trailing-icon {\n margin-inline-end: var(--_icon-padding);\n }\n\n .label {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-field-label-line-height, var(--u-body-l-line-height, 1.5rem));\n font-size: var(--u-field-label-font-size, var(--u-body-l-font-size, 1rem));\n letter-spacing: var(--u-field-label-letter-spacing, var(--u-body-l-letter-spacing, 0.03125rem));\n font-weight: var(--u-field-label-font-weight, var(--u-body-l-font-weight, var(--u-font-weight-regular, 400)));\n font-size: var(--u-field-label-font-size, var(--u-body-s-font-size, 0.75rem));\n display: block;\n position: absolute;\n inset-inline-start: var(--_field-control-leading-padding);\n margin-bottom: 0;\n line-height: var(--_label-line-height);\n color: var(--u-field-label-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n transition: inset 200ms, font-size 200ms;\n }\n\n .input-wrapper {\n display: flex;\n align-items: center;\n flex: 1;\n padding-block: var(--_vertical-padding);\n padding-inline: var(--_field-control-inline-padding);\n min-height: var(--_field-min-height);\n transition: opacity 150ms;\n }\n\n .input {\n color: var(--u-field-input-text-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n flex: 1;\n }\n .input:focus {\n outline: 0;\n }\n .input textarea,\n .input select,\n .input input,\n .input ::slotted(*) {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-field-control-line-height, var(--u-body-l-line-height, 1.5rem));\n font-size: var(--u-field-control-font-size, var(--u-body-l-font-size, 1rem));\n letter-spacing: var(--u-field-control-letter-spacing, var(--u-body-l-letter-spacing, 0.03125rem));\n font-weight: var(--u-field-control-font-weight, var(--u-body-l-font-weight, var(--u-font-weight-regular, 400)));\n display: block;\n width: 100%;\n color: var(--u-field-input-text-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n min-height: var(--_control-line-height);\n line-height: var(--_control-line-height);\n padding: 0;\n margin: 0;\n appearance: none;\n background: transparent;\n border: none;\n outline: 0 !important;\n caret-color: var(--_color-primary);\n }\n .input,\n .input textarea::placeholder,\n .input input::placeholder,\n .input ::slotted(select),\n .input ::slotted(:is(input, textarea))::placeholder {\n transition: color 150ms 100ms;\n }\n .input textarea::placeholder,\n .input input::placeholder,\n .input ::slotted(:is(input, textarea))::placeholder {\n color: var(--_field-placeholder-color);\n }\n\n .supporting-text {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-field-supporting-text-line-height, var(--u-body-s-line-height, 1rem));\n font-size: var(--u-field-supporting-text-font-size, var(--u-body-s-font-size, 0.75rem));\n letter-spacing: var(--u-field-supporting-text-letter-spacing, var(--u-body-s-letter-spacing, 0.0333333333rem));\n font-weight: var(--u-field-supporting-text-font-weight, var(--u-body-s-font-weight, var(--u-font-weight-regular, 400)));\n display: flex;\n color: var(--u-field-supporting-text, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n padding-inline: 16px;\n gap: 16px;\n }\n .supporting-text div:empty {\n display: none;\n }\n .supporting-text div,\n .supporting-text ::slotted(*) {\n display: inline-block;\n margin-top: 4px;\n }\n\n .error-text {\n display: none;\n }\n\n .counter div, .counter::slotted(*) {\n margin-inline-start: auto;\n }\n\n :host([has-leading-icon]) {\n --_field-control-leading-padding: calc(var(--_icon-padding) + var(--_icon-size) + var(--_field-control-inline-padding)) ;\n }\n\n :host(:not([has-leading-icon])) .leading-icon {\n display: none;\n }\n\n :host(:not([has-trailing-icon])) .container:has(slot[name=trailing-icon] span:empty) .trailing-icon {\n display: none;\n }\n\n :host(:focus-within) {\n --u-field-border-width: var(--_focus-border-width);\n }\n :host(:focus-within) .container::after {\n border-color: var(--u-field-focused-border-color, var(--_color-primary));\n }\n :host(:focus-within) .label {\n color: var(--u-field-label-focused-color, var(--_color-primary));\n }\n\n :host([invalid]) .container::after {\n border-color: var(--u-field-error-border-color, var(--_color-error));\n }\n :host([invalid]) .label {\n color: var(--u-field-label-error-color, var(--_color-error));\n }\n :host([invalid]) .supporting-text {\n color: var(--u-field-supporting-text-error-color, var(--_color-error));\n }\n :host([invalid]) .trailing-icon {\n color: var(--u-field-trailing-icon-error-color, var(--_color-error));\n }\n :host([invalid]) .leading-icon {\n color: var(--u-field-leading-icon-error-color, var(--_icon-color));\n }\n\n :host([invalid]) .supporting-text:has(.error-text div:not(:empty)) .error-text,\n :host([invalid][has-error-text]) .error-text {\n display: contents;\n }\n :host([invalid]) .supporting-text:has(.error-text div:not(:empty)) slot[name=supporting-text],\n :host([invalid][has-error-text]) slot[name=supporting-text] {\n display: none;\n }\n\n .container.filled {\n border-radius: var(--u-field-filled-border-radius, 4px 4px 0 0);\n background-color: var(--u-color-surface-container-highest, rgb(230, 224, 233));\n }\n .container.filled::after {\n border-bottom-style: solid;\n }\n .container.filled:not(.no-label) .input-wrapper {\n padding-top: calc(var(--_vertical-padding) + var(--_label-line-height));\n padding-bottom: var(--_vertical-padding);\n }\n .container.filled .label {\n top: var(--_vertical-padding);\n }\n .container.filled .input ::slotted(:is(input, textarea, select, button)) {\n display: block;\n }\n .container.outlined::after {\n --_mid-point: calc(var(--u-field-label-half-width) + var(--_outlined-label-margin) + var(--_outlined-label-padding));\n border-radius: var(--u-outlined-field-shape-corder, var(--u-shape-corner-small, 8px));\n border-style: solid;\n clip-path: polygon(0 0, var(--_mid-point) 0, var(--_mid-point) var(--_focus-border-width), var(--_mid-point) var(--_focus-border-width), var(--_mid-point) 0, 100% 0, 100% 100%, 0 100%);\n transition: clip-path 100ms;\n }\n .container.outlined .label {\n top: calc(var(--_label-line-height) / -2);\n }\n\n .container.outlined:focus-within::after,\n :host(:not([empty])) .container.outlined::after {\n --_end-point: calc(var(--u-field-label-width) + var(--_outlined-label-margin) + (var(--_outlined-label-padding) * 2));\n clip-path: polygon(0 0, var(--_outlined-label-margin) 0, var(--_outlined-label-margin) var(--_focus-border-width), var(--_end-point) var(--_focus-border-width), var(--_end-point) 0, 100% 0, 100% 100%, 0 100%);\n }\n .container.outlined:focus-within .label,\n :host(:not([empty])) .container.outlined .label {\n inset-inline-start: calc(var(--_outlined-label-margin) + var(--_outlined-label-padding));\n }\n\n :host([empty]) ::slotted(select) {\n color: var(--_field-placeholder-color);\n }\n\n :host([empty]:not(:focus-within)) .label {\n font-size: var(--u-field-label-font-size, var(--u-body-l-font-size, 1rem));\n pointer-events: none;\n top: calc(var(--_field-min-height) / 2 - var(--_label-line-height) / 2);\n }\n :host([empty]:not(:focus-within)) .container:not(.no-label) .input-wrapper,\n :host([empty]:not(:focus-within)) .container:not(.no-label) .input,\n :host([empty]:not(:focus-within)) .container:not(.no-label) .input input::placeholder,\n :host([empty]:not(:focus-within)) .container:not(.no-label) .input textarea::placeholder,\n :host([empty]:not(:focus-within)) .container:not(.no-label) ::slotted(:is(input, textarea))::placeholder,\n :host([empty]:not(:focus-within)) .container:not(.no-label) ::slotted(select) {\n color: transparent;\n transition: color 150ms;\n }\n\n .container.no-label::after {\n clip-path: none !important;\n }\n\n :host([disabled]) .container .filled {\n background-color: var(--u-filled-field-disabled-bg-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-filled-field-background-disabled-opacity, 0.04)));\n }\n :host([disabled]) .container::after {\n border-color: var(--u-field-disabled-border-color, var(--_disabled-color));\n }\n :host([disabled]) .supporting-text {\n color: var(--u-field-supporting-text-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .label {\n color: var(--u-field-label-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .input select,\n :host([disabled]) .input select::placeholder,\n :host([disabled]) .input textarea,\n :host([disabled]) .input textarea::placeholder,\n :host([disabled]) .input input,\n :host([disabled]) .input input::placeholder,\n :host([disabled]) .input ::slotted(*),\n :host([disabled]) .input ::slotted(:is(input, textarea))::placeholder {\n color: var(--u-field-input-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .trailing-icon {\n color: var(--u-field-trailing-icon-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .leading-icon {\n color: var(--u-field-leading-icon-disabled-color, var(--_disabled-color));\n }\n`"
6201
+ "default": "css `\n :host {\n --_control-line-height: var(--u-field-control-line-height, 1.5rem);\n --_label-line-height: var(--u-field-label-line-height, 1rem);\n --_field-icon-size: var(--u-field-icon-size, 1.5rem);\n --_field-control-padding: var(--u-field-control-padding, 16px);\n --_field-control-inline-padding: var(--u-field-control-inline-padding, var(--_field-control-padding));\n --_field-control-block-padding: var(--u-field-control-block-padding, var(--_field-control-padding));\n --_field-min-height: var(--u-field-min-height, 56px);\n --_field-placeholder-color: var(--u-field-placeholder-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n --_disabled-color: var(--u-field-disabled-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-field-disabled-opacity, .38)));\n --_disabled-bg-color: var(--u-filled-field-disabled-bg-color, rgba(var(--u-color-on-surface-rgb, ), var(--u-filled-field-background-disabled-opacity, .12)));\n --_color-primary: var(--u-color-primary, rgb(103, 80, 164));\n --_color-error: var(--u-field-error-color, var(--u-color-error, rgb(179, 38, 30)));\n --_active-indicator-opacity: 1;\n --_vertical-padding: var(--u-field-vertical-padding, 8px);\n --_icon-size: var(--u-field-icon-size, 1.5rem);\n --_icon-padding: var(--u-field-icon-padding, 12px);\n --_icon-color: var(--u-icon-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n --_focus-border-width: var(--u-text-field-focus-border-width, 2px);\n --_field-control-leading-padding: var(--_field-control-inline-padding);\n --_outlined-label-margin: var(--u-outlined-field-label-margin, 12px);\n --_outlined-label-padding: var(--u-outlined-field-label-padding, 4px);\n --u-label-input-start: auto;\n --u-label-input-span-leading-offset: 0;\n --u-label-input-span-trailing-offset: 0;\n --u-text-field-horizontal-padding: 12px;\n display: block;\n }\n\n .container {\n display: flex;\n align-items: center;\n position: relative;\n }\n .container::before, .container::after {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n pointer-events: none;\n }\n .container::before {\n background: var(--u-color-on-surface, rgb(29, 27, 32));\n transition: opacity 150ms;\n opacity: 0;\n }\n .container::after {\n border-width: var(--u-field-border-width, 1px);\n border-color: var(--u-field-border-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n }\n\n @media (hover: hover) {\n :host(:not([disabled]):not([invalid]):hover) .container.filled::before {\n opacity: var(--u-state-hover-opacity, 0.08);\n }\n :host(:not([disabled]):not([invalid]):not(:focus-within):hover) .container::after {\n border-color: var(--u-field-hover-border-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n }\n }\n .icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: var(--_icon-size);\n color: var(--_icon-color);\n font-size: var(--_icon-size);\n line-height: var(--_icon-size);\n }\n .icon::slotted(*) {\n flex-shrink: 0;\n }\n\n .leading-icon {\n margin-inline-start: var(--_icon-padding);\n }\n\n .trailing-icon {\n margin-inline-end: var(--_icon-padding);\n }\n\n .label {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-field-label-line-height, var(--u-body-l-line-height, 1.5rem));\n font-size: var(--u-field-label-font-size, var(--u-body-l-font-size, 1rem));\n letter-spacing: var(--u-field-label-letter-spacing, var(--u-body-l-letter-spacing, 0.03125rem));\n font-weight: var(--u-field-label-font-weight, var(--u-body-l-font-weight, var(--u-font-weight-regular, 400)));\n font-size: var(--u-field-label-font-size, var(--u-body-s-font-size, 0.75rem));\n display: block;\n position: absolute;\n inset-inline-start: var(--_field-control-leading-padding);\n margin-bottom: 0;\n line-height: var(--_label-line-height);\n color: var(--u-field-label-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n transition: inset 200ms, font-size 200ms;\n }\n\n .input-wrapper {\n display: flex;\n align-items: center;\n flex: 1;\n padding-block: var(--_vertical-padding);\n padding-inline: var(--_field-control-inline-padding);\n min-height: var(--_field-min-height);\n transition: opacity 150ms;\n }\n\n .input {\n color: var(--u-field-input-text-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n flex: 1;\n }\n .input:focus {\n outline: 0;\n }\n .input textarea,\n .input select,\n .input input,\n .input ::slotted(*) {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-field-control-line-height, var(--u-body-l-line-height, 1.5rem));\n font-size: var(--u-field-control-font-size, var(--u-body-l-font-size, 1rem));\n letter-spacing: var(--u-field-control-letter-spacing, var(--u-body-l-letter-spacing, 0.03125rem));\n font-weight: var(--u-field-control-font-weight, var(--u-body-l-font-weight, var(--u-font-weight-regular, 400)));\n display: block;\n width: 100%;\n color: var(--u-field-input-text-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n min-height: var(--_control-line-height);\n line-height: var(--_control-line-height);\n padding: 0;\n margin: 0;\n appearance: none;\n background: transparent;\n border: none;\n outline: 0 !important;\n caret-color: var(--_color-primary);\n }\n .input,\n .input textarea::placeholder,\n .input input::placeholder,\n .input ::slotted(select),\n .input ::slotted(:is(input, textarea))::placeholder {\n transition: color 150ms 100ms;\n }\n .input textarea::placeholder,\n .input input::placeholder,\n .input ::slotted(:is(input, textarea))::placeholder {\n color: var(--_field-placeholder-color);\n }\n\n .supporting-text {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-field-supporting-text-line-height, var(--u-body-s-line-height, 1rem));\n font-size: var(--u-field-supporting-text-font-size, var(--u-body-s-font-size, 0.75rem));\n letter-spacing: var(--u-field-supporting-text-letter-spacing, var(--u-body-s-letter-spacing, 0.0333333333rem));\n font-weight: var(--u-field-supporting-text-font-weight, var(--u-body-s-font-weight, var(--u-font-weight-regular, 400)));\n display: flex;\n color: var(--u-field-supporting-text, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n padding-inline: 16px;\n gap: 16px;\n }\n .supporting-text div:empty {\n display: none;\n }\n .supporting-text div,\n .supporting-text ::slotted(*) {\n display: inline-block;\n margin-top: 4px;\n }\n\n .error-text {\n display: none;\n }\n\n .counter div, .counter::slotted(*) {\n margin-inline-start: auto;\n }\n\n :host([has-leading-icon]) {\n --_field-control-leading-padding: calc(var(--_icon-padding) + var(--_icon-size) + var(--_field-control-inline-padding)) ;\n }\n\n :host(:not([has-leading-icon])) .leading-icon {\n display: none;\n }\n\n :host(:not([has-trailing-icon])) .container:has(slot[name=trailing-icon] span:empty) .trailing-icon {\n display: none;\n }\n\n :host(:focus-within) {\n --u-field-border-width: var(--_focus-border-width);\n }\n :host(:focus-within) .container::after {\n border-color: var(--u-field-focused-border-color, var(--_color-primary));\n }\n :host(:focus-within) .label {\n color: var(--u-field-label-focused-color, var(--_color-primary));\n }\n\n :host([invalid]) .container::after {\n border-color: var(--u-field-error-border-color, var(--_color-error));\n }\n :host([invalid]) .label {\n color: var(--u-field-label-error-color, var(--_color-error));\n }\n :host([invalid]) .supporting-text {\n color: var(--u-field-supporting-text-error-color, var(--_color-error));\n }\n :host([invalid]) .trailing-icon {\n color: var(--u-field-trailing-icon-error-color, var(--_color-error));\n }\n :host([invalid]) .leading-icon {\n color: var(--u-field-leading-icon-error-color, var(--_icon-color));\n }\n\n :host([invalid]) .supporting-text:has(.error-text div:not(:empty)) .error-text,\n :host([invalid][has-error-text]) .error-text {\n display: contents;\n }\n :host([invalid]) .supporting-text:has(.error-text div:not(:empty)) slot[name=supporting-text],\n :host([invalid][has-error-text]) slot[name=supporting-text] {\n display: none;\n }\n\n .container.filled {\n border-radius: var(--u-field-filled-border-radius, 4px 4px 0 0);\n background-color: var(--u-color-surface-container-highest, rgb(230, 224, 233));\n }\n .container.filled::after {\n border-bottom-style: solid;\n }\n .container.filled:not(.no-label) .input-wrapper {\n padding-top: calc(var(--_vertical-padding) + var(--_label-line-height));\n padding-bottom: var(--_vertical-padding);\n }\n .container.filled .label {\n top: var(--_vertical-padding);\n }\n .container.filled .input ::slotted(:is(input, textarea, select, button)) {\n display: block;\n }\n .container.outlined .label {\n top: calc(var(--_label-line-height) / -2);\n }\n\n .container.outlined:focus-within .label,\n :host(:not([empty])) .container.outlined .label {\n inset-inline-start: calc(var(--_outlined-label-margin) + var(--_outlined-label-padding));\n }\n\n :host([empty]) ::slotted(select) {\n color: var(--_field-placeholder-color);\n }\n\n :host([empty]:not(:focus-within)) .label {\n font-size: var(--u-field-label-font-size, var(--u-body-l-font-size, 1rem));\n pointer-events: none;\n top: calc(var(--_field-min-height) / 2 - var(--_label-line-height) / 2);\n }\n :host([empty]:not(:focus-within)) .container:not(.no-label) .input-wrapper,\n :host([empty]:not(:focus-within)) .container:not(.no-label) .input,\n :host([empty]:not(:focus-within)) .container:not(.no-label) .input input::placeholder,\n :host([empty]:not(:focus-within)) .container:not(.no-label) .input textarea::placeholder,\n :host([empty]:not(:focus-within)) .container:not(.no-label) ::slotted(:is(input, textarea))::placeholder,\n :host([empty]:not(:focus-within)) .container:not(.no-label) ::slotted(select) {\n color: transparent;\n transition: color 150ms;\n }\n\n .container.no-label::after {\n clip-path: none !important;\n }\n\n :host([disabled]) .container .filled {\n background-color: var(--u-filled-field-disabled-bg-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-filled-field-background-disabled-opacity, 0.04)));\n }\n :host([disabled]) .container::after {\n border-color: var(--u-field-disabled-border-color, var(--_disabled-color));\n }\n :host([disabled]) .supporting-text {\n color: var(--u-field-supporting-text-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .label {\n color: var(--u-field-label-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .input select,\n :host([disabled]) .input select::placeholder,\n :host([disabled]) .input textarea,\n :host([disabled]) .input textarea::placeholder,\n :host([disabled]) .input input,\n :host([disabled]) .input input::placeholder,\n :host([disabled]) .input ::slotted(*),\n :host([disabled]) .input ::slotted(:is(input, textarea))::placeholder {\n color: var(--u-field-input-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .trailing-icon {\n color: var(--u-field-trailing-icon-disabled-color, var(--_disabled-color));\n }\n :host([disabled]) .leading-icon {\n color: var(--u-field-leading-icon-disabled-color, var(--_disabled-color));\n }\n`"
6202
6202
  }
6203
6203
  ],
6204
6204
  "exports": [
@@ -6276,7 +6276,7 @@
6276
6276
  "kind": "field",
6277
6277
  "name": "supportingText",
6278
6278
  "type": {
6279
- "text": "| string\n | undefined"
6279
+ "text": "string | undefined"
6280
6280
  },
6281
6281
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
6282
6282
  "attribute": "supporting-text"
@@ -6526,7 +6526,7 @@
6526
6526
  {
6527
6527
  "name": "supporting-text",
6528
6528
  "type": {
6529
- "text": "| string\n | undefined"
6529
+ "text": "string | undefined"
6530
6530
  },
6531
6531
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
6532
6532
  "fieldName": "supportingText"
@@ -6768,7 +6768,7 @@
6768
6768
  "kind": "field",
6769
6769
  "name": "supportingText",
6770
6770
  "type": {
6771
- "text": "| string\n | undefined"
6771
+ "text": "string | undefined"
6772
6772
  },
6773
6773
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
6774
6774
  "attribute": "supporting-text",
@@ -7120,7 +7120,7 @@
7120
7120
  {
7121
7121
  "name": "supporting-text",
7122
7122
  "type": {
7123
- "text": "| string\n | undefined"
7123
+ "text": "string | undefined"
7124
7124
  },
7125
7125
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
7126
7126
  "fieldName": "supportingText",
@@ -7853,7 +7853,7 @@
7853
7853
  {
7854
7854
  "kind": "variable",
7855
7855
  "name": "styles",
7856
- "default": "css `\n :host {\n --u-elevation-level: var(--u-menu-elevation-level, 2);\n display: block;\n width: 0;\n }\n\n :host([positioning=relative]) {\n position: relative;\n }\n\n :host([positioning=fixed]) {\n position: fixed;\n }\n\n .ref {\n position: absolute;\n inset-inline-start: 0;\n pointer-events: none;\n }\n\n .menu {\n position: absolute;\n display: flex;\n min-width: var(--u-menu-min-width, 112px);\n max-width: var(--u-menu-max-width, 280px);\n background: var(--u-menu-bg-color, var(--u-color-surface-container, rgb(243, 237, 247)));\n border-radius: var(--u-menu-shape-corner, var(--u-shape-corner-extra-small, 4px));\n opacity: 0;\n transition: transform 350ms cubic-bezier(0.19, 1, 0.22, 1) 350ms, opacity 350ms;\n transform: scale3d(0, 0, 1);\n transform-origin: top;\n z-index: var(--u-menu-z-index, 1020);\n }\n .menu.up {\n transform: scale3d(1, 0, 0);\n transform-origin: bottom;\n }\n\n .content {\n width: 100%;\n padding-block: var(--u-menu-padding, 8px);\n opacity: 0;\n transition: opacity 1ms 400ms;\n scroll-padding-block: 32px;\n overflow: auto;\n }\n\n :host([open]) .menu {\n opacity: 1;\n transition: transform 350ms cubic-bezier(0.19, 1, 0.22, 1), opacity 250ms;\n transform: scale3d(1, 1, 1);\n }\n :host([open]) .content {\n opacity: 1;\n transition: opacity 300ms 150ms;\n }\n`"
7856
+ "default": "css `\n :host {\n --u-elevation-level: var(--u-menu-elevation-level, 2);\n display: block;\n width: 0;\n }\n\n :host([positioning=relative]) {\n position: relative;\n }\n\n :host([positioning=fixed]) {\n position: fixed;\n }\n\n .ref {\n position: absolute;\n inset-inline-start: 0;\n pointer-events: none;\n }\n\n .menu {\n position: absolute;\n display: flex;\n min-width: var(--u-menu-min-width, 112px);\n max-width: var(--u-menu-max-width, 280px);\n background: var(--u-menu-bg-color, var(--u-color-surface-container, rgb(243, 237, 247)));\n border-radius: var(--u-menu-shape-corner, var(--u-shape-corner-extra-small, 4px));\n opacity: 0;\n transition: transform 350ms cubic-bezier(0.19, 1, 0.22, 1) 350ms, opacity 350ms;\n transform: scale3d(1, 0, 0);\n transform-origin: top;\n z-index: var(--u-menu-z-index, 1020);\n }\n .menu.up {\n transform-origin: bottom;\n }\n\n .content {\n width: 100%;\n padding-block: var(--u-menu-padding, 8px);\n opacity: 0;\n transition: opacity 1ms 400ms;\n scroll-padding-block: 32px;\n overflow: auto;\n }\n\n :host([open]) .menu {\n opacity: 1;\n animation-fill-mode: forwards;\n animation-direction: normal;\n animation: menu-open 350ms cubic-bezier(0.19, 1, 0.22, 1);\n transform: scale3d(1, 1, 1);\n }\n :host([open]) .content {\n opacity: 1;\n transition: opacity 300ms 150ms;\n }\n\n @keyframes menu-open {\n from {\n opacity: 0;\n transform: scale3d(1, 0, 0);\n }\n to {\n opacity: 1;\n transform: scale3d(1, 1, 1);\n }\n }\n`"
7857
7857
  }
7858
7858
  ],
7859
7859
  "exports": [
@@ -10278,19 +10278,6 @@
10278
10278
  "text": "ExtendedOption"
10279
10279
  }
10280
10280
  },
10281
- {
10282
- "kind": "field",
10283
- "name": "_listItem"
10284
- },
10285
- {
10286
- "kind": "field",
10287
- "name": "#mutationObserver",
10288
- "privacy": "private",
10289
- "type": {
10290
- "text": "MutationObserver"
10291
- },
10292
- "default": "new MutationObserver(() => this.#updateContent())"
10293
- },
10294
10281
  {
10295
10282
  "kind": "field",
10296
10283
  "name": "value",
@@ -10933,10 +10920,16 @@
10933
10920
  "privacy": "protected",
10934
10921
  "parameters": [
10935
10922
  {
10936
- "name": "option",
10923
+ "name": "_",
10937
10924
  "type": {
10938
10925
  "text": "UmOption"
10939
10926
  }
10927
+ },
10928
+ {
10929
+ "name": "index",
10930
+ "type": {
10931
+ "text": "number"
10932
+ }
10940
10933
  }
10941
10934
  ],
10942
10935
  "inheritedFrom": {
@@ -11089,6 +11082,12 @@
11089
11082
  "type": {
11090
11083
  "text": "TMenuItem | undefined"
11091
11084
  }
11085
+ },
11086
+ {
11087
+ "name": "index",
11088
+ "type": {
11089
+ "text": "number"
11090
+ }
11092
11091
  }
11093
11092
  ],
11094
11093
  "inheritedFrom": {
@@ -11106,6 +11105,12 @@
11106
11105
  "text": "TMenuItem"
11107
11106
  }
11108
11107
  },
11108
+ {
11109
+ "name": "index",
11110
+ "type": {
11111
+ "text": "number"
11112
+ }
11113
+ },
11109
11114
  {
11110
11115
  "name": "active",
11111
11116
  "default": "true"
@@ -11305,9 +11310,26 @@
11305
11310
  "name": "#updateAccessibilityList",
11306
11311
  "parameters": [
11307
11312
  {
11308
- "name": "options",
11313
+ "name": "options",
11314
+ "type": {
11315
+ "text": "UmOption[]"
11316
+ }
11317
+ }
11318
+ ]
11319
+ },
11320
+ {
11321
+ "kind": "method",
11322
+ "name": "#createListItem",
11323
+ "return": {
11324
+ "type": {
11325
+ "text": "HTMLElement"
11326
+ }
11327
+ },
11328
+ "parameters": [
11329
+ {
11330
+ "name": "id",
11309
11331
  "type": {
11310
- "text": "UmOption[]"
11332
+ "text": "string"
11311
11333
  }
11312
11334
  }
11313
11335
  ]
@@ -11576,7 +11598,7 @@
11576
11598
  "kind": "field",
11577
11599
  "name": "supportingText",
11578
11600
  "type": {
11579
- "text": "| string\n | undefined"
11601
+ "text": "string | undefined"
11580
11602
  },
11581
11603
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
11582
11604
  "attribute": "supporting-text",
@@ -11882,7 +11904,7 @@
11882
11904
  {
11883
11905
  "name": "supporting-text",
11884
11906
  "type": {
11885
- "text": "| string\n | undefined"
11907
+ "text": "string | undefined"
11886
11908
  },
11887
11909
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
11888
11910
  "fieldName": "supportingText",
@@ -14203,7 +14225,7 @@
14203
14225
  "kind": "field",
14204
14226
  "name": "supportingText",
14205
14227
  "type": {
14206
- "text": "| string\n | undefined"
14228
+ "text": "string | undefined"
14207
14229
  },
14208
14230
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
14209
14231
  "attribute": "supporting-text",
@@ -14582,7 +14604,7 @@
14582
14604
  {
14583
14605
  "name": "supporting-text",
14584
14606
  "type": {
14585
- "text": "| string\n | undefined"
14607
+ "text": "string | undefined"
14586
14608
  },
14587
14609
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
14588
14610
  "fieldName": "supportingText",
@@ -15039,7 +15061,7 @@
15039
15061
  "kind": "field",
15040
15062
  "name": "supportingText",
15041
15063
  "type": {
15042
- "text": "| string\n | undefined"
15064
+ "text": "string | undefined"
15043
15065
  },
15044
15066
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
15045
15067
  "attribute": "supporting-text",
@@ -15439,7 +15461,7 @@
15439
15461
  {
15440
15462
  "name": "supporting-text",
15441
15463
  "type": {
15442
- "text": "| string\n | undefined"
15464
+ "text": "string | undefined"
15443
15465
  },
15444
15466
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
15445
15467
  "fieldName": "supportingText",
@@ -17029,7 +17051,7 @@
17029
17051
  "kind": "field",
17030
17052
  "name": "supportingText",
17031
17053
  "type": {
17032
- "text": "| string\n | undefined"
17054
+ "text": "string | undefined"
17033
17055
  },
17034
17056
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
17035
17057
  "attribute": "supporting-text",
@@ -17402,7 +17424,7 @@
17402
17424
  {
17403
17425
  "name": "supporting-text",
17404
17426
  "type": {
17405
- "text": "| string\n | undefined"
17427
+ "text": "string | undefined"
17406
17428
  },
17407
17429
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
17408
17430
  "fieldName": "supportingText",
@@ -17518,46 +17540,6 @@
17518
17540
  }
17519
17541
  ]
17520
17542
  },
17521
- {
17522
- "kind": "javascript-module",
17523
- "path": "src/shared/events/dispatch-event.ts",
17524
- "declarations": [],
17525
- "exports": []
17526
- },
17527
- {
17528
- "kind": "javascript-module",
17529
- "path": "src/shared/events/redispatch-event.ts",
17530
- "declarations": [
17531
- {
17532
- "kind": "function",
17533
- "name": "redispatchEvent",
17534
- "parameters": [
17535
- {
17536
- "name": "element",
17537
- "type": {
17538
- "text": "Element"
17539
- }
17540
- },
17541
- {
17542
- "name": "event",
17543
- "type": {
17544
- "text": "Event"
17545
- }
17546
- }
17547
- ]
17548
- }
17549
- ],
17550
- "exports": [
17551
- {
17552
- "kind": "js",
17553
- "name": "redispatchEvent",
17554
- "declaration": {
17555
- "name": "redispatchEvent",
17556
- "module": "src/shared/events/redispatch-event.ts"
17557
- }
17558
- }
17559
- ]
17560
- },
17561
17543
  {
17562
17544
  "kind": "javascript-module",
17563
17545
  "path": "src/shared/menu-field/menu-field-navigation-controller.ts",
@@ -17676,6 +17658,12 @@
17676
17658
  "type": {
17677
17659
  "text": "TMenuItem | undefined"
17678
17660
  }
17661
+ },
17662
+ {
17663
+ "name": "index",
17664
+ "type": {
17665
+ "text": "number"
17666
+ }
17679
17667
  }
17680
17668
  ]
17681
17669
  },
@@ -17689,6 +17677,12 @@
17689
17677
  "text": "TMenuItem"
17690
17678
  }
17691
17679
  },
17680
+ {
17681
+ "name": "index",
17682
+ "type": {
17683
+ "text": "number"
17684
+ }
17685
+ },
17692
17686
  {
17693
17687
  "name": "active",
17694
17688
  "default": "true"
@@ -17726,6 +17720,12 @@
17726
17720
  "type": {
17727
17721
  "text": "TMenuItem"
17728
17722
  }
17723
+ },
17724
+ {
17725
+ "name": "__",
17726
+ "type": {
17727
+ "text": "number"
17728
+ }
17729
17729
  }
17730
17730
  ]
17731
17731
  },
@@ -17754,6 +17754,117 @@
17754
17754
  "declarations": [],
17755
17755
  "exports": []
17756
17756
  },
17757
+ {
17758
+ "kind": "javascript-module",
17759
+ "path": "src/shared/events/dispatch-event.ts",
17760
+ "declarations": [],
17761
+ "exports": []
17762
+ },
17763
+ {
17764
+ "kind": "javascript-module",
17765
+ "path": "src/shared/events/redispatch-event.ts",
17766
+ "declarations": [
17767
+ {
17768
+ "kind": "function",
17769
+ "name": "redispatchEvent",
17770
+ "parameters": [
17771
+ {
17772
+ "name": "element",
17773
+ "type": {
17774
+ "text": "Element"
17775
+ }
17776
+ },
17777
+ {
17778
+ "name": "event",
17779
+ "type": {
17780
+ "text": "Event"
17781
+ }
17782
+ }
17783
+ ]
17784
+ }
17785
+ ],
17786
+ "exports": [
17787
+ {
17788
+ "kind": "js",
17789
+ "name": "redispatchEvent",
17790
+ "declaration": {
17791
+ "name": "redispatchEvent",
17792
+ "module": "src/shared/events/redispatch-event.ts"
17793
+ }
17794
+ }
17795
+ ]
17796
+ },
17797
+ {
17798
+ "kind": "javascript-module",
17799
+ "path": "src/shared/sets/set-base.styles.ts",
17800
+ "declarations": [
17801
+ {
17802
+ "kind": "variable",
17803
+ "name": "styles",
17804
+ "default": "css `\n :host {\n display: flex;\n gap: 8px;\n align-items: center;\n flex-wrap: nowrap;\n }\n\n :host([alignment=start]) {\n justify-content: flex-start;\n }\n\n :host([alignment=center]) {\n justify-content: center;\n }\n\n :host([alignment=end]) {\n justify-content: flex-end;\n }\n`"
17805
+ }
17806
+ ],
17807
+ "exports": [
17808
+ {
17809
+ "kind": "js",
17810
+ "name": "styles",
17811
+ "declaration": {
17812
+ "name": "styles",
17813
+ "module": "src/shared/sets/set-base.styles.ts"
17814
+ }
17815
+ }
17816
+ ]
17817
+ },
17818
+ {
17819
+ "kind": "javascript-module",
17820
+ "path": "src/shared/sets/set-base.ts",
17821
+ "declarations": [
17822
+ {
17823
+ "kind": "class",
17824
+ "description": "",
17825
+ "name": "UmSetBase",
17826
+ "members": [
17827
+ {
17828
+ "kind": "field",
17829
+ "name": "alignment",
17830
+ "type": {
17831
+ "text": "'start' | 'center' | 'end'"
17832
+ },
17833
+ "default": "'start'",
17834
+ "description": "Set the alignment of the set at the `start`, `center` or at the `end`.",
17835
+ "attribute": "alignment",
17836
+ "reflects": true
17837
+ }
17838
+ ],
17839
+ "attributes": [
17840
+ {
17841
+ "name": "alignment",
17842
+ "type": {
17843
+ "text": "'start' | 'center' | 'end'"
17844
+ },
17845
+ "default": "'start'",
17846
+ "description": "Set the alignment of the set at the `start`, `center` or at the `end`.",
17847
+ "fieldName": "alignment"
17848
+ }
17849
+ ],
17850
+ "superclass": {
17851
+ "name": "LitElement",
17852
+ "package": "lit"
17853
+ },
17854
+ "customElement": true
17855
+ }
17856
+ ],
17857
+ "exports": [
17858
+ {
17859
+ "kind": "js",
17860
+ "name": "UmSetBase",
17861
+ "declaration": {
17862
+ "name": "UmSetBase",
17863
+ "module": "src/shared/sets/set-base.ts"
17864
+ }
17865
+ }
17866
+ ]
17867
+ },
17757
17868
  {
17758
17869
  "kind": "javascript-module",
17759
17870
  "path": "src/shared/selection-control/selection-control-list-item.ts",
@@ -18025,77 +18136,6 @@
18025
18136
  }
18026
18137
  ]
18027
18138
  },
18028
- {
18029
- "kind": "javascript-module",
18030
- "path": "src/shared/sets/set-base.styles.ts",
18031
- "declarations": [
18032
- {
18033
- "kind": "variable",
18034
- "name": "styles",
18035
- "default": "css `\n :host {\n display: flex;\n gap: 8px;\n align-items: center;\n flex-wrap: nowrap;\n }\n\n :host([alignment=start]) {\n justify-content: flex-start;\n }\n\n :host([alignment=center]) {\n justify-content: center;\n }\n\n :host([alignment=end]) {\n justify-content: flex-end;\n }\n`"
18036
- }
18037
- ],
18038
- "exports": [
18039
- {
18040
- "kind": "js",
18041
- "name": "styles",
18042
- "declaration": {
18043
- "name": "styles",
18044
- "module": "src/shared/sets/set-base.styles.ts"
18045
- }
18046
- }
18047
- ]
18048
- },
18049
- {
18050
- "kind": "javascript-module",
18051
- "path": "src/shared/sets/set-base.ts",
18052
- "declarations": [
18053
- {
18054
- "kind": "class",
18055
- "description": "",
18056
- "name": "UmSetBase",
18057
- "members": [
18058
- {
18059
- "kind": "field",
18060
- "name": "alignment",
18061
- "type": {
18062
- "text": "'start' | 'center' | 'end'"
18063
- },
18064
- "default": "'start'",
18065
- "description": "Set the alignment of the set at the `start`, `center` or at the `end`.",
18066
- "attribute": "alignment",
18067
- "reflects": true
18068
- }
18069
- ],
18070
- "attributes": [
18071
- {
18072
- "name": "alignment",
18073
- "type": {
18074
- "text": "'start' | 'center' | 'end'"
18075
- },
18076
- "default": "'start'",
18077
- "description": "Set the alignment of the set at the `start`, `center` or at the `end`.",
18078
- "fieldName": "alignment"
18079
- }
18080
- ],
18081
- "superclass": {
18082
- "name": "LitElement",
18083
- "package": "lit"
18084
- },
18085
- "customElement": true
18086
- }
18087
- ],
18088
- "exports": [
18089
- {
18090
- "kind": "js",
18091
- "name": "UmSetBase",
18092
- "declaration": {
18093
- "name": "UmSetBase",
18094
- "module": "src/shared/sets/set-base.ts"
18095
- }
18096
- }
18097
- ]
18098
- },
18099
18139
  {
18100
18140
  "kind": "javascript-module",
18101
18141
  "path": "src/shared/text-field-base/text-field-base.styles.ts",
@@ -18263,7 +18303,7 @@
18263
18303
  "kind": "field",
18264
18304
  "name": "supportingText",
18265
18305
  "type": {
18266
- "text": "| string\n | undefined"
18306
+ "text": "string | undefined"
18267
18307
  },
18268
18308
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
18269
18309
  "attribute": "supporting-text",
@@ -18614,7 +18654,7 @@
18614
18654
  {
18615
18655
  "name": "supporting-text",
18616
18656
  "type": {
18617
- "text": "| string\n | undefined"
18657
+ "text": "string | undefined"
18618
18658
  },
18619
18659
  "description": "Supporting text conveys additional information about the field, such as how it will be used",
18620
18660
  "fieldName": "supportingText",