@sky.ui/core 0.0.30 → 0.0.31

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 (2) hide show
  1. package/dist/custom-elements.json +1294 -1294
  2. package/package.json +1 -1
package/dist/custom-elements.json CHANGED
@@ -453,34 +453,34 @@
453
453
  },
454
454
  {
455
455
  "kind": "javascript-module",
456
- "path": "src/sky-badge/sky-badge.ts",
456
+ "path": "src/sky-button/sky-button.ts",
457
457
  "declarations": [
458
458
  {
459
459
  "kind": "class",
460
460
  "description": "",
461
- "name": "SkyBadge",
461
+ "name": "SkyButton",
462
462
  "cssParts": [
463
463
  {
464
- "description": "Wrapper around the slotted content and the badge.",
465
- "name": "container"
464
+ "description": "The native `<button>` element.",
465
+ "name": "button"
466
466
  },
467
467
  {
468
- "description": "The badge element. Use `badgeRef` for positioning (e.g. tooltip anchor).",
469
- "name": "badge"
468
+ "description": "The optional left/right icons.",
469
+ "name": "icon"
470
470
  },
471
471
  {
472
- "description": "The icon element when `isIcon` is true.",
473
- "name": "icon"
472
+ "description": "Overlay displayed when loading.",
473
+ "name": "loading-overlay"
474
+ },
475
+ {
476
+ "description": "Spinner displayed when loading.",
477
+ "name": "spinner"
474
478
  }
475
479
  ],
476
480
  "slots": [
477
481
  {
478
- "description": "The content the badge attaches to.",
482
+ "description": "Default slot for the button label (replaces `label` property if used).",
479
483
  "name": ""
480
- },
481
- {
482
- "description": "Optional slot to override the badge content entirely.",
483
- "name": "badge"
484
484
  }
485
485
  ],
486
486
  "members": [
@@ -495,68 +495,61 @@
495
495
  },
496
496
  {
497
497
  "kind": "field",
498
- "name": "statusColor",
498
+ "name": "formAssociated",
499
499
  "type": {
500
- "text": "string"
500
+ "text": "boolean"
501
501
  },
502
- "default": "\"success\"",
503
- "description": "Badge background token or CSS color.",
504
- "attribute": "statusColor",
505
- "reflects": true
502
+ "static": true,
503
+ "default": "true"
506
504
  },
507
505
  {
508
506
  "kind": "field",
509
- "name": "textColor",
507
+ "name": "internals",
510
508
  "type": {
511
- "text": "string"
509
+ "text": "ElementInternals"
512
510
  },
513
- "default": "\"default\"",
514
- "description": "Text color token or CSS color.",
515
- "attribute": "textColor",
516
- "reflects": true
511
+ "privacy": "private"
517
512
  },
518
513
  {
519
514
  "kind": "field",
520
- "name": "iconColor",
515
+ "name": "variant",
521
516
  "type": {
522
- "text": "string"
517
+ "text": "SkyButtonVariant"
523
518
  },
524
- "default": "\"\"",
525
- "description": "Icon color token or CSS color; falls back to `textColor` when empty.",
526
- "attribute": "iconColor",
519
+ "default": "\"solid\"",
520
+ "description": "Visual variant of the button. Use `\"link\"` for text-only control with underline on hover. Default: `\"solid\"`.",
521
+ "attribute": "variant",
527
522
  "reflects": true
528
523
  },
529
524
  {
530
525
  "kind": "field",
531
- "name": "position",
526
+ "name": "color",
532
527
  "type": {
533
- "text": "SkyBadgePosition"
528
+ "text": "string"
534
529
  },
535
- "default": "\"default\"",
536
- "description": "Layout mode: `default | floating | inline`.",
537
- "attribute": "position",
538
- "reflects": true
530
+ "default": "\"primary\"",
531
+ "description": "Base color token or custom CSS color. Default: `\"primary\"`.",
532
+ "attribute": "color"
539
533
  },
540
534
  {
541
535
  "kind": "field",
542
- "name": "value",
536
+ "name": "type",
543
537
  "type": {
544
- "text": "string"
538
+ "text": "SkyButtonType"
545
539
  },
546
- "default": "\"\"",
547
- "description": "Badge text/count or icon name in icon mode.",
548
- "attribute": "value"
540
+ "default": "\"button\"",
541
+ "description": "Button type attribute. Default: `\"button\"`.",
542
+ "attribute": "type"
549
543
  },
550
544
  {
551
545
  "kind": "field",
552
- "name": "isIcon",
546
+ "name": "form",
553
547
  "type": {
554
- "text": "boolean"
548
+ "text": "string"
555
549
  },
556
- "default": "false",
557
- "description": "Renders icon mode when true.",
558
- "attribute": "isIcon",
559
- "reflects": true
550
+ "default": "\"\"",
551
+ "description": "Associated form ID for custom submit handling.",
552
+ "attribute": "form"
560
553
  },
561
554
  {
562
555
  "kind": "field",
@@ -564,545 +557,550 @@
564
557
  "type": {
565
558
  "text": "string"
566
559
  },
567
- "default": "\"\"",
568
- "description": "Badge and icon size CSS length.",
569
- "attribute": "size",
570
- "reflects": true
560
+ "default": "\"md\"",
561
+ "description": "Preset size token (`xs…xl`) or CSS size (e.g., `\"15px\"`, `\"1rem\"`). Default: `\"md\"`.",
562
+ "attribute": "size"
571
563
  },
572
564
  {
573
565
  "kind": "field",
574
- "name": "shape",
566
+ "name": "radius",
575
567
  "type": {
576
- "text": "SkyBadgeShape"
568
+ "text": "string"
577
569
  },
578
- "default": "\"custom\"",
579
- "description": "Badge shape: `circle | pill | custom`.",
580
- "attribute": "shape",
581
- "reflects": true
570
+ "default": "\"md\"",
571
+ "description": "Preset radius token (`none…full`) or CSS radius (e.g., `\"12px\"`). Default: `\"md\"`.",
572
+ "attribute": "radius"
582
573
  },
583
574
  {
584
575
  "kind": "field",
585
- "name": "max",
576
+ "name": "label",
586
577
  "type": {
587
- "text": "number"
578
+ "text": "string"
588
579
  },
589
- "default": "99",
590
- "description": "Maximum numeric count before rendering overflow label.",
591
- "attribute": "max"
580
+ "default": "\"Button\"",
581
+ "description": "Text label for the button. Ignored if default slot is used. Default: `\"Button\"`.",
582
+ "attribute": "label"
592
583
  },
593
584
  {
594
585
  "kind": "field",
595
- "name": "hideWhenZero",
586
+ "name": "disabled",
596
587
  "type": {
597
588
  "text": "boolean"
598
589
  },
599
590
  "default": "false",
600
- "description": "Hides badge when value resolves to numeric zero.",
601
- "attribute": "hideWhenZero"
591
+ "description": "Whether the button is disabled. Default: `false`.",
592
+ "attribute": "disabled",
593
+ "reflects": true
602
594
  },
603
595
  {
604
596
  "kind": "field",
605
- "name": "show",
597
+ "name": "loading",
606
598
  "type": {
607
599
  "text": "boolean"
608
600
  },
609
- "default": "true",
610
- "description": "Forces badge visibility independent of value.",
611
- "attribute": "show",
601
+ "default": "false",
602
+ "description": "Shows a loading overlay when true. Default: `false`.",
603
+ "attribute": "loading",
612
604
  "reflects": true
613
605
  },
614
606
  {
615
607
  "kind": "field",
616
- "name": "offsetX",
608
+ "name": "iconL",
617
609
  "type": {
618
610
  "text": "string"
619
611
  },
620
- "default": "\"0px\"",
621
- "description": "Horizontal offset CSS length.",
622
- "attribute": "offsetX"
612
+ "default": "\"\"",
613
+ "description": "Optional left-side icon (Iconify name). Default: `\"\"`.",
614
+ "attribute": "iconL"
623
615
  },
624
616
  {
625
617
  "kind": "field",
626
- "name": "offsetY",
618
+ "name": "iconR",
627
619
  "type": {
628
620
  "text": "string"
629
621
  },
630
- "default": "\"0px\"",
631
- "description": "Vertical offset CSS length.",
632
- "attribute": "offsetY"
622
+ "default": "\"\"",
623
+ "description": "Optional right-side icon (Iconify name). Default: `\"\"`.",
624
+ "attribute": "iconR"
633
625
  },
634
626
  {
635
627
  "kind": "field",
636
- "name": "ring",
628
+ "name": "iconOnly",
637
629
  "type": {
638
630
  "text": "boolean"
639
631
  },
640
632
  "default": "false",
641
- "description": "Enables visual ring around the badge.",
642
- "attribute": "ring"
643
- },
644
- {
645
- "kind": "field",
646
- "name": "ringColor",
647
- "type": {
648
- "text": "string"
649
- },
650
- "default": "\"primary\"",
651
- "description": "Ring color token or CSS color.",
652
- "attribute": "ringColor"
633
+ "description": "Square padding for icon-only buttons; hides label text. Default: `false`.",
634
+ "attribute": "iconOnly",
635
+ "reflects": true
653
636
  },
654
637
  {
655
638
  "kind": "field",
656
- "name": "ringOffset",
639
+ "name": "colors",
657
640
  "type": {
658
641
  "text": "string"
659
642
  },
660
- "default": "\"1px\"",
661
- "description": "Ring offset CSS length.",
662
- "attribute": "ringOffset"
643
+ "default": "\"\"",
644
+ "description": "Comma-separated color stops for gradient variant. Default: `\"\"`.",
645
+ "attribute": "colors"
663
646
  },
664
647
  {
665
648
  "kind": "field",
666
- "name": "badgeLabel",
649
+ "name": "animation",
667
650
  "type": {
668
- "text": "string | null"
651
+ "text": "SkyButtonAnimation"
669
652
  },
670
- "default": "null",
671
- "description": "ARIA label override.",
672
- "attribute": "badgeLabel"
653
+ "default": "\"auto\"",
654
+ "description": "Transform animation style. Default: `\"auto\"`.",
655
+ "attribute": "animation",
656
+ "reflects": true
673
657
  },
674
658
  {
675
659
  "kind": "field",
676
- "name": "badgeAriaHidden",
660
+ "name": "_hasMeaningfulSlot",
677
661
  "type": {
678
662
  "text": "boolean"
679
663
  },
680
- "default": "false",
681
- "description": "Hides badge from assistive technology when true.",
682
- "attribute": "badgeAriaHidden"
664
+ "privacy": "private",
665
+ "default": "false"
683
666
  },
684
667
  {
685
668
  "kind": "field",
686
- "name": "interactive",
669
+ "name": "_styleVars",
687
670
  "type": {
688
- "text": "boolean"
671
+ "text": "Record<string, string>"
689
672
  },
690
- "default": "false",
691
- "description": "Enables focus/activation and `badge-click` emission.",
692
- "attribute": "interactive"
673
+ "privacy": "private",
674
+ "default": "{}",
675
+ "description": "Inline CSS variable cache."
693
676
  },
694
677
  {
695
- "kind": "field",
696
- "name": "placement",
697
- "type": {
698
- "text": "SkyBadgePlacement"
678
+ "kind": "method",
679
+ "name": "_slotHasMeaningfulContent",
680
+ "privacy": "private",
681
+ "return": {
682
+ "type": {
683
+ "text": "boolean"
684
+ }
699
685
  },
700
- "default": "\"custom\"",
701
- "description": "Anchor placement preset for badge positioning.",
702
- "attribute": "placement",
703
- "reflects": true
686
+ "parameters": [
687
+ {
688
+ "name": "slotEl",
689
+ "type": {
690
+ "text": "HTMLSlotElement"
691
+ }
692
+ }
693
+ ]
704
694
  },
705
695
  {
706
696
  "kind": "field",
707
- "name": "_badgeEl",
708
- "type": {
709
- "text": "HTMLSpanElement"
710
- },
697
+ "name": "_onSlotChange",
711
698
  "privacy": "private"
712
699
  },
713
- {
714
- "kind": "field",
715
- "name": "badgeRef",
716
- "privacy": "public",
717
- "description": "Ref for the badge element (e.g. for tooltip anchor or positioning)."
718
- },
719
- {
720
- "kind": "field",
721
- "name": "shadowRootOptions",
722
- "type": {
723
- "text": "ShadowRootInit"
724
- },
725
- "static": true,
726
- "default": "{ mode: \"open\", delegatesFocus: true, }"
727
- },
728
700
  {
729
701
  "kind": "method",
730
- "name": "showBadge",
731
- "privacy": "public",
702
+ "name": "_toSquarePadding",
703
+ "privacy": "private",
732
704
  "return": {
733
705
  "type": {
734
- "text": "void"
706
+ "text": "string"
735
707
  }
736
708
  },
737
- "description": "Forces badge visibility on."
738
- },
739
- {
740
- "kind": "method",
741
- "name": "hideBadge",
742
- "privacy": "public",
743
- "return": {
744
- "type": {
745
- "text": "void"
709
+ "parameters": [
710
+ {
711
+ "name": "padding",
712
+ "type": {
713
+ "text": "string"
714
+ }
746
715
  }
747
- },
748
- "description": "Forces badge visibility off."
716
+ ],
717
+ "description": "Uses vertical padding for equal sides (icon-only square control)."
749
718
  },
750
719
  {
751
720
  "kind": "method",
752
- "name": "setValue",
753
- "privacy": "public",
721
+ "name": "_resolveSize",
722
+ "privacy": "private",
754
723
  "return": {
755
724
  "type": {
756
- "text": "void"
725
+ "text": "{\r\n padding: string;\r\n fontSize: string;\r\n gap: string;\r\n icon: string;\r\n spinner: string;\r\n }"
757
726
  }
758
727
  },
759
728
  "parameters": [
760
729
  {
761
- "name": "value",
730
+ "name": "input",
762
731
  "type": {
763
732
  "text": "string"
764
- },
765
- "description": "Badge value or icon name."
733
+ }
766
734
  }
767
- ],
768
- "description": "Updates badge value for text/count or icon modes."
769
- },
770
- {
771
- "kind": "field",
772
- "name": "_onActivate",
773
- "privacy": "private",
774
- "description": "Emits `badge-click` for interactive activation."
735
+ ]
775
736
  },
776
737
  {
777
- "kind": "field",
778
- "name": "_onKeydown",
738
+ "kind": "method",
739
+ "name": "_isThemeBorderShorthand",
779
740
  "privacy": "private",
780
- "description": "Handles keyboard activation with Enter and Space."
741
+ "return": {
742
+ "type": {
743
+ "text": "boolean"
744
+ }
745
+ },
746
+ "parameters": [
747
+ {
748
+ "name": "border",
749
+ "type": {
750
+ "text": "string | undefined"
751
+ }
752
+ }
753
+ ],
754
+ "description": "Theme tokens like `var(--sky-border-primary)` are full border shorthands, not colors."
781
755
  },
782
756
  {
783
757
  "kind": "method",
784
- "name": "_computeAriaLabel",
758
+ "name": "_borderColorFromShorthand",
785
759
  "privacy": "private",
786
760
  "return": {
787
761
  "type": {
788
- "text": "string | null"
762
+ "text": "string"
789
763
  }
790
764
  },
791
765
  "parameters": [
792
766
  {
793
- "name": "displayValue",
767
+ "name": "border",
794
768
  "type": {
795
- "text": "string | null"
769
+ "text": "string | undefined"
796
770
  }
797
771
  }
798
772
  ],
799
- "description": "Computes accessible badge label from current render state."
773
+ "description": "Extracts the color token from a `Npx solid …` border shorthand."
800
774
  },
801
775
  {
802
776
  "kind": "method",
803
- "name": "_computeAnchors",
777
+ "name": "focusButton",
778
+ "privacy": "public",
779
+ "return": {
780
+ "type": {
781
+ "text": "void"
782
+ }
783
+ },
784
+ "description": "Focuses the internal native button."
785
+ },
786
+ {
787
+ "kind": "method",
788
+ "name": "clickButton",
789
+ "privacy": "public",
790
+ "return": {
791
+ "type": {
792
+ "text": "void"
793
+ }
794
+ },
795
+ "description": "Triggers a click on the internal native button when enabled."
796
+ },
797
+ {
798
+ "kind": "method",
799
+ "name": "_createRipple",
804
800
  "privacy": "private",
805
801
  "return": {
806
802
  "type": {
807
- "text": "{\r\n top: string;\r\n right: string;\r\n bottom: string;\r\n left: string;\r\n }"
803
+ "text": "void"
808
804
  }
809
805
  },
810
806
  "parameters": [
811
807
  {
812
- "name": "placement",
808
+ "name": "event",
813
809
  "type": {
814
- "text": "SkyBadgePlacement"
810
+ "text": "MouseEvent"
815
811
  }
816
812
  }
817
- ],
818
- "description": "Resolves anchor edges from placement preset."
813
+ ]
819
814
  },
820
815
  {
821
816
  "kind": "method",
822
- "name": "_resolveBadgeSurface",
823
- "privacy": "private",
817
+ "name": "formDisabledCallback",
824
818
  "return": {
825
819
  "type": {
826
- "text": "{\r\n bg: string;\r\n color: string;\r\n border: string;\r\n }"
820
+ "text": "void"
827
821
  }
828
822
  },
829
- "description": "Maps semantic status tokens to soft badge surface colors."
830
- }
831
- ],
832
- "events": [
823
+ "parameters": [
824
+ {
825
+ "name": "disabled",
826
+ "type": {
827
+ "text": "boolean"
828
+ }
829
+ }
830
+ ]
831
+ },
833
832
  {
833
+ "kind": "field",
834
+ "name": "formOwner",
834
835
  "type": {
835
- "text": "CustomEvent<SkyBadgeClickEventDetail>"
836
+ "text": "HTMLFormElement | null"
836
837
  },
837
- "description": "Emitted when badge activation occurs via click, Enter, or Space while `interactive` is true.",
838
- "name": "badge-click"
839
- }
840
- ],
841
- "attributes": [
838
+ "readonly": true
839
+ },
842
840
  {
843
- "name": "statusColor",
844
- "type": {
845
- "text": "string"
841
+ "kind": "method",
842
+ "name": "_handleClick",
843
+ "privacy": "private",
844
+ "return": {
845
+ "type": {
846
+ "text": "void"
847
+ }
846
848
  },
847
- "default": "\"success\"",
848
- "description": "Badge background token or CSS color.",
849
- "fieldName": "statusColor"
849
+ "parameters": [
850
+ {
851
+ "name": "event",
852
+ "type": {
853
+ "text": "MouseEvent"
854
+ }
855
+ }
856
+ ]
850
857
  },
851
858
  {
852
- "name": "textColor",
859
+ "kind": "method",
860
+ "name": "_iconOnlyName",
861
+ "privacy": "private",
862
+ "return": {
863
+ "type": {
864
+ "text": "string"
865
+ }
866
+ }
867
+ }
868
+ ],
869
+ "attributes": [
870
+ {
871
+ "name": "variant",
853
872
  "type": {
854
- "text": "string"
873
+ "text": "SkyButtonVariant"
855
874
  },
856
- "default": "\"default\"",
857
- "description": "Text color token or CSS color.",
858
- "fieldName": "textColor"
875
+ "default": "\"solid\"",
876
+ "description": "Visual variant of the button. Use `\"link\"` for text-only control with underline on hover. Default: `\"solid\"`.",
877
+ "fieldName": "variant"
859
878
  },
860
879
  {
861
- "name": "iconColor",
880
+ "name": "color",
862
881
  "type": {
863
882
  "text": "string"
864
883
  },
865
- "default": "\"\"",
866
- "description": "Icon color token or CSS color; falls back to `textColor` when empty.",
867
- "fieldName": "iconColor"
884
+ "default": "\"primary\"",
885
+ "description": "Base color token or custom CSS color. Default: `\"primary\"`.",
886
+ "fieldName": "color"
868
887
  },
869
888
  {
870
- "name": "position",
889
+ "name": "type",
871
890
  "type": {
872
- "text": "SkyBadgePosition"
891
+ "text": "SkyButtonType"
873
892
  },
874
- "default": "\"default\"",
875
- "description": "Layout mode: `default | floating | inline`.",
876
- "fieldName": "position"
893
+ "default": "\"button\"",
894
+ "description": "Button type attribute. Default: `\"button\"`.",
895
+ "fieldName": "type"
877
896
  },
878
897
  {
879
- "name": "value",
898
+ "name": "form",
880
899
  "type": {
881
900
  "text": "string"
882
901
  },
883
902
  "default": "\"\"",
884
- "description": "Badge text/count or icon name in icon mode.",
885
- "fieldName": "value"
886
- },
887
- {
888
- "name": "isIcon",
889
- "type": {
890
- "text": "boolean"
891
- },
892
- "default": "false",
893
- "description": "Renders icon mode when true.",
894
- "fieldName": "isIcon"
903
+ "description": "Associated form ID for custom submit handling.",
904
+ "fieldName": "form"
895
905
  },
896
906
  {
897
907
  "name": "size",
898
908
  "type": {
899
909
  "text": "string"
900
910
  },
901
- "default": "\"\"",
902
- "description": "Badge and icon size CSS length.",
911
+ "default": "\"md\"",
912
+ "description": "Preset size token (`xs…xl`) or CSS size (e.g., `\"15px\"`, `\"1rem\"`). Default: `\"md\"`.",
903
913
  "fieldName": "size"
904
914
  },
905
915
  {
906
- "name": "shape",
916
+ "name": "radius",
907
917
  "type": {
908
- "text": "SkyBadgeShape"
918
+ "text": "string"
909
919
  },
910
- "default": "\"custom\"",
911
- "description": "Badge shape: `circle | pill | custom`.",
912
- "fieldName": "shape"
920
+ "default": "\"md\"",
921
+ "description": "Preset radius token (`none…full`) or CSS radius (e.g., `\"12px\"`). Default: `\"md\"`.",
922
+ "fieldName": "radius"
913
923
  },
914
924
  {
915
- "name": "max",
925
+ "name": "label",
916
926
  "type": {
917
- "text": "number"
927
+ "text": "string"
918
928
  },
919
- "default": "99",
920
- "description": "Maximum numeric count before rendering overflow label.",
921
- "fieldName": "max"
929
+ "default": "\"Button\"",
930
+ "description": "Text label for the button. Ignored if default slot is used. Default: `\"Button\"`.",
931
+ "fieldName": "label"
922
932
  },
923
933
  {
924
- "name": "hideWhenZero",
934
+ "name": "disabled",
925
935
  "type": {
926
936
  "text": "boolean"
927
937
  },
928
938
  "default": "false",
929
- "description": "Hides badge when value resolves to numeric zero.",
930
- "fieldName": "hideWhenZero"
939
+ "description": "Whether the button is disabled. Default: `false`.",
940
+ "fieldName": "disabled"
931
941
  },
932
942
  {
933
- "name": "show",
943
+ "name": "loading",
934
944
  "type": {
935
945
  "text": "boolean"
936
946
  },
937
- "default": "true",
938
- "description": "Forces badge visibility independent of value.",
939
- "fieldName": "show"
947
+ "default": "false",
948
+ "description": "Shows a loading overlay when true. Default: `false`.",
949
+ "fieldName": "loading"
940
950
  },
941
951
  {
942
- "name": "offsetX",
952
+ "name": "iconL",
943
953
  "type": {
944
954
  "text": "string"
945
955
  },
946
- "default": "\"0px\"",
947
- "description": "Horizontal offset CSS length.",
948
- "fieldName": "offsetX"
956
+ "default": "\"\"",
957
+ "description": "Optional left-side icon (Iconify name). Default: `\"\"`.",
958
+ "fieldName": "iconL"
949
959
  },
950
960
  {
951
- "name": "offsetY",
961
+ "name": "iconR",
952
962
  "type": {
953
963
  "text": "string"
954
964
  },
955
- "default": "\"0px\"",
956
- "description": "Vertical offset CSS length.",
957
- "fieldName": "offsetY"
965
+ "default": "\"\"",
966
+ "description": "Optional right-side icon (Iconify name). Default: `\"\"`.",
967
+ "fieldName": "iconR"
958
968
  },
959
969
  {
960
- "name": "ring",
970
+ "name": "iconOnly",
961
971
  "type": {
962
972
  "text": "boolean"
963
973
  },
964
974
  "default": "false",
965
- "description": "Enables visual ring around the badge.",
966
- "fieldName": "ring"
967
- },
968
- {
969
- "name": "ringColor",
970
- "type": {
971
- "text": "string"
972
- },
973
- "default": "\"primary\"",
974
- "description": "Ring color token or CSS color.",
975
- "fieldName": "ringColor"
975
+ "description": "Square padding for icon-only buttons; hides label text. Default: `false`.",
976
+ "fieldName": "iconOnly"
976
977
  },
977
978
  {
978
- "name": "ringOffset",
979
+ "name": "colors",
979
980
  "type": {
980
981
  "text": "string"
981
982
  },
982
- "default": "\"1px\"",
983
- "description": "Ring offset CSS length.",
984
- "fieldName": "ringOffset"
985
- },
986
- {
987
- "name": "badgeLabel",
988
- "type": {
989
- "text": "string | null"
990
- },
991
- "default": "null",
992
- "description": "ARIA label override.",
993
- "fieldName": "badgeLabel"
994
- },
995
- {
996
- "name": "badgeAriaHidden",
997
- "type": {
998
- "text": "boolean"
999
- },
1000
- "default": "false",
1001
- "description": "Hides badge from assistive technology when true.",
1002
- "fieldName": "badgeAriaHidden"
1003
- },
1004
- {
1005
- "name": "interactive",
1006
- "type": {
1007
- "text": "boolean"
1008
- },
1009
- "default": "false",
1010
- "description": "Enables focus/activation and `badge-click` emission.",
1011
- "fieldName": "interactive"
983
+ "default": "\"\"",
984
+ "description": "Comma-separated color stops for gradient variant. Default: `\"\"`.",
985
+ "fieldName": "colors"
1012
986
  },
1013
987
  {
1014
- "name": "placement",
988
+ "name": "animation",
1015
989
  "type": {
1016
- "text": "SkyBadgePlacement"
990
+ "text": "SkyButtonAnimation"
1017
991
  },
1018
- "default": "\"custom\"",
1019
- "description": "Anchor placement preset for badge positioning.",
1020
- "fieldName": "placement"
992
+ "default": "\"auto\"",
993
+ "description": "Transform animation style. Default: `\"auto\"`.",
994
+ "fieldName": "animation"
1021
995
  }
1022
996
  ],
1023
997
  "superclass": {
1024
998
  "name": "LitElement",
1025
999
  "package": "lit"
1026
1000
  },
1027
- "tagName": "sky-badge",
1001
+ "tagName": "sky-button",
1028
1002
  "customElement": true,
1029
- "summary": "Badge for status dots, counts, or icons anchored to slotted content."
1003
+ "summary": "Styled button supporting variants, icons, loading state, ripple feedback, and form-associated behavior."
1030
1004
  }
1031
1005
  ],
1032
1006
  "exports": [
1033
1007
  {
1034
1008
  "kind": "js",
1035
- "name": "SkyBadge",
1009
+ "name": "SkyButton",
1036
1010
  "declaration": {
1037
- "name": "SkyBadge",
1038
- "module": "src/sky-badge/sky-badge.ts"
1011
+ "name": "SkyButton",
1012
+ "module": "src/sky-button/sky-button.ts"
1039
1013
  }
1040
1014
  },
1041
1015
  {
1042
1016
  "kind": "custom-element-definition",
1043
- "name": "sky-badge",
1017
+ "name": "sky-button",
1044
1018
  "declaration": {
1045
- "name": "SkyBadge",
1046
- "module": "src/sky-badge/sky-badge.ts"
1019
+ "name": "SkyButton",
1020
+ "module": "src/sky-button/sky-button.ts"
1047
1021
  }
1048
1022
  }
1049
1023
  ]
1050
1024
  },
1051
1025
  {
1052
1026
  "kind": "javascript-module",
1053
- "path": "src/sky-appbar/sky-appbar.ts",
1027
+ "path": "src/sky-avatar/sky-avatar.ts",
1054
1028
  "declarations": [
1055
1029
  {
1056
1030
  "kind": "class",
1057
1031
  "description": "",
1058
- "name": "SkyAppbar",
1032
+ "name": "SkyAvatar",
1059
1033
  "cssParts": [
1060
1034
  {
1061
- "description": "Wrapper that contains the leading slot, title, and actions.",
1062
- "name": "content"
1063
- },
1064
- {
1065
- "description": "Container for the leading slot (e.g. menu button).",
1066
- "name": "leading"
1035
+ "description": "The avatar container element.",
1036
+ "name": "avatar"
1067
1037
  },
1068
1038
  {
1069
- "description": "The title area (contains .title-text with the title string).",
1070
- "name": "title"
1039
+ "description": "The loading overlay container (shown when `loading` is true).",
1040
+ "name": "loading-overlay"
1071
1041
  },
1072
1042
  {
1073
- "description": "The trailing actions container.",
1074
- "name": "actions"
1043
+ "description": "The spinner element shown when loading.",
1044
+ "name": "spinner"
1075
1045
  }
1076
1046
  ],
1077
1047
  "slots": [
1078
1048
  {
1079
- "description": "Leading area (e.g., menu/back button). Defaults to a hamburger icon.",
1080
- "name": "button"
1081
- },
1082
- {
1083
- "description": "Trailing actions (icons/buttons). This is the default slot.",
1049
+ "description": "Fallback content (e.g., initials or an icon) rendered when `image` is empty.",
1084
1050
  "name": ""
1085
1051
  }
1086
1052
  ],
1087
1053
  "members": [
1088
1054
  {
1089
1055
  "kind": "field",
1090
- "name": "dependencies",
1056
+ "name": "size",
1091
1057
  "type": {
1092
- "text": "Record<string, CustomElementConstructor>"
1058
+ "text": "string"
1093
1059
  },
1094
- "static": true,
1095
- "default": "{ \"sky-icon\": SkyIcon, }"
1060
+ "default": "\"50px\"",
1061
+ "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
1062
+ "attribute": "size"
1096
1063
  },
1097
1064
  {
1098
1065
  "kind": "field",
1099
- "name": "title",
1066
+ "name": "image",
1100
1067
  "type": {
1101
1068
  "text": "string"
1102
1069
  },
1103
- "default": "\"App Bar\"",
1104
- "description": "Title text displayed in the app bar.",
1105
- "attribute": "title"
1070
+ "default": "\"\"",
1071
+ "description": "Image URL; fallback slot is shown on load error.",
1072
+ "attribute": "image"
1073
+ },
1074
+ {
1075
+ "kind": "field",
1076
+ "name": "fit",
1077
+ "type": {
1078
+ "text": "SkyAvatarFit"
1079
+ },
1080
+ "default": "\"cover\"",
1081
+ "description": "Image fill mode: `cover` (default) or `contain`.",
1082
+ "attribute": "fit",
1083
+ "reflects": true
1084
+ },
1085
+ {
1086
+ "kind": "field",
1087
+ "name": "radius",
1088
+ "type": {
1089
+ "text": "string"
1090
+ },
1091
+ "default": "\"md\"",
1092
+ "description": "Border radius token or CSS value.",
1093
+ "attribute": "radius"
1094
+ },
1095
+ {
1096
+ "kind": "field",
1097
+ "name": "alt",
1098
+ "type": {
1099
+ "text": "string"
1100
+ },
1101
+ "default": "\"\"",
1102
+ "description": "Accessible name when image content conveys meaning.",
1103
+ "attribute": "alt"
1106
1104
  },
1107
1105
  {
1108
1106
  "kind": "field",
@@ -1110,206 +1108,321 @@
1110
1108
  "type": {
1111
1109
  "text": "string"
1112
1110
  },
1113
- "default": "\"default\"",
1114
- "description": "Semantic token or CSS color for bar background; foreground color is derived for contrast.",
1111
+ "default": "\"dark\"",
1112
+ "description": "Token or CSS color applied to fallback slot content.",
1115
1113
  "attribute": "color"
1116
1114
  },
1117
1115
  {
1118
1116
  "kind": "field",
1119
- "name": "url",
1117
+ "name": "outline",
1120
1118
  "type": {
1121
1119
  "text": "string"
1122
1120
  },
1123
1121
  "default": "\"\"",
1124
- "description": "Background image URL.",
1125
- "attribute": "url"
1122
+ "description": "CSS `outline` value.",
1123
+ "attribute": "outline"
1126
1124
  },
1127
1125
  {
1128
1126
  "kind": "field",
1129
- "name": "banner",
1127
+ "name": "outlineOffset",
1128
+ "type": {
1129
+ "text": "string"
1130
+ },
1131
+ "default": "\"2px\"",
1132
+ "description": "CSS `outline-offset` value.",
1133
+ "attribute": "outlineOffset"
1134
+ },
1135
+ {
1136
+ "kind": "field",
1137
+ "name": "loading",
1130
1138
  "type": {
1131
1139
  "text": "boolean"
1132
1140
  },
1133
- "default": "true",
1134
- "description": "Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.",
1135
- "attribute": "banner"
1141
+ "default": "false",
1142
+ "description": "Shows loading overlay when true.",
1143
+ "attribute": "loading",
1144
+ "reflects": true
1136
1145
  },
1137
1146
  {
1138
1147
  "kind": "field",
1139
- "name": "dense",
1148
+ "name": "disabled",
1140
1149
  "type": {
1141
1150
  "text": "boolean"
1142
1151
  },
1143
1152
  "default": "false",
1144
- "description": "Enables compact vertical spacing.",
1145
- "attribute": "dense"
1153
+ "description": "Dims and disables pointer interactions.",
1154
+ "attribute": "disabled",
1155
+ "reflects": true
1146
1156
  },
1147
1157
  {
1148
1158
  "kind": "field",
1149
- "name": "elevated",
1159
+ "name": "interactive",
1150
1160
  "type": {
1151
1161
  "text": "boolean"
1152
1162
  },
1153
1163
  "default": "false",
1154
- "description": "Applies elevated shadow styling.",
1155
- "attribute": "elevated"
1164
+ "description": "Enables interactive behavior with keyboard/click activation.",
1165
+ "attribute": "interactive"
1156
1166
  },
1157
1167
  {
1158
1168
  "kind": "field",
1159
- "name": "leadingLabel",
1169
+ "name": "shadow",
1160
1170
  "type": {
1161
- "text": "string"
1171
+ "text": "boolean"
1162
1172
  },
1163
- "default": "\"Open menu\"",
1164
- "description": "Accessible label for default leading button fallback.",
1165
- "attribute": "leadingLabel"
1173
+ "default": "false",
1174
+ "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
1175
+ "attribute": "shadow",
1176
+ "reflects": true
1177
+ },
1178
+ {
1179
+ "kind": "field",
1180
+ "name": "_imageError",
1181
+ "type": {
1182
+ "text": "boolean"
1183
+ },
1184
+ "privacy": "private",
1185
+ "default": "false",
1186
+ "description": "True when image failed to load; show slot instead."
1187
+ },
1188
+ {
1189
+ "kind": "field",
1190
+ "name": "_onImageLoad",
1191
+ "privacy": "private",
1192
+ "description": "Marks image load success and keeps image rendering active."
1193
+ },
1194
+ {
1195
+ "kind": "field",
1196
+ "name": "_onImageError",
1197
+ "privacy": "private",
1198
+ "description": "Marks image load failure and enables fallback slot rendering."
1166
1199
  },
1167
1200
  {
1168
1201
  "kind": "method",
1169
- "name": "_applyColorSurface",
1202
+ "name": "_handleInteractiveClick",
1170
1203
  "privacy": "private",
1171
1204
  "return": {
1172
1205
  "type": {
1173
1206
  "text": "void"
1174
1207
  }
1175
1208
  },
1176
- "description": "Applies glass vs solid surface tokens from `color`."
1209
+ "parameters": [
1210
+ {
1211
+ "name": "e",
1212
+ "type": {
1213
+ "text": "Event"
1214
+ }
1215
+ }
1216
+ ],
1217
+ "description": "Re-dispatches click in interactive mode for host-level consumers."
1177
1218
  },
1178
1219
  {
1179
1220
  "kind": "method",
1180
- "name": "_applyBackgroundImage",
1221
+ "name": "_handleInteractiveKeydown",
1181
1222
  "privacy": "private",
1182
1223
  "return": {
1183
1224
  "type": {
1184
1225
  "text": "void"
1185
1226
  }
1186
1227
  },
1187
- "description": "Sets background image CSS variable from `url`."
1188
- }
1189
- ],
1190
- "attributes": [
1191
- {
1192
- "name": "title",
1193
- "type": {
1194
- "text": "string"
1195
- },
1196
- "default": "\"App Bar\"",
1197
- "description": "Title text displayed in the app bar.",
1198
- "fieldName": "title"
1228
+ "parameters": [
1229
+ {
1230
+ "name": "e",
1231
+ "type": {
1232
+ "text": "KeyboardEvent"
1233
+ }
1234
+ }
1235
+ ],
1236
+ "description": "Handles keyboard activation in interactive mode."
1237
+ },
1238
+ {
1239
+ "kind": "method",
1240
+ "name": "adjustSpinnerSize",
1241
+ "privacy": "private",
1242
+ "return": {
1243
+ "type": {
1244
+ "text": "void"
1245
+ }
1246
+ },
1247
+ "description": "Derives spinner dimensions from current avatar size."
1248
+ }
1249
+ ],
1250
+ "events": [
1251
+ {
1252
+ "name": "click",
1253
+ "type": {
1254
+ "text": "Event"
1255
+ }
1256
+ }
1257
+ ],
1258
+ "attributes": [
1259
+ {
1260
+ "name": "size",
1261
+ "type": {
1262
+ "text": "string"
1263
+ },
1264
+ "default": "\"50px\"",
1265
+ "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
1266
+ "fieldName": "size"
1267
+ },
1268
+ {
1269
+ "name": "image",
1270
+ "type": {
1271
+ "text": "string"
1272
+ },
1273
+ "default": "\"\"",
1274
+ "description": "Image URL; fallback slot is shown on load error.",
1275
+ "fieldName": "image"
1276
+ },
1277
+ {
1278
+ "name": "fit",
1279
+ "type": {
1280
+ "text": "SkyAvatarFit"
1281
+ },
1282
+ "default": "\"cover\"",
1283
+ "description": "Image fill mode: `cover` (default) or `contain`.",
1284
+ "fieldName": "fit"
1285
+ },
1286
+ {
1287
+ "name": "radius",
1288
+ "type": {
1289
+ "text": "string"
1290
+ },
1291
+ "default": "\"md\"",
1292
+ "description": "Border radius token or CSS value.",
1293
+ "fieldName": "radius"
1294
+ },
1295
+ {
1296
+ "name": "alt",
1297
+ "type": {
1298
+ "text": "string"
1299
+ },
1300
+ "default": "\"\"",
1301
+ "description": "Accessible name when image content conveys meaning.",
1302
+ "fieldName": "alt"
1199
1303
  },
1200
1304
  {
1201
1305
  "name": "color",
1202
1306
  "type": {
1203
1307
  "text": "string"
1204
1308
  },
1205
- "default": "\"default\"",
1206
- "description": "Semantic token or CSS color for bar background; foreground color is derived for contrast.",
1309
+ "default": "\"dark\"",
1310
+ "description": "Token or CSS color applied to fallback slot content.",
1207
1311
  "fieldName": "color"
1208
1312
  },
1209
1313
  {
1210
- "name": "url",
1314
+ "name": "outline",
1211
1315
  "type": {
1212
1316
  "text": "string"
1213
1317
  },
1214
1318
  "default": "\"\"",
1215
- "description": "Background image URL.",
1216
- "fieldName": "url"
1319
+ "description": "CSS `outline` value.",
1320
+ "fieldName": "outline"
1217
1321
  },
1218
1322
  {
1219
- "name": "banner",
1323
+ "name": "outlineOffset",
1324
+ "type": {
1325
+ "text": "string"
1326
+ },
1327
+ "default": "\"2px\"",
1328
+ "description": "CSS `outline-offset` value.",
1329
+ "fieldName": "outlineOffset"
1330
+ },
1331
+ {
1332
+ "name": "loading",
1220
1333
  "type": {
1221
1334
  "text": "boolean"
1222
1335
  },
1223
- "default": "true",
1224
- "description": "Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.",
1225
- "fieldName": "banner"
1336
+ "default": "false",
1337
+ "description": "Shows loading overlay when true.",
1338
+ "fieldName": "loading"
1226
1339
  },
1227
1340
  {
1228
- "name": "dense",
1341
+ "name": "disabled",
1229
1342
  "type": {
1230
1343
  "text": "boolean"
1231
1344
  },
1232
1345
  "default": "false",
1233
- "description": "Enables compact vertical spacing.",
1234
- "fieldName": "dense"
1346
+ "description": "Dims and disables pointer interactions.",
1347
+ "fieldName": "disabled"
1235
1348
  },
1236
1349
  {
1237
- "name": "elevated",
1350
+ "name": "interactive",
1238
1351
  "type": {
1239
1352
  "text": "boolean"
1240
1353
  },
1241
1354
  "default": "false",
1242
- "description": "Applies elevated shadow styling.",
1243
- "fieldName": "elevated"
1355
+ "description": "Enables interactive behavior with keyboard/click activation.",
1356
+ "fieldName": "interactive"
1244
1357
  },
1245
1358
  {
1246
- "name": "leadingLabel",
1359
+ "name": "shadow",
1247
1360
  "type": {
1248
- "text": "string"
1361
+ "text": "boolean"
1249
1362
  },
1250
- "default": "\"Open menu\"",
1251
- "description": "Accessible label for default leading button fallback.",
1252
- "fieldName": "leadingLabel"
1363
+ "default": "false",
1364
+ "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
1365
+ "fieldName": "shadow"
1253
1366
  }
1254
1367
  ],
1255
1368
  "superclass": {
1256
1369
  "name": "LitElement",
1257
1370
  "package": "lit"
1258
1371
  },
1259
- "tagName": "sky-appbar",
1372
+ "tagName": "sky-avatar",
1260
1373
  "customElement": true,
1261
- "summary": "Application top bar with title, optional leading control, trailing actions, and optional color/image background."
1374
+ "summary": "Avatar that renders image content or fallback slot content with configurable size, radius, outline, and loading state."
1262
1375
  }
1263
1376
  ],
1264
1377
  "exports": [
1265
1378
  {
1266
1379
  "kind": "js",
1267
- "name": "SkyAppbar",
1380
+ "name": "SkyAvatar",
1268
1381
  "declaration": {
1269
- "name": "SkyAppbar",
1270
- "module": "src/sky-appbar/sky-appbar.ts"
1382
+ "name": "SkyAvatar",
1383
+ "module": "src/sky-avatar/sky-avatar.ts"
1271
1384
  }
1272
1385
  },
1273
1386
  {
1274
1387
  "kind": "custom-element-definition",
1275
- "name": "sky-appbar",
1388
+ "name": "sky-avatar",
1276
1389
  "declaration": {
1277
- "name": "SkyAppbar",
1278
- "module": "src/sky-appbar/sky-appbar.ts"
1390
+ "name": "SkyAvatar",
1391
+ "module": "src/sky-avatar/sky-avatar.ts"
1279
1392
  }
1280
1393
  }
1281
1394
  ]
1282
1395
  },
1283
1396
  {
1284
1397
  "kind": "javascript-module",
1285
- "path": "src/sky-button/sky-button.ts",
1398
+ "path": "src/sky-badge/sky-badge.ts",
1286
1399
  "declarations": [
1287
1400
  {
1288
1401
  "kind": "class",
1289
1402
  "description": "",
1290
- "name": "SkyButton",
1403
+ "name": "SkyBadge",
1291
1404
  "cssParts": [
1292
1405
  {
1293
- "description": "The native `<button>` element.",
1294
- "name": "button"
1295
- },
1296
- {
1297
- "description": "The optional left/right icons.",
1298
- "name": "icon"
1406
+ "description": "Wrapper around the slotted content and the badge.",
1407
+ "name": "container"
1299
1408
  },
1300
1409
  {
1301
- "description": "Overlay displayed when loading.",
1302
- "name": "loading-overlay"
1410
+ "description": "The badge element. Use `badgeRef` for positioning (e.g. tooltip anchor).",
1411
+ "name": "badge"
1303
1412
  },
1304
1413
  {
1305
- "description": "Spinner displayed when loading.",
1306
- "name": "spinner"
1414
+ "description": "The icon element when `isIcon` is true.",
1415
+ "name": "icon"
1307
1416
  }
1308
1417
  ],
1309
1418
  "slots": [
1310
1419
  {
1311
- "description": "Default slot for the button label (replaces `label` property if used).",
1420
+ "description": "The content the badge attaches to.",
1312
1421
  "name": ""
1422
+ },
1423
+ {
1424
+ "description": "Optional slot to override the badge content entirely.",
1425
+ "name": "badge"
1313
1426
  }
1314
1427
  ],
1315
1428
  "members": [
@@ -1324,61 +1437,68 @@
1324
1437
  },
1325
1438
  {
1326
1439
  "kind": "field",
1327
- "name": "formAssociated",
1440
+ "name": "statusColor",
1328
1441
  "type": {
1329
- "text": "boolean"
1442
+ "text": "string"
1330
1443
  },
1331
- "static": true,
1332
- "default": "true"
1444
+ "default": "\"success\"",
1445
+ "description": "Badge background token or CSS color.",
1446
+ "attribute": "statusColor",
1447
+ "reflects": true
1333
1448
  },
1334
1449
  {
1335
1450
  "kind": "field",
1336
- "name": "internals",
1451
+ "name": "textColor",
1337
1452
  "type": {
1338
- "text": "ElementInternals"
1453
+ "text": "string"
1339
1454
  },
1340
- "privacy": "private"
1455
+ "default": "\"default\"",
1456
+ "description": "Text color token or CSS color.",
1457
+ "attribute": "textColor",
1458
+ "reflects": true
1341
1459
  },
1342
1460
  {
1343
1461
  "kind": "field",
1344
- "name": "variant",
1462
+ "name": "iconColor",
1345
1463
  "type": {
1346
- "text": "SkyButtonVariant"
1464
+ "text": "string"
1347
1465
  },
1348
- "default": "\"solid\"",
1349
- "description": "Visual variant of the button. Use `\"link\"` for text-only control with underline on hover. Default: `\"solid\"`.",
1350
- "attribute": "variant",
1466
+ "default": "\"\"",
1467
+ "description": "Icon color token or CSS color; falls back to `textColor` when empty.",
1468
+ "attribute": "iconColor",
1351
1469
  "reflects": true
1352
1470
  },
1353
1471
  {
1354
1472
  "kind": "field",
1355
- "name": "color",
1473
+ "name": "position",
1356
1474
  "type": {
1357
- "text": "string"
1475
+ "text": "SkyBadgePosition"
1358
1476
  },
1359
- "default": "\"primary\"",
1360
- "description": "Base color token or custom CSS color. Default: `\"primary\"`.",
1361
- "attribute": "color"
1477
+ "default": "\"default\"",
1478
+ "description": "Layout mode: `default | floating | inline`.",
1479
+ "attribute": "position",
1480
+ "reflects": true
1362
1481
  },
1363
1482
  {
1364
1483
  "kind": "field",
1365
- "name": "type",
1484
+ "name": "value",
1366
1485
  "type": {
1367
- "text": "SkyButtonType"
1486
+ "text": "string"
1368
1487
  },
1369
- "default": "\"button\"",
1370
- "description": "Button type attribute. Default: `\"button\"`.",
1371
- "attribute": "type"
1488
+ "default": "\"\"",
1489
+ "description": "Badge text/count or icon name in icon mode.",
1490
+ "attribute": "value"
1372
1491
  },
1373
1492
  {
1374
1493
  "kind": "field",
1375
- "name": "form",
1494
+ "name": "isIcon",
1376
1495
  "type": {
1377
- "text": "string"
1496
+ "text": "boolean"
1378
1497
  },
1379
- "default": "\"\"",
1380
- "description": "Associated form ID for custom submit handling.",
1381
- "attribute": "form"
1498
+ "default": "false",
1499
+ "description": "Renders icon mode when true.",
1500
+ "attribute": "isIcon",
1501
+ "reflects": true
1382
1502
  },
1383
1503
  {
1384
1504
  "kind": "field",
@@ -1386,794 +1506,442 @@
1386
1506
  "type": {
1387
1507
  "text": "string"
1388
1508
  },
1389
- "default": "\"md\"",
1390
- "description": "Preset size token (`xs…xl`) or CSS size (e.g., `\"15px\"`, `\"1rem\"`). Default: `\"md\"`.",
1391
- "attribute": "size"
1509
+ "default": "\"\"",
1510
+ "description": "Badge and icon size CSS length.",
1511
+ "attribute": "size",
1512
+ "reflects": true
1392
1513
  },
1393
1514
  {
1394
1515
  "kind": "field",
1395
- "name": "radius",
1516
+ "name": "shape",
1396
1517
  "type": {
1397
- "text": "string"
1518
+ "text": "SkyBadgeShape"
1398
1519
  },
1399
- "default": "\"md\"",
1400
- "description": "Preset radius token (`none…full`) or CSS radius (e.g., `\"12px\"`). Default: `\"md\"`.",
1401
- "attribute": "radius"
1520
+ "default": "\"custom\"",
1521
+ "description": "Badge shape: `circle | pill | custom`.",
1522
+ "attribute": "shape",
1523
+ "reflects": true
1402
1524
  },
1403
1525
  {
1404
1526
  "kind": "field",
1405
- "name": "label",
1527
+ "name": "max",
1406
1528
  "type": {
1407
- "text": "string"
1529
+ "text": "number"
1408
1530
  },
1409
- "default": "\"Button\"",
1410
- "description": "Text label for the button. Ignored if default slot is used. Default: `\"Button\"`.",
1411
- "attribute": "label"
1531
+ "default": "99",
1532
+ "description": "Maximum numeric count before rendering overflow label.",
1533
+ "attribute": "max"
1412
1534
  },
1413
1535
  {
1414
1536
  "kind": "field",
1415
- "name": "disabled",
1537
+ "name": "hideWhenZero",
1416
1538
  "type": {
1417
1539
  "text": "boolean"
1418
1540
  },
1419
1541
  "default": "false",
1420
- "description": "Whether the button is disabled. Default: `false`.",
1421
- "attribute": "disabled",
1422
- "reflects": true
1542
+ "description": "Hides badge when value resolves to numeric zero.",
1543
+ "attribute": "hideWhenZero"
1423
1544
  },
1424
1545
  {
1425
1546
  "kind": "field",
1426
- "name": "loading",
1547
+ "name": "show",
1427
1548
  "type": {
1428
1549
  "text": "boolean"
1429
1550
  },
1430
- "default": "false",
1431
- "description": "Shows a loading overlay when true. Default: `false`.",
1432
- "attribute": "loading",
1433
- "reflects": true
1434
- },
1435
- {
1436
- "kind": "field",
1437
- "name": "iconL",
1438
- "type": {
1439
- "text": "string"
1440
- },
1441
- "default": "\"\"",
1442
- "description": "Optional left-side icon (Iconify name). Default: `\"\"`.",
1443
- "attribute": "iconL"
1444
- },
1445
- {
1446
- "kind": "field",
1447
- "name": "iconR",
1448
- "type": {
1449
- "text": "string"
1450
- },
1451
- "default": "\"\"",
1452
- "description": "Optional right-side icon (Iconify name). Default: `\"\"`.",
1453
- "attribute": "iconR"
1454
- },
1455
- {
1456
- "kind": "field",
1457
- "name": "iconOnly",
1458
- "type": {
1459
- "text": "boolean"
1460
- },
1461
- "default": "false",
1462
- "description": "Square padding for icon-only buttons; hides label text. Default: `false`.",
1463
- "attribute": "iconOnly",
1464
- "reflects": true
1465
- },
1466
- {
1467
- "kind": "field",
1468
- "name": "colors",
1469
- "type": {
1470
- "text": "string"
1471
- },
1472
- "default": "\"\"",
1473
- "description": "Comma-separated color stops for gradient variant. Default: `\"\"`.",
1474
- "attribute": "colors"
1475
- },
1476
- {
1477
- "kind": "field",
1478
- "name": "animation",
1479
- "type": {
1480
- "text": "SkyButtonAnimation"
1481
- },
1482
- "default": "\"auto\"",
1483
- "description": "Transform animation style. Default: `\"auto\"`.",
1484
- "attribute": "animation",
1485
- "reflects": true
1486
- },
1487
- {
1488
- "kind": "field",
1489
- "name": "_hasMeaningfulSlot",
1490
- "type": {
1491
- "text": "boolean"
1492
- },
1493
- "privacy": "private",
1494
- "default": "false"
1495
- },
1496
- {
1497
- "kind": "field",
1498
- "name": "_styleVars",
1499
- "type": {
1500
- "text": "Record<string, string>"
1501
- },
1502
- "privacy": "private",
1503
- "default": "{}",
1504
- "description": "Inline CSS variable cache."
1505
- },
1506
- {
1507
- "kind": "method",
1508
- "name": "_slotHasMeaningfulContent",
1509
- "privacy": "private",
1510
- "return": {
1511
- "type": {
1512
- "text": "boolean"
1513
- }
1514
- },
1515
- "parameters": [
1516
- {
1517
- "name": "slotEl",
1518
- "type": {
1519
- "text": "HTMLSlotElement"
1520
- }
1521
- }
1522
- ]
1523
- },
1524
- {
1525
- "kind": "field",
1526
- "name": "_onSlotChange",
1527
- "privacy": "private"
1528
- },
1529
- {
1530
- "kind": "method",
1531
- "name": "_toSquarePadding",
1532
- "privacy": "private",
1533
- "return": {
1534
- "type": {
1535
- "text": "string"
1536
- }
1537
- },
1538
- "parameters": [
1539
- {
1540
- "name": "padding",
1541
- "type": {
1542
- "text": "string"
1543
- }
1544
- }
1545
- ],
1546
- "description": "Uses vertical padding for equal sides (icon-only square control)."
1547
- },
1548
- {
1549
- "kind": "method",
1550
- "name": "_resolveSize",
1551
- "privacy": "private",
1552
- "return": {
1553
- "type": {
1554
- "text": "{\r\n padding: string;\r\n fontSize: string;\r\n gap: string;\r\n icon: string;\r\n spinner: string;\r\n }"
1555
- }
1556
- },
1557
- "parameters": [
1558
- {
1559
- "name": "input",
1560
- "type": {
1561
- "text": "string"
1562
- }
1563
- }
1564
- ]
1565
- },
1566
- {
1567
- "kind": "method",
1568
- "name": "_isThemeBorderShorthand",
1569
- "privacy": "private",
1570
- "return": {
1571
- "type": {
1572
- "text": "boolean"
1573
- }
1574
- },
1575
- "parameters": [
1576
- {
1577
- "name": "border",
1578
- "type": {
1579
- "text": "string | undefined"
1580
- }
1581
- }
1582
- ],
1583
- "description": "Theme tokens like `var(--sky-border-primary)` are full border shorthands, not colors."
1584
- },
1585
- {
1586
- "kind": "method",
1587
- "name": "_borderColorFromShorthand",
1588
- "privacy": "private",
1589
- "return": {
1590
- "type": {
1591
- "text": "string"
1592
- }
1593
- },
1594
- "parameters": [
1595
- {
1596
- "name": "border",
1597
- "type": {
1598
- "text": "string | undefined"
1599
- }
1600
- }
1601
- ],
1602
- "description": "Extracts the color token from a `Npx solid …` border shorthand."
1603
- },
1604
- {
1605
- "kind": "method",
1606
- "name": "focusButton",
1607
- "privacy": "public",
1608
- "return": {
1609
- "type": {
1610
- "text": "void"
1611
- }
1612
- },
1613
- "description": "Focuses the internal native button."
1614
- },
1615
- {
1616
- "kind": "method",
1617
- "name": "clickButton",
1618
- "privacy": "public",
1619
- "return": {
1620
- "type": {
1621
- "text": "void"
1622
- }
1623
- },
1624
- "description": "Triggers a click on the internal native button when enabled."
1625
- },
1626
- {
1627
- "kind": "method",
1628
- "name": "_createRipple",
1629
- "privacy": "private",
1630
- "return": {
1631
- "type": {
1632
- "text": "void"
1633
- }
1634
- },
1635
- "parameters": [
1636
- {
1637
- "name": "event",
1638
- "type": {
1639
- "text": "MouseEvent"
1640
- }
1641
- }
1642
- ]
1643
- },
1644
- {
1645
- "kind": "method",
1646
- "name": "formDisabledCallback",
1647
- "return": {
1648
- "type": {
1649
- "text": "void"
1650
- }
1651
- },
1652
- "parameters": [
1653
- {
1654
- "name": "disabled",
1655
- "type": {
1656
- "text": "boolean"
1657
- }
1658
- }
1659
- ]
1660
- },
1661
- {
1662
- "kind": "field",
1663
- "name": "formOwner",
1664
- "type": {
1665
- "text": "HTMLFormElement | null"
1666
- },
1667
- "readonly": true
1668
- },
1669
- {
1670
- "kind": "method",
1671
- "name": "_handleClick",
1672
- "privacy": "private",
1673
- "return": {
1674
- "type": {
1675
- "text": "void"
1676
- }
1677
- },
1678
- "parameters": [
1679
- {
1680
- "name": "event",
1681
- "type": {
1682
- "text": "MouseEvent"
1683
- }
1684
- }
1685
- ]
1686
- },
1687
- {
1688
- "kind": "method",
1689
- "name": "_iconOnlyName",
1690
- "privacy": "private",
1691
- "return": {
1692
- "type": {
1693
- "text": "string"
1694
- }
1695
- }
1696
- }
1697
- ],
1698
- "attributes": [
1699
- {
1700
- "name": "variant",
1701
- "type": {
1702
- "text": "SkyButtonVariant"
1703
- },
1704
- "default": "\"solid\"",
1705
- "description": "Visual variant of the button. Use `\"link\"` for text-only control with underline on hover. Default: `\"solid\"`.",
1706
- "fieldName": "variant"
1707
- },
1708
- {
1709
- "name": "color",
1710
- "type": {
1711
- "text": "string"
1712
- },
1713
- "default": "\"primary\"",
1714
- "description": "Base color token or custom CSS color. Default: `\"primary\"`.",
1715
- "fieldName": "color"
1716
- },
1717
- {
1718
- "name": "type",
1719
- "type": {
1720
- "text": "SkyButtonType"
1721
- },
1722
- "default": "\"button\"",
1723
- "description": "Button type attribute. Default: `\"button\"`.",
1724
- "fieldName": "type"
1725
- },
1726
- {
1727
- "name": "form",
1728
- "type": {
1729
- "text": "string"
1730
- },
1731
- "default": "\"\"",
1732
- "description": "Associated form ID for custom submit handling.",
1733
- "fieldName": "form"
1734
- },
1735
- {
1736
- "name": "size",
1737
- "type": {
1738
- "text": "string"
1739
- },
1740
- "default": "\"md\"",
1741
- "description": "Preset size token (`xs…xl`) or CSS size (e.g., `\"15px\"`, `\"1rem\"`). Default: `\"md\"`.",
1742
- "fieldName": "size"
1743
- },
1744
- {
1745
- "name": "radius",
1746
- "type": {
1747
- "text": "string"
1748
- },
1749
- "default": "\"md\"",
1750
- "description": "Preset radius token (`none…full`) or CSS radius (e.g., `\"12px\"`). Default: `\"md\"`.",
1751
- "fieldName": "radius"
1752
- },
1753
- {
1754
- "name": "label",
1755
- "type": {
1756
- "text": "string"
1757
- },
1758
- "default": "\"Button\"",
1759
- "description": "Text label for the button. Ignored if default slot is used. Default: `\"Button\"`.",
1760
- "fieldName": "label"
1761
- },
1762
- {
1763
- "name": "disabled",
1764
- "type": {
1765
- "text": "boolean"
1766
- },
1767
- "default": "false",
1768
- "description": "Whether the button is disabled. Default: `false`.",
1769
- "fieldName": "disabled"
1770
- },
1771
- {
1772
- "name": "loading",
1773
- "type": {
1774
- "text": "boolean"
1775
- },
1776
- "default": "false",
1777
- "description": "Shows a loading overlay when true. Default: `false`.",
1778
- "fieldName": "loading"
1551
+ "default": "true",
1552
+ "description": "Forces badge visibility independent of value.",
1553
+ "attribute": "show",
1554
+ "reflects": true
1779
1555
  },
1780
1556
  {
1781
- "name": "iconL",
1557
+ "kind": "field",
1558
+ "name": "offsetX",
1782
1559
  "type": {
1783
1560
  "text": "string"
1784
1561
  },
1785
- "default": "\"\"",
1786
- "description": "Optional left-side icon (Iconify name). Default: `\"\"`.",
1787
- "fieldName": "iconL"
1562
+ "default": "\"0px\"",
1563
+ "description": "Horizontal offset CSS length.",
1564
+ "attribute": "offsetX"
1788
1565
  },
1789
1566
  {
1790
- "name": "iconR",
1567
+ "kind": "field",
1568
+ "name": "offsetY",
1791
1569
  "type": {
1792
1570
  "text": "string"
1793
1571
  },
1794
- "default": "\"\"",
1795
- "description": "Optional right-side icon (Iconify name). Default: `\"\"`.",
1796
- "fieldName": "iconR"
1572
+ "default": "\"0px\"",
1573
+ "description": "Vertical offset CSS length.",
1574
+ "attribute": "offsetY"
1797
1575
  },
1798
1576
  {
1799
- "name": "iconOnly",
1577
+ "kind": "field",
1578
+ "name": "ring",
1800
1579
  "type": {
1801
1580
  "text": "boolean"
1802
1581
  },
1803
1582
  "default": "false",
1804
- "description": "Square padding for icon-only buttons; hides label text. Default: `false`.",
1805
- "fieldName": "iconOnly"
1806
- },
1807
- {
1808
- "name": "colors",
1809
- "type": {
1810
- "text": "string"
1811
- },
1812
- "default": "\"\"",
1813
- "description": "Comma-separated color stops for gradient variant. Default: `\"\"`.",
1814
- "fieldName": "colors"
1815
- },
1816
- {
1817
- "name": "animation",
1818
- "type": {
1819
- "text": "SkyButtonAnimation"
1820
- },
1821
- "default": "\"auto\"",
1822
- "description": "Transform animation style. Default: `\"auto\"`.",
1823
- "fieldName": "animation"
1824
- }
1825
- ],
1826
- "superclass": {
1827
- "name": "LitElement",
1828
- "package": "lit"
1829
- },
1830
- "tagName": "sky-button",
1831
- "customElement": true,
1832
- "summary": "Styled button supporting variants, icons, loading state, ripple feedback, and form-associated behavior."
1833
- }
1834
- ],
1835
- "exports": [
1836
- {
1837
- "kind": "js",
1838
- "name": "SkyButton",
1839
- "declaration": {
1840
- "name": "SkyButton",
1841
- "module": "src/sky-button/sky-button.ts"
1842
- }
1843
- },
1844
- {
1845
- "kind": "custom-element-definition",
1846
- "name": "sky-button",
1847
- "declaration": {
1848
- "name": "SkyButton",
1849
- "module": "src/sky-button/sky-button.ts"
1850
- }
1851
- }
1852
- ]
1853
- },
1854
- {
1855
- "kind": "javascript-module",
1856
- "path": "src/sky-avatar/sky-avatar.ts",
1857
- "declarations": [
1858
- {
1859
- "kind": "class",
1860
- "description": "",
1861
- "name": "SkyAvatar",
1862
- "cssParts": [
1863
- {
1864
- "description": "The avatar container element.",
1865
- "name": "avatar"
1866
- },
1867
- {
1868
- "description": "The loading overlay container (shown when `loading` is true).",
1869
- "name": "loading-overlay"
1583
+ "description": "Enables visual ring around the badge.",
1584
+ "attribute": "ring"
1870
1585
  },
1871
- {
1872
- "description": "The spinner element shown when loading.",
1873
- "name": "spinner"
1874
- }
1875
- ],
1876
- "slots": [
1877
- {
1878
- "description": "Fallback content (e.g., initials or an icon) rendered when `image` is empty.",
1879
- "name": ""
1880
- }
1881
- ],
1882
- "members": [
1883
1586
  {
1884
1587
  "kind": "field",
1885
- "name": "size",
1588
+ "name": "ringColor",
1886
1589
  "type": {
1887
1590
  "text": "string"
1888
1591
  },
1889
- "default": "\"50px\"",
1890
- "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
1891
- "attribute": "size"
1592
+ "default": "\"primary\"",
1593
+ "description": "Ring color token or CSS color.",
1594
+ "attribute": "ringColor"
1892
1595
  },
1893
1596
  {
1894
1597
  "kind": "field",
1895
- "name": "image",
1598
+ "name": "ringOffset",
1896
1599
  "type": {
1897
1600
  "text": "string"
1898
1601
  },
1899
- "default": "\"\"",
1900
- "description": "Image URL; fallback slot is shown on load error.",
1901
- "attribute": "image"
1902
- },
1903
- {
1904
- "kind": "field",
1905
- "name": "fit",
1906
- "type": {
1907
- "text": "SkyAvatarFit"
1908
- },
1909
- "default": "\"cover\"",
1910
- "description": "Image fill mode: `cover` (default) or `contain`.",
1911
- "attribute": "fit",
1912
- "reflects": true
1602
+ "default": "\"1px\"",
1603
+ "description": "Ring offset CSS length.",
1604
+ "attribute": "ringOffset"
1913
1605
  },
1914
1606
  {
1915
1607
  "kind": "field",
1916
- "name": "radius",
1608
+ "name": "badgeLabel",
1917
1609
  "type": {
1918
- "text": "string"
1610
+ "text": "string | null"
1919
1611
  },
1920
- "default": "\"md\"",
1921
- "description": "Border radius token or CSS value.",
1922
- "attribute": "radius"
1612
+ "default": "null",
1613
+ "description": "ARIA label override.",
1614
+ "attribute": "badgeLabel"
1923
1615
  },
1924
1616
  {
1925
1617
  "kind": "field",
1926
- "name": "alt",
1618
+ "name": "badgeAriaHidden",
1927
1619
  "type": {
1928
- "text": "string"
1620
+ "text": "boolean"
1929
1621
  },
1930
- "default": "\"\"",
1931
- "description": "Accessible name when image content conveys meaning.",
1932
- "attribute": "alt"
1622
+ "default": "false",
1623
+ "description": "Hides badge from assistive technology when true.",
1624
+ "attribute": "badgeAriaHidden"
1933
1625
  },
1934
1626
  {
1935
1627
  "kind": "field",
1936
- "name": "color",
1628
+ "name": "interactive",
1937
1629
  "type": {
1938
- "text": "string"
1630
+ "text": "boolean"
1939
1631
  },
1940
- "default": "\"dark\"",
1941
- "description": "Token or CSS color applied to fallback slot content.",
1942
- "attribute": "color"
1632
+ "default": "false",
1633
+ "description": "Enables focus/activation and `badge-click` emission.",
1634
+ "attribute": "interactive"
1943
1635
  },
1944
1636
  {
1945
1637
  "kind": "field",
1946
- "name": "outline",
1638
+ "name": "placement",
1947
1639
  "type": {
1948
- "text": "string"
1640
+ "text": "SkyBadgePlacement"
1949
1641
  },
1950
- "default": "\"\"",
1951
- "description": "CSS `outline` value.",
1952
- "attribute": "outline"
1642
+ "default": "\"custom\"",
1643
+ "description": "Anchor placement preset for badge positioning.",
1644
+ "attribute": "placement",
1645
+ "reflects": true
1953
1646
  },
1954
1647
  {
1955
1648
  "kind": "field",
1956
- "name": "outlineOffset",
1649
+ "name": "_badgeEl",
1957
1650
  "type": {
1958
- "text": "string"
1651
+ "text": "HTMLSpanElement"
1959
1652
  },
1960
- "default": "\"2px\"",
1961
- "description": "CSS `outline-offset` value.",
1962
- "attribute": "outlineOffset"
1653
+ "privacy": "private"
1963
1654
  },
1964
1655
  {
1965
1656
  "kind": "field",
1966
- "name": "loading",
1967
- "type": {
1968
- "text": "boolean"
1969
- },
1970
- "default": "false",
1971
- "description": "Shows loading overlay when true.",
1972
- "attribute": "loading",
1973
- "reflects": true
1657
+ "name": "badgeRef",
1658
+ "privacy": "public",
1659
+ "description": "Ref for the badge element (e.g. for tooltip anchor or positioning)."
1974
1660
  },
1975
1661
  {
1976
1662
  "kind": "field",
1977
- "name": "disabled",
1663
+ "name": "shadowRootOptions",
1978
1664
  "type": {
1979
- "text": "boolean"
1665
+ "text": "ShadowRootInit"
1980
1666
  },
1981
- "default": "false",
1982
- "description": "Dims and disables pointer interactions.",
1983
- "attribute": "disabled",
1984
- "reflects": true
1667
+ "static": true,
1668
+ "default": "{ mode: \"open\", delegatesFocus: true, }"
1985
1669
  },
1986
1670
  {
1987
- "kind": "field",
1988
- "name": "interactive",
1989
- "type": {
1990
- "text": "boolean"
1671
+ "kind": "method",
1672
+ "name": "showBadge",
1673
+ "privacy": "public",
1674
+ "return": {
1675
+ "type": {
1676
+ "text": "void"
1677
+ }
1991
1678
  },
1992
- "default": "false",
1993
- "description": "Enables interactive behavior with keyboard/click activation.",
1994
- "attribute": "interactive"
1679
+ "description": "Forces badge visibility on."
1995
1680
  },
1996
1681
  {
1997
- "kind": "field",
1998
- "name": "shadow",
1999
- "type": {
2000
- "text": "boolean"
1682
+ "kind": "method",
1683
+ "name": "hideBadge",
1684
+ "privacy": "public",
1685
+ "return": {
1686
+ "type": {
1687
+ "text": "void"
1688
+ }
2001
1689
  },
2002
- "default": "false",
2003
- "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
2004
- "attribute": "shadow",
2005
- "reflects": true
1690
+ "description": "Forces badge visibility off."
2006
1691
  },
2007
1692
  {
2008
- "kind": "field",
2009
- "name": "_imageError",
2010
- "type": {
2011
- "text": "boolean"
1693
+ "kind": "method",
1694
+ "name": "setValue",
1695
+ "privacy": "public",
1696
+ "return": {
1697
+ "type": {
1698
+ "text": "void"
1699
+ }
2012
1700
  },
2013
- "privacy": "private",
2014
- "default": "false",
2015
- "description": "True when image failed to load; show slot instead."
1701
+ "parameters": [
1702
+ {
1703
+ "name": "value",
1704
+ "type": {
1705
+ "text": "string"
1706
+ },
1707
+ "description": "Badge value or icon name."
1708
+ }
1709
+ ],
1710
+ "description": "Updates badge value for text/count or icon modes."
2016
1711
  },
2017
1712
  {
2018
1713
  "kind": "field",
2019
- "name": "_onImageLoad",
1714
+ "name": "_onActivate",
2020
1715
  "privacy": "private",
2021
- "description": "Marks image load success and keeps image rendering active."
1716
+ "description": "Emits `badge-click` for interactive activation."
2022
1717
  },
2023
1718
  {
2024
1719
  "kind": "field",
2025
- "name": "_onImageError",
1720
+ "name": "_onKeydown",
2026
1721
  "privacy": "private",
2027
- "description": "Marks image load failure and enables fallback slot rendering."
1722
+ "description": "Handles keyboard activation with Enter and Space."
2028
1723
  },
2029
1724
  {
2030
1725
  "kind": "method",
2031
- "name": "_handleInteractiveClick",
1726
+ "name": "_computeAriaLabel",
2032
1727
  "privacy": "private",
2033
1728
  "return": {
2034
1729
  "type": {
2035
- "text": "void"
1730
+ "text": "string | null"
2036
1731
  }
2037
1732
  },
2038
1733
  "parameters": [
2039
1734
  {
2040
- "name": "e",
1735
+ "name": "displayValue",
2041
1736
  "type": {
2042
- "text": "Event"
1737
+ "text": "string | null"
2043
1738
  }
2044
1739
  }
2045
1740
  ],
2046
- "description": "Re-dispatches click in interactive mode for host-level consumers."
1741
+ "description": "Computes accessible badge label from current render state."
2047
1742
  },
2048
1743
  {
2049
1744
  "kind": "method",
2050
- "name": "_handleInteractiveKeydown",
1745
+ "name": "_computeAnchors",
2051
1746
  "privacy": "private",
2052
1747
  "return": {
2053
1748
  "type": {
2054
- "text": "void"
1749
+ "text": "{\r\n top: string;\r\n right: string;\r\n bottom: string;\r\n left: string;\r\n }"
2055
1750
  }
2056
1751
  },
2057
1752
  "parameters": [
2058
1753
  {
2059
- "name": "e",
1754
+ "name": "placement",
2060
1755
  "type": {
2061
- "text": "KeyboardEvent"
1756
+ "text": "SkyBadgePlacement"
2062
1757
  }
2063
1758
  }
2064
1759
  ],
2065
- "description": "Handles keyboard activation in interactive mode."
1760
+ "description": "Resolves anchor edges from placement preset."
2066
1761
  },
2067
1762
  {
2068
1763
  "kind": "method",
2069
- "name": "adjustSpinnerSize",
1764
+ "name": "_resolveBadgeSurface",
2070
1765
  "privacy": "private",
2071
1766
  "return": {
2072
1767
  "type": {
2073
- "text": "void"
1768
+ "text": "{\r\n bg: string;\r\n color: string;\r\n border: string;\r\n }"
2074
1769
  }
2075
1770
  },
2076
- "description": "Derives spinner dimensions from current avatar size."
1771
+ "description": "Maps semantic status tokens to soft badge surface colors."
2077
1772
  }
2078
1773
  ],
2079
1774
  "events": [
2080
1775
  {
2081
- "name": "click",
2082
1776
  "type": {
2083
- "text": "Event"
2084
- }
1777
+ "text": "CustomEvent<SkyBadgeClickEventDetail>"
1778
+ },
1779
+ "description": "Emitted when badge activation occurs via click, Enter, or Space while `interactive` is true.",
1780
+ "name": "badge-click"
2085
1781
  }
2086
1782
  ],
2087
1783
  "attributes": [
2088
1784
  {
2089
- "name": "size",
1785
+ "name": "statusColor",
2090
1786
  "type": {
2091
1787
  "text": "string"
2092
1788
  },
2093
- "default": "\"50px\"",
2094
- "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
2095
- "fieldName": "size"
1789
+ "default": "\"success\"",
1790
+ "description": "Badge background token or CSS color.",
1791
+ "fieldName": "statusColor"
2096
1792
  },
2097
1793
  {
2098
- "name": "image",
1794
+ "name": "textColor",
1795
+ "type": {
1796
+ "text": "string"
1797
+ },
1798
+ "default": "\"default\"",
1799
+ "description": "Text color token or CSS color.",
1800
+ "fieldName": "textColor"
1801
+ },
1802
+ {
1803
+ "name": "iconColor",
2099
1804
  "type": {
2100
1805
  "text": "string"
2101
1806
  },
2102
1807
  "default": "\"\"",
2103
- "description": "Image URL; fallback slot is shown on load error.",
2104
- "fieldName": "image"
1808
+ "description": "Icon color token or CSS color; falls back to `textColor` when empty.",
1809
+ "fieldName": "iconColor"
2105
1810
  },
2106
1811
  {
2107
- "name": "fit",
1812
+ "name": "position",
2108
1813
  "type": {
2109
- "text": "SkyAvatarFit"
1814
+ "text": "SkyBadgePosition"
2110
1815
  },
2111
- "default": "\"cover\"",
2112
- "description": "Image fill mode: `cover` (default) or `contain`.",
2113
- "fieldName": "fit"
1816
+ "default": "\"default\"",
1817
+ "description": "Layout mode: `default | floating | inline`.",
1818
+ "fieldName": "position"
2114
1819
  },
2115
1820
  {
2116
- "name": "radius",
1821
+ "name": "value",
2117
1822
  "type": {
2118
1823
  "text": "string"
2119
1824
  },
2120
- "default": "\"md\"",
2121
- "description": "Border radius token or CSS value.",
2122
- "fieldName": "radius"
1825
+ "default": "\"\"",
1826
+ "description": "Badge text/count or icon name in icon mode.",
1827
+ "fieldName": "value"
2123
1828
  },
2124
1829
  {
2125
- "name": "alt",
1830
+ "name": "isIcon",
1831
+ "type": {
1832
+ "text": "boolean"
1833
+ },
1834
+ "default": "false",
1835
+ "description": "Renders icon mode when true.",
1836
+ "fieldName": "isIcon"
1837
+ },
1838
+ {
1839
+ "name": "size",
2126
1840
  "type": {
2127
1841
  "text": "string"
2128
1842
  },
2129
1843
  "default": "\"\"",
2130
- "description": "Accessible name when image content conveys meaning.",
2131
- "fieldName": "alt"
1844
+ "description": "Badge and icon size CSS length.",
1845
+ "fieldName": "size"
2132
1846
  },
2133
1847
  {
2134
- "name": "color",
1848
+ "name": "shape",
2135
1849
  "type": {
2136
- "text": "string"
1850
+ "text": "SkyBadgeShape"
2137
1851
  },
2138
- "default": "\"dark\"",
2139
- "description": "Token or CSS color applied to fallback slot content.",
2140
- "fieldName": "color"
1852
+ "default": "\"custom\"",
1853
+ "description": "Badge shape: `circle | pill | custom`.",
1854
+ "fieldName": "shape"
2141
1855
  },
2142
1856
  {
2143
- "name": "outline",
1857
+ "name": "max",
1858
+ "type": {
1859
+ "text": "number"
1860
+ },
1861
+ "default": "99",
1862
+ "description": "Maximum numeric count before rendering overflow label.",
1863
+ "fieldName": "max"
1864
+ },
1865
+ {
1866
+ "name": "hideWhenZero",
1867
+ "type": {
1868
+ "text": "boolean"
1869
+ },
1870
+ "default": "false",
1871
+ "description": "Hides badge when value resolves to numeric zero.",
1872
+ "fieldName": "hideWhenZero"
1873
+ },
1874
+ {
1875
+ "name": "show",
1876
+ "type": {
1877
+ "text": "boolean"
1878
+ },
1879
+ "default": "true",
1880
+ "description": "Forces badge visibility independent of value.",
1881
+ "fieldName": "show"
1882
+ },
1883
+ {
1884
+ "name": "offsetX",
2144
1885
  "type": {
2145
1886
  "text": "string"
2146
1887
  },
2147
- "default": "\"\"",
2148
- "description": "CSS `outline` value.",
2149
- "fieldName": "outline"
1888
+ "default": "\"0px\"",
1889
+ "description": "Horizontal offset CSS length.",
1890
+ "fieldName": "offsetX"
2150
1891
  },
2151
1892
  {
2152
- "name": "outlineOffset",
1893
+ "name": "offsetY",
2153
1894
  "type": {
2154
1895
  "text": "string"
2155
1896
  },
2156
- "default": "\"2px\"",
2157
- "description": "CSS `outline-offset` value.",
2158
- "fieldName": "outlineOffset"
1897
+ "default": "\"0px\"",
1898
+ "description": "Vertical offset CSS length.",
1899
+ "fieldName": "offsetY"
2159
1900
  },
2160
1901
  {
2161
- "name": "loading",
1902
+ "name": "ring",
2162
1903
  "type": {
2163
1904
  "text": "boolean"
2164
1905
  },
2165
1906
  "default": "false",
2166
- "description": "Shows loading overlay when true.",
2167
- "fieldName": "loading"
1907
+ "description": "Enables visual ring around the badge.",
1908
+ "fieldName": "ring"
2168
1909
  },
2169
1910
  {
2170
- "name": "disabled",
1911
+ "name": "ringColor",
1912
+ "type": {
1913
+ "text": "string"
1914
+ },
1915
+ "default": "\"primary\"",
1916
+ "description": "Ring color token or CSS color.",
1917
+ "fieldName": "ringColor"
1918
+ },
1919
+ {
1920
+ "name": "ringOffset",
1921
+ "type": {
1922
+ "text": "string"
1923
+ },
1924
+ "default": "\"1px\"",
1925
+ "description": "Ring offset CSS length.",
1926
+ "fieldName": "ringOffset"
1927
+ },
1928
+ {
1929
+ "name": "badgeLabel",
1930
+ "type": {
1931
+ "text": "string | null"
1932
+ },
1933
+ "default": "null",
1934
+ "description": "ARIA label override.",
1935
+ "fieldName": "badgeLabel"
1936
+ },
1937
+ {
1938
+ "name": "badgeAriaHidden",
2171
1939
  "type": {
2172
1940
  "text": "boolean"
2173
1941
  },
2174
1942
  "default": "false",
2175
- "description": "Dims and disables pointer interactions.",
2176
- "fieldName": "disabled"
1943
+ "description": "Hides badge from assistive technology when true.",
1944
+ "fieldName": "badgeAriaHidden"
2177
1945
  },
2178
1946
  {
2179
1947
  "name": "interactive",
@@ -2181,43 +1949,43 @@
2181
1949
  "text": "boolean"
2182
1950
  },
2183
1951
  "default": "false",
2184
- "description": "Enables interactive behavior with keyboard/click activation.",
1952
+ "description": "Enables focus/activation and `badge-click` emission.",
2185
1953
  "fieldName": "interactive"
2186
1954
  },
2187
1955
  {
2188
- "name": "shadow",
1956
+ "name": "placement",
2189
1957
  "type": {
2190
- "text": "boolean"
1958
+ "text": "SkyBadgePlacement"
2191
1959
  },
2192
- "default": "false",
2193
- "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
2194
- "fieldName": "shadow"
1960
+ "default": "\"custom\"",
1961
+ "description": "Anchor placement preset for badge positioning.",
1962
+ "fieldName": "placement"
2195
1963
  }
2196
1964
  ],
2197
1965
  "superclass": {
2198
1966
  "name": "LitElement",
2199
1967
  "package": "lit"
2200
1968
  },
2201
- "tagName": "sky-avatar",
1969
+ "tagName": "sky-badge",
2202
1970
  "customElement": true,
2203
- "summary": "Avatar that renders image content or fallback slot content with configurable size, radius, outline, and loading state."
1971
+ "summary": "Badge for status dots, counts, or icons anchored to slotted content."
2204
1972
  }
2205
1973
  ],
2206
1974
  "exports": [
2207
1975
  {
2208
1976
  "kind": "js",
2209
- "name": "SkyAvatar",
1977
+ "name": "SkyBadge",
2210
1978
  "declaration": {
2211
- "name": "SkyAvatar",
2212
- "module": "src/sky-avatar/sky-avatar.ts"
1979
+ "name": "SkyBadge",
1980
+ "module": "src/sky-badge/sky-badge.ts"
2213
1981
  }
2214
1982
  },
2215
1983
  {
2216
1984
  "kind": "custom-element-definition",
2217
- "name": "sky-avatar",
1985
+ "name": "sky-badge",
2218
1986
  "declaration": {
2219
- "name": "SkyAvatar",
2220
- "module": "src/sky-avatar/sky-avatar.ts"
1987
+ "name": "SkyBadge",
1988
+ "module": "src/sky-badge/sky-badge.ts"
2221
1989
  }
2222
1990
  }
2223
1991
  ]
@@ -3713,34 +3481,266 @@
3713
3481
  "type": {
3714
3482
  "text": "boolean"
3715
3483
  },
3716
- "description": "Whether the checkbox is in the indeterminate state. Default: `false`.",
3717
- "fieldName": "indeterminate"
3484
+ "description": "Whether the checkbox is in the indeterminate state. Default: `false`.",
3485
+ "fieldName": "indeterminate"
3486
+ }
3487
+ ],
3488
+ "superclass": {
3489
+ "name": "FormControlBase",
3490
+ "module": "/src/helper/internals/form-control-base"
3491
+ },
3492
+ "tagName": "sky-checkbox",
3493
+ "customElement": true,
3494
+ "summary": "Form-associated checkbox with validation, indeterminate state, and customizable label/prefix/suffix rendering."
3495
+ }
3496
+ ],
3497
+ "exports": [
3498
+ {
3499
+ "kind": "js",
3500
+ "name": "SkyCheckbox",
3501
+ "declaration": {
3502
+ "name": "SkyCheckbox",
3503
+ "module": "src/sky-checkbox/sky-checkbox.ts"
3504
+ }
3505
+ },
3506
+ {
3507
+ "kind": "custom-element-definition",
3508
+ "name": "sky-checkbox",
3509
+ "declaration": {
3510
+ "name": "SkyCheckbox",
3511
+ "module": "src/sky-checkbox/sky-checkbox.ts"
3512
+ }
3513
+ }
3514
+ ]
3515
+ },
3516
+ {
3517
+ "kind": "javascript-module",
3518
+ "path": "src/sky-appbar/sky-appbar.ts",
3519
+ "declarations": [
3520
+ {
3521
+ "kind": "class",
3522
+ "description": "",
3523
+ "name": "SkyAppbar",
3524
+ "cssParts": [
3525
+ {
3526
+ "description": "Wrapper that contains the leading slot, title, and actions.",
3527
+ "name": "content"
3528
+ },
3529
+ {
3530
+ "description": "Container for the leading slot (e.g. menu button).",
3531
+ "name": "leading"
3532
+ },
3533
+ {
3534
+ "description": "The title area (contains .title-text with the title string).",
3535
+ "name": "title"
3536
+ },
3537
+ {
3538
+ "description": "The trailing actions container.",
3539
+ "name": "actions"
3540
+ }
3541
+ ],
3542
+ "slots": [
3543
+ {
3544
+ "description": "Leading area (e.g., menu/back button). Defaults to a hamburger icon.",
3545
+ "name": "button"
3546
+ },
3547
+ {
3548
+ "description": "Trailing actions (icons/buttons). This is the default slot.",
3549
+ "name": ""
3550
+ }
3551
+ ],
3552
+ "members": [
3553
+ {
3554
+ "kind": "field",
3555
+ "name": "dependencies",
3556
+ "type": {
3557
+ "text": "Record<string, CustomElementConstructor>"
3558
+ },
3559
+ "static": true,
3560
+ "default": "{ \"sky-icon\": SkyIcon, }"
3561
+ },
3562
+ {
3563
+ "kind": "field",
3564
+ "name": "title",
3565
+ "type": {
3566
+ "text": "string"
3567
+ },
3568
+ "default": "\"App Bar\"",
3569
+ "description": "Title text displayed in the app bar.",
3570
+ "attribute": "title"
3571
+ },
3572
+ {
3573
+ "kind": "field",
3574
+ "name": "color",
3575
+ "type": {
3576
+ "text": "string"
3577
+ },
3578
+ "default": "\"default\"",
3579
+ "description": "Semantic token or CSS color for bar background; foreground color is derived for contrast.",
3580
+ "attribute": "color"
3581
+ },
3582
+ {
3583
+ "kind": "field",
3584
+ "name": "url",
3585
+ "type": {
3586
+ "text": "string"
3587
+ },
3588
+ "default": "\"\"",
3589
+ "description": "Background image URL.",
3590
+ "attribute": "url"
3591
+ },
3592
+ {
3593
+ "kind": "field",
3594
+ "name": "banner",
3595
+ "type": {
3596
+ "text": "boolean"
3597
+ },
3598
+ "default": "true",
3599
+ "description": "Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.",
3600
+ "attribute": "banner"
3601
+ },
3602
+ {
3603
+ "kind": "field",
3604
+ "name": "dense",
3605
+ "type": {
3606
+ "text": "boolean"
3607
+ },
3608
+ "default": "false",
3609
+ "description": "Enables compact vertical spacing.",
3610
+ "attribute": "dense"
3611
+ },
3612
+ {
3613
+ "kind": "field",
3614
+ "name": "elevated",
3615
+ "type": {
3616
+ "text": "boolean"
3617
+ },
3618
+ "default": "false",
3619
+ "description": "Applies elevated shadow styling.",
3620
+ "attribute": "elevated"
3621
+ },
3622
+ {
3623
+ "kind": "field",
3624
+ "name": "leadingLabel",
3625
+ "type": {
3626
+ "text": "string"
3627
+ },
3628
+ "default": "\"Open menu\"",
3629
+ "description": "Accessible label for default leading button fallback.",
3630
+ "attribute": "leadingLabel"
3631
+ },
3632
+ {
3633
+ "kind": "method",
3634
+ "name": "_applyColorSurface",
3635
+ "privacy": "private",
3636
+ "return": {
3637
+ "type": {
3638
+ "text": "void"
3639
+ }
3640
+ },
3641
+ "description": "Applies glass vs solid surface tokens from `color`."
3642
+ },
3643
+ {
3644
+ "kind": "method",
3645
+ "name": "_applyBackgroundImage",
3646
+ "privacy": "private",
3647
+ "return": {
3648
+ "type": {
3649
+ "text": "void"
3650
+ }
3651
+ },
3652
+ "description": "Sets background image CSS variable from `url`."
3653
+ }
3654
+ ],
3655
+ "attributes": [
3656
+ {
3657
+ "name": "title",
3658
+ "type": {
3659
+ "text": "string"
3660
+ },
3661
+ "default": "\"App Bar\"",
3662
+ "description": "Title text displayed in the app bar.",
3663
+ "fieldName": "title"
3664
+ },
3665
+ {
3666
+ "name": "color",
3667
+ "type": {
3668
+ "text": "string"
3669
+ },
3670
+ "default": "\"default\"",
3671
+ "description": "Semantic token or CSS color for bar background; foreground color is derived for contrast.",
3672
+ "fieldName": "color"
3673
+ },
3674
+ {
3675
+ "name": "url",
3676
+ "type": {
3677
+ "text": "string"
3678
+ },
3679
+ "default": "\"\"",
3680
+ "description": "Background image URL.",
3681
+ "fieldName": "url"
3682
+ },
3683
+ {
3684
+ "name": "banner",
3685
+ "type": {
3686
+ "text": "boolean"
3687
+ },
3688
+ "default": "true",
3689
+ "description": "Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.",
3690
+ "fieldName": "banner"
3691
+ },
3692
+ {
3693
+ "name": "dense",
3694
+ "type": {
3695
+ "text": "boolean"
3696
+ },
3697
+ "default": "false",
3698
+ "description": "Enables compact vertical spacing.",
3699
+ "fieldName": "dense"
3700
+ },
3701
+ {
3702
+ "name": "elevated",
3703
+ "type": {
3704
+ "text": "boolean"
3705
+ },
3706
+ "default": "false",
3707
+ "description": "Applies elevated shadow styling.",
3708
+ "fieldName": "elevated"
3709
+ },
3710
+ {
3711
+ "name": "leadingLabel",
3712
+ "type": {
3713
+ "text": "string"
3714
+ },
3715
+ "default": "\"Open menu\"",
3716
+ "description": "Accessible label for default leading button fallback.",
3717
+ "fieldName": "leadingLabel"
3718
3718
  }
3719
3719
  ],
3720
3720
  "superclass": {
3721
- "name": "FormControlBase",
3722
- "module": "/src/helper/internals/form-control-base"
3721
+ "name": "LitElement",
3722
+ "package": "lit"
3723
3723
  },
3724
- "tagName": "sky-checkbox",
3724
+ "tagName": "sky-appbar",
3725
3725
  "customElement": true,
3726
- "summary": "Form-associated checkbox with validation, indeterminate state, and customizable label/prefix/suffix rendering."
3726
+ "summary": "Application top bar with title, optional leading control, trailing actions, and optional color/image background."
3727
3727
  }
3728
3728
  ],
3729
3729
  "exports": [
3730
3730
  {
3731
3731
  "kind": "js",
3732
- "name": "SkyCheckbox",
3732
+ "name": "SkyAppbar",
3733
3733
  "declaration": {
3734
- "name": "SkyCheckbox",
3735
- "module": "src/sky-checkbox/sky-checkbox.ts"
3734
+ "name": "SkyAppbar",
3735
+ "module": "src/sky-appbar/sky-appbar.ts"
3736
3736
  }
3737
3737
  },
3738
3738
  {
3739
3739
  "kind": "custom-element-definition",
3740
- "name": "sky-checkbox",
3740
+ "name": "sky-appbar",
3741
3741
  "declaration": {
3742
- "name": "SkyCheckbox",
3743
- "module": "src/sky-checkbox/sky-checkbox.ts"
3742
+ "name": "SkyAppbar",
3743
+ "module": "src/sky-appbar/sky-appbar.ts"
3744
3744
  }
3745
3745
  }
3746
3746
  ]
@@ -11141,266 +11141,36 @@
11141
11141
  {
11142
11142
  "name": "variant",
11143
11143
  "type": {
11144
- "text": "string"
11145
- },
11146
- "default": "'default'",
11147
- "fieldName": "variant"
11148
- }
11149
- ],
11150
- "superclass": {
11151
- "name": "FormControlBase",
11152
- "module": "/src/helper/internals/form-control-base"
11153
- },
11154
- "tagName": "sky-input",
11155
- "customElement": true,
11156
- "summary": "Versatile form input supporting text, password, number, textarea, and file workflows."
11157
- }
11158
- ],
11159
- "exports": [
11160
- {
11161
- "kind": "js",
11162
- "name": "SkyInput",
11163
- "declaration": {
11164
- "name": "SkyInput",
11165
- "module": "src/sky-input/sky-input.ts"
11166
- }
11167
- },
11168
- {
11169
- "kind": "custom-element-definition",
11170
- "name": "sky-input",
11171
- "declaration": {
11172
- "name": "SkyInput",
11173
- "module": "src/sky-input/sky-input.ts"
11174
- }
11175
- }
11176
- ]
11177
- },
11178
- {
11179
- "kind": "javascript-module",
11180
- "path": "src/sky-listitem/sky-listitem.ts",
11181
- "declarations": [
11182
- {
11183
- "kind": "class",
11184
- "description": "",
11185
- "name": "SkyListitem",
11186
- "cssParts": [
11187
- {
11188
- "description": "The main list item container.",
11189
- "name": "list-item"
11190
- },
11191
- {
11192
- "description": "The leading section (avatar container).",
11193
- "name": "leading"
11194
- },
11195
- {
11196
- "description": "The avatar image element.",
11197
- "name": "avatar"
11198
- },
11199
- {
11200
- "description": "The content wrapper for the main slot.",
11201
- "name": "content"
11202
- },
11203
- {
11204
- "description": "The trailing actions container.",
11205
- "name": "actions"
11206
- },
11207
- {
11208
- "description": "The subheader divider element.",
11209
- "name": "subheader"
11210
- }
11211
- ],
11212
- "slots": [
11213
- {
11214
- "description": "Main content of the list item (usually label or text).",
11215
- "name": "content"
11216
- },
11217
- {
11218
- "description": "Trailing action elements (e.g., icons, buttons).",
11219
- "name": "actions"
11220
- }
11221
- ],
11222
- "members": [
11223
- {
11224
- "kind": "field",
11225
- "name": "avatar",
11226
- "type": {
11227
- "text": "string"
11228
- },
11229
- "default": "\"\"",
11230
- "description": "Optional avatar image URL.",
11231
- "attribute": "avatar"
11232
- },
11233
- {
11234
- "kind": "field",
11235
- "name": "value",
11236
- "type": {
11237
- "text": "string"
11238
- },
11239
- "default": "\"\"",
11240
- "description": "Stable id for selection (`sky-list` `selectedValues` / `list-change`). Default: `\"\"`.",
11241
- "attribute": "value"
11242
- },
11243
- {
11244
- "kind": "field",
11245
- "name": "subheader",
11246
- "type": {
11247
- "text": "string"
11248
- },
11249
- "default": "\"\"",
11250
- "description": "Subheader text; when set, item renders as a section header.",
11251
- "attribute": "subheader",
11252
- "reflects": true
11253
- },
11254
- {
11255
- "kind": "field",
11256
- "name": "selected",
11257
- "type": {
11258
- "text": "boolean"
11259
- },
11260
- "default": "false",
11261
- "description": "Whether item is selected.",
11262
- "attribute": "selected",
11263
- "reflects": true
11264
- },
11265
- {
11266
- "kind": "field",
11267
- "name": "dense",
11268
- "type": {
11269
- "text": "boolean"
11270
- },
11271
- "default": "false",
11272
- "description": "Whether compact spacing is used.",
11273
- "attribute": "dense",
11274
- "reflects": true
11275
- },
11276
- {
11277
- "kind": "field",
11278
- "name": "disabled",
11279
- "type": {
11280
- "text": "boolean"
11281
- },
11282
- "default": "false",
11283
- "description": "Whether interaction is disabled.",
11284
- "attribute": "disabled",
11285
- "reflects": true
11286
- },
11287
- {
11288
- "kind": "method",
11289
- "name": "onClick",
11290
- "privacy": "private",
11291
- "return": {
11292
- "type": {
11293
- "text": "void"
11294
- }
11295
- }
11296
- },
11297
- {
11298
- "kind": "method",
11299
- "name": "setSelected",
11300
- "return": {
11301
- "type": {
11302
- "text": "void"
11303
- }
11304
- },
11305
- "parameters": [
11306
- {
11307
- "name": "selected",
11308
- "type": {
11309
- "text": "boolean"
11310
- }
11311
- }
11312
- ]
11313
- }
11314
- ],
11315
- "events": [
11316
- {
11317
- "name": "item-activate",
11318
- "type": {
11319
- "text": "CustomEvent<SkyListitemActivateDetail>"
11320
- },
11321
- "description": "Fired when the item is activated."
11322
- }
11323
- ],
11324
- "attributes": [
11325
- {
11326
- "name": "avatar",
11327
- "type": {
11328
- "text": "string"
11329
- },
11330
- "default": "\"\"",
11331
- "description": "Optional avatar image URL.",
11332
- "fieldName": "avatar"
11333
- },
11334
- {
11335
- "name": "value",
11336
- "type": {
11337
- "text": "string"
11338
- },
11339
- "default": "\"\"",
11340
- "description": "Stable id for selection (`sky-list` `selectedValues` / `list-change`). Default: `\"\"`.",
11341
- "fieldName": "value"
11342
- },
11343
- {
11344
- "name": "subheader",
11345
- "type": {
11346
- "text": "string"
11347
- },
11348
- "default": "\"\"",
11349
- "description": "Subheader text; when set, item renders as a section header.",
11350
- "fieldName": "subheader"
11351
- },
11352
- {
11353
- "name": "selected",
11354
- "type": {
11355
- "text": "boolean"
11356
- },
11357
- "default": "false",
11358
- "description": "Whether item is selected.",
11359
- "fieldName": "selected"
11360
- },
11361
- {
11362
- "name": "dense",
11363
- "type": {
11364
- "text": "boolean"
11365
- },
11366
- "default": "false",
11367
- "description": "Whether compact spacing is used.",
11368
- "fieldName": "dense"
11369
- },
11370
- {
11371
- "name": "disabled",
11372
- "type": {
11373
- "text": "boolean"
11144
+ "text": "string"
11374
11145
  },
11375
- "default": "false",
11376
- "description": "Whether interaction is disabled.",
11377
- "fieldName": "disabled"
11146
+ "default": "'default'",
11147
+ "fieldName": "variant"
11378
11148
  }
11379
11149
  ],
11380
11150
  "superclass": {
11381
- "name": "LitElement",
11382
- "package": "lit"
11151
+ "name": "FormControlBase",
11152
+ "module": "/src/helper/internals/form-control-base"
11383
11153
  },
11384
- "tagName": "sky-listitem",
11154
+ "tagName": "sky-input",
11385
11155
  "customElement": true,
11386
- "summary": "List item with optional avatar, actions, subheader mode, and selectable state."
11156
+ "summary": "Versatile form input supporting text, password, number, textarea, and file workflows."
11387
11157
  }
11388
11158
  ],
11389
11159
  "exports": [
11390
11160
  {
11391
11161
  "kind": "js",
11392
- "name": "SkyListitem",
11162
+ "name": "SkyInput",
11393
11163
  "declaration": {
11394
- "name": "SkyListitem",
11395
- "module": "src/sky-listitem/sky-listitem.ts"
11164
+ "name": "SkyInput",
11165
+ "module": "src/sky-input/sky-input.ts"
11396
11166
  }
11397
11167
  },
11398
11168
  {
11399
11169
  "kind": "custom-element-definition",
11400
- "name": "sky-listitem",
11170
+ "name": "sky-input",
11401
11171
  "declaration": {
11402
- "name": "SkyListitem",
11403
- "module": "src/sky-listitem/sky-listitem.ts"
11172
+ "name": "SkyInput",
11173
+ "module": "src/sky-input/sky-input.ts"
11404
11174
  }
11405
11175
  }
11406
11176
  ]
@@ -11725,6 +11495,236 @@
11725
11495
  }
11726
11496
  ]
11727
11497
  },
11498
+ {
11499
+ "kind": "javascript-module",
11500
+ "path": "src/sky-listitem/sky-listitem.ts",
11501
+ "declarations": [
11502
+ {
11503
+ "kind": "class",
11504
+ "description": "",
11505
+ "name": "SkyListitem",
11506
+ "cssParts": [
11507
+ {
11508
+ "description": "The main list item container.",
11509
+ "name": "list-item"
11510
+ },
11511
+ {
11512
+ "description": "The leading section (avatar container).",
11513
+ "name": "leading"
11514
+ },
11515
+ {
11516
+ "description": "The avatar image element.",
11517
+ "name": "avatar"
11518
+ },
11519
+ {
11520
+ "description": "The content wrapper for the main slot.",
11521
+ "name": "content"
11522
+ },
11523
+ {
11524
+ "description": "The trailing actions container.",
11525
+ "name": "actions"
11526
+ },
11527
+ {
11528
+ "description": "The subheader divider element.",
11529
+ "name": "subheader"
11530
+ }
11531
+ ],
11532
+ "slots": [
11533
+ {
11534
+ "description": "Main content of the list item (usually label or text).",
11535
+ "name": "content"
11536
+ },
11537
+ {
11538
+ "description": "Trailing action elements (e.g., icons, buttons).",
11539
+ "name": "actions"
11540
+ }
11541
+ ],
11542
+ "members": [
11543
+ {
11544
+ "kind": "field",
11545
+ "name": "avatar",
11546
+ "type": {
11547
+ "text": "string"
11548
+ },
11549
+ "default": "\"\"",
11550
+ "description": "Optional avatar image URL.",
11551
+ "attribute": "avatar"
11552
+ },
11553
+ {
11554
+ "kind": "field",
11555
+ "name": "value",
11556
+ "type": {
11557
+ "text": "string"
11558
+ },
11559
+ "default": "\"\"",
11560
+ "description": "Stable id for selection (`sky-list` `selectedValues` / `list-change`). Default: `\"\"`.",
11561
+ "attribute": "value"
11562
+ },
11563
+ {
11564
+ "kind": "field",
11565
+ "name": "subheader",
11566
+ "type": {
11567
+ "text": "string"
11568
+ },
11569
+ "default": "\"\"",
11570
+ "description": "Subheader text; when set, item renders as a section header.",
11571
+ "attribute": "subheader",
11572
+ "reflects": true
11573
+ },
11574
+ {
11575
+ "kind": "field",
11576
+ "name": "selected",
11577
+ "type": {
11578
+ "text": "boolean"
11579
+ },
11580
+ "default": "false",
11581
+ "description": "Whether item is selected.",
11582
+ "attribute": "selected",
11583
+ "reflects": true
11584
+ },
11585
+ {
11586
+ "kind": "field",
11587
+ "name": "dense",
11588
+ "type": {
11589
+ "text": "boolean"
11590
+ },
11591
+ "default": "false",
11592
+ "description": "Whether compact spacing is used.",
11593
+ "attribute": "dense",
11594
+ "reflects": true
11595
+ },
11596
+ {
11597
+ "kind": "field",
11598
+ "name": "disabled",
11599
+ "type": {
11600
+ "text": "boolean"
11601
+ },
11602
+ "default": "false",
11603
+ "description": "Whether interaction is disabled.",
11604
+ "attribute": "disabled",
11605
+ "reflects": true
11606
+ },
11607
+ {
11608
+ "kind": "method",
11609
+ "name": "onClick",
11610
+ "privacy": "private",
11611
+ "return": {
11612
+ "type": {
11613
+ "text": "void"
11614
+ }
11615
+ }
11616
+ },
11617
+ {
11618
+ "kind": "method",
11619
+ "name": "setSelected",
11620
+ "return": {
11621
+ "type": {
11622
+ "text": "void"
11623
+ }
11624
+ },
11625
+ "parameters": [
11626
+ {
11627
+ "name": "selected",
11628
+ "type": {
11629
+ "text": "boolean"
11630
+ }
11631
+ }
11632
+ ]
11633
+ }
11634
+ ],
11635
+ "events": [
11636
+ {
11637
+ "name": "item-activate",
11638
+ "type": {
11639
+ "text": "CustomEvent<SkyListitemActivateDetail>"
11640
+ },
11641
+ "description": "Fired when the item is activated."
11642
+ }
11643
+ ],
11644
+ "attributes": [
11645
+ {
11646
+ "name": "avatar",
11647
+ "type": {
11648
+ "text": "string"
11649
+ },
11650
+ "default": "\"\"",
11651
+ "description": "Optional avatar image URL.",
11652
+ "fieldName": "avatar"
11653
+ },
11654
+ {
11655
+ "name": "value",
11656
+ "type": {
11657
+ "text": "string"
11658
+ },
11659
+ "default": "\"\"",
11660
+ "description": "Stable id for selection (`sky-list` `selectedValues` / `list-change`). Default: `\"\"`.",
11661
+ "fieldName": "value"
11662
+ },
11663
+ {
11664
+ "name": "subheader",
11665
+ "type": {
11666
+ "text": "string"
11667
+ },
11668
+ "default": "\"\"",
11669
+ "description": "Subheader text; when set, item renders as a section header.",
11670
+ "fieldName": "subheader"
11671
+ },
11672
+ {
11673
+ "name": "selected",
11674
+ "type": {
11675
+ "text": "boolean"
11676
+ },
11677
+ "default": "false",
11678
+ "description": "Whether item is selected.",
11679
+ "fieldName": "selected"
11680
+ },
11681
+ {
11682
+ "name": "dense",
11683
+ "type": {
11684
+ "text": "boolean"
11685
+ },
11686
+ "default": "false",
11687
+ "description": "Whether compact spacing is used.",
11688
+ "fieldName": "dense"
11689
+ },
11690
+ {
11691
+ "name": "disabled",
11692
+ "type": {
11693
+ "text": "boolean"
11694
+ },
11695
+ "default": "false",
11696
+ "description": "Whether interaction is disabled.",
11697
+ "fieldName": "disabled"
11698
+ }
11699
+ ],
11700
+ "superclass": {
11701
+ "name": "LitElement",
11702
+ "package": "lit"
11703
+ },
11704
+ "tagName": "sky-listitem",
11705
+ "customElement": true,
11706
+ "summary": "List item with optional avatar, actions, subheader mode, and selectable state."
11707
+ }
11708
+ ],
11709
+ "exports": [
11710
+ {
11711
+ "kind": "js",
11712
+ "name": "SkyListitem",
11713
+ "declaration": {
11714
+ "name": "SkyListitem",
11715
+ "module": "src/sky-listitem/sky-listitem.ts"
11716
+ }
11717
+ },
11718
+ {
11719
+ "kind": "custom-element-definition",
11720
+ "name": "sky-listitem",
11721
+ "declaration": {
11722
+ "name": "SkyListitem",
11723
+ "module": "src/sky-listitem/sky-listitem.ts"
11724
+ }
11725
+ }
11726
+ ]
11727
+ },
11728
11728
  {
11729
11729
  "kind": "javascript-module",
11730
11730
  "path": "src/sky-radio/sky-radio.ts",