@sky.ui/core 0.0.29 → 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 (4) hide show
  1. package/auto-import.js +1 -1
  2. package/dist/custom-elements.json +972 -972
  3. package/package.json +1 -1
  4. package/plugins/ce-auto-import.js +1 -1
package/dist/custom-elements.json CHANGED
@@ -453,37 +453,33 @@
453
453
  },
454
454
  {
455
455
  "kind": "javascript-module",
456
- "path": "src/sky-appbar/sky-appbar.ts",
456
+ "path": "src/sky-button/sky-button.ts",
457
457
  "declarations": [
458
458
  {
459
459
  "kind": "class",
460
460
  "description": "",
461
- "name": "SkyAppbar",
461
+ "name": "SkyButton",
462
462
  "cssParts": [
463
463
  {
464
- "description": "Wrapper that contains the leading slot, title, and actions.",
465
- "name": "content"
464
+ "description": "The native `<button>` element.",
465
+ "name": "button"
466
466
  },
467
467
  {
468
- "description": "Container for the leading slot (e.g. menu button).",
469
- "name": "leading"
468
+ "description": "The optional left/right icons.",
469
+ "name": "icon"
470
470
  },
471
471
  {
472
- "description": "The title area (contains .title-text with the title string).",
473
- "name": "title"
472
+ "description": "Overlay displayed when loading.",
473
+ "name": "loading-overlay"
474
474
  },
475
475
  {
476
- "description": "The trailing actions container.",
477
- "name": "actions"
476
+ "description": "Spinner displayed when loading.",
477
+ "name": "spinner"
478
478
  }
479
479
  ],
480
480
  "slots": [
481
481
  {
482
- "description": "Leading area (e.g., menu/back button). Defaults to a hamburger icon.",
483
- "name": "button"
484
- },
485
- {
486
- "description": "Trailing actions (icons/buttons). This is the default slot.",
482
+ "description": "Default slot for the button label (replaces `label` property if used).",
487
483
  "name": ""
488
484
  }
489
485
  ],
@@ -499,907 +495,711 @@
499
495
  },
500
496
  {
501
497
  "kind": "field",
502
- "name": "title",
503
- "type": {
504
- "text": "string"
505
- },
506
- "default": "\"App Bar\"",
507
- "description": "Title text displayed in the app bar.",
508
- "attribute": "title"
509
- },
510
- {
511
- "kind": "field",
512
- "name": "color",
498
+ "name": "formAssociated",
513
499
  "type": {
514
- "text": "string"
500
+ "text": "boolean"
515
501
  },
516
- "default": "\"default\"",
517
- "description": "Semantic token or CSS color for bar background; foreground color is derived for contrast.",
518
- "attribute": "color"
502
+ "static": true,
503
+ "default": "true"
519
504
  },
520
505
  {
521
506
  "kind": "field",
522
- "name": "url",
507
+ "name": "internals",
523
508
  "type": {
524
- "text": "string"
509
+ "text": "ElementInternals"
525
510
  },
526
- "default": "\"\"",
527
- "description": "Background image URL.",
528
- "attribute": "url"
511
+ "privacy": "private"
529
512
  },
530
513
  {
531
514
  "kind": "field",
532
- "name": "banner",
515
+ "name": "variant",
533
516
  "type": {
534
- "text": "boolean"
517
+ "text": "SkyButtonVariant"
535
518
  },
536
- "default": "true",
537
- "description": "Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.",
538
- "attribute": "banner"
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",
522
+ "reflects": true
539
523
  },
540
524
  {
541
525
  "kind": "field",
542
- "name": "dense",
526
+ "name": "color",
543
527
  "type": {
544
- "text": "boolean"
528
+ "text": "string"
545
529
  },
546
- "default": "false",
547
- "description": "Enables compact vertical spacing.",
548
- "attribute": "dense"
530
+ "default": "\"primary\"",
531
+ "description": "Base color token or custom CSS color. Default: `\"primary\"`.",
532
+ "attribute": "color"
549
533
  },
550
534
  {
551
535
  "kind": "field",
552
- "name": "elevated",
536
+ "name": "type",
553
537
  "type": {
554
- "text": "boolean"
538
+ "text": "SkyButtonType"
555
539
  },
556
- "default": "false",
557
- "description": "Applies elevated shadow styling.",
558
- "attribute": "elevated"
540
+ "default": "\"button\"",
541
+ "description": "Button type attribute. Default: `\"button\"`.",
542
+ "attribute": "type"
559
543
  },
560
544
  {
561
545
  "kind": "field",
562
- "name": "leadingLabel",
546
+ "name": "form",
563
547
  "type": {
564
548
  "text": "string"
565
549
  },
566
- "default": "\"Open menu\"",
567
- "description": "Accessible label for default leading button fallback.",
568
- "attribute": "leadingLabel"
569
- },
570
- {
571
- "kind": "method",
572
- "name": "_applyColorSurface",
573
- "privacy": "private",
574
- "return": {
575
- "type": {
576
- "text": "void"
577
- }
578
- },
579
- "description": "Applies glass vs solid surface tokens from `color`."
550
+ "default": "\"\"",
551
+ "description": "Associated form ID for custom submit handling.",
552
+ "attribute": "form"
580
553
  },
581
554
  {
582
- "kind": "method",
583
- "name": "_applyBackgroundImage",
584
- "privacy": "private",
585
- "return": {
586
- "type": {
587
- "text": "void"
588
- }
589
- },
590
- "description": "Sets background image CSS variable from `url`."
591
- }
592
- ],
593
- "attributes": [
594
- {
595
- "name": "title",
555
+ "kind": "field",
556
+ "name": "size",
596
557
  "type": {
597
558
  "text": "string"
598
559
  },
599
- "default": "\"App Bar\"",
600
- "description": "Title text displayed in the app bar.",
601
- "fieldName": "title"
560
+ "default": "\"md\"",
561
+ "description": "Preset size token (`xs…xl`) or CSS size (e.g., `\"15px\"`, `\"1rem\"`). Default: `\"md\"`.",
562
+ "attribute": "size"
602
563
  },
603
564
  {
604
- "name": "color",
565
+ "kind": "field",
566
+ "name": "radius",
605
567
  "type": {
606
568
  "text": "string"
607
569
  },
608
- "default": "\"default\"",
609
- "description": "Semantic token or CSS color for bar background; foreground color is derived for contrast.",
610
- "fieldName": "color"
570
+ "default": "\"md\"",
571
+ "description": "Preset radius token (`none…full`) or CSS radius (e.g., `\"12px\"`). Default: `\"md\"`.",
572
+ "attribute": "radius"
611
573
  },
612
574
  {
613
- "name": "url",
575
+ "kind": "field",
576
+ "name": "label",
614
577
  "type": {
615
578
  "text": "string"
616
579
  },
617
- "default": "\"\"",
618
- "description": "Background image URL.",
619
- "fieldName": "url"
580
+ "default": "\"Button\"",
581
+ "description": "Text label for the button. Ignored if default slot is used. Default: `\"Button\"`.",
582
+ "attribute": "label"
620
583
  },
621
584
  {
622
- "name": "banner",
585
+ "kind": "field",
586
+ "name": "disabled",
623
587
  "type": {
624
588
  "text": "boolean"
625
589
  },
626
- "default": "true",
627
- "description": "Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.",
628
- "fieldName": "banner"
590
+ "default": "false",
591
+ "description": "Whether the button is disabled. Default: `false`.",
592
+ "attribute": "disabled",
593
+ "reflects": true
629
594
  },
630
595
  {
631
- "name": "dense",
596
+ "kind": "field",
597
+ "name": "loading",
632
598
  "type": {
633
599
  "text": "boolean"
634
600
  },
635
601
  "default": "false",
636
- "description": "Enables compact vertical spacing.",
637
- "fieldName": "dense"
602
+ "description": "Shows a loading overlay when true. Default: `false`.",
603
+ "attribute": "loading",
604
+ "reflects": true
638
605
  },
639
606
  {
640
- "name": "elevated",
607
+ "kind": "field",
608
+ "name": "iconL",
641
609
  "type": {
642
- "text": "boolean"
610
+ "text": "string"
643
611
  },
644
- "default": "false",
645
- "description": "Applies elevated shadow styling.",
646
- "fieldName": "elevated"
612
+ "default": "\"\"",
613
+ "description": "Optional left-side icon (Iconify name). Default: `\"\"`.",
614
+ "attribute": "iconL"
647
615
  },
648
616
  {
649
- "name": "leadingLabel",
617
+ "kind": "field",
618
+ "name": "iconR",
650
619
  "type": {
651
620
  "text": "string"
652
621
  },
653
- "default": "\"Open menu\"",
654
- "description": "Accessible label for default leading button fallback.",
655
- "fieldName": "leadingLabel"
656
- }
657
- ],
658
- "superclass": {
659
- "name": "LitElement",
660
- "package": "lit"
661
- },
662
- "tagName": "sky-appbar",
663
- "customElement": true,
664
- "summary": "Application top bar with title, optional leading control, trailing actions, and optional color/image background."
665
- }
666
- ],
667
- "exports": [
668
- {
669
- "kind": "js",
670
- "name": "SkyAppbar",
671
- "declaration": {
672
- "name": "SkyAppbar",
673
- "module": "src/sky-appbar/sky-appbar.ts"
674
- }
675
- },
676
- {
677
- "kind": "custom-element-definition",
678
- "name": "sky-appbar",
679
- "declaration": {
680
- "name": "SkyAppbar",
681
- "module": "src/sky-appbar/sky-appbar.ts"
682
- }
683
- }
684
- ]
685
- },
686
- {
687
- "kind": "javascript-module",
688
- "path": "src/sky-avatar/sky-avatar.ts",
689
- "declarations": [
690
- {
691
- "kind": "class",
692
- "description": "",
693
- "name": "SkyAvatar",
694
- "cssParts": [
695
- {
696
- "description": "The avatar container element.",
697
- "name": "avatar"
698
- },
699
- {
700
- "description": "The loading overlay container (shown when `loading` is true).",
701
- "name": "loading-overlay"
622
+ "default": "\"\"",
623
+ "description": "Optional right-side icon (Iconify name). Default: `\"\"`.",
624
+ "attribute": "iconR"
702
625
  },
703
- {
704
- "description": "The spinner element shown when loading.",
705
- "name": "spinner"
706
- }
707
- ],
708
- "slots": [
709
- {
710
- "description": "Fallback content (e.g., initials or an icon) rendered when `image` is empty.",
711
- "name": ""
712
- }
713
- ],
714
- "members": [
715
626
  {
716
627
  "kind": "field",
717
- "name": "size",
628
+ "name": "iconOnly",
718
629
  "type": {
719
- "text": "string"
630
+ "text": "boolean"
720
631
  },
721
- "default": "\"50px\"",
722
- "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
723
- "attribute": "size"
632
+ "default": "false",
633
+ "description": "Square padding for icon-only buttons; hides label text. Default: `false`.",
634
+ "attribute": "iconOnly",
635
+ "reflects": true
724
636
  },
725
637
  {
726
638
  "kind": "field",
727
- "name": "image",
639
+ "name": "colors",
728
640
  "type": {
729
641
  "text": "string"
730
642
  },
731
643
  "default": "\"\"",
732
- "description": "Image URL; fallback slot is shown on load error.",
733
- "attribute": "image"
644
+ "description": "Comma-separated color stops for gradient variant. Default: `\"\"`.",
645
+ "attribute": "colors"
734
646
  },
735
647
  {
736
648
  "kind": "field",
737
- "name": "fit",
738
- "type": {
739
- "text": "SkyAvatarFit"
740
- },
741
- "default": "\"cover\"",
742
- "description": "Image fill mode: `cover` (default) or `contain`.",
743
- "attribute": "fit",
744
- "reflects": true
745
- },
746
- {
747
- "kind": "field",
748
- "name": "radius",
749
- "type": {
750
- "text": "string"
751
- },
752
- "default": "\"md\"",
753
- "description": "Border radius token or CSS value.",
754
- "attribute": "radius"
755
- },
756
- {
757
- "kind": "field",
758
- "name": "alt",
759
- "type": {
760
- "text": "string"
761
- },
762
- "default": "\"\"",
763
- "description": "Accessible name when image content conveys meaning.",
764
- "attribute": "alt"
765
- },
766
- {
767
- "kind": "field",
768
- "name": "color",
769
- "type": {
770
- "text": "string"
771
- },
772
- "default": "\"dark\"",
773
- "description": "Token or CSS color applied to fallback slot content.",
774
- "attribute": "color"
775
- },
776
- {
777
- "kind": "field",
778
- "name": "outline",
779
- "type": {
780
- "text": "string"
781
- },
782
- "default": "\"\"",
783
- "description": "CSS `outline` value.",
784
- "attribute": "outline"
785
- },
786
- {
787
- "kind": "field",
788
- "name": "outlineOffset",
789
- "type": {
790
- "text": "string"
791
- },
792
- "default": "\"2px\"",
793
- "description": "CSS `outline-offset` value.",
794
- "attribute": "outlineOffset"
795
- },
796
- {
797
- "kind": "field",
798
- "name": "loading",
799
- "type": {
800
- "text": "boolean"
801
- },
802
- "default": "false",
803
- "description": "Shows loading overlay when true.",
804
- "attribute": "loading",
805
- "reflects": true
806
- },
807
- {
808
- "kind": "field",
809
- "name": "disabled",
649
+ "name": "animation",
810
650
  "type": {
811
- "text": "boolean"
651
+ "text": "SkyButtonAnimation"
812
652
  },
813
- "default": "false",
814
- "description": "Dims and disables pointer interactions.",
815
- "attribute": "disabled",
653
+ "default": "\"auto\"",
654
+ "description": "Transform animation style. Default: `\"auto\"`.",
655
+ "attribute": "animation",
816
656
  "reflects": true
817
657
  },
818
658
  {
819
659
  "kind": "field",
820
- "name": "interactive",
821
- "type": {
822
- "text": "boolean"
823
- },
824
- "default": "false",
825
- "description": "Enables interactive behavior with keyboard/click activation.",
826
- "attribute": "interactive"
827
- },
828
- {
829
- "kind": "field",
830
- "name": "shadow",
660
+ "name": "_hasMeaningfulSlot",
831
661
  "type": {
832
662
  "text": "boolean"
833
663
  },
834
- "default": "false",
835
- "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
836
- "attribute": "shadow",
837
- "reflects": true
664
+ "privacy": "private",
665
+ "default": "false"
838
666
  },
839
667
  {
840
668
  "kind": "field",
841
- "name": "_imageError",
669
+ "name": "_styleVars",
842
670
  "type": {
843
- "text": "boolean"
671
+ "text": "Record<string, string>"
844
672
  },
845
673
  "privacy": "private",
846
- "default": "false",
847
- "description": "True when image failed to load; show slot instead."
674
+ "default": "{}",
675
+ "description": "Inline CSS variable cache."
848
676
  },
849
677
  {
850
- "kind": "field",
851
- "name": "_onImageLoad",
678
+ "kind": "method",
679
+ "name": "_slotHasMeaningfulContent",
852
680
  "privacy": "private",
853
- "description": "Marks image load success and keeps image rendering active."
681
+ "return": {
682
+ "type": {
683
+ "text": "boolean"
684
+ }
685
+ },
686
+ "parameters": [
687
+ {
688
+ "name": "slotEl",
689
+ "type": {
690
+ "text": "HTMLSlotElement"
691
+ }
692
+ }
693
+ ]
854
694
  },
855
695
  {
856
696
  "kind": "field",
857
- "name": "_onImageError",
858
- "privacy": "private",
859
- "description": "Marks image load failure and enables fallback slot rendering."
697
+ "name": "_onSlotChange",
698
+ "privacy": "private"
860
699
  },
861
700
  {
862
701
  "kind": "method",
863
- "name": "_handleInteractiveClick",
702
+ "name": "_toSquarePadding",
864
703
  "privacy": "private",
865
704
  "return": {
866
705
  "type": {
867
- "text": "void"
706
+ "text": "string"
868
707
  }
869
708
  },
870
709
  "parameters": [
871
710
  {
872
- "name": "e",
711
+ "name": "padding",
873
712
  "type": {
874
- "text": "Event"
713
+ "text": "string"
875
714
  }
876
715
  }
877
716
  ],
878
- "description": "Re-dispatches click in interactive mode for host-level consumers."
717
+ "description": "Uses vertical padding for equal sides (icon-only square control)."
879
718
  },
880
719
  {
881
720
  "kind": "method",
882
- "name": "_handleInteractiveKeydown",
721
+ "name": "_resolveSize",
883
722
  "privacy": "private",
884
723
  "return": {
885
724
  "type": {
886
- "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 }"
887
726
  }
888
727
  },
889
728
  "parameters": [
890
729
  {
891
- "name": "e",
730
+ "name": "input",
892
731
  "type": {
893
- "text": "KeyboardEvent"
732
+ "text": "string"
894
733
  }
895
734
  }
896
- ],
897
- "description": "Handles keyboard activation in interactive mode."
735
+ ]
898
736
  },
899
737
  {
900
738
  "kind": "method",
901
- "name": "adjustSpinnerSize",
739
+ "name": "_isThemeBorderShorthand",
902
740
  "privacy": "private",
903
741
  "return": {
904
742
  "type": {
905
- "text": "void"
743
+ "text": "boolean"
906
744
  }
907
745
  },
908
- "description": "Derives spinner dimensions from current avatar size."
909
- }
910
- ],
911
- "events": [
912
- {
913
- "name": "click",
914
- "type": {
915
- "text": "Event"
916
- }
917
- }
918
- ],
919
- "attributes": [
920
- {
921
- "name": "size",
922
- "type": {
923
- "text": "string"
924
- },
925
- "default": "\"50px\"",
926
- "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
927
- "fieldName": "size"
928
- },
929
- {
930
- "name": "image",
931
- "type": {
932
- "text": "string"
933
- },
934
- "default": "\"\"",
935
- "description": "Image URL; fallback slot is shown on load error.",
936
- "fieldName": "image"
937
- },
938
- {
939
- "name": "fit",
940
- "type": {
941
- "text": "SkyAvatarFit"
942
- },
943
- "default": "\"cover\"",
944
- "description": "Image fill mode: `cover` (default) or `contain`.",
945
- "fieldName": "fit"
946
- },
947
- {
948
- "name": "radius",
949
- "type": {
950
- "text": "string"
951
- },
952
- "default": "\"md\"",
953
- "description": "Border radius token or CSS value.",
954
- "fieldName": "radius"
955
- },
956
- {
957
- "name": "alt",
958
- "type": {
959
- "text": "string"
960
- },
961
- "default": "\"\"",
962
- "description": "Accessible name when image content conveys meaning.",
963
- "fieldName": "alt"
964
- },
965
- {
966
- "name": "color",
967
- "type": {
968
- "text": "string"
969
- },
970
- "default": "\"dark\"",
971
- "description": "Token or CSS color applied to fallback slot content.",
972
- "fieldName": "color"
973
- },
974
- {
975
- "name": "outline",
976
- "type": {
977
- "text": "string"
978
- },
979
- "default": "\"\"",
980
- "description": "CSS `outline` value.",
981
- "fieldName": "outline"
982
- },
983
- {
984
- "name": "outlineOffset",
985
- "type": {
986
- "text": "string"
987
- },
988
- "default": "\"2px\"",
989
- "description": "CSS `outline-offset` value.",
990
- "fieldName": "outlineOffset"
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."
991
755
  },
992
756
  {
993
- "name": "loading",
994
- "type": {
995
- "text": "boolean"
757
+ "kind": "method",
758
+ "name": "_borderColorFromShorthand",
759
+ "privacy": "private",
760
+ "return": {
761
+ "type": {
762
+ "text": "string"
763
+ }
996
764
  },
997
- "default": "false",
998
- "description": "Shows loading overlay when true.",
999
- "fieldName": "loading"
765
+ "parameters": [
766
+ {
767
+ "name": "border",
768
+ "type": {
769
+ "text": "string | undefined"
770
+ }
771
+ }
772
+ ],
773
+ "description": "Extracts the color token from a `Npx solid …` border shorthand."
1000
774
  },
1001
775
  {
1002
- "name": "disabled",
1003
- "type": {
1004
- "text": "boolean"
776
+ "kind": "method",
777
+ "name": "focusButton",
778
+ "privacy": "public",
779
+ "return": {
780
+ "type": {
781
+ "text": "void"
782
+ }
1005
783
  },
1006
- "default": "false",
1007
- "description": "Dims and disables pointer interactions.",
1008
- "fieldName": "disabled"
784
+ "description": "Focuses the internal native button."
1009
785
  },
1010
786
  {
1011
- "name": "interactive",
1012
- "type": {
1013
- "text": "boolean"
787
+ "kind": "method",
788
+ "name": "clickButton",
789
+ "privacy": "public",
790
+ "return": {
791
+ "type": {
792
+ "text": "void"
793
+ }
1014
794
  },
1015
- "default": "false",
1016
- "description": "Enables interactive behavior with keyboard/click activation.",
1017
- "fieldName": "interactive"
795
+ "description": "Triggers a click on the internal native button when enabled."
1018
796
  },
1019
797
  {
1020
- "name": "shadow",
1021
- "type": {
1022
- "text": "boolean"
798
+ "kind": "method",
799
+ "name": "_createRipple",
800
+ "privacy": "private",
801
+ "return": {
802
+ "type": {
803
+ "text": "void"
804
+ }
1023
805
  },
1024
- "default": "false",
1025
- "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
1026
- "fieldName": "shadow"
1027
- }
1028
- ],
1029
- "superclass": {
1030
- "name": "LitElement",
1031
- "package": "lit"
1032
- },
1033
- "tagName": "sky-avatar",
1034
- "customElement": true,
1035
- "summary": "Avatar that renders image content or fallback slot content with configurable size, radius, outline, and loading state."
1036
- }
1037
- ],
1038
- "exports": [
1039
- {
1040
- "kind": "js",
1041
- "name": "SkyAvatar",
1042
- "declaration": {
1043
- "name": "SkyAvatar",
1044
- "module": "src/sky-avatar/sky-avatar.ts"
1045
- }
1046
- },
1047
- {
1048
- "kind": "custom-element-definition",
1049
- "name": "sky-avatar",
1050
- "declaration": {
1051
- "name": "SkyAvatar",
1052
- "module": "src/sky-avatar/sky-avatar.ts"
1053
- }
1054
- }
1055
- ]
1056
- },
1057
- {
1058
- "kind": "javascript-module",
1059
- "path": "src/sky-button/sky-button.ts",
1060
- "declarations": [
1061
- {
1062
- "kind": "class",
1063
- "description": "",
1064
- "name": "SkyButton",
1065
- "cssParts": [
1066
- {
1067
- "description": "The native `<button>` element.",
1068
- "name": "button"
1069
- },
1070
- {
1071
- "description": "The optional left/right icons.",
1072
- "name": "icon"
1073
- },
1074
- {
1075
- "description": "Overlay displayed when loading.",
1076
- "name": "loading-overlay"
806
+ "parameters": [
807
+ {
808
+ "name": "event",
809
+ "type": {
810
+ "text": "MouseEvent"
811
+ }
812
+ }
813
+ ]
1077
814
  },
1078
815
  {
1079
- "description": "Spinner displayed when loading.",
1080
- "name": "spinner"
1081
- }
1082
- ],
1083
- "slots": [
1084
- {
1085
- "description": "Default slot for the button label (replaces `label` property if used).",
1086
- "name": ""
1087
- }
1088
- ],
1089
- "members": [
1090
- {
1091
- "kind": "field",
1092
- "name": "dependencies",
1093
- "type": {
1094
- "text": "Record<string, CustomElementConstructor>"
816
+ "kind": "method",
817
+ "name": "formDisabledCallback",
818
+ "return": {
819
+ "type": {
820
+ "text": "void"
821
+ }
1095
822
  },
1096
- "static": true,
1097
- "default": "{ \"sky-icon\": SkyIcon, }"
823
+ "parameters": [
824
+ {
825
+ "name": "disabled",
826
+ "type": {
827
+ "text": "boolean"
828
+ }
829
+ }
830
+ ]
1098
831
  },
1099
832
  {
1100
833
  "kind": "field",
1101
- "name": "formAssociated",
834
+ "name": "formOwner",
1102
835
  "type": {
1103
- "text": "boolean"
836
+ "text": "HTMLFormElement | null"
1104
837
  },
1105
- "static": true,
1106
- "default": "true"
838
+ "readonly": true
1107
839
  },
1108
840
  {
1109
- "kind": "field",
1110
- "name": "internals",
1111
- "type": {
1112
- "text": "ElementInternals"
841
+ "kind": "method",
842
+ "name": "_handleClick",
843
+ "privacy": "private",
844
+ "return": {
845
+ "type": {
846
+ "text": "void"
847
+ }
1113
848
  },
1114
- "privacy": "private"
849
+ "parameters": [
850
+ {
851
+ "name": "event",
852
+ "type": {
853
+ "text": "MouseEvent"
854
+ }
855
+ }
856
+ ]
1115
857
  },
1116
858
  {
1117
- "kind": "field",
859
+ "kind": "method",
860
+ "name": "_iconOnlyName",
861
+ "privacy": "private",
862
+ "return": {
863
+ "type": {
864
+ "text": "string"
865
+ }
866
+ }
867
+ }
868
+ ],
869
+ "attributes": [
870
+ {
1118
871
  "name": "variant",
1119
872
  "type": {
1120
873
  "text": "SkyButtonVariant"
1121
874
  },
1122
875
  "default": "\"solid\"",
1123
876
  "description": "Visual variant of the button. Use `\"link\"` for text-only control with underline on hover. Default: `\"solid\"`.",
1124
- "attribute": "variant",
1125
- "reflects": true
877
+ "fieldName": "variant"
1126
878
  },
1127
879
  {
1128
- "kind": "field",
1129
880
  "name": "color",
1130
881
  "type": {
1131
882
  "text": "string"
1132
883
  },
1133
884
  "default": "\"primary\"",
1134
885
  "description": "Base color token or custom CSS color. Default: `\"primary\"`.",
1135
- "attribute": "color"
886
+ "fieldName": "color"
1136
887
  },
1137
888
  {
1138
- "kind": "field",
1139
889
  "name": "type",
1140
890
  "type": {
1141
891
  "text": "SkyButtonType"
1142
892
  },
1143
893
  "default": "\"button\"",
1144
894
  "description": "Button type attribute. Default: `\"button\"`.",
1145
- "attribute": "type"
895
+ "fieldName": "type"
1146
896
  },
1147
897
  {
1148
- "kind": "field",
1149
898
  "name": "form",
1150
899
  "type": {
1151
900
  "text": "string"
1152
901
  },
1153
902
  "default": "\"\"",
1154
903
  "description": "Associated form ID for custom submit handling.",
1155
- "attribute": "form"
904
+ "fieldName": "form"
1156
905
  },
1157
906
  {
1158
- "kind": "field",
1159
907
  "name": "size",
1160
908
  "type": {
1161
909
  "text": "string"
1162
910
  },
1163
911
  "default": "\"md\"",
1164
912
  "description": "Preset size token (`xs…xl`) or CSS size (e.g., `\"15px\"`, `\"1rem\"`). Default: `\"md\"`.",
1165
- "attribute": "size"
913
+ "fieldName": "size"
1166
914
  },
1167
915
  {
1168
- "kind": "field",
1169
916
  "name": "radius",
1170
917
  "type": {
1171
918
  "text": "string"
1172
919
  },
1173
920
  "default": "\"md\"",
1174
921
  "description": "Preset radius token (`none…full`) or CSS radius (e.g., `\"12px\"`). Default: `\"md\"`.",
1175
- "attribute": "radius"
922
+ "fieldName": "radius"
1176
923
  },
1177
924
  {
1178
- "kind": "field",
1179
925
  "name": "label",
1180
926
  "type": {
1181
927
  "text": "string"
1182
928
  },
1183
929
  "default": "\"Button\"",
1184
930
  "description": "Text label for the button. Ignored if default slot is used. Default: `\"Button\"`.",
1185
- "attribute": "label"
931
+ "fieldName": "label"
1186
932
  },
1187
933
  {
1188
- "kind": "field",
1189
934
  "name": "disabled",
1190
935
  "type": {
1191
936
  "text": "boolean"
1192
937
  },
1193
938
  "default": "false",
1194
939
  "description": "Whether the button is disabled. Default: `false`.",
1195
- "attribute": "disabled",
1196
- "reflects": true
940
+ "fieldName": "disabled"
1197
941
  },
1198
942
  {
1199
- "kind": "field",
1200
943
  "name": "loading",
1201
944
  "type": {
1202
945
  "text": "boolean"
1203
946
  },
1204
947
  "default": "false",
1205
948
  "description": "Shows a loading overlay when true. Default: `false`.",
1206
- "attribute": "loading",
1207
- "reflects": true
949
+ "fieldName": "loading"
1208
950
  },
1209
951
  {
1210
- "kind": "field",
1211
952
  "name": "iconL",
1212
953
  "type": {
1213
954
  "text": "string"
1214
955
  },
1215
956
  "default": "\"\"",
1216
957
  "description": "Optional left-side icon (Iconify name). Default: `\"\"`.",
1217
- "attribute": "iconL"
958
+ "fieldName": "iconL"
1218
959
  },
1219
960
  {
1220
- "kind": "field",
1221
961
  "name": "iconR",
1222
962
  "type": {
1223
963
  "text": "string"
1224
964
  },
1225
965
  "default": "\"\"",
1226
966
  "description": "Optional right-side icon (Iconify name). Default: `\"\"`.",
1227
- "attribute": "iconR"
967
+ "fieldName": "iconR"
1228
968
  },
1229
969
  {
1230
- "kind": "field",
1231
970
  "name": "iconOnly",
1232
971
  "type": {
1233
972
  "text": "boolean"
1234
973
  },
1235
974
  "default": "false",
1236
975
  "description": "Square padding for icon-only buttons; hides label text. Default: `false`.",
1237
- "attribute": "iconOnly",
1238
- "reflects": true
976
+ "fieldName": "iconOnly"
1239
977
  },
1240
978
  {
1241
- "kind": "field",
1242
979
  "name": "colors",
1243
980
  "type": {
1244
981
  "text": "string"
1245
982
  },
1246
983
  "default": "\"\"",
1247
984
  "description": "Comma-separated color stops for gradient variant. Default: `\"\"`.",
1248
- "attribute": "colors"
985
+ "fieldName": "colors"
1249
986
  },
1250
987
  {
1251
- "kind": "field",
1252
988
  "name": "animation",
1253
989
  "type": {
1254
990
  "text": "SkyButtonAnimation"
1255
991
  },
1256
992
  "default": "\"auto\"",
1257
993
  "description": "Transform animation style. Default: `\"auto\"`.",
1258
- "attribute": "animation",
994
+ "fieldName": "animation"
995
+ }
996
+ ],
997
+ "superclass": {
998
+ "name": "LitElement",
999
+ "package": "lit"
1000
+ },
1001
+ "tagName": "sky-button",
1002
+ "customElement": true,
1003
+ "summary": "Styled button supporting variants, icons, loading state, ripple feedback, and form-associated behavior."
1004
+ }
1005
+ ],
1006
+ "exports": [
1007
+ {
1008
+ "kind": "js",
1009
+ "name": "SkyButton",
1010
+ "declaration": {
1011
+ "name": "SkyButton",
1012
+ "module": "src/sky-button/sky-button.ts"
1013
+ }
1014
+ },
1015
+ {
1016
+ "kind": "custom-element-definition",
1017
+ "name": "sky-button",
1018
+ "declaration": {
1019
+ "name": "SkyButton",
1020
+ "module": "src/sky-button/sky-button.ts"
1021
+ }
1022
+ }
1023
+ ]
1024
+ },
1025
+ {
1026
+ "kind": "javascript-module",
1027
+ "path": "src/sky-avatar/sky-avatar.ts",
1028
+ "declarations": [
1029
+ {
1030
+ "kind": "class",
1031
+ "description": "",
1032
+ "name": "SkyAvatar",
1033
+ "cssParts": [
1034
+ {
1035
+ "description": "The avatar container element.",
1036
+ "name": "avatar"
1037
+ },
1038
+ {
1039
+ "description": "The loading overlay container (shown when `loading` is true).",
1040
+ "name": "loading-overlay"
1041
+ },
1042
+ {
1043
+ "description": "The spinner element shown when loading.",
1044
+ "name": "spinner"
1045
+ }
1046
+ ],
1047
+ "slots": [
1048
+ {
1049
+ "description": "Fallback content (e.g., initials or an icon) rendered when `image` is empty.",
1050
+ "name": ""
1051
+ }
1052
+ ],
1053
+ "members": [
1054
+ {
1055
+ "kind": "field",
1056
+ "name": "size",
1057
+ "type": {
1058
+ "text": "string"
1059
+ },
1060
+ "default": "\"50px\"",
1061
+ "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
1062
+ "attribute": "size"
1063
+ },
1064
+ {
1065
+ "kind": "field",
1066
+ "name": "image",
1067
+ "type": {
1068
+ "text": "string"
1069
+ },
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",
1259
1083
  "reflects": true
1260
1084
  },
1261
1085
  {
1262
1086
  "kind": "field",
1263
- "name": "_hasMeaningfulSlot",
1087
+ "name": "radius",
1264
1088
  "type": {
1265
- "text": "boolean"
1089
+ "text": "string"
1266
1090
  },
1267
- "privacy": "private",
1268
- "default": "false"
1091
+ "default": "\"md\"",
1092
+ "description": "Border radius token or CSS value.",
1093
+ "attribute": "radius"
1269
1094
  },
1270
1095
  {
1271
1096
  "kind": "field",
1272
- "name": "_styleVars",
1097
+ "name": "alt",
1273
1098
  "type": {
1274
- "text": "Record<string, string>"
1099
+ "text": "string"
1275
1100
  },
1276
- "privacy": "private",
1277
- "default": "{}",
1278
- "description": "Inline CSS variable cache."
1101
+ "default": "\"\"",
1102
+ "description": "Accessible name when image content conveys meaning.",
1103
+ "attribute": "alt"
1279
1104
  },
1280
1105
  {
1281
- "kind": "method",
1282
- "name": "_slotHasMeaningfulContent",
1283
- "privacy": "private",
1284
- "return": {
1285
- "type": {
1286
- "text": "boolean"
1287
- }
1106
+ "kind": "field",
1107
+ "name": "color",
1108
+ "type": {
1109
+ "text": "string"
1288
1110
  },
1289
- "parameters": [
1290
- {
1291
- "name": "slotEl",
1292
- "type": {
1293
- "text": "HTMLSlotElement"
1294
- }
1295
- }
1296
- ]
1111
+ "default": "\"dark\"",
1112
+ "description": "Token or CSS color applied to fallback slot content.",
1113
+ "attribute": "color"
1297
1114
  },
1298
1115
  {
1299
1116
  "kind": "field",
1300
- "name": "_onSlotChange",
1301
- "privacy": "private"
1117
+ "name": "outline",
1118
+ "type": {
1119
+ "text": "string"
1120
+ },
1121
+ "default": "\"\"",
1122
+ "description": "CSS `outline` value.",
1123
+ "attribute": "outline"
1302
1124
  },
1303
1125
  {
1304
- "kind": "method",
1305
- "name": "_toSquarePadding",
1306
- "privacy": "private",
1307
- "return": {
1308
- "type": {
1309
- "text": "string"
1310
- }
1126
+ "kind": "field",
1127
+ "name": "outlineOffset",
1128
+ "type": {
1129
+ "text": "string"
1311
1130
  },
1312
- "parameters": [
1313
- {
1314
- "name": "padding",
1315
- "type": {
1316
- "text": "string"
1317
- }
1318
- }
1319
- ],
1320
- "description": "Uses vertical padding for equal sides (icon-only square control)."
1131
+ "default": "\"2px\"",
1132
+ "description": "CSS `outline-offset` value.",
1133
+ "attribute": "outlineOffset"
1134
+ },
1135
+ {
1136
+ "kind": "field",
1137
+ "name": "loading",
1138
+ "type": {
1139
+ "text": "boolean"
1140
+ },
1141
+ "default": "false",
1142
+ "description": "Shows loading overlay when true.",
1143
+ "attribute": "loading",
1144
+ "reflects": true
1145
+ },
1146
+ {
1147
+ "kind": "field",
1148
+ "name": "disabled",
1149
+ "type": {
1150
+ "text": "boolean"
1151
+ },
1152
+ "default": "false",
1153
+ "description": "Dims and disables pointer interactions.",
1154
+ "attribute": "disabled",
1155
+ "reflects": true
1321
1156
  },
1322
1157
  {
1323
- "kind": "method",
1324
- "name": "_resolveSize",
1325
- "privacy": "private",
1326
- "return": {
1327
- "type": {
1328
- "text": "{\r\n padding: string;\r\n fontSize: string;\r\n gap: string;\r\n icon: string;\r\n spinner: string;\r\n }"
1329
- }
1158
+ "kind": "field",
1159
+ "name": "interactive",
1160
+ "type": {
1161
+ "text": "boolean"
1330
1162
  },
1331
- "parameters": [
1332
- {
1333
- "name": "input",
1334
- "type": {
1335
- "text": "string"
1336
- }
1337
- }
1338
- ]
1163
+ "default": "false",
1164
+ "description": "Enables interactive behavior with keyboard/click activation.",
1165
+ "attribute": "interactive"
1339
1166
  },
1340
1167
  {
1341
- "kind": "method",
1342
- "name": "_isThemeBorderShorthand",
1343
- "privacy": "private",
1344
- "return": {
1345
- "type": {
1346
- "text": "boolean"
1347
- }
1168
+ "kind": "field",
1169
+ "name": "shadow",
1170
+ "type": {
1171
+ "text": "boolean"
1348
1172
  },
1349
- "parameters": [
1350
- {
1351
- "name": "border",
1352
- "type": {
1353
- "text": "string | undefined"
1354
- }
1355
- }
1356
- ],
1357
- "description": "Theme tokens like `var(--sky-border-primary)` are full border shorthands, not colors."
1173
+ "default": "false",
1174
+ "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
1175
+ "attribute": "shadow",
1176
+ "reflects": true
1358
1177
  },
1359
1178
  {
1360
- "kind": "method",
1361
- "name": "_borderColorFromShorthand",
1362
- "privacy": "private",
1363
- "return": {
1364
- "type": {
1365
- "text": "string"
1366
- }
1179
+ "kind": "field",
1180
+ "name": "_imageError",
1181
+ "type": {
1182
+ "text": "boolean"
1367
1183
  },
1368
- "parameters": [
1369
- {
1370
- "name": "border",
1371
- "type": {
1372
- "text": "string | undefined"
1373
- }
1374
- }
1375
- ],
1376
- "description": "Extracts the color token from a `Npx solid …` border shorthand."
1184
+ "privacy": "private",
1185
+ "default": "false",
1186
+ "description": "True when image failed to load; show slot instead."
1377
1187
  },
1378
1188
  {
1379
- "kind": "method",
1380
- "name": "focusButton",
1381
- "privacy": "public",
1382
- "return": {
1383
- "type": {
1384
- "text": "void"
1385
- }
1386
- },
1387
- "description": "Focuses the internal native button."
1189
+ "kind": "field",
1190
+ "name": "_onImageLoad",
1191
+ "privacy": "private",
1192
+ "description": "Marks image load success and keeps image rendering active."
1388
1193
  },
1389
1194
  {
1390
- "kind": "method",
1391
- "name": "clickButton",
1392
- "privacy": "public",
1393
- "return": {
1394
- "type": {
1395
- "text": "void"
1396
- }
1397
- },
1398
- "description": "Triggers a click on the internal native button when enabled."
1195
+ "kind": "field",
1196
+ "name": "_onImageError",
1197
+ "privacy": "private",
1198
+ "description": "Marks image load failure and enables fallback slot rendering."
1399
1199
  },
1400
1200
  {
1401
1201
  "kind": "method",
1402
- "name": "_createRipple",
1202
+ "name": "_handleInteractiveClick",
1403
1203
  "privacy": "private",
1404
1204
  "return": {
1405
1205
  "type": {
@@ -1408,16 +1208,18 @@
1408
1208
  },
1409
1209
  "parameters": [
1410
1210
  {
1411
- "name": "event",
1211
+ "name": "e",
1412
1212
  "type": {
1413
- "text": "MouseEvent"
1213
+ "text": "Event"
1414
1214
  }
1415
1215
  }
1416
- ]
1216
+ ],
1217
+ "description": "Re-dispatches click in interactive mode for host-level consumers."
1417
1218
  },
1418
1219
  {
1419
1220
  "kind": "method",
1420
- "name": "formDisabledCallback",
1221
+ "name": "_handleInteractiveKeydown",
1222
+ "privacy": "private",
1421
1223
  "return": {
1422
1224
  "type": {
1423
1225
  "text": "void"
@@ -1425,95 +1227,61 @@
1425
1227
  },
1426
1228
  "parameters": [
1427
1229
  {
1428
- "name": "disabled",
1230
+ "name": "e",
1429
1231
  "type": {
1430
- "text": "boolean"
1232
+ "text": "KeyboardEvent"
1431
1233
  }
1432
1234
  }
1433
- ]
1434
- },
1435
- {
1436
- "kind": "field",
1437
- "name": "formOwner",
1438
- "type": {
1439
- "text": "HTMLFormElement | null"
1440
- },
1441
- "readonly": true
1235
+ ],
1236
+ "description": "Handles keyboard activation in interactive mode."
1442
1237
  },
1443
1238
  {
1444
1239
  "kind": "method",
1445
- "name": "_handleClick",
1240
+ "name": "adjustSpinnerSize",
1446
1241
  "privacy": "private",
1447
1242
  "return": {
1448
1243
  "type": {
1449
1244
  "text": "void"
1450
1245
  }
1451
1246
  },
1452
- "parameters": [
1453
- {
1454
- "name": "event",
1455
- "type": {
1456
- "text": "MouseEvent"
1457
- }
1458
- }
1459
- ]
1460
- },
1247
+ "description": "Derives spinner dimensions from current avatar size."
1248
+ }
1249
+ ],
1250
+ "events": [
1461
1251
  {
1462
- "kind": "method",
1463
- "name": "_iconOnlyName",
1464
- "privacy": "private",
1465
- "return": {
1466
- "type": {
1467
- "text": "string"
1468
- }
1252
+ "name": "click",
1253
+ "type": {
1254
+ "text": "Event"
1469
1255
  }
1470
1256
  }
1471
1257
  ],
1472
1258
  "attributes": [
1473
1259
  {
1474
- "name": "variant",
1475
- "type": {
1476
- "text": "SkyButtonVariant"
1477
- },
1478
- "default": "\"solid\"",
1479
- "description": "Visual variant of the button. Use `\"link\"` for text-only control with underline on hover. Default: `\"solid\"`.",
1480
- "fieldName": "variant"
1481
- },
1482
- {
1483
- "name": "color",
1260
+ "name": "size",
1484
1261
  "type": {
1485
1262
  "text": "string"
1486
1263
  },
1487
- "default": "\"primary\"",
1488
- "description": "Base color token or custom CSS color. Default: `\"primary\"`.",
1489
- "fieldName": "color"
1490
- },
1491
- {
1492
- "name": "type",
1493
- "type": {
1494
- "text": "SkyButtonType"
1495
- },
1496
- "default": "\"button\"",
1497
- "description": "Button type attribute. Default: `\"button\"`.",
1498
- "fieldName": "type"
1264
+ "default": "\"50px\"",
1265
+ "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
1266
+ "fieldName": "size"
1499
1267
  },
1500
1268
  {
1501
- "name": "form",
1269
+ "name": "image",
1502
1270
  "type": {
1503
1271
  "text": "string"
1504
1272
  },
1505
1273
  "default": "\"\"",
1506
- "description": "Associated form ID for custom submit handling.",
1507
- "fieldName": "form"
1274
+ "description": "Image URL; fallback slot is shown on load error.",
1275
+ "fieldName": "image"
1508
1276
  },
1509
1277
  {
1510
- "name": "size",
1278
+ "name": "fit",
1511
1279
  "type": {
1512
- "text": "string"
1280
+ "text": "SkyAvatarFit"
1513
1281
  },
1514
- "default": "\"md\"",
1515
- "description": "Preset size token (`xs…xl`) or CSS size (e.g., `\"15px\"`, `\"1rem\"`). Default: `\"md\"`.",
1516
- "fieldName": "size"
1282
+ "default": "\"cover\"",
1283
+ "description": "Image fill mode: `cover` (default) or `contain`.",
1284
+ "fieldName": "fit"
1517
1285
  },
1518
1286
  {
1519
1287
  "name": "radius",
@@ -1521,106 +1289,106 @@
1521
1289
  "text": "string"
1522
1290
  },
1523
1291
  "default": "\"md\"",
1524
- "description": "Preset radius token (`none…full`) or CSS radius (e.g., `\"12px\"`). Default: `\"md\"`.",
1292
+ "description": "Border radius token or CSS value.",
1525
1293
  "fieldName": "radius"
1526
1294
  },
1527
1295
  {
1528
- "name": "label",
1296
+ "name": "alt",
1529
1297
  "type": {
1530
1298
  "text": "string"
1531
1299
  },
1532
- "default": "\"Button\"",
1533
- "description": "Text label for the button. Ignored if default slot is used. Default: `\"Button\"`.",
1534
- "fieldName": "label"
1300
+ "default": "\"\"",
1301
+ "description": "Accessible name when image content conveys meaning.",
1302
+ "fieldName": "alt"
1535
1303
  },
1536
1304
  {
1537
- "name": "disabled",
1305
+ "name": "color",
1538
1306
  "type": {
1539
- "text": "boolean"
1307
+ "text": "string"
1540
1308
  },
1541
- "default": "false",
1542
- "description": "Whether the button is disabled. Default: `false`.",
1543
- "fieldName": "disabled"
1309
+ "default": "\"dark\"",
1310
+ "description": "Token or CSS color applied to fallback slot content.",
1311
+ "fieldName": "color"
1544
1312
  },
1545
1313
  {
1546
- "name": "loading",
1314
+ "name": "outline",
1547
1315
  "type": {
1548
- "text": "boolean"
1316
+ "text": "string"
1549
1317
  },
1550
- "default": "false",
1551
- "description": "Shows a loading overlay when true. Default: `false`.",
1552
- "fieldName": "loading"
1318
+ "default": "\"\"",
1319
+ "description": "CSS `outline` value.",
1320
+ "fieldName": "outline"
1553
1321
  },
1554
1322
  {
1555
- "name": "iconL",
1323
+ "name": "outlineOffset",
1556
1324
  "type": {
1557
1325
  "text": "string"
1558
1326
  },
1559
- "default": "\"\"",
1560
- "description": "Optional left-side icon (Iconify name). Default: `\"\"`.",
1561
- "fieldName": "iconL"
1327
+ "default": "\"2px\"",
1328
+ "description": "CSS `outline-offset` value.",
1329
+ "fieldName": "outlineOffset"
1562
1330
  },
1563
1331
  {
1564
- "name": "iconR",
1332
+ "name": "loading",
1565
1333
  "type": {
1566
- "text": "string"
1334
+ "text": "boolean"
1567
1335
  },
1568
- "default": "\"\"",
1569
- "description": "Optional right-side icon (Iconify name). Default: `\"\"`.",
1570
- "fieldName": "iconR"
1336
+ "default": "false",
1337
+ "description": "Shows loading overlay when true.",
1338
+ "fieldName": "loading"
1571
1339
  },
1572
1340
  {
1573
- "name": "iconOnly",
1341
+ "name": "disabled",
1574
1342
  "type": {
1575
1343
  "text": "boolean"
1576
1344
  },
1577
1345
  "default": "false",
1578
- "description": "Square padding for icon-only buttons; hides label text. Default: `false`.",
1579
- "fieldName": "iconOnly"
1346
+ "description": "Dims and disables pointer interactions.",
1347
+ "fieldName": "disabled"
1580
1348
  },
1581
1349
  {
1582
- "name": "colors",
1350
+ "name": "interactive",
1583
1351
  "type": {
1584
- "text": "string"
1352
+ "text": "boolean"
1585
1353
  },
1586
- "default": "\"\"",
1587
- "description": "Comma-separated color stops for gradient variant. Default: `\"\"`.",
1588
- "fieldName": "colors"
1354
+ "default": "false",
1355
+ "description": "Enables interactive behavior with keyboard/click activation.",
1356
+ "fieldName": "interactive"
1589
1357
  },
1590
1358
  {
1591
- "name": "animation",
1359
+ "name": "shadow",
1592
1360
  "type": {
1593
- "text": "SkyButtonAnimation"
1361
+ "text": "boolean"
1594
1362
  },
1595
- "default": "\"auto\"",
1596
- "description": "Transform animation style. Default: `\"auto\"`.",
1597
- "fieldName": "animation"
1363
+ "default": "false",
1364
+ "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
1365
+ "fieldName": "shadow"
1598
1366
  }
1599
1367
  ],
1600
1368
  "superclass": {
1601
1369
  "name": "LitElement",
1602
1370
  "package": "lit"
1603
1371
  },
1604
- "tagName": "sky-button",
1372
+ "tagName": "sky-avatar",
1605
1373
  "customElement": true,
1606
- "summary": "Styled button supporting variants, icons, loading state, ripple feedback, and form-associated behavior."
1374
+ "summary": "Avatar that renders image content or fallback slot content with configurable size, radius, outline, and loading state."
1607
1375
  }
1608
1376
  ],
1609
1377
  "exports": [
1610
1378
  {
1611
1379
  "kind": "js",
1612
- "name": "SkyButton",
1380
+ "name": "SkyAvatar",
1613
1381
  "declaration": {
1614
- "name": "SkyButton",
1615
- "module": "src/sky-button/sky-button.ts"
1382
+ "name": "SkyAvatar",
1383
+ "module": "src/sky-avatar/sky-avatar.ts"
1616
1384
  }
1617
1385
  },
1618
1386
  {
1619
1387
  "kind": "custom-element-definition",
1620
- "name": "sky-button",
1388
+ "name": "sky-avatar",
1621
1389
  "declaration": {
1622
- "name": "SkyButton",
1623
- "module": "src/sky-button/sky-button.ts"
1390
+ "name": "SkyAvatar",
1391
+ "module": "src/sky-avatar/sky-avatar.ts"
1624
1392
  }
1625
1393
  }
1626
1394
  ]
@@ -3676,71 +3444,303 @@
3676
3444
  "fieldName": "prefixColor"
3677
3445
  },
3678
3446
  {
3679
- "name": "suffixColor",
3447
+ "name": "suffixColor",
3448
+ "type": {
3449
+ "text": "string"
3450
+ },
3451
+ "default": "\"\"",
3452
+ "description": "The color for the suffix text. Default: `\"\"`.",
3453
+ "fieldName": "suffixColor"
3454
+ },
3455
+ {
3456
+ "name": "validationActive",
3457
+ "type": {
3458
+ "text": "boolean"
3459
+ },
3460
+ "default": "false",
3461
+ "fieldName": "validationActive"
3462
+ },
3463
+ {
3464
+ "name": "invalid",
3465
+ "type": {
3466
+ "text": "boolean"
3467
+ },
3468
+ "default": "false",
3469
+ "fieldName": "invalid"
3470
+ },
3471
+ {
3472
+ "name": "checked",
3473
+ "type": {
3474
+ "text": "boolean"
3475
+ },
3476
+ "description": "Whether the checkbox is checked. Default: `false`.",
3477
+ "fieldName": "checked"
3478
+ },
3479
+ {
3480
+ "name": "indeterminate",
3481
+ "type": {
3482
+ "text": "boolean"
3483
+ },
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",
3680
3676
  "type": {
3681
3677
  "text": "string"
3682
3678
  },
3683
3679
  "default": "\"\"",
3684
- "description": "The color for the suffix text. Default: `\"\"`.",
3685
- "fieldName": "suffixColor"
3680
+ "description": "Background image URL.",
3681
+ "fieldName": "url"
3686
3682
  },
3687
3683
  {
3688
- "name": "validationActive",
3684
+ "name": "banner",
3689
3685
  "type": {
3690
3686
  "text": "boolean"
3691
3687
  },
3692
- "default": "false",
3693
- "fieldName": "validationActive"
3688
+ "default": "true",
3689
+ "description": "Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.",
3690
+ "fieldName": "banner"
3694
3691
  },
3695
3692
  {
3696
- "name": "invalid",
3693
+ "name": "dense",
3697
3694
  "type": {
3698
3695
  "text": "boolean"
3699
3696
  },
3700
3697
  "default": "false",
3701
- "fieldName": "invalid"
3698
+ "description": "Enables compact vertical spacing.",
3699
+ "fieldName": "dense"
3702
3700
  },
3703
3701
  {
3704
- "name": "checked",
3702
+ "name": "elevated",
3705
3703
  "type": {
3706
3704
  "text": "boolean"
3707
3705
  },
3708
- "description": "Whether the checkbox is checked. Default: `false`.",
3709
- "fieldName": "checked"
3706
+ "default": "false",
3707
+ "description": "Applies elevated shadow styling.",
3708
+ "fieldName": "elevated"
3710
3709
  },
3711
3710
  {
3712
- "name": "indeterminate",
3711
+ "name": "leadingLabel",
3713
3712
  "type": {
3714
- "text": "boolean"
3713
+ "text": "string"
3715
3714
  },
3716
- "description": "Whether the checkbox is in the indeterminate state. Default: `false`.",
3717
- "fieldName": "indeterminate"
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
  ]
@@ -6712,57 +6712,263 @@
6712
6712
  "fieldName": "headerPadding"
6713
6713
  },
6714
6714
  {
6715
- "name": "bodyPadding",
6715
+ "name": "bodyPadding",
6716
+ "type": {
6717
+ "text": "SkyDialogPadding"
6718
+ },
6719
+ "default": "\"sm\"",
6720
+ "description": "Body padding token.",
6721
+ "fieldName": "bodyPadding"
6722
+ },
6723
+ {
6724
+ "name": "footerPadding",
6725
+ "type": {
6726
+ "text": "SkyDialogPadding"
6727
+ },
6728
+ "default": "\"sm\"",
6729
+ "description": "Footer padding token.",
6730
+ "fieldName": "footerPadding"
6731
+ },
6732
+ {
6733
+ "name": "highlightOnOutsideClick",
6734
+ "type": {
6735
+ "text": "boolean"
6736
+ },
6737
+ "default": "true",
6738
+ "description": "Enables highlight animation on rejected outside click.",
6739
+ "fieldName": "highlightOnOutsideClick"
6740
+ }
6741
+ ],
6742
+ "superclass": {
6743
+ "name": "LitElement",
6744
+ "package": "lit"
6745
+ },
6746
+ "tagName": "sky-dialog",
6747
+ "customElement": true,
6748
+ "summary": "Accessible modal dialog built on native `<dialog>` with controlled open state, slots, and keyboard/backdrop handling."
6749
+ }
6750
+ ],
6751
+ "exports": [
6752
+ {
6753
+ "kind": "js",
6754
+ "name": "SkyDialog",
6755
+ "declaration": {
6756
+ "name": "SkyDialog",
6757
+ "module": "src/sky-dialog/sky-dialog.ts"
6758
+ }
6759
+ },
6760
+ {
6761
+ "kind": "custom-element-definition",
6762
+ "name": "sky-dialog",
6763
+ "declaration": {
6764
+ "name": "SkyDialog",
6765
+ "module": "src/sky-dialog/sky-dialog.ts"
6766
+ }
6767
+ }
6768
+ ]
6769
+ },
6770
+ {
6771
+ "kind": "javascript-module",
6772
+ "path": "src/sky-divider/sky-divider.ts",
6773
+ "declarations": [
6774
+ {
6775
+ "kind": "class",
6776
+ "description": "",
6777
+ "name": "SkyDivider",
6778
+ "cssProperties": [
6779
+ {
6780
+ "description": "CSS custom property for divider color.",
6781
+ "name": "--divider-color"
6782
+ },
6783
+ {
6784
+ "description": "CSS custom property for divider thickness.",
6785
+ "name": "--divider-thickness"
6786
+ },
6787
+ {
6788
+ "description": "CSS custom property for divider margin.",
6789
+ "name": "--divider-margin"
6790
+ },
6791
+ {
6792
+ "description": "CSS custom property for vertical divider height.",
6793
+ "name": "--divider-height"
6794
+ }
6795
+ ],
6796
+ "cssParts": [
6797
+ {
6798
+ "description": "The divider line element (either `<hr>` or `<div>` depending on direction).",
6799
+ "name": "divider"
6800
+ }
6801
+ ],
6802
+ "members": [
6803
+ {
6804
+ "kind": "field",
6805
+ "name": "color",
6806
+ "type": {
6807
+ "text": "string"
6808
+ },
6809
+ "default": "\"muted\"",
6810
+ "description": "Divider color token or CSS color.",
6811
+ "privacy": "public",
6812
+ "attribute": "color"
6813
+ },
6814
+ {
6815
+ "kind": "field",
6816
+ "name": "thickness",
6817
+ "type": {
6818
+ "text": "string"
6819
+ },
6820
+ "default": "\"1px\"",
6821
+ "description": "Divider thickness (for example `1px` or `2px`).",
6822
+ "privacy": "public",
6823
+ "attribute": "thickness"
6824
+ },
6825
+ {
6826
+ "kind": "field",
6827
+ "name": "margin",
6828
+ "type": {
6829
+ "text": "string"
6830
+ },
6831
+ "default": "\"\"",
6832
+ "description": "Outer margin around the divider.",
6833
+ "privacy": "public",
6834
+ "attribute": "margin"
6835
+ },
6836
+ {
6837
+ "kind": "field",
6838
+ "name": "direction",
6839
+ "type": {
6840
+ "text": "SkyDividerDirection"
6841
+ },
6842
+ "default": "\"horizontal\"",
6843
+ "description": "Divider orientation.",
6844
+ "privacy": "public",
6845
+ "attribute": "direction"
6846
+ },
6847
+ {
6848
+ "kind": "field",
6849
+ "name": "inset",
6850
+ "type": {
6851
+ "text": "boolean"
6852
+ },
6853
+ "default": "false",
6854
+ "description": "Enables indented divider layout.",
6855
+ "privacy": "public",
6856
+ "attribute": "inset"
6857
+ },
6858
+ {
6859
+ "kind": "field",
6860
+ "name": "height",
6861
+ "type": {
6862
+ "text": "string"
6863
+ },
6864
+ "default": "\"100%\"",
6865
+ "description": "Height used for vertical orientation.",
6866
+ "privacy": "public",
6867
+ "attribute": "height"
6868
+ },
6869
+ {
6870
+ "kind": "method",
6871
+ "name": "getComputedColor",
6872
+ "privacy": "public",
6873
+ "return": {
6874
+ "type": {
6875
+ "text": ""
6876
+ }
6877
+ },
6878
+ "description": "Gets the current computed color of the divider."
6879
+ },
6880
+ {
6881
+ "kind": "method",
6882
+ "name": "getComputedThickness",
6883
+ "privacy": "public",
6884
+ "return": {
6885
+ "type": {
6886
+ "text": ""
6887
+ }
6888
+ },
6889
+ "description": "Gets the current computed thickness of the divider."
6890
+ }
6891
+ ],
6892
+ "attributes": [
6893
+ {
6894
+ "name": "color",
6895
+ "type": {
6896
+ "text": "string"
6897
+ },
6898
+ "default": "\"muted\"",
6899
+ "description": "Divider color token or CSS color.",
6900
+ "fieldName": "color"
6901
+ },
6902
+ {
6903
+ "name": "thickness",
6904
+ "type": {
6905
+ "text": "string"
6906
+ },
6907
+ "default": "\"1px\"",
6908
+ "description": "Divider thickness (for example `1px` or `2px`).",
6909
+ "fieldName": "thickness"
6910
+ },
6911
+ {
6912
+ "name": "margin",
6913
+ "type": {
6914
+ "text": "string"
6915
+ },
6916
+ "default": "\"\"",
6917
+ "description": "Outer margin around the divider.",
6918
+ "fieldName": "margin"
6919
+ },
6920
+ {
6921
+ "name": "direction",
6716
6922
  "type": {
6717
- "text": "SkyDialogPadding"
6923
+ "text": "SkyDividerDirection"
6718
6924
  },
6719
- "default": "\"sm\"",
6720
- "description": "Body padding token.",
6721
- "fieldName": "bodyPadding"
6925
+ "default": "\"horizontal\"",
6926
+ "description": "Divider orientation.",
6927
+ "fieldName": "direction"
6722
6928
  },
6723
6929
  {
6724
- "name": "footerPadding",
6930
+ "name": "inset",
6725
6931
  "type": {
6726
- "text": "SkyDialogPadding"
6932
+ "text": "boolean"
6727
6933
  },
6728
- "default": "\"sm\"",
6729
- "description": "Footer padding token.",
6730
- "fieldName": "footerPadding"
6934
+ "default": "false",
6935
+ "description": "Enables indented divider layout.",
6936
+ "fieldName": "inset"
6731
6937
  },
6732
6938
  {
6733
- "name": "highlightOnOutsideClick",
6939
+ "name": "height",
6734
6940
  "type": {
6735
- "text": "boolean"
6941
+ "text": "string"
6736
6942
  },
6737
- "default": "true",
6738
- "description": "Enables highlight animation on rejected outside click.",
6739
- "fieldName": "highlightOnOutsideClick"
6943
+ "default": "\"100%\"",
6944
+ "description": "Height used for vertical orientation.",
6945
+ "fieldName": "height"
6740
6946
  }
6741
6947
  ],
6742
6948
  "superclass": {
6743
6949
  "name": "LitElement",
6744
6950
  "package": "lit"
6745
6951
  },
6746
- "tagName": "sky-dialog",
6952
+ "tagName": "sky-divider",
6747
6953
  "customElement": true,
6748
- "summary": "Accessible modal dialog built on native `<dialog>` with controlled open state, slots, and keyboard/backdrop handling."
6954
+ "summary": "Visual separator component for horizontal and vertical layout separation."
6749
6955
  }
6750
6956
  ],
6751
6957
  "exports": [
6752
6958
  {
6753
6959
  "kind": "js",
6754
- "name": "SkyDialog",
6960
+ "name": "SkyDivider",
6755
6961
  "declaration": {
6756
- "name": "SkyDialog",
6757
- "module": "src/sky-dialog/sky-dialog.ts"
6962
+ "name": "SkyDivider",
6963
+ "module": "src/sky-divider/sky-divider.ts"
6758
6964
  }
6759
6965
  },
6760
6966
  {
6761
6967
  "kind": "custom-element-definition",
6762
- "name": "sky-dialog",
6968
+ "name": "sky-divider",
6763
6969
  "declaration": {
6764
- "name": "SkyDialog",
6765
- "module": "src/sky-dialog/sky-dialog.ts"
6970
+ "name": "SkyDivider",
6971
+ "module": "src/sky-divider/sky-divider.ts"
6766
6972
  }
6767
6973
  }
6768
6974
  ]
@@ -7112,212 +7318,6 @@
7112
7318
  }
7113
7319
  ]
7114
7320
  },
7115
- {
7116
- "kind": "javascript-module",
7117
- "path": "src/sky-divider/sky-divider.ts",
7118
- "declarations": [
7119
- {
7120
- "kind": "class",
7121
- "description": "",
7122
- "name": "SkyDivider",
7123
- "cssProperties": [
7124
- {
7125
- "description": "CSS custom property for divider color.",
7126
- "name": "--divider-color"
7127
- },
7128
- {
7129
- "description": "CSS custom property for divider thickness.",
7130
- "name": "--divider-thickness"
7131
- },
7132
- {
7133
- "description": "CSS custom property for divider margin.",
7134
- "name": "--divider-margin"
7135
- },
7136
- {
7137
- "description": "CSS custom property for vertical divider height.",
7138
- "name": "--divider-height"
7139
- }
7140
- ],
7141
- "cssParts": [
7142
- {
7143
- "description": "The divider line element (either `<hr>` or `<div>` depending on direction).",
7144
- "name": "divider"
7145
- }
7146
- ],
7147
- "members": [
7148
- {
7149
- "kind": "field",
7150
- "name": "color",
7151
- "type": {
7152
- "text": "string"
7153
- },
7154
- "default": "\"muted\"",
7155
- "description": "Divider color token or CSS color.",
7156
- "privacy": "public",
7157
- "attribute": "color"
7158
- },
7159
- {
7160
- "kind": "field",
7161
- "name": "thickness",
7162
- "type": {
7163
- "text": "string"
7164
- },
7165
- "default": "\"1px\"",
7166
- "description": "Divider thickness (for example `1px` or `2px`).",
7167
- "privacy": "public",
7168
- "attribute": "thickness"
7169
- },
7170
- {
7171
- "kind": "field",
7172
- "name": "margin",
7173
- "type": {
7174
- "text": "string"
7175
- },
7176
- "default": "\"\"",
7177
- "description": "Outer margin around the divider.",
7178
- "privacy": "public",
7179
- "attribute": "margin"
7180
- },
7181
- {
7182
- "kind": "field",
7183
- "name": "direction",
7184
- "type": {
7185
- "text": "SkyDividerDirection"
7186
- },
7187
- "default": "\"horizontal\"",
7188
- "description": "Divider orientation.",
7189
- "privacy": "public",
7190
- "attribute": "direction"
7191
- },
7192
- {
7193
- "kind": "field",
7194
- "name": "inset",
7195
- "type": {
7196
- "text": "boolean"
7197
- },
7198
- "default": "false",
7199
- "description": "Enables indented divider layout.",
7200
- "privacy": "public",
7201
- "attribute": "inset"
7202
- },
7203
- {
7204
- "kind": "field",
7205
- "name": "height",
7206
- "type": {
7207
- "text": "string"
7208
- },
7209
- "default": "\"100%\"",
7210
- "description": "Height used for vertical orientation.",
7211
- "privacy": "public",
7212
- "attribute": "height"
7213
- },
7214
- {
7215
- "kind": "method",
7216
- "name": "getComputedColor",
7217
- "privacy": "public",
7218
- "return": {
7219
- "type": {
7220
- "text": ""
7221
- }
7222
- },
7223
- "description": "Gets the current computed color of the divider."
7224
- },
7225
- {
7226
- "kind": "method",
7227
- "name": "getComputedThickness",
7228
- "privacy": "public",
7229
- "return": {
7230
- "type": {
7231
- "text": ""
7232
- }
7233
- },
7234
- "description": "Gets the current computed thickness of the divider."
7235
- }
7236
- ],
7237
- "attributes": [
7238
- {
7239
- "name": "color",
7240
- "type": {
7241
- "text": "string"
7242
- },
7243
- "default": "\"muted\"",
7244
- "description": "Divider color token or CSS color.",
7245
- "fieldName": "color"
7246
- },
7247
- {
7248
- "name": "thickness",
7249
- "type": {
7250
- "text": "string"
7251
- },
7252
- "default": "\"1px\"",
7253
- "description": "Divider thickness (for example `1px` or `2px`).",
7254
- "fieldName": "thickness"
7255
- },
7256
- {
7257
- "name": "margin",
7258
- "type": {
7259
- "text": "string"
7260
- },
7261
- "default": "\"\"",
7262
- "description": "Outer margin around the divider.",
7263
- "fieldName": "margin"
7264
- },
7265
- {
7266
- "name": "direction",
7267
- "type": {
7268
- "text": "SkyDividerDirection"
7269
- },
7270
- "default": "\"horizontal\"",
7271
- "description": "Divider orientation.",
7272
- "fieldName": "direction"
7273
- },
7274
- {
7275
- "name": "inset",
7276
- "type": {
7277
- "text": "boolean"
7278
- },
7279
- "default": "false",
7280
- "description": "Enables indented divider layout.",
7281
- "fieldName": "inset"
7282
- },
7283
- {
7284
- "name": "height",
7285
- "type": {
7286
- "text": "string"
7287
- },
7288
- "default": "\"100%\"",
7289
- "description": "Height used for vertical orientation.",
7290
- "fieldName": "height"
7291
- }
7292
- ],
7293
- "superclass": {
7294
- "name": "LitElement",
7295
- "package": "lit"
7296
- },
7297
- "tagName": "sky-divider",
7298
- "customElement": true,
7299
- "summary": "Visual separator component for horizontal and vertical layout separation."
7300
- }
7301
- ],
7302
- "exports": [
7303
- {
7304
- "kind": "js",
7305
- "name": "SkyDivider",
7306
- "declaration": {
7307
- "name": "SkyDivider",
7308
- "module": "src/sky-divider/sky-divider.ts"
7309
- }
7310
- },
7311
- {
7312
- "kind": "custom-element-definition",
7313
- "name": "sky-divider",
7314
- "declaration": {
7315
- "name": "SkyDivider",
7316
- "module": "src/sky-divider/sky-divider.ts"
7317
- }
7318
- }
7319
- ]
7320
- },
7321
7321
  {
7322
7322
  "kind": "javascript-module",
7323
7323
  "path": "src/sky-flexcol/sky-flexcol.ts",