@sky.ui/core 0.0.51 → 0.0.53

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 (6) hide show
  1. package/dist/custom-elements.json +1433 -1433
  2. package/dist/sky-combobox/sky-combobox.js +82 -22
  3. package/dist/sky-combobox/sky-combobox.js.map +1 -1
  4. package/dist/sky-input/sky-input.js +43 -34
  5. package/dist/sky-input/sky-input.js.map +1 -1
  6. package/package.json +1 -1
package/dist/custom-elements.json CHANGED
@@ -746,254 +746,166 @@
746
746
  },
747
747
  {
748
748
  "kind": "javascript-module",
749
- "path": "src/sky-badge/sky-badge.ts",
749
+ "path": "src/sky-avatar/sky-avatar.ts",
750
750
  "declarations": [
751
751
  {
752
752
  "kind": "class",
753
753
  "description": "",
754
- "name": "SkyBadge",
754
+ "name": "SkyAvatar",
755
755
  "cssParts": [
756
756
  {
757
- "description": "Wrapper around the slotted content and the badge.",
758
- "name": "container"
757
+ "description": "The avatar container element.",
758
+ "name": "avatar"
759
759
  },
760
760
  {
761
- "description": "The badge element. Use `badgeRef` for positioning (e.g. tooltip anchor).",
762
- "name": "badge"
761
+ "description": "The loading overlay container (shown when `loading` is true).",
762
+ "name": "loading-overlay"
763
763
  },
764
764
  {
765
- "description": "The icon element when `isIcon` is true.",
766
- "name": "icon"
765
+ "description": "The spinner element shown when loading.",
766
+ "name": "spinner"
767
767
  }
768
768
  ],
769
769
  "slots": [
770
770
  {
771
- "description": "The content the badge attaches to.",
771
+ "description": "Fallback content (e.g., initials or an icon) rendered when `image` is empty.",
772
772
  "name": ""
773
- },
774
- {
775
- "description": "Optional slot to override the badge content entirely.",
776
- "name": "badge"
777
773
  }
778
774
  ],
779
775
  "members": [
780
776
  {
781
777
  "kind": "field",
782
- "name": "dependencies",
783
- "type": {
784
- "text": "Record<string, CustomElementConstructor>"
785
- },
786
- "static": true,
787
- "default": "{ \"sky-icon\": SkyIcon, }"
788
- },
789
- {
790
- "kind": "field",
791
- "name": "statusColor",
778
+ "name": "size",
792
779
  "type": {
793
780
  "text": "string"
794
781
  },
795
- "default": "\"success\"",
796
- "description": "Badge background token or CSS color.",
797
- "attribute": "statusColor",
798
- "reflects": true
782
+ "default": "\"50px\"",
783
+ "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
784
+ "attribute": "size"
799
785
  },
800
786
  {
801
787
  "kind": "field",
802
- "name": "textColor",
788
+ "name": "image",
803
789
  "type": {
804
790
  "text": "string"
805
791
  },
806
- "default": "\"default\"",
807
- "description": "Text color token or CSS color.",
808
- "attribute": "textColor",
809
- "reflects": true
792
+ "default": "\"\"",
793
+ "description": "Image URL; fallback slot is shown on load error.",
794
+ "attribute": "image"
810
795
  },
811
796
  {
812
797
  "kind": "field",
813
- "name": "iconColor",
798
+ "name": "fit",
814
799
  "type": {
815
- "text": "string"
800
+ "text": "SkyAvatarFit"
816
801
  },
817
- "default": "\"\"",
818
- "description": "Icon color token or CSS color; falls back to `textColor` when empty.",
819
- "attribute": "iconColor",
802
+ "default": "\"cover\"",
803
+ "description": "Image fill mode: `cover` (default) or `contain`.",
804
+ "attribute": "fit",
820
805
  "reflects": true
821
806
  },
822
807
  {
823
808
  "kind": "field",
824
- "name": "position",
809
+ "name": "radius",
825
810
  "type": {
826
- "text": "SkyBadgePosition"
811
+ "text": "string"
827
812
  },
828
- "default": "\"default\"",
829
- "description": "Layout mode: `default | floating | inline`.",
830
- "attribute": "position",
831
- "reflects": true
813
+ "default": "\"md\"",
814
+ "description": "Border radius token or CSS value.",
815
+ "attribute": "radius"
832
816
  },
833
817
  {
834
818
  "kind": "field",
835
- "name": "value",
819
+ "name": "alt",
836
820
  "type": {
837
821
  "text": "string"
838
822
  },
839
823
  "default": "\"\"",
840
- "description": "Badge text/count or icon name in icon mode.",
841
- "attribute": "value"
824
+ "description": "Accessible name when image content conveys meaning.",
825
+ "attribute": "alt"
842
826
  },
843
827
  {
844
828
  "kind": "field",
845
- "name": "isIcon",
829
+ "name": "color",
846
830
  "type": {
847
- "text": "boolean"
831
+ "text": "string"
848
832
  },
849
- "default": "false",
850
- "description": "Renders icon mode when true.",
851
- "attribute": "isIcon",
852
- "reflects": true
833
+ "default": "\"dark\"",
834
+ "description": "Token or CSS color applied to fallback slot content.",
835
+ "attribute": "color"
853
836
  },
854
837
  {
855
838
  "kind": "field",
856
- "name": "size",
839
+ "name": "outline",
857
840
  "type": {
858
841
  "text": "string"
859
842
  },
860
843
  "default": "\"\"",
861
- "description": "Badge and icon size CSS length.",
862
- "attribute": "size",
863
- "reflects": true
864
- },
865
- {
866
- "kind": "field",
867
- "name": "shape",
868
- "type": {
869
- "text": "SkyBadgeShape"
870
- },
871
- "default": "\"custom\"",
872
- "description": "Badge shape: `circle | pill | custom`.",
873
- "attribute": "shape",
874
- "reflects": true
844
+ "description": "CSS `outline` value.",
845
+ "attribute": "outline"
875
846
  },
876
847
  {
877
848
  "kind": "field",
878
- "name": "max",
849
+ "name": "outlineOffset",
879
850
  "type": {
880
- "text": "number"
851
+ "text": "string"
881
852
  },
882
- "default": "99",
883
- "description": "Maximum numeric count before rendering overflow label.",
884
- "attribute": "max"
853
+ "default": "\"2px\"",
854
+ "description": "CSS `outline-offset` value.",
855
+ "attribute": "outlineOffset"
885
856
  },
886
857
  {
887
858
  "kind": "field",
888
- "name": "hideWhenZero",
859
+ "name": "loading",
889
860
  "type": {
890
861
  "text": "boolean"
891
862
  },
892
863
  "default": "false",
893
- "description": "Hides badge when value resolves to numeric zero.",
894
- "attribute": "hideWhenZero"
864
+ "description": "Shows loading overlay when true.",
865
+ "attribute": "loading",
866
+ "reflects": true
895
867
  },
896
868
  {
897
869
  "kind": "field",
898
- "name": "show",
870
+ "name": "disabled",
899
871
  "type": {
900
872
  "text": "boolean"
901
873
  },
902
- "default": "true",
903
- "description": "Forces badge visibility independent of value.",
904
- "attribute": "show",
874
+ "default": "false",
875
+ "description": "Dims and disables pointer interactions.",
876
+ "attribute": "disabled",
905
877
  "reflects": true
906
878
  },
907
879
  {
908
880
  "kind": "field",
909
- "name": "offsetX",
910
- "type": {
911
- "text": "string"
912
- },
913
- "default": "\"0px\"",
914
- "description": "Horizontal offset CSS length.",
915
- "attribute": "offsetX"
916
- },
917
- {
918
- "kind": "field",
919
- "name": "offsetY",
920
- "type": {
921
- "text": "string"
922
- },
923
- "default": "\"0px\"",
924
- "description": "Vertical offset CSS length.",
925
- "attribute": "offsetY"
926
- },
927
- {
928
- "kind": "field",
929
- "name": "ring",
881
+ "name": "interactive",
930
882
  "type": {
931
883
  "text": "boolean"
932
884
  },
933
885
  "default": "false",
934
- "description": "Enables visual ring around the badge.",
935
- "attribute": "ring"
936
- },
937
- {
938
- "kind": "field",
939
- "name": "ringColor",
940
- "type": {
941
- "text": "string"
942
- },
943
- "default": "\"primary\"",
944
- "description": "Ring color token or CSS color.",
945
- "attribute": "ringColor"
946
- },
947
- {
948
- "kind": "field",
949
- "name": "ringOffset",
950
- "type": {
951
- "text": "string"
952
- },
953
- "default": "\"1px\"",
954
- "description": "Ring offset CSS length.",
955
- "attribute": "ringOffset"
956
- },
957
- {
958
- "kind": "field",
959
- "name": "badgeLabel",
960
- "type": {
961
- "text": "string | null"
962
- },
963
- "default": "null",
964
- "description": "ARIA label override.",
965
- "attribute": "badgeLabel"
886
+ "description": "Enables interactive behavior with keyboard/click activation.",
887
+ "attribute": "interactive"
966
888
  },
967
889
  {
968
890
  "kind": "field",
969
- "name": "badgeAriaHidden",
891
+ "name": "shadow",
970
892
  "type": {
971
893
  "text": "boolean"
972
894
  },
973
895
  "default": "false",
974
- "description": "Hides badge from assistive technology when true.",
975
- "attribute": "badgeAriaHidden"
896
+ "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
897
+ "attribute": "shadow",
898
+ "reflects": true
976
899
  },
977
900
  {
978
901
  "kind": "field",
979
- "name": "interactive",
902
+ "name": "_imageError",
980
903
  "type": {
981
904
  "text": "boolean"
982
905
  },
906
+ "privacy": "private",
983
907
  "default": "false",
984
- "description": "Enables focus/activation and `badge-click` emission.",
985
- "attribute": "interactive"
986
- },
987
- {
988
- "kind": "field",
989
- "name": "placement",
990
- "type": {
991
- "text": "SkyBadgePlacement"
992
- },
993
- "default": "\"custom\"",
994
- "description": "Anchor placement preset for badge positioning.",
995
- "attribute": "placement",
996
- "reflects": true
908
+ "description": "True when image failed to load; show slot instead."
997
909
  },
998
910
  {
999
911
  "kind": "field",
@@ -1014,302 +926,164 @@
1014
926
  },
1015
927
  {
1016
928
  "kind": "field",
1017
- "name": "_badgeEl",
1018
- "type": {
1019
- "text": "HTMLSpanElement"
1020
- },
1021
- "privacy": "private"
1022
- },
1023
- {
1024
- "kind": "field",
1025
- "name": "badgeRef",
1026
- "privacy": "public",
1027
- "description": "Ref for the badge element (e.g. for tooltip anchor or positioning)."
929
+ "name": "_onImageLoad",
930
+ "privacy": "private",
931
+ "description": "Marks image load success and keeps image rendering active."
1028
932
  },
1029
933
  {
1030
934
  "kind": "field",
1031
- "name": "shadowRootOptions",
1032
- "type": {
1033
- "text": "ShadowRootInit"
1034
- },
1035
- "static": true,
1036
- "default": "{ mode: \"open\", delegatesFocus: true, }"
935
+ "name": "_onImageError",
936
+ "privacy": "private",
937
+ "description": "Marks image load failure and enables fallback slot rendering."
1037
938
  },
1038
939
  {
1039
940
  "kind": "method",
1040
- "name": "showBadge",
1041
- "privacy": "public",
941
+ "name": "_handleInteractiveClick",
942
+ "privacy": "private",
1042
943
  "return": {
1043
944
  "type": {
1044
945
  "text": "void"
1045
946
  }
1046
947
  },
1047
- "description": "Forces badge visibility on."
948
+ "parameters": [
949
+ {
950
+ "name": "e",
951
+ "type": {
952
+ "text": "Event"
953
+ }
954
+ }
955
+ ],
956
+ "description": "Re-dispatches click in interactive mode for host-level consumers."
1048
957
  },
1049
958
  {
1050
959
  "kind": "method",
1051
- "name": "hideBadge",
1052
- "privacy": "public",
960
+ "name": "_handleInteractiveKeydown",
961
+ "privacy": "private",
1053
962
  "return": {
1054
963
  "type": {
1055
964
  "text": "void"
1056
965
  }
1057
966
  },
1058
- "description": "Forces badge visibility off."
1059
- },
1060
- {
1061
- "kind": "method",
1062
- "name": "setValue",
1063
- "privacy": "public",
1064
- "return": {
1065
- "type": {
1066
- "text": "void"
1067
- }
1068
- },
1069
- "parameters": [
1070
- {
1071
- "name": "value",
1072
- "type": {
1073
- "text": "string"
1074
- },
1075
- "description": "Badge value or icon name."
1076
- }
1077
- ],
1078
- "description": "Updates badge value for text/count or icon modes."
1079
- },
1080
- {
1081
- "kind": "field",
1082
- "name": "_onActivate",
1083
- "privacy": "private",
1084
- "description": "Emits `badge-click` for interactive activation."
1085
- },
1086
- {
1087
- "kind": "field",
1088
- "name": "_onKeydown",
1089
- "privacy": "private",
1090
- "description": "Handles keyboard activation with Enter and Space."
1091
- },
1092
- {
1093
- "kind": "method",
1094
- "name": "_computeAriaLabel",
1095
- "privacy": "private",
1096
- "return": {
1097
- "type": {
1098
- "text": "string | null"
1099
- }
1100
- },
1101
- "parameters": [
1102
- {
1103
- "name": "displayValue",
1104
- "type": {
1105
- "text": "string | null"
1106
- }
1107
- }
1108
- ],
1109
- "description": "Computes accessible badge label from current render state."
1110
- },
1111
- {
1112
- "kind": "method",
1113
- "name": "_computeAnchors",
1114
- "privacy": "private",
1115
- "return": {
1116
- "type": {
1117
- "text": "{\r\n top: string;\r\n right: string;\r\n bottom: string;\r\n left: string;\r\n }"
1118
- }
1119
- },
1120
967
  "parameters": [
1121
968
  {
1122
- "name": "placement",
969
+ "name": "e",
1123
970
  "type": {
1124
- "text": "SkyBadgePlacement"
971
+ "text": "KeyboardEvent"
1125
972
  }
1126
973
  }
1127
974
  ],
1128
- "description": "Resolves anchor edges from placement preset."
975
+ "description": "Handles keyboard activation in interactive mode."
1129
976
  },
1130
977
  {
1131
978
  "kind": "method",
1132
- "name": "_resolveBadgeSurface",
979
+ "name": "adjustSpinnerSize",
1133
980
  "privacy": "private",
1134
981
  "return": {
1135
982
  "type": {
1136
- "text": "{\r\n bg: string;\r\n color: string;\r\n border: string;\r\n }"
983
+ "text": "void"
1137
984
  }
1138
985
  },
1139
- "description": "Maps semantic status tokens to soft badge surface colors."
986
+ "description": "Derives spinner dimensions from current avatar size."
1140
987
  }
1141
988
  ],
1142
989
  "events": [
1143
990
  {
991
+ "name": "click",
1144
992
  "type": {
1145
- "text": "CustomEvent<SkyBadgeClickEventDetail>"
1146
- },
1147
- "description": "Emitted when badge activation occurs via click, Enter, or Space while `interactive` is true.",
1148
- "name": "badge-click"
993
+ "text": "Event"
994
+ }
1149
995
  }
1150
996
  ],
1151
997
  "attributes": [
1152
998
  {
1153
- "name": "statusColor",
1154
- "type": {
1155
- "text": "string"
1156
- },
1157
- "default": "\"success\"",
1158
- "description": "Badge background token or CSS color.",
1159
- "fieldName": "statusColor"
1160
- },
1161
- {
1162
- "name": "textColor",
999
+ "name": "size",
1163
1000
  "type": {
1164
1001
  "text": "string"
1165
1002
  },
1166
- "default": "\"default\"",
1167
- "description": "Text color token or CSS color.",
1168
- "fieldName": "textColor"
1003
+ "default": "\"50px\"",
1004
+ "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
1005
+ "fieldName": "size"
1169
1006
  },
1170
1007
  {
1171
- "name": "iconColor",
1008
+ "name": "image",
1172
1009
  "type": {
1173
1010
  "text": "string"
1174
1011
  },
1175
1012
  "default": "\"\"",
1176
- "description": "Icon color token or CSS color; falls back to `textColor` when empty.",
1177
- "fieldName": "iconColor"
1013
+ "description": "Image URL; fallback slot is shown on load error.",
1014
+ "fieldName": "image"
1178
1015
  },
1179
1016
  {
1180
- "name": "position",
1017
+ "name": "fit",
1181
1018
  "type": {
1182
- "text": "SkyBadgePosition"
1019
+ "text": "SkyAvatarFit"
1183
1020
  },
1184
- "default": "\"default\"",
1185
- "description": "Layout mode: `default | floating | inline`.",
1186
- "fieldName": "position"
1021
+ "default": "\"cover\"",
1022
+ "description": "Image fill mode: `cover` (default) or `contain`.",
1023
+ "fieldName": "fit"
1187
1024
  },
1188
1025
  {
1189
- "name": "value",
1026
+ "name": "radius",
1190
1027
  "type": {
1191
1028
  "text": "string"
1192
1029
  },
1193
- "default": "\"\"",
1194
- "description": "Badge text/count or icon name in icon mode.",
1195
- "fieldName": "value"
1196
- },
1197
- {
1198
- "name": "isIcon",
1199
- "type": {
1200
- "text": "boolean"
1201
- },
1202
- "default": "false",
1203
- "description": "Renders icon mode when true.",
1204
- "fieldName": "isIcon"
1030
+ "default": "\"md\"",
1031
+ "description": "Border radius token or CSS value.",
1032
+ "fieldName": "radius"
1205
1033
  },
1206
1034
  {
1207
- "name": "size",
1035
+ "name": "alt",
1208
1036
  "type": {
1209
1037
  "text": "string"
1210
1038
  },
1211
1039
  "default": "\"\"",
1212
- "description": "Badge and icon size CSS length.",
1213
- "fieldName": "size"
1214
- },
1215
- {
1216
- "name": "shape",
1217
- "type": {
1218
- "text": "SkyBadgeShape"
1219
- },
1220
- "default": "\"custom\"",
1221
- "description": "Badge shape: `circle | pill | custom`.",
1222
- "fieldName": "shape"
1223
- },
1224
- {
1225
- "name": "max",
1226
- "type": {
1227
- "text": "number"
1228
- },
1229
- "default": "99",
1230
- "description": "Maximum numeric count before rendering overflow label.",
1231
- "fieldName": "max"
1232
- },
1233
- {
1234
- "name": "hideWhenZero",
1235
- "type": {
1236
- "text": "boolean"
1237
- },
1238
- "default": "false",
1239
- "description": "Hides badge when value resolves to numeric zero.",
1240
- "fieldName": "hideWhenZero"
1040
+ "description": "Accessible name when image content conveys meaning.",
1041
+ "fieldName": "alt"
1241
1042
  },
1242
1043
  {
1243
- "name": "show",
1044
+ "name": "color",
1244
1045
  "type": {
1245
- "text": "boolean"
1046
+ "text": "string"
1246
1047
  },
1247
- "default": "true",
1248
- "description": "Forces badge visibility independent of value.",
1249
- "fieldName": "show"
1048
+ "default": "\"dark\"",
1049
+ "description": "Token or CSS color applied to fallback slot content.",
1050
+ "fieldName": "color"
1250
1051
  },
1251
1052
  {
1252
- "name": "offsetX",
1053
+ "name": "outline",
1253
1054
  "type": {
1254
1055
  "text": "string"
1255
1056
  },
1256
- "default": "\"0px\"",
1257
- "description": "Horizontal offset CSS length.",
1258
- "fieldName": "offsetX"
1057
+ "default": "\"\"",
1058
+ "description": "CSS `outline` value.",
1059
+ "fieldName": "outline"
1259
1060
  },
1260
1061
  {
1261
- "name": "offsetY",
1062
+ "name": "outlineOffset",
1262
1063
  "type": {
1263
1064
  "text": "string"
1264
1065
  },
1265
- "default": "\"0px\"",
1266
- "description": "Vertical offset CSS length.",
1267
- "fieldName": "offsetY"
1066
+ "default": "\"2px\"",
1067
+ "description": "CSS `outline-offset` value.",
1068
+ "fieldName": "outlineOffset"
1268
1069
  },
1269
1070
  {
1270
- "name": "ring",
1071
+ "name": "loading",
1271
1072
  "type": {
1272
1073
  "text": "boolean"
1273
1074
  },
1274
1075
  "default": "false",
1275
- "description": "Enables visual ring around the badge.",
1276
- "fieldName": "ring"
1277
- },
1278
- {
1279
- "name": "ringColor",
1280
- "type": {
1281
- "text": "string"
1282
- },
1283
- "default": "\"primary\"",
1284
- "description": "Ring color token or CSS color.",
1285
- "fieldName": "ringColor"
1286
- },
1287
- {
1288
- "name": "ringOffset",
1289
- "type": {
1290
- "text": "string"
1291
- },
1292
- "default": "\"1px\"",
1293
- "description": "Ring offset CSS length.",
1294
- "fieldName": "ringOffset"
1295
- },
1296
- {
1297
- "name": "badgeLabel",
1298
- "type": {
1299
- "text": "string | null"
1300
- },
1301
- "default": "null",
1302
- "description": "ARIA label override.",
1303
- "fieldName": "badgeLabel"
1076
+ "description": "Shows loading overlay when true.",
1077
+ "fieldName": "loading"
1304
1078
  },
1305
1079
  {
1306
- "name": "badgeAriaHidden",
1080
+ "name": "disabled",
1307
1081
  "type": {
1308
1082
  "text": "boolean"
1309
1083
  },
1310
1084
  "default": "false",
1311
- "description": "Hides badge from assistive technology when true.",
1312
- "fieldName": "badgeAriaHidden"
1085
+ "description": "Dims and disables pointer interactions.",
1086
+ "fieldName": "disabled"
1313
1087
  },
1314
1088
  {
1315
1089
  "name": "interactive",
@@ -1317,17 +1091,17 @@
1317
1091
  "text": "boolean"
1318
1092
  },
1319
1093
  "default": "false",
1320
- "description": "Enables focus/activation and `badge-click` emission.",
1094
+ "description": "Enables interactive behavior with keyboard/click activation.",
1321
1095
  "fieldName": "interactive"
1322
1096
  },
1323
1097
  {
1324
- "name": "placement",
1098
+ "name": "shadow",
1325
1099
  "type": {
1326
- "text": "SkyBadgePlacement"
1100
+ "text": "boolean"
1327
1101
  },
1328
- "default": "\"custom\"",
1329
- "description": "Anchor placement preset for badge positioning.",
1330
- "fieldName": "placement"
1102
+ "default": "false",
1103
+ "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
1104
+ "fieldName": "shadow"
1331
1105
  },
1332
1106
  {
1333
1107
  "name": "preset",
@@ -1343,60 +1117,60 @@
1343
1117
  "name": "LitElement",
1344
1118
  "package": "lit"
1345
1119
  },
1346
- "tagName": "sky-badge",
1120
+ "tagName": "sky-avatar",
1347
1121
  "customElement": true,
1348
- "summary": "Badge for status dots, counts, or icons anchored to slotted content."
1122
+ "summary": "Avatar that renders image content or fallback slot content with configurable size, radius, outline, and loading state."
1349
1123
  }
1350
1124
  ],
1351
1125
  "exports": [
1352
1126
  {
1353
1127
  "kind": "js",
1354
- "name": "SkyBadge",
1128
+ "name": "SkyAvatar",
1355
1129
  "declaration": {
1356
- "name": "SkyBadge",
1357
- "module": "src/sky-badge/sky-badge.ts"
1130
+ "name": "SkyAvatar",
1131
+ "module": "src/sky-avatar/sky-avatar.ts"
1358
1132
  }
1359
1133
  },
1360
1134
  {
1361
1135
  "kind": "custom-element-definition",
1362
- "name": "sky-badge",
1136
+ "name": "sky-avatar",
1363
1137
  "declaration": {
1364
- "name": "SkyBadge",
1365
- "module": "src/sky-badge/sky-badge.ts"
1138
+ "name": "SkyAvatar",
1139
+ "module": "src/sky-avatar/sky-avatar.ts"
1366
1140
  }
1367
1141
  }
1368
1142
  ]
1369
1143
  },
1370
1144
  {
1371
1145
  "kind": "javascript-module",
1372
- "path": "src/sky-button/sky-button.ts",
1146
+ "path": "src/sky-badge/sky-badge.ts",
1373
1147
  "declarations": [
1374
1148
  {
1375
1149
  "kind": "class",
1376
1150
  "description": "",
1377
- "name": "SkyButton",
1151
+ "name": "SkyBadge",
1378
1152
  "cssParts": [
1379
1153
  {
1380
- "description": "The native `<button>` element.",
1381
- "name": "button"
1382
- },
1383
- {
1384
- "description": "The optional left/right icons.",
1385
- "name": "icon"
1154
+ "description": "Wrapper around the slotted content and the badge.",
1155
+ "name": "container"
1386
1156
  },
1387
1157
  {
1388
- "description": "Overlay displayed when loading.",
1389
- "name": "loading-overlay"
1158
+ "description": "The badge element. Use `badgeRef` for positioning (e.g. tooltip anchor).",
1159
+ "name": "badge"
1390
1160
  },
1391
1161
  {
1392
- "description": "Spinner displayed when loading.",
1393
- "name": "spinner"
1162
+ "description": "The icon element when `isIcon` is true.",
1163
+ "name": "icon"
1394
1164
  }
1395
1165
  ],
1396
1166
  "slots": [
1397
1167
  {
1398
- "description": "Default slot for the button label (replaces `label` property if used).",
1168
+ "description": "The content the badge attaches to.",
1399
1169
  "name": ""
1170
+ },
1171
+ {
1172
+ "description": "Optional slot to override the badge content entirely.",
1173
+ "name": "badge"
1400
1174
  }
1401
1175
  ],
1402
1176
  "members": [
@@ -1411,61 +1185,68 @@
1411
1185
  },
1412
1186
  {
1413
1187
  "kind": "field",
1414
- "name": "formAssociated",
1188
+ "name": "statusColor",
1415
1189
  "type": {
1416
- "text": "boolean"
1190
+ "text": "string"
1417
1191
  },
1418
- "static": true,
1419
- "default": "true"
1192
+ "default": "\"success\"",
1193
+ "description": "Badge background token or CSS color.",
1194
+ "attribute": "statusColor",
1195
+ "reflects": true
1420
1196
  },
1421
1197
  {
1422
1198
  "kind": "field",
1423
- "name": "internals",
1199
+ "name": "textColor",
1424
1200
  "type": {
1425
- "text": "ElementInternals"
1201
+ "text": "string"
1426
1202
  },
1427
- "privacy": "private"
1203
+ "default": "\"default\"",
1204
+ "description": "Text color token or CSS color.",
1205
+ "attribute": "textColor",
1206
+ "reflects": true
1428
1207
  },
1429
1208
  {
1430
1209
  "kind": "field",
1431
- "name": "variant",
1210
+ "name": "iconColor",
1432
1211
  "type": {
1433
- "text": "SkyButtonVariant"
1212
+ "text": "string"
1434
1213
  },
1435
- "default": "\"solid\"",
1436
- "description": "Visual variant of the button. Use `\"link\"` for text-only control with underline on hover. Default: `\"solid\"`.",
1437
- "attribute": "variant",
1214
+ "default": "\"\"",
1215
+ "description": "Icon color token or CSS color; falls back to `textColor` when empty.",
1216
+ "attribute": "iconColor",
1438
1217
  "reflects": true
1439
1218
  },
1440
1219
  {
1441
1220
  "kind": "field",
1442
- "name": "color",
1221
+ "name": "position",
1443
1222
  "type": {
1444
- "text": "string"
1223
+ "text": "SkyBadgePosition"
1445
1224
  },
1446
- "default": "\"primary\"",
1447
- "description": "Base color token or custom CSS color. Default: `\"primary\"`.",
1448
- "attribute": "color"
1225
+ "default": "\"default\"",
1226
+ "description": "Layout mode: `default | floating | inline`.",
1227
+ "attribute": "position",
1228
+ "reflects": true
1449
1229
  },
1450
1230
  {
1451
1231
  "kind": "field",
1452
- "name": "type",
1232
+ "name": "value",
1453
1233
  "type": {
1454
- "text": "SkyButtonType"
1234
+ "text": "string"
1455
1235
  },
1456
- "default": "\"button\"",
1457
- "description": "Button type attribute. Default: `\"button\"`.",
1458
- "attribute": "type"
1236
+ "default": "\"\"",
1237
+ "description": "Badge text/count or icon name in icon mode.",
1238
+ "attribute": "value"
1459
1239
  },
1460
1240
  {
1461
1241
  "kind": "field",
1462
- "name": "form",
1242
+ "name": "isIcon",
1463
1243
  "type": {
1464
- "text": "string"
1244
+ "text": "boolean"
1465
1245
  },
1466
- "default": "\"\"",
1467
- "description": "Associated form ID for custom submit handling.",
1468
- "attribute": "form"
1246
+ "default": "false",
1247
+ "description": "Renders icon mode when true.",
1248
+ "attribute": "isIcon",
1249
+ "reflects": true
1469
1250
  },
1470
1251
  {
1471
1252
  "kind": "field",
@@ -1473,495 +1254,477 @@
1473
1254
  "type": {
1474
1255
  "text": "string"
1475
1256
  },
1476
- "default": "\"md\"",
1477
- "description": "Preset size token (`xs…xl`) or CSS size (e.g., `\"15px\"`, `\"1rem\"`). Default: `\"md\"`.",
1478
- "attribute": "size"
1257
+ "default": "\"\"",
1258
+ "description": "Badge and icon size CSS length.",
1259
+ "attribute": "size",
1260
+ "reflects": true
1479
1261
  },
1480
1262
  {
1481
1263
  "kind": "field",
1482
- "name": "radius",
1264
+ "name": "shape",
1483
1265
  "type": {
1484
- "text": "string"
1266
+ "text": "SkyBadgeShape"
1485
1267
  },
1486
- "default": "\"md\"",
1487
- "description": "Preset radius token (`none…full`) or CSS radius (e.g., `\"12px\"`). Default: `\"md\"`.",
1488
- "attribute": "radius"
1268
+ "default": "\"custom\"",
1269
+ "description": "Badge shape: `circle | pill | custom`.",
1270
+ "attribute": "shape",
1271
+ "reflects": true
1489
1272
  },
1490
1273
  {
1491
1274
  "kind": "field",
1492
- "name": "label",
1275
+ "name": "max",
1493
1276
  "type": {
1494
- "text": "string"
1277
+ "text": "number"
1495
1278
  },
1496
- "default": "\"Button\"",
1497
- "description": "Text label for the button. Ignored if default slot is used. Default: `\"Button\"`.",
1498
- "attribute": "label"
1279
+ "default": "99",
1280
+ "description": "Maximum numeric count before rendering overflow label.",
1281
+ "attribute": "max"
1499
1282
  },
1500
1283
  {
1501
1284
  "kind": "field",
1502
- "name": "disabled",
1285
+ "name": "hideWhenZero",
1503
1286
  "type": {
1504
1287
  "text": "boolean"
1505
1288
  },
1506
1289
  "default": "false",
1507
- "description": "Whether the button is disabled. Default: `false`.",
1508
- "attribute": "disabled",
1509
- "reflects": true
1290
+ "description": "Hides badge when value resolves to numeric zero.",
1291
+ "attribute": "hideWhenZero"
1510
1292
  },
1511
1293
  {
1512
1294
  "kind": "field",
1513
- "name": "loading",
1295
+ "name": "show",
1514
1296
  "type": {
1515
1297
  "text": "boolean"
1516
1298
  },
1517
- "default": "false",
1518
- "description": "Shows a loading overlay when true. Default: `false`.",
1519
- "attribute": "loading",
1299
+ "default": "true",
1300
+ "description": "Forces badge visibility independent of value.",
1301
+ "attribute": "show",
1520
1302
  "reflects": true
1521
1303
  },
1522
1304
  {
1523
1305
  "kind": "field",
1524
- "name": "iconL",
1306
+ "name": "offsetX",
1525
1307
  "type": {
1526
1308
  "text": "string"
1527
1309
  },
1528
- "default": "\"\"",
1529
- "description": "Optional left-side icon (Iconify name). Default: `\"\"`.",
1530
- "attribute": "iconL"
1310
+ "default": "\"0px\"",
1311
+ "description": "Horizontal offset CSS length.",
1312
+ "attribute": "offsetX"
1531
1313
  },
1532
1314
  {
1533
1315
  "kind": "field",
1534
- "name": "iconR",
1316
+ "name": "offsetY",
1535
1317
  "type": {
1536
1318
  "text": "string"
1537
1319
  },
1538
- "default": "\"\"",
1539
- "description": "Optional right-side icon (Iconify name). Default: `\"\"`.",
1540
- "attribute": "iconR"
1320
+ "default": "\"0px\"",
1321
+ "description": "Vertical offset CSS length.",
1322
+ "attribute": "offsetY"
1541
1323
  },
1542
1324
  {
1543
1325
  "kind": "field",
1544
- "name": "iconOnly",
1326
+ "name": "ring",
1545
1327
  "type": {
1546
1328
  "text": "boolean"
1547
1329
  },
1548
1330
  "default": "false",
1549
- "description": "Square padding for icon-only buttons; hides label text. Default: `false`.",
1550
- "attribute": "iconOnly",
1551
- "reflects": true
1331
+ "description": "Enables visual ring around the badge.",
1332
+ "attribute": "ring"
1552
1333
  },
1553
1334
  {
1554
1335
  "kind": "field",
1555
- "name": "colors",
1336
+ "name": "ringColor",
1556
1337
  "type": {
1557
1338
  "text": "string"
1558
1339
  },
1559
- "default": "\"\"",
1560
- "description": "Comma-separated color stops for gradient variant. Default: `\"\"`.",
1561
- "attribute": "colors"
1340
+ "default": "\"primary\"",
1341
+ "description": "Ring color token or CSS color.",
1342
+ "attribute": "ringColor"
1562
1343
  },
1563
1344
  {
1564
1345
  "kind": "field",
1565
- "name": "animation",
1346
+ "name": "ringOffset",
1566
1347
  "type": {
1567
- "text": "SkyButtonAnimation"
1348
+ "text": "string"
1568
1349
  },
1569
- "default": "\"auto\"",
1570
- "description": "Transform animation style. Default: `\"auto\"`.",
1571
- "attribute": "animation",
1572
- "reflects": true
1350
+ "default": "\"1px\"",
1351
+ "description": "Ring offset CSS length.",
1352
+ "attribute": "ringOffset"
1573
1353
  },
1574
1354
  {
1575
1355
  "kind": "field",
1576
- "name": "preset",
1356
+ "name": "badgeLabel",
1577
1357
  "type": {
1578
- "text": "string"
1358
+ "text": "string | null"
1579
1359
  },
1580
- "default": "\"\"",
1581
- "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
1582
- "attribute": "preset",
1583
- "reflects": true
1360
+ "default": "null",
1361
+ "description": "ARIA label override.",
1362
+ "attribute": "badgeLabel"
1584
1363
  },
1585
1364
  {
1586
1365
  "kind": "field",
1587
- "name": "_hasMeaningfulSlot",
1366
+ "name": "badgeAriaHidden",
1588
1367
  "type": {
1589
1368
  "text": "boolean"
1590
1369
  },
1591
- "privacy": "private",
1592
- "default": "false"
1370
+ "default": "false",
1371
+ "description": "Hides badge from assistive technology when true.",
1372
+ "attribute": "badgeAriaHidden"
1593
1373
  },
1594
1374
  {
1595
1375
  "kind": "field",
1596
- "name": "_styleVars",
1376
+ "name": "interactive",
1597
1377
  "type": {
1598
- "text": "Record<string, string>"
1378
+ "text": "boolean"
1599
1379
  },
1600
- "privacy": "private",
1601
- "default": "{}",
1602
- "description": "Inline CSS variable cache."
1380
+ "default": "false",
1381
+ "description": "Enables focus/activation and `badge-click` emission.",
1382
+ "attribute": "interactive"
1383
+ },
1384
+ {
1385
+ "kind": "field",
1386
+ "name": "placement",
1387
+ "type": {
1388
+ "text": "SkyBadgePlacement"
1389
+ },
1390
+ "default": "\"custom\"",
1391
+ "description": "Anchor placement preset for badge positioning.",
1392
+ "attribute": "placement",
1393
+ "reflects": true
1394
+ },
1395
+ {
1396
+ "kind": "field",
1397
+ "name": "preset",
1398
+ "type": {
1399
+ "text": "string"
1400
+ },
1401
+ "default": "\"\"",
1402
+ "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
1403
+ "attribute": "preset",
1404
+ "reflects": true
1603
1405
  },
1604
1406
  {
1605
1407
  "kind": "field",
1606
1408
  "name": "_presets",
1607
1409
  "privacy": "private",
1608
- "default": "new PresetController(this, { isPaused: () => this.inGroup, onChange: () => { this._styleDirty = true; }, })"
1410
+ "default": "new PresetController(this)"
1609
1411
  },
1610
1412
  {
1611
1413
  "kind": "field",
1612
- "name": "_lastPresetRevision",
1414
+ "name": "_badgeEl",
1613
1415
  "type": {
1614
- "text": "number"
1416
+ "text": "HTMLSpanElement"
1615
1417
  },
1616
- "privacy": "private",
1617
- "default": "-1"
1418
+ "privacy": "private"
1618
1419
  },
1619
1420
  {
1620
1421
  "kind": "field",
1621
- "name": "_styleDirty",
1422
+ "name": "badgeRef",
1423
+ "privacy": "public",
1424
+ "description": "Ref for the badge element (e.g. for tooltip anchor or positioning)."
1425
+ },
1426
+ {
1427
+ "kind": "field",
1428
+ "name": "shadowRootOptions",
1622
1429
  "type": {
1623
- "text": "boolean"
1430
+ "text": "ShadowRootInit"
1624
1431
  },
1625
- "privacy": "private",
1626
- "default": "true",
1627
- "description": "Set when presets change so `update()` rebuilds CSS vars after hostUpdate."
1432
+ "static": true,
1433
+ "default": "{ mode: \"open\", delegatesFocus: true, }"
1628
1434
  },
1629
1435
  {
1630
1436
  "kind": "method",
1631
- "name": "_slotHasMeaningfulContent",
1632
- "privacy": "private",
1437
+ "name": "showBadge",
1438
+ "privacy": "public",
1633
1439
  "return": {
1634
1440
  "type": {
1635
- "text": "boolean"
1441
+ "text": "void"
1636
1442
  }
1637
1443
  },
1638
- "parameters": [
1639
- {
1640
- "name": "slotEl",
1641
- "type": {
1642
- "text": "HTMLSlotElement"
1643
- }
1644
- }
1645
- ]
1646
- },
1647
- {
1648
- "kind": "field",
1649
- "name": "_onSlotChange",
1650
- "privacy": "private"
1444
+ "description": "Forces badge visibility on."
1651
1445
  },
1652
1446
  {
1653
1447
  "kind": "method",
1654
- "name": "_toSquarePadding",
1655
- "privacy": "private",
1448
+ "name": "hideBadge",
1449
+ "privacy": "public",
1656
1450
  "return": {
1657
1451
  "type": {
1658
- "text": "string"
1452
+ "text": "void"
1659
1453
  }
1660
1454
  },
1661
- "parameters": [
1662
- {
1663
- "name": "padding",
1664
- "type": {
1665
- "text": "string"
1666
- }
1667
- }
1668
- ],
1669
- "description": "Uses vertical padding for equal sides (icon-only square control)."
1455
+ "description": "Forces badge visibility off."
1670
1456
  },
1671
1457
  {
1672
1458
  "kind": "method",
1673
- "name": "_resolveSize",
1674
- "privacy": "private",
1459
+ "name": "setValue",
1460
+ "privacy": "public",
1675
1461
  "return": {
1676
1462
  "type": {
1677
- "text": "{\r\n padding: string;\r\n fontSize: string;\r\n gap: string;\r\n icon: string;\r\n spinner: string;\r\n }"
1463
+ "text": "void"
1678
1464
  }
1679
1465
  },
1680
1466
  "parameters": [
1681
1467
  {
1682
- "name": "input",
1468
+ "name": "value",
1683
1469
  "type": {
1684
1470
  "text": "string"
1685
- }
1471
+ },
1472
+ "description": "Badge value or icon name."
1686
1473
  }
1687
- ]
1474
+ ],
1475
+ "description": "Updates badge value for text/count or icon modes."
1688
1476
  },
1689
1477
  {
1690
- "kind": "method",
1691
- "name": "_isThemeBorderShorthand",
1478
+ "kind": "field",
1479
+ "name": "_onActivate",
1692
1480
  "privacy": "private",
1693
- "return": {
1694
- "type": {
1695
- "text": "boolean"
1696
- }
1697
- },
1698
- "parameters": [
1699
- {
1700
- "name": "border",
1701
- "type": {
1702
- "text": "string | undefined"
1703
- }
1704
- }
1705
- ],
1706
- "description": "Theme tokens like `var(--sky-border-primary)` are full border shorthands, not colors."
1481
+ "description": "Emits `badge-click` for interactive activation."
1707
1482
  },
1708
1483
  {
1709
- "kind": "method",
1710
- "name": "_borderColorFromShorthand",
1484
+ "kind": "field",
1485
+ "name": "_onKeydown",
1711
1486
  "privacy": "private",
1712
- "return": {
1713
- "type": {
1714
- "text": "string"
1715
- }
1716
- },
1717
- "parameters": [
1718
- {
1719
- "name": "border",
1720
- "type": {
1721
- "text": "string | undefined"
1722
- }
1723
- }
1724
- ],
1725
- "description": "Extracts the color token from a `Npx solid …` border shorthand."
1487
+ "description": "Handles keyboard activation with Enter and Space."
1726
1488
  },
1727
1489
  {
1728
1490
  "kind": "method",
1729
- "name": "_rebuildStyleVars",
1491
+ "name": "_computeAriaLabel",
1730
1492
  "privacy": "private",
1731
1493
  "return": {
1732
1494
  "type": {
1733
- "text": "void"
1495
+ "text": "string | null"
1734
1496
  }
1735
1497
  },
1736
1498
  "parameters": [
1737
1499
  {
1738
- "name": "changedProperties",
1500
+ "name": "displayValue",
1739
1501
  "type": {
1740
- "text": "Map<string, unknown>"
1502
+ "text": "string | null"
1741
1503
  }
1742
1504
  }
1743
- ]
1744
- },
1745
- {
1746
- "kind": "method",
1747
- "name": "focusButton",
1748
- "privacy": "public",
1749
- "return": {
1750
- "type": {
1751
- "text": "void"
1752
- }
1753
- },
1754
- "description": "Focuses the internal native button."
1755
- },
1756
- {
1757
- "kind": "method",
1758
- "name": "clickButton",
1759
- "privacy": "public",
1760
- "return": {
1761
- "type": {
1762
- "text": "void"
1763
- }
1764
- },
1765
- "description": "Triggers a click on the internal native button when enabled."
1505
+ ],
1506
+ "description": "Computes accessible badge label from current render state."
1766
1507
  },
1767
1508
  {
1768
1509
  "kind": "method",
1769
- "name": "_createRipple",
1510
+ "name": "_computeAnchors",
1770
1511
  "privacy": "private",
1771
1512
  "return": {
1772
1513
  "type": {
1773
- "text": "void"
1514
+ "text": "{\r\n top: string;\r\n right: string;\r\n bottom: string;\r\n left: string;\r\n }"
1774
1515
  }
1775
1516
  },
1776
1517
  "parameters": [
1777
1518
  {
1778
- "name": "event",
1519
+ "name": "placement",
1779
1520
  "type": {
1780
- "text": "MouseEvent"
1521
+ "text": "SkyBadgePlacement"
1781
1522
  }
1782
1523
  }
1783
- ]
1524
+ ],
1525
+ "description": "Resolves anchor edges from placement preset."
1784
1526
  },
1785
1527
  {
1786
1528
  "kind": "method",
1787
- "name": "formDisabledCallback",
1529
+ "name": "_resolveBadgeSurface",
1530
+ "privacy": "private",
1788
1531
  "return": {
1789
1532
  "type": {
1790
- "text": "void"
1533
+ "text": "{\r\n bg: string;\r\n color: string;\r\n border: string;\r\n }"
1791
1534
  }
1792
1535
  },
1793
- "parameters": [
1794
- {
1795
- "name": "disabled",
1796
- "type": {
1797
- "text": "boolean"
1798
- }
1799
- }
1800
- ]
1801
- },
1536
+ "description": "Maps semantic status tokens to soft badge surface colors."
1537
+ }
1538
+ ],
1539
+ "events": [
1802
1540
  {
1803
- "kind": "field",
1804
- "name": "formOwner",
1805
1541
  "type": {
1806
- "text": "HTMLFormElement | null"
1807
- },
1808
- "readonly": true
1809
- },
1810
- {
1811
- "kind": "method",
1812
- "name": "_handleClick",
1813
- "privacy": "private",
1814
- "return": {
1815
- "type": {
1816
- "text": "void"
1817
- }
1542
+ "text": "CustomEvent<SkyBadgeClickEventDetail>"
1818
1543
  },
1819
- "parameters": [
1820
- {
1821
- "name": "event",
1822
- "type": {
1823
- "text": "MouseEvent"
1824
- }
1825
- }
1826
- ]
1827
- },
1828
- {
1829
- "kind": "method",
1830
- "name": "_iconOnlyName",
1831
- "privacy": "private",
1832
- "return": {
1833
- "type": {
1834
- "text": "string"
1835
- }
1836
- }
1544
+ "description": "Emitted when badge activation occurs via click, Enter, or Space while `interactive` is true.",
1545
+ "name": "badge-click"
1837
1546
  }
1838
1547
  ],
1839
1548
  "attributes": [
1840
1549
  {
1841
- "name": "variant",
1550
+ "name": "statusColor",
1842
1551
  "type": {
1843
- "text": "SkyButtonVariant"
1552
+ "text": "string"
1844
1553
  },
1845
- "default": "\"solid\"",
1846
- "description": "Visual variant of the button. Use `\"link\"` for text-only control with underline on hover. Default: `\"solid\"`.",
1847
- "fieldName": "variant"
1554
+ "default": "\"success\"",
1555
+ "description": "Badge background token or CSS color.",
1556
+ "fieldName": "statusColor"
1848
1557
  },
1849
1558
  {
1850
- "name": "color",
1559
+ "name": "textColor",
1851
1560
  "type": {
1852
1561
  "text": "string"
1853
1562
  },
1854
- "default": "\"primary\"",
1855
- "description": "Base color token or custom CSS color. Default: `\"primary\"`.",
1856
- "fieldName": "color"
1563
+ "default": "\"default\"",
1564
+ "description": "Text color token or CSS color.",
1565
+ "fieldName": "textColor"
1857
1566
  },
1858
1567
  {
1859
- "name": "type",
1568
+ "name": "iconColor",
1860
1569
  "type": {
1861
- "text": "SkyButtonType"
1570
+ "text": "string"
1862
1571
  },
1863
- "default": "\"button\"",
1864
- "description": "Button type attribute. Default: `\"button\"`.",
1865
- "fieldName": "type"
1572
+ "default": "\"\"",
1573
+ "description": "Icon color token or CSS color; falls back to `textColor` when empty.",
1574
+ "fieldName": "iconColor"
1866
1575
  },
1867
1576
  {
1868
- "name": "form",
1577
+ "name": "position",
1578
+ "type": {
1579
+ "text": "SkyBadgePosition"
1580
+ },
1581
+ "default": "\"default\"",
1582
+ "description": "Layout mode: `default | floating | inline`.",
1583
+ "fieldName": "position"
1584
+ },
1585
+ {
1586
+ "name": "value",
1869
1587
  "type": {
1870
1588
  "text": "string"
1871
1589
  },
1872
1590
  "default": "\"\"",
1873
- "description": "Associated form ID for custom submit handling.",
1874
- "fieldName": "form"
1591
+ "description": "Badge text/count or icon name in icon mode.",
1592
+ "fieldName": "value"
1593
+ },
1594
+ {
1595
+ "name": "isIcon",
1596
+ "type": {
1597
+ "text": "boolean"
1598
+ },
1599
+ "default": "false",
1600
+ "description": "Renders icon mode when true.",
1601
+ "fieldName": "isIcon"
1875
1602
  },
1876
1603
  {
1877
1604
  "name": "size",
1878
1605
  "type": {
1879
1606
  "text": "string"
1880
1607
  },
1881
- "default": "\"md\"",
1882
- "description": "Preset size token (`xs…xl`) or CSS size (e.g., `\"15px\"`, `\"1rem\"`). Default: `\"md\"`.",
1608
+ "default": "\"\"",
1609
+ "description": "Badge and icon size CSS length.",
1883
1610
  "fieldName": "size"
1884
1611
  },
1885
1612
  {
1886
- "name": "radius",
1613
+ "name": "shape",
1887
1614
  "type": {
1888
- "text": "string"
1615
+ "text": "SkyBadgeShape"
1889
1616
  },
1890
- "default": "\"md\"",
1891
- "description": "Preset radius token (`none…full`) or CSS radius (e.g., `\"12px\"`). Default: `\"md\"`.",
1892
- "fieldName": "radius"
1617
+ "default": "\"custom\"",
1618
+ "description": "Badge shape: `circle | pill | custom`.",
1619
+ "fieldName": "shape"
1893
1620
  },
1894
1621
  {
1895
- "name": "label",
1622
+ "name": "max",
1896
1623
  "type": {
1897
- "text": "string"
1624
+ "text": "number"
1898
1625
  },
1899
- "default": "\"Button\"",
1900
- "description": "Text label for the button. Ignored if default slot is used. Default: `\"Button\"`.",
1901
- "fieldName": "label"
1626
+ "default": "99",
1627
+ "description": "Maximum numeric count before rendering overflow label.",
1628
+ "fieldName": "max"
1902
1629
  },
1903
1630
  {
1904
- "name": "disabled",
1631
+ "name": "hideWhenZero",
1905
1632
  "type": {
1906
1633
  "text": "boolean"
1907
1634
  },
1908
1635
  "default": "false",
1909
- "description": "Whether the button is disabled. Default: `false`.",
1910
- "fieldName": "disabled"
1636
+ "description": "Hides badge when value resolves to numeric zero.",
1637
+ "fieldName": "hideWhenZero"
1911
1638
  },
1912
1639
  {
1913
- "name": "loading",
1640
+ "name": "show",
1914
1641
  "type": {
1915
1642
  "text": "boolean"
1916
1643
  },
1917
- "default": "false",
1918
- "description": "Shows a loading overlay when true. Default: `false`.",
1919
- "fieldName": "loading"
1644
+ "default": "true",
1645
+ "description": "Forces badge visibility independent of value.",
1646
+ "fieldName": "show"
1920
1647
  },
1921
1648
  {
1922
- "name": "iconL",
1649
+ "name": "offsetX",
1923
1650
  "type": {
1924
1651
  "text": "string"
1925
1652
  },
1926
- "default": "\"\"",
1927
- "description": "Optional left-side icon (Iconify name). Default: `\"\"`.",
1928
- "fieldName": "iconL"
1653
+ "default": "\"0px\"",
1654
+ "description": "Horizontal offset CSS length.",
1655
+ "fieldName": "offsetX"
1929
1656
  },
1930
1657
  {
1931
- "name": "iconR",
1658
+ "name": "offsetY",
1932
1659
  "type": {
1933
1660
  "text": "string"
1934
1661
  },
1935
- "default": "\"\"",
1936
- "description": "Optional right-side icon (Iconify name). Default: `\"\"`.",
1937
- "fieldName": "iconR"
1662
+ "default": "\"0px\"",
1663
+ "description": "Vertical offset CSS length.",
1664
+ "fieldName": "offsetY"
1938
1665
  },
1939
1666
  {
1940
- "name": "iconOnly",
1667
+ "name": "ring",
1941
1668
  "type": {
1942
1669
  "text": "boolean"
1943
1670
  },
1944
1671
  "default": "false",
1945
- "description": "Square padding for icon-only buttons; hides label text. Default: `false`.",
1946
- "fieldName": "iconOnly"
1672
+ "description": "Enables visual ring around the badge.",
1673
+ "fieldName": "ring"
1947
1674
  },
1948
1675
  {
1949
- "name": "colors",
1676
+ "name": "ringColor",
1950
1677
  "type": {
1951
1678
  "text": "string"
1952
1679
  },
1953
- "default": "\"\"",
1954
- "description": "Comma-separated color stops for gradient variant. Default: `\"\"`.",
1955
- "fieldName": "colors"
1680
+ "default": "\"primary\"",
1681
+ "description": "Ring color token or CSS color.",
1682
+ "fieldName": "ringColor"
1956
1683
  },
1957
1684
  {
1958
- "name": "animation",
1685
+ "name": "ringOffset",
1959
1686
  "type": {
1960
- "text": "SkyButtonAnimation"
1687
+ "text": "string"
1961
1688
  },
1962
- "default": "\"auto\"",
1963
- "description": "Transform animation style. Default: `\"auto\"`.",
1964
- "fieldName": "animation"
1689
+ "default": "\"1px\"",
1690
+ "description": "Ring offset CSS length.",
1691
+ "fieldName": "ringOffset"
1692
+ },
1693
+ {
1694
+ "name": "badgeLabel",
1695
+ "type": {
1696
+ "text": "string | null"
1697
+ },
1698
+ "default": "null",
1699
+ "description": "ARIA label override.",
1700
+ "fieldName": "badgeLabel"
1701
+ },
1702
+ {
1703
+ "name": "badgeAriaHidden",
1704
+ "type": {
1705
+ "text": "boolean"
1706
+ },
1707
+ "default": "false",
1708
+ "description": "Hides badge from assistive technology when true.",
1709
+ "fieldName": "badgeAriaHidden"
1710
+ },
1711
+ {
1712
+ "name": "interactive",
1713
+ "type": {
1714
+ "text": "boolean"
1715
+ },
1716
+ "default": "false",
1717
+ "description": "Enables focus/activation and `badge-click` emission.",
1718
+ "fieldName": "interactive"
1719
+ },
1720
+ {
1721
+ "name": "placement",
1722
+ "type": {
1723
+ "text": "SkyBadgePlacement"
1724
+ },
1725
+ "default": "\"custom\"",
1726
+ "description": "Anchor placement preset for badge positioning.",
1727
+ "fieldName": "placement"
1965
1728
  },
1966
1729
  {
1967
1730
  "name": "preset",
@@ -1977,388 +1740,625 @@
1977
1740
  "name": "LitElement",
1978
1741
  "package": "lit"
1979
1742
  },
1980
- "tagName": "sky-button",
1743
+ "tagName": "sky-badge",
1981
1744
  "customElement": true,
1982
- "summary": "Styled button supporting variants, icons, loading state, ripple feedback, and form-associated behavior."
1745
+ "summary": "Badge for status dots, counts, or icons anchored to slotted content."
1983
1746
  }
1984
1747
  ],
1985
1748
  "exports": [
1986
1749
  {
1987
1750
  "kind": "js",
1988
- "name": "SkyButton",
1751
+ "name": "SkyBadge",
1989
1752
  "declaration": {
1990
- "name": "SkyButton",
1991
- "module": "src/sky-button/sky-button.ts"
1753
+ "name": "SkyBadge",
1754
+ "module": "src/sky-badge/sky-badge.ts"
1992
1755
  }
1993
1756
  },
1994
1757
  {
1995
1758
  "kind": "custom-element-definition",
1996
- "name": "sky-button",
1759
+ "name": "sky-badge",
1997
1760
  "declaration": {
1998
- "name": "SkyButton",
1999
- "module": "src/sky-button/sky-button.ts"
1761
+ "name": "SkyBadge",
1762
+ "module": "src/sky-badge/sky-badge.ts"
2000
1763
  }
2001
1764
  }
2002
1765
  ]
2003
1766
  },
2004
1767
  {
2005
1768
  "kind": "javascript-module",
2006
- "path": "src/sky-avatar/sky-avatar.ts",
1769
+ "path": "src/sky-button/sky-button.ts",
2007
1770
  "declarations": [
2008
1771
  {
2009
1772
  "kind": "class",
2010
1773
  "description": "",
2011
- "name": "SkyAvatar",
1774
+ "name": "SkyButton",
2012
1775
  "cssParts": [
2013
1776
  {
2014
- "description": "The avatar container element.",
2015
- "name": "avatar"
1777
+ "description": "The native `<button>` element.",
1778
+ "name": "button"
2016
1779
  },
2017
1780
  {
2018
- "description": "The loading overlay container (shown when `loading` is true).",
1781
+ "description": "The optional left/right icons.",
1782
+ "name": "icon"
1783
+ },
1784
+ {
1785
+ "description": "Overlay displayed when loading.",
2019
1786
  "name": "loading-overlay"
2020
1787
  },
2021
1788
  {
2022
- "description": "The spinner element shown when loading.",
1789
+ "description": "Spinner displayed when loading.",
2023
1790
  "name": "spinner"
2024
1791
  }
2025
1792
  ],
2026
1793
  "slots": [
2027
1794
  {
2028
- "description": "Fallback content (e.g., initials or an icon) rendered when `image` is empty.",
1795
+ "description": "Default slot for the button label (replaces `label` property if used).",
2029
1796
  "name": ""
2030
1797
  }
2031
1798
  ],
2032
1799
  "members": [
2033
1800
  {
2034
1801
  "kind": "field",
2035
- "name": "size",
1802
+ "name": "dependencies",
2036
1803
  "type": {
2037
- "text": "string"
1804
+ "text": "Record<string, CustomElementConstructor>"
2038
1805
  },
2039
- "default": "\"50px\"",
2040
- "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
2041
- "attribute": "size"
1806
+ "static": true,
1807
+ "default": "{ \"sky-icon\": SkyIcon, }"
2042
1808
  },
2043
1809
  {
2044
1810
  "kind": "field",
2045
- "name": "image",
1811
+ "name": "formAssociated",
2046
1812
  "type": {
2047
- "text": "string"
1813
+ "text": "boolean"
2048
1814
  },
2049
- "default": "\"\"",
2050
- "description": "Image URL; fallback slot is shown on load error.",
2051
- "attribute": "image"
1815
+ "static": true,
1816
+ "default": "true"
2052
1817
  },
2053
1818
  {
2054
1819
  "kind": "field",
2055
- "name": "fit",
1820
+ "name": "internals",
2056
1821
  "type": {
2057
- "text": "SkyAvatarFit"
1822
+ "text": "ElementInternals"
2058
1823
  },
2059
- "default": "\"cover\"",
2060
- "description": "Image fill mode: `cover` (default) or `contain`.",
2061
- "attribute": "fit",
1824
+ "privacy": "private"
1825
+ },
1826
+ {
1827
+ "kind": "field",
1828
+ "name": "variant",
1829
+ "type": {
1830
+ "text": "SkyButtonVariant"
1831
+ },
1832
+ "default": "\"solid\"",
1833
+ "description": "Visual variant of the button. Use `\"link\"` for text-only control with underline on hover. Default: `\"solid\"`.",
1834
+ "attribute": "variant",
2062
1835
  "reflects": true
2063
1836
  },
2064
1837
  {
2065
1838
  "kind": "field",
2066
- "name": "radius",
1839
+ "name": "color",
2067
1840
  "type": {
2068
1841
  "text": "string"
2069
1842
  },
2070
- "default": "\"md\"",
2071
- "description": "Border radius token or CSS value.",
2072
- "attribute": "radius"
1843
+ "default": "\"primary\"",
1844
+ "description": "Base color token or custom CSS color. Default: `\"primary\"`.",
1845
+ "attribute": "color"
2073
1846
  },
2074
1847
  {
2075
1848
  "kind": "field",
2076
- "name": "alt",
1849
+ "name": "type",
1850
+ "type": {
1851
+ "text": "SkyButtonType"
1852
+ },
1853
+ "default": "\"button\"",
1854
+ "description": "Button type attribute. Default: `\"button\"`.",
1855
+ "attribute": "type"
1856
+ },
1857
+ {
1858
+ "kind": "field",
1859
+ "name": "form",
2077
1860
  "type": {
2078
1861
  "text": "string"
2079
1862
  },
2080
1863
  "default": "\"\"",
2081
- "description": "Accessible name when image content conveys meaning.",
2082
- "attribute": "alt"
1864
+ "description": "Associated form ID for custom submit handling.",
1865
+ "attribute": "form"
2083
1866
  },
2084
1867
  {
2085
1868
  "kind": "field",
2086
- "name": "color",
1869
+ "name": "size",
2087
1870
  "type": {
2088
1871
  "text": "string"
2089
1872
  },
2090
- "default": "\"dark\"",
2091
- "description": "Token or CSS color applied to fallback slot content.",
2092
- "attribute": "color"
1873
+ "default": "\"md\"",
1874
+ "description": "Preset size token (`xs…xl`) or CSS size (e.g., `\"15px\"`, `\"1rem\"`). Default: `\"md\"`.",
1875
+ "attribute": "size"
2093
1876
  },
2094
1877
  {
2095
1878
  "kind": "field",
2096
- "name": "outline",
1879
+ "name": "radius",
2097
1880
  "type": {
2098
1881
  "text": "string"
2099
1882
  },
2100
- "default": "\"\"",
2101
- "description": "CSS `outline` value.",
2102
- "attribute": "outline"
1883
+ "default": "\"md\"",
1884
+ "description": "Preset radius token (`none…full`) or CSS radius (e.g., `\"12px\"`). Default: `\"md\"`.",
1885
+ "attribute": "radius"
2103
1886
  },
2104
1887
  {
2105
1888
  "kind": "field",
2106
- "name": "outlineOffset",
1889
+ "name": "label",
2107
1890
  "type": {
2108
1891
  "text": "string"
2109
1892
  },
2110
- "default": "\"2px\"",
2111
- "description": "CSS `outline-offset` value.",
2112
- "attribute": "outlineOffset"
1893
+ "default": "\"Button\"",
1894
+ "description": "Text label for the button. Ignored if default slot is used. Default: `\"Button\"`.",
1895
+ "attribute": "label"
2113
1896
  },
2114
1897
  {
2115
1898
  "kind": "field",
2116
- "name": "loading",
1899
+ "name": "disabled",
2117
1900
  "type": {
2118
1901
  "text": "boolean"
2119
1902
  },
2120
1903
  "default": "false",
2121
- "description": "Shows loading overlay when true.",
2122
- "attribute": "loading",
1904
+ "description": "Whether the button is disabled. Default: `false`.",
1905
+ "attribute": "disabled",
2123
1906
  "reflects": true
2124
1907
  },
2125
1908
  {
2126
1909
  "kind": "field",
2127
- "name": "disabled",
1910
+ "name": "loading",
2128
1911
  "type": {
2129
1912
  "text": "boolean"
2130
1913
  },
2131
1914
  "default": "false",
2132
- "description": "Dims and disables pointer interactions.",
2133
- "attribute": "disabled",
1915
+ "description": "Shows a loading overlay when true. Default: `false`.",
1916
+ "attribute": "loading",
2134
1917
  "reflects": true
2135
1918
  },
2136
1919
  {
2137
1920
  "kind": "field",
2138
- "name": "interactive",
1921
+ "name": "iconL",
2139
1922
  "type": {
2140
- "text": "boolean"
1923
+ "text": "string"
2141
1924
  },
2142
- "default": "false",
2143
- "description": "Enables interactive behavior with keyboard/click activation.",
2144
- "attribute": "interactive"
1925
+ "default": "\"\"",
1926
+ "description": "Optional left-side icon (Iconify name). Default: `\"\"`.",
1927
+ "attribute": "iconL"
2145
1928
  },
2146
1929
  {
2147
1930
  "kind": "field",
2148
- "name": "shadow",
1931
+ "name": "iconR",
2149
1932
  "type": {
2150
- "text": "boolean"
1933
+ "text": "string"
2151
1934
  },
2152
- "default": "false",
2153
- "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
2154
- "attribute": "shadow",
2155
- "reflects": true
1935
+ "default": "\"\"",
1936
+ "description": "Optional right-side icon (Iconify name). Default: `\"\"`.",
1937
+ "attribute": "iconR"
2156
1938
  },
2157
1939
  {
2158
1940
  "kind": "field",
2159
- "name": "_imageError",
1941
+ "name": "iconOnly",
2160
1942
  "type": {
2161
1943
  "text": "boolean"
2162
1944
  },
2163
- "privacy": "private",
2164
1945
  "default": "false",
2165
- "description": "True when image failed to load; show slot instead."
1946
+ "description": "Square padding for icon-only buttons; hides label text. Default: `false`.",
1947
+ "attribute": "iconOnly",
1948
+ "reflects": true
2166
1949
  },
2167
1950
  {
2168
1951
  "kind": "field",
2169
- "name": "preset",
1952
+ "name": "colors",
2170
1953
  "type": {
2171
1954
  "text": "string"
2172
1955
  },
2173
1956
  "default": "\"\"",
2174
- "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
2175
- "attribute": "preset",
1957
+ "description": "Comma-separated color stops for gradient variant. Default: `\"\"`.",
1958
+ "attribute": "colors"
1959
+ },
1960
+ {
1961
+ "kind": "field",
1962
+ "name": "animation",
1963
+ "type": {
1964
+ "text": "SkyButtonAnimation"
1965
+ },
1966
+ "default": "\"auto\"",
1967
+ "description": "Transform animation style. Default: `\"auto\"`.",
1968
+ "attribute": "animation",
2176
1969
  "reflects": true
2177
1970
  },
2178
1971
  {
2179
1972
  "kind": "field",
2180
- "name": "_presets",
1973
+ "name": "preset",
1974
+ "type": {
1975
+ "text": "string"
1976
+ },
1977
+ "default": "\"\"",
1978
+ "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
1979
+ "attribute": "preset",
1980
+ "reflects": true
1981
+ },
1982
+ {
1983
+ "kind": "field",
1984
+ "name": "_hasMeaningfulSlot",
1985
+ "type": {
1986
+ "text": "boolean"
1987
+ },
2181
1988
  "privacy": "private",
2182
- "default": "new PresetController(this)"
1989
+ "default": "false"
2183
1990
  },
2184
1991
  {
2185
1992
  "kind": "field",
2186
- "name": "_onImageLoad",
1993
+ "name": "_styleVars",
1994
+ "type": {
1995
+ "text": "Record<string, string>"
1996
+ },
2187
1997
  "privacy": "private",
2188
- "description": "Marks image load success and keeps image rendering active."
1998
+ "default": "{}",
1999
+ "description": "Inline CSS variable cache."
2189
2000
  },
2190
2001
  {
2191
2002
  "kind": "field",
2192
- "name": "_onImageError",
2003
+ "name": "_presets",
2193
2004
  "privacy": "private",
2194
- "description": "Marks image load failure and enables fallback slot rendering."
2005
+ "default": "new PresetController(this, { isPaused: () => this.inGroup, onChange: () => { this._styleDirty = true; }, })"
2006
+ },
2007
+ {
2008
+ "kind": "field",
2009
+ "name": "_lastPresetRevision",
2010
+ "type": {
2011
+ "text": "number"
2012
+ },
2013
+ "privacy": "private",
2014
+ "default": "-1"
2015
+ },
2016
+ {
2017
+ "kind": "field",
2018
+ "name": "_styleDirty",
2019
+ "type": {
2020
+ "text": "boolean"
2021
+ },
2022
+ "privacy": "private",
2023
+ "default": "true",
2024
+ "description": "Set when presets change so `update()` rebuilds CSS vars after hostUpdate."
2195
2025
  },
2196
2026
  {
2197
2027
  "kind": "method",
2198
- "name": "_handleInteractiveClick",
2028
+ "name": "_slotHasMeaningfulContent",
2199
2029
  "privacy": "private",
2200
2030
  "return": {
2201
2031
  "type": {
2202
- "text": "void"
2032
+ "text": "boolean"
2203
2033
  }
2204
2034
  },
2205
2035
  "parameters": [
2206
2036
  {
2207
- "name": "e",
2037
+ "name": "slotEl",
2208
2038
  "type": {
2209
- "text": "Event"
2039
+ "text": "HTMLSlotElement"
2210
2040
  }
2211
2041
  }
2212
- ],
2213
- "description": "Re-dispatches click in interactive mode for host-level consumers."
2042
+ ]
2043
+ },
2044
+ {
2045
+ "kind": "field",
2046
+ "name": "_onSlotChange",
2047
+ "privacy": "private"
2214
2048
  },
2215
2049
  {
2216
2050
  "kind": "method",
2217
- "name": "_handleInteractiveKeydown",
2051
+ "name": "_toSquarePadding",
2218
2052
  "privacy": "private",
2219
2053
  "return": {
2220
2054
  "type": {
2221
- "text": "void"
2055
+ "text": "string"
2222
2056
  }
2223
2057
  },
2224
2058
  "parameters": [
2225
2059
  {
2226
- "name": "e",
2060
+ "name": "padding",
2227
2061
  "type": {
2228
- "text": "KeyboardEvent"
2062
+ "text": "string"
2229
2063
  }
2230
2064
  }
2231
2065
  ],
2232
- "description": "Handles keyboard activation in interactive mode."
2066
+ "description": "Uses vertical padding for equal sides (icon-only square control)."
2233
2067
  },
2234
2068
  {
2235
2069
  "kind": "method",
2236
- "name": "adjustSpinnerSize",
2070
+ "name": "_resolveSize",
2237
2071
  "privacy": "private",
2238
2072
  "return": {
2239
2073
  "type": {
2240
- "text": "void"
2074
+ "text": "{\r\n padding: string;\r\n fontSize: string;\r\n gap: string;\r\n icon: string;\r\n spinner: string;\r\n }"
2241
2075
  }
2242
2076
  },
2243
- "description": "Derives spinner dimensions from current avatar size."
2244
- }
2245
- ],
2246
- "events": [
2247
- {
2248
- "name": "click",
2249
- "type": {
2250
- "text": "Event"
2251
- }
2252
- }
2253
- ],
2254
- "attributes": [
2255
- {
2256
- "name": "size",
2257
- "type": {
2258
- "text": "string"
2259
- },
2260
- "default": "\"50px\"",
2261
- "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
2262
- "fieldName": "size"
2077
+ "parameters": [
2078
+ {
2079
+ "name": "input",
2080
+ "type": {
2081
+ "text": "string"
2082
+ }
2083
+ }
2084
+ ]
2263
2085
  },
2264
2086
  {
2265
- "name": "image",
2266
- "type": {
2267
- "text": "string"
2087
+ "kind": "method",
2088
+ "name": "_isThemeBorderShorthand",
2089
+ "privacy": "private",
2090
+ "return": {
2091
+ "type": {
2092
+ "text": "boolean"
2093
+ }
2268
2094
  },
2269
- "default": "\"\"",
2270
- "description": "Image URL; fallback slot is shown on load error.",
2271
- "fieldName": "image"
2095
+ "parameters": [
2096
+ {
2097
+ "name": "border",
2098
+ "type": {
2099
+ "text": "string | undefined"
2100
+ }
2101
+ }
2102
+ ],
2103
+ "description": "Theme tokens like `var(--sky-border-primary)` are full border shorthands, not colors."
2272
2104
  },
2273
2105
  {
2274
- "name": "fit",
2275
- "type": {
2276
- "text": "SkyAvatarFit"
2106
+ "kind": "method",
2107
+ "name": "_borderColorFromShorthand",
2108
+ "privacy": "private",
2109
+ "return": {
2110
+ "type": {
2111
+ "text": "string"
2112
+ }
2277
2113
  },
2278
- "default": "\"cover\"",
2279
- "description": "Image fill mode: `cover` (default) or `contain`.",
2280
- "fieldName": "fit"
2114
+ "parameters": [
2115
+ {
2116
+ "name": "border",
2117
+ "type": {
2118
+ "text": "string | undefined"
2119
+ }
2120
+ }
2121
+ ],
2122
+ "description": "Extracts the color token from a `Npx solid …` border shorthand."
2281
2123
  },
2282
2124
  {
2283
- "name": "radius",
2284
- "type": {
2285
- "text": "string"
2125
+ "kind": "method",
2126
+ "name": "_rebuildStyleVars",
2127
+ "privacy": "private",
2128
+ "return": {
2129
+ "type": {
2130
+ "text": "void"
2131
+ }
2286
2132
  },
2287
- "default": "\"md\"",
2288
- "description": "Border radius token or CSS value.",
2289
- "fieldName": "radius"
2133
+ "parameters": [
2134
+ {
2135
+ "name": "changedProperties",
2136
+ "type": {
2137
+ "text": "Map<string, unknown>"
2138
+ }
2139
+ }
2140
+ ]
2290
2141
  },
2291
2142
  {
2292
- "name": "alt",
2293
- "type": {
2294
- "text": "string"
2143
+ "kind": "method",
2144
+ "name": "focusButton",
2145
+ "privacy": "public",
2146
+ "return": {
2147
+ "type": {
2148
+ "text": "void"
2149
+ }
2295
2150
  },
2296
- "default": "\"\"",
2297
- "description": "Accessible name when image content conveys meaning.",
2298
- "fieldName": "alt"
2151
+ "description": "Focuses the internal native button."
2299
2152
  },
2300
2153
  {
2301
- "name": "color",
2302
- "type": {
2303
- "text": "string"
2154
+ "kind": "method",
2155
+ "name": "clickButton",
2156
+ "privacy": "public",
2157
+ "return": {
2158
+ "type": {
2159
+ "text": "void"
2160
+ }
2304
2161
  },
2305
- "default": "\"dark\"",
2306
- "description": "Token or CSS color applied to fallback slot content.",
2307
- "fieldName": "color"
2162
+ "description": "Triggers a click on the internal native button when enabled."
2308
2163
  },
2309
2164
  {
2310
- "name": "outline",
2311
- "type": {
2312
- "text": "string"
2165
+ "kind": "method",
2166
+ "name": "_createRipple",
2167
+ "privacy": "private",
2168
+ "return": {
2169
+ "type": {
2170
+ "text": "void"
2171
+ }
2313
2172
  },
2314
- "default": "\"\"",
2315
- "description": "CSS `outline` value.",
2316
- "fieldName": "outline"
2173
+ "parameters": [
2174
+ {
2175
+ "name": "event",
2176
+ "type": {
2177
+ "text": "MouseEvent"
2178
+ }
2179
+ }
2180
+ ]
2317
2181
  },
2318
2182
  {
2319
- "name": "outlineOffset",
2320
- "type": {
2321
- "text": "string"
2183
+ "kind": "method",
2184
+ "name": "formDisabledCallback",
2185
+ "return": {
2186
+ "type": {
2187
+ "text": "void"
2188
+ }
2322
2189
  },
2323
- "default": "\"2px\"",
2324
- "description": "CSS `outline-offset` value.",
2325
- "fieldName": "outlineOffset"
2190
+ "parameters": [
2191
+ {
2192
+ "name": "disabled",
2193
+ "type": {
2194
+ "text": "boolean"
2195
+ }
2196
+ }
2197
+ ]
2326
2198
  },
2327
2199
  {
2328
- "name": "loading",
2200
+ "kind": "field",
2201
+ "name": "formOwner",
2329
2202
  "type": {
2330
- "text": "boolean"
2203
+ "text": "HTMLFormElement | null"
2331
2204
  },
2332
- "default": "false",
2333
- "description": "Shows loading overlay when true.",
2334
- "fieldName": "loading"
2205
+ "readonly": true
2335
2206
  },
2336
2207
  {
2337
- "name": "disabled",
2338
- "type": {
2339
- "text": "boolean"
2340
- },
2341
- "default": "false",
2342
- "description": "Dims and disables pointer interactions.",
2343
- "fieldName": "disabled"
2208
+ "kind": "method",
2209
+ "name": "_handleClick",
2210
+ "privacy": "private",
2211
+ "return": {
2212
+ "type": {
2213
+ "text": "void"
2214
+ }
2215
+ },
2216
+ "parameters": [
2217
+ {
2218
+ "name": "event",
2219
+ "type": {
2220
+ "text": "MouseEvent"
2221
+ }
2222
+ }
2223
+ ]
2344
2224
  },
2345
2225
  {
2346
- "name": "interactive",
2226
+ "kind": "method",
2227
+ "name": "_iconOnlyName",
2228
+ "privacy": "private",
2229
+ "return": {
2230
+ "type": {
2231
+ "text": "string"
2232
+ }
2233
+ }
2234
+ }
2235
+ ],
2236
+ "attributes": [
2237
+ {
2238
+ "name": "variant",
2239
+ "type": {
2240
+ "text": "SkyButtonVariant"
2241
+ },
2242
+ "default": "\"solid\"",
2243
+ "description": "Visual variant of the button. Use `\"link\"` for text-only control with underline on hover. Default: `\"solid\"`.",
2244
+ "fieldName": "variant"
2245
+ },
2246
+ {
2247
+ "name": "color",
2248
+ "type": {
2249
+ "text": "string"
2250
+ },
2251
+ "default": "\"primary\"",
2252
+ "description": "Base color token or custom CSS color. Default: `\"primary\"`.",
2253
+ "fieldName": "color"
2254
+ },
2255
+ {
2256
+ "name": "type",
2257
+ "type": {
2258
+ "text": "SkyButtonType"
2259
+ },
2260
+ "default": "\"button\"",
2261
+ "description": "Button type attribute. Default: `\"button\"`.",
2262
+ "fieldName": "type"
2263
+ },
2264
+ {
2265
+ "name": "form",
2266
+ "type": {
2267
+ "text": "string"
2268
+ },
2269
+ "default": "\"\"",
2270
+ "description": "Associated form ID for custom submit handling.",
2271
+ "fieldName": "form"
2272
+ },
2273
+ {
2274
+ "name": "size",
2275
+ "type": {
2276
+ "text": "string"
2277
+ },
2278
+ "default": "\"md\"",
2279
+ "description": "Preset size token (`xs…xl`) or CSS size (e.g., `\"15px\"`, `\"1rem\"`). Default: `\"md\"`.",
2280
+ "fieldName": "size"
2281
+ },
2282
+ {
2283
+ "name": "radius",
2284
+ "type": {
2285
+ "text": "string"
2286
+ },
2287
+ "default": "\"md\"",
2288
+ "description": "Preset radius token (`none…full`) or CSS radius (e.g., `\"12px\"`). Default: `\"md\"`.",
2289
+ "fieldName": "radius"
2290
+ },
2291
+ {
2292
+ "name": "label",
2293
+ "type": {
2294
+ "text": "string"
2295
+ },
2296
+ "default": "\"Button\"",
2297
+ "description": "Text label for the button. Ignored if default slot is used. Default: `\"Button\"`.",
2298
+ "fieldName": "label"
2299
+ },
2300
+ {
2301
+ "name": "disabled",
2347
2302
  "type": {
2348
2303
  "text": "boolean"
2349
2304
  },
2350
2305
  "default": "false",
2351
- "description": "Enables interactive behavior with keyboard/click activation.",
2352
- "fieldName": "interactive"
2306
+ "description": "Whether the button is disabled. Default: `false`.",
2307
+ "fieldName": "disabled"
2353
2308
  },
2354
2309
  {
2355
- "name": "shadow",
2310
+ "name": "loading",
2356
2311
  "type": {
2357
2312
  "text": "boolean"
2358
2313
  },
2359
2314
  "default": "false",
2360
- "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
2361
- "fieldName": "shadow"
2315
+ "description": "Shows a loading overlay when true. Default: `false`.",
2316
+ "fieldName": "loading"
2317
+ },
2318
+ {
2319
+ "name": "iconL",
2320
+ "type": {
2321
+ "text": "string"
2322
+ },
2323
+ "default": "\"\"",
2324
+ "description": "Optional left-side icon (Iconify name). Default: `\"\"`.",
2325
+ "fieldName": "iconL"
2326
+ },
2327
+ {
2328
+ "name": "iconR",
2329
+ "type": {
2330
+ "text": "string"
2331
+ },
2332
+ "default": "\"\"",
2333
+ "description": "Optional right-side icon (Iconify name). Default: `\"\"`.",
2334
+ "fieldName": "iconR"
2335
+ },
2336
+ {
2337
+ "name": "iconOnly",
2338
+ "type": {
2339
+ "text": "boolean"
2340
+ },
2341
+ "default": "false",
2342
+ "description": "Square padding for icon-only buttons; hides label text. Default: `false`.",
2343
+ "fieldName": "iconOnly"
2344
+ },
2345
+ {
2346
+ "name": "colors",
2347
+ "type": {
2348
+ "text": "string"
2349
+ },
2350
+ "default": "\"\"",
2351
+ "description": "Comma-separated color stops for gradient variant. Default: `\"\"`.",
2352
+ "fieldName": "colors"
2353
+ },
2354
+ {
2355
+ "name": "animation",
2356
+ "type": {
2357
+ "text": "SkyButtonAnimation"
2358
+ },
2359
+ "default": "\"auto\"",
2360
+ "description": "Transform animation style. Default: `\"auto\"`.",
2361
+ "fieldName": "animation"
2362
2362
  },
2363
2363
  {
2364
2364
  "name": "preset",
@@ -2374,26 +2374,26 @@
2374
2374
  "name": "LitElement",
2375
2375
  "package": "lit"
2376
2376
  },
2377
- "tagName": "sky-avatar",
2377
+ "tagName": "sky-button",
2378
2378
  "customElement": true,
2379
- "summary": "Avatar that renders image content or fallback slot content with configurable size, radius, outline, and loading state."
2379
+ "summary": "Styled button supporting variants, icons, loading state, ripple feedback, and form-associated behavior."
2380
2380
  }
2381
2381
  ],
2382
2382
  "exports": [
2383
2383
  {
2384
2384
  "kind": "js",
2385
- "name": "SkyAvatar",
2385
+ "name": "SkyButton",
2386
2386
  "declaration": {
2387
- "name": "SkyAvatar",
2388
- "module": "src/sky-avatar/sky-avatar.ts"
2387
+ "name": "SkyButton",
2388
+ "module": "src/sky-button/sky-button.ts"
2389
2389
  }
2390
2390
  },
2391
2391
  {
2392
2392
  "kind": "custom-element-definition",
2393
- "name": "sky-avatar",
2393
+ "name": "sky-button",
2394
2394
  "declaration": {
2395
- "name": "SkyAvatar",
2396
- "module": "src/sky-avatar/sky-avatar.ts"
2395
+ "name": "SkyButton",
2396
+ "module": "src/sky-button/sky-button.ts"
2397
2397
  }
2398
2398
  }
2399
2399
  ]
@@ -9222,216 +9222,289 @@
9222
9222
  },
9223
9223
  {
9224
9224
  "kind": "javascript-module",
9225
- "path": "src/sky-image/sky-image.ts",
9225
+ "path": "src/sky-icon/sky-icon.ts",
9226
9226
  "declarations": [
9227
9227
  {
9228
9228
  "kind": "class",
9229
9229
  "description": "",
9230
- "name": "SkyImage",
9230
+ "name": "SkyIcon",
9231
9231
  "cssParts": [
9232
9232
  {
9233
- "description": "The underlying `<img>` element.",
9234
- "name": "img"
9233
+ "description": "The icon container element.",
9234
+ "name": "icon"
9235
+ },
9236
+ {
9237
+ "description": "The rendered SVG element.",
9238
+ "name": "svg"
9235
9239
  }
9236
9240
  ],
9237
9241
  "slots": [
9238
9242
  {
9239
- "description": "No slots are exposed; image content is rendered internally.",
9243
+ "description": "Optional fallback `<svg>` content when remote icon data is unavailable.",
9240
9244
  "name": ""
9241
9245
  }
9242
9246
  ],
9243
9247
  "members": [
9244
9248
  {
9245
9249
  "kind": "field",
9246
- "name": "src",
9247
- "type": {
9248
- "text": "string"
9249
- },
9250
- "default": "\"\"",
9251
- "description": "Primary image source URL.",
9252
- "attribute": "src"
9253
- },
9254
- {
9255
- "kind": "field",
9256
- "name": "alt",
9257
- "type": {
9258
- "text": "string"
9259
- },
9260
- "default": "\"Image\"",
9261
- "description": "Alternative text for accessibility.",
9262
- "attribute": "alt"
9250
+ "name": "_iconCache",
9251
+ "privacy": "private",
9252
+ "static": true,
9253
+ "default": "new Map<string, string>()",
9254
+ "description": "Cache: icon name -> final SVG string (bounded by MAX_ICON_CACHE_SIZE, LRU eviction)."
9263
9255
  },
9264
9256
  {
9265
9257
  "kind": "field",
9266
- "name": "width",
9267
- "type": {
9268
- "text": "string"
9269
- },
9270
- "default": "\"auto\"",
9271
- "description": "CSS width for the rendered image.",
9272
- "attribute": "width"
9258
+ "name": "_iconPromiseCache",
9259
+ "privacy": "private",
9260
+ "static": true,
9261
+ "default": "new Map<string, Promise<string>>()",
9262
+ "description": "Cache for in-flight fetches: icon name -> Promise<svg>"
9273
9263
  },
9274
9264
  {
9275
9265
  "kind": "field",
9276
- "name": "height",
9277
- "type": {
9278
- "text": "string"
9279
- },
9280
- "default": "\"auto\"",
9281
- "description": "CSS height for the rendered image.",
9282
- "attribute": "height"
9266
+ "name": "_localSets",
9267
+ "privacy": "private",
9268
+ "static": true,
9269
+ "default": "new Map<string, IconifySetData>()",
9270
+ "description": "Local icon sets (prefix -> Iconify set data) for offline/custom icons"
9283
9271
  },
9284
9272
  {
9285
9273
  "kind": "field",
9286
- "name": "aspectRatio",
9287
- "type": {
9288
- "text": "string | null"
9289
- },
9290
- "default": "null",
9291
- "description": "CSS `aspect-ratio` value.",
9292
- "attribute": "aspectRatio"
9274
+ "name": "_localIcons",
9275
+ "privacy": "private",
9276
+ "static": true,
9277
+ "default": "new Map<string, IconifyIcon>()",
9278
+ "description": "Single local icons (full name -> icon data)"
9293
9279
  },
9294
9280
  {
9295
- "kind": "field",
9296
- "name": "borderRadius",
9297
- "type": {
9298
- "text": "string"
9281
+ "kind": "method",
9282
+ "name": "registerLocalSet",
9283
+ "static": true,
9284
+ "return": {
9285
+ "type": {
9286
+ "text": "void"
9287
+ }
9299
9288
  },
9300
- "default": "\"0\"",
9301
- "description": "CSS border radius.",
9302
- "attribute": "borderRadius"
9303
- },
9304
- {
9305
- "kind": "field",
9306
- "name": "boxShadow",
9307
- "type": {
9308
- "text": "string"
9289
+ "parameters": [
9290
+ {
9291
+ "name": "prefix",
9292
+ "type": {
9293
+ "text": "string"
9294
+ },
9295
+ "description": "Set prefix (e.g. \"ion\", \"custom\"); use as icon=\"prefix:iconName\"."
9296
+ },
9297
+ {
9298
+ "name": "data",
9299
+ "type": {
9300
+ "text": "IconifySetData"
9301
+ },
9302
+ "description": "Set data with `icons` and optional defaults (width, height, left, top)."
9303
+ }
9304
+ ],
9305
+ "description": "Register a local icon set (Iconify-compatible JSON) for offline or custom icons."
9306
+ },
9307
+ {
9308
+ "kind": "method",
9309
+ "name": "registerLocalIcon",
9310
+ "static": true,
9311
+ "return": {
9312
+ "type": {
9313
+ "text": "void"
9314
+ }
9309
9315
  },
9310
- "default": "\"none\"",
9311
- "description": "CSS box shadow.",
9312
- "attribute": "boxShadow"
9316
+ "parameters": [
9317
+ {
9318
+ "name": "fullName",
9319
+ "type": {
9320
+ "text": "string"
9321
+ },
9322
+ "description": "Full icon name, e.g. \"ion:heart\"."
9323
+ },
9324
+ {
9325
+ "name": "icon",
9326
+ "type": {
9327
+ "text": "IconifyIcon"
9328
+ },
9329
+ "description": "Icon data (body, width, height, viewBox, etc.)."
9330
+ }
9331
+ ],
9332
+ "description": "Register a single local icon (one-off custom icon without a full set)."
9313
9333
  },
9314
9334
  {
9315
9335
  "kind": "field",
9316
- "name": "objectFit",
9336
+ "name": "preset",
9317
9337
  "type": {
9318
9338
  "text": "string"
9319
9339
  },
9320
- "default": "\"cover\"",
9321
- "description": "CSS object-fit value.",
9322
- "attribute": "objectFit"
9340
+ "default": "\"\"",
9341
+ "description": "Named prop preset from nearest `sky-config-provider`.",
9342
+ "attribute": "preset",
9343
+ "reflects": true
9323
9344
  },
9324
9345
  {
9325
9346
  "kind": "field",
9326
- "name": "objectPosition",
9347
+ "name": "_presets",
9348
+ "privacy": "private",
9349
+ "default": "new PresetController(this)"
9350
+ },
9351
+ {
9352
+ "kind": "field",
9353
+ "name": "icon",
9327
9354
  "type": {
9328
9355
  "text": "string"
9329
9356
  },
9330
- "default": "\"center\"",
9331
- "description": "CSS object-position value.",
9332
- "attribute": "objectPosition"
9357
+ "default": "''",
9358
+ "description": "Icon name in `prefix:icon-name` format.",
9359
+ "attribute": "icon"
9333
9360
  },
9334
9361
  {
9335
9362
  "kind": "field",
9336
- "name": "srcset",
9363
+ "name": "width",
9337
9364
  "type": {
9338
- "text": "string"
9365
+ "text": "SkyIconSizeValue"
9339
9366
  },
9340
- "default": "\"\"",
9341
- "description": "Responsive source set string.",
9342
- "attribute": "srcset"
9367
+ "default": "''",
9368
+ "description": "Icon width value.",
9369
+ "attribute": "width"
9343
9370
  },
9344
9371
  {
9345
9372
  "kind": "field",
9346
- "name": "sizes",
9373
+ "name": "height",
9374
+ "type": {
9375
+ "text": "SkyIconSizeValue"
9376
+ },
9377
+ "default": "''",
9378
+ "description": "Icon height value.",
9379
+ "attribute": "height"
9380
+ },
9381
+ {
9382
+ "kind": "field",
9383
+ "name": "color",
9347
9384
  "type": {
9348
9385
  "text": "string"
9349
9386
  },
9350
- "default": "\"\"",
9351
- "description": "Responsive sizes string.",
9352
- "attribute": "sizes"
9387
+ "default": "'currentColor'",
9388
+ "description": "Icon color value.",
9389
+ "attribute": "color"
9353
9390
  },
9354
9391
  {
9355
9392
  "kind": "field",
9356
- "name": "autoSizes",
9393
+ "name": "inline",
9357
9394
  "type": {
9358
9395
  "text": "boolean"
9359
9396
  },
9360
9397
  "default": "false",
9361
- "description": "Computes `sizes` from host width when true.",
9362
- "attribute": "autoSizes"
9398
+ "description": "Applies inline alignment behavior for text contexts.",
9399
+ "attribute": "inline"
9363
9400
  },
9364
9401
  {
9365
9402
  "kind": "field",
9366
- "name": "_computedSizes",
9403
+ "name": "flip",
9367
9404
  "type": {
9368
- "text": "string"
9405
+ "text": "SkyIconFlip"
9369
9406
  },
9370
- "privacy": "private",
9371
- "default": "\"\""
9407
+ "default": "''",
9408
+ "description": "Flip transform descriptor.",
9409
+ "attribute": "flip"
9372
9410
  },
9373
9411
  {
9374
9412
  "kind": "field",
9375
- "name": "loading",
9413
+ "name": "hFlip",
9376
9414
  "type": {
9377
- "text": "SkyImageLoading"
9415
+ "text": "boolean"
9378
9416
  },
9379
- "default": "\"lazy\"",
9380
- "description": "Native loading hint.",
9381
- "attribute": "loading"
9417
+ "default": "false",
9418
+ "description": "Horizontal flip shortcut.",
9419
+ "attribute": "hFlip"
9382
9420
  },
9383
9421
  {
9384
9422
  "kind": "field",
9385
- "name": "decoding",
9423
+ "name": "vFlip",
9386
9424
  "type": {
9387
- "text": "SkyImageDecoding"
9425
+ "text": "boolean"
9388
9426
  },
9389
- "default": "\"async\"",
9390
- "description": "Native decoding hint.",
9391
- "attribute": "decoding"
9427
+ "default": "false",
9428
+ "description": "Vertical flip shortcut.",
9429
+ "attribute": "vFlip"
9392
9430
  },
9393
9431
  {
9394
9432
  "kind": "field",
9395
- "name": "preset",
9433
+ "name": "rotate",
9396
9434
  "type": {
9397
- "text": "string"
9435
+ "text": "SkyIconRotateValue"
9398
9436
  },
9399
- "default": "\"\"",
9400
- "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
9401
- "attribute": "preset",
9402
- "reflects": true
9437
+ "default": "0",
9438
+ "description": "Rotation descriptor.",
9439
+ "attribute": "rotate"
9403
9440
  },
9404
9441
  {
9405
9442
  "kind": "field",
9406
- "name": "_presets",
9443
+ "name": "lazy",
9444
+ "type": {
9445
+ "text": "boolean"
9446
+ },
9447
+ "default": "false",
9448
+ "description": "Defers loading until the icon is visible.",
9449
+ "attribute": "lazy"
9450
+ },
9451
+ {
9452
+ "kind": "field",
9453
+ "name": "_svgContent",
9454
+ "type": {
9455
+ "text": "string | null"
9456
+ },
9407
9457
  "privacy": "private",
9408
- "default": "new PresetController(this)"
9458
+ "default": "null"
9409
9459
  },
9410
9460
  {
9411
9461
  "kind": "field",
9412
- "name": "_ro",
9462
+ "name": "_hasSlottedSvg",
9413
9463
  "type": {
9414
- "text": "ResizeObserver | undefined"
9464
+ "text": "boolean"
9415
9465
  },
9416
- "privacy": "private"
9466
+ "privacy": "private",
9467
+ "default": "false"
9417
9468
  },
9418
9469
  {
9419
9470
  "kind": "field",
9420
- "name": "_sizesRafId",
9471
+ "name": "_observer",
9421
9472
  "type": {
9422
- "text": "number | null"
9473
+ "text": "IntersectionObserver | null"
9423
9474
  },
9424
9475
  "privacy": "private",
9425
9476
  "default": "null"
9426
9477
  },
9427
9478
  {
9428
9479
  "kind": "field",
9429
- "name": "_updateSizes",
9430
- "privacy": "private"
9480
+ "name": "_visible",
9481
+ "type": {
9482
+ "text": "boolean"
9483
+ },
9484
+ "privacy": "private",
9485
+ "default": "false"
9431
9486
  },
9432
9487
  {
9433
9488
  "kind": "method",
9434
- "name": "_ensureAutoSizesObserver",
9489
+ "name": "_onSlotChange",
9490
+ "privacy": "private",
9491
+ "return": {
9492
+ "type": {
9493
+ "text": "void"
9494
+ }
9495
+ },
9496
+ "parameters": [
9497
+ {
9498
+ "name": "e",
9499
+ "type": {
9500
+ "text": "Event"
9501
+ }
9502
+ }
9503
+ ]
9504
+ },
9505
+ {
9506
+ "kind": "method",
9507
+ "name": "_startObserver",
9435
9508
  "privacy": "private",
9436
9509
  "return": {
9437
9510
  "type": {
@@ -9441,545 +9514,492 @@
9441
9514
  },
9442
9515
  {
9443
9516
  "kind": "method",
9444
- "name": "_shouldResyncImageSource",
9517
+ "name": "_stopObserver",
9445
9518
  "privacy": "private",
9446
9519
  "return": {
9447
9520
  "type": {
9448
- "text": "boolean"
9521
+ "text": "void"
9522
+ }
9523
+ }
9524
+ },
9525
+ {
9526
+ "kind": "method",
9527
+ "name": "_setSvgContent",
9528
+ "privacy": "private",
9529
+ "return": {
9530
+ "type": {
9531
+ "text": "void"
9449
9532
  }
9450
9533
  },
9451
9534
  "parameters": [
9452
9535
  {
9453
- "name": "changed",
9536
+ "name": "svg",
9454
9537
  "type": {
9455
- "text": "PropertyValues<this>"
9538
+ "text": "string | null"
9456
9539
  }
9457
9540
  }
9458
- ],
9459
- "description": "Browsers keep the resolved resource when only srcset/sizes attrs change on a live <img>."
9541
+ ]
9460
9542
  },
9461
9543
  {
9462
9544
  "kind": "method",
9463
- "name": "_resolvedSizesAttr",
9545
+ "name": "_loadIcon",
9464
9546
  "privacy": "private",
9465
9547
  "return": {
9466
9548
  "type": {
9467
- "text": "string"
9549
+ "text": "Promise<void>"
9468
9550
  }
9469
9551
  }
9470
9552
  },
9471
9553
  {
9472
9554
  "kind": "method",
9473
- "name": "_displaySrc",
9555
+ "name": "_fetchAndBuild",
9474
9556
  "privacy": "private",
9475
9557
  "return": {
9476
9558
  "type": {
9477
- "text": "string"
9559
+ "text": "Promise<string>"
9478
9560
  }
9479
9561
  },
9480
- "description": "`src` used on <img> — must stay in sync with `srcset` when the set changes."
9562
+ "parameters": [
9563
+ {
9564
+ "name": "full",
9565
+ "type": {
9566
+ "text": "string"
9567
+ }
9568
+ }
9569
+ ]
9481
9570
  },
9482
9571
  {
9483
9572
  "kind": "method",
9484
- "name": "_applyImgAttrs",
9573
+ "name": "_buildSvg",
9485
9574
  "privacy": "private",
9486
9575
  "return": {
9487
9576
  "type": {
9488
- "text": "void"
9577
+ "text": "string"
9489
9578
  }
9490
9579
  },
9491
9580
  "parameters": [
9492
9581
  {
9493
- "name": "img",
9582
+ "name": "icon",
9494
9583
  "type": {
9495
- "text": "HTMLImageElement"
9584
+ "text": "IconifyIcon"
9496
9585
  }
9497
9586
  },
9498
9587
  {
9499
- "name": "srcsetChanged",
9588
+ "name": "set",
9500
9589
  "type": {
9501
- "text": "boolean"
9590
+ "text": "IconifyCollection"
9502
9591
  }
9503
9592
  }
9504
9593
  ]
9505
9594
  },
9506
9595
  {
9507
9596
  "kind": "method",
9508
- "name": "_resyncImageSource",
9597
+ "name": "_normalize",
9509
9598
  "privacy": "private",
9510
9599
  "return": {
9511
9600
  "type": {
9512
- "text": "void"
9601
+ "text": "string"
9513
9602
  }
9514
9603
  },
9515
9604
  "parameters": [
9516
9605
  {
9517
- "name": "srcsetChanged",
9518
- "default": "false"
9519
- }
9606
+ "name": "v",
9607
+ "type": {
9608
+ "text": "string | number"
9609
+ }
9610
+ }
9520
9611
  ]
9521
- }
9522
- ],
9523
- "attributes": [
9524
- {
9525
- "name": "src",
9526
- "type": {
9527
- "text": "string"
9528
- },
9529
- "default": "\"\"",
9530
- "description": "Primary image source URL.",
9531
- "fieldName": "src"
9532
- },
9533
- {
9534
- "name": "alt",
9535
- "type": {
9536
- "text": "string"
9537
- },
9538
- "default": "\"Image\"",
9539
- "description": "Alternative text for accessibility.",
9540
- "fieldName": "alt"
9541
- },
9542
- {
9543
- "name": "width",
9544
- "type": {
9545
- "text": "string"
9546
- },
9547
- "default": "\"auto\"",
9548
- "description": "CSS width for the rendered image.",
9549
- "fieldName": "width"
9550
- },
9551
- {
9552
- "name": "height",
9553
- "type": {
9554
- "text": "string"
9555
- },
9556
- "default": "\"auto\"",
9557
- "description": "CSS height for the rendered image.",
9558
- "fieldName": "height"
9559
- },
9560
- {
9561
- "name": "aspectRatio",
9562
- "type": {
9563
- "text": "string | null"
9564
- },
9565
- "default": "null",
9566
- "description": "CSS `aspect-ratio` value.",
9567
- "fieldName": "aspectRatio"
9568
- },
9569
- {
9570
- "name": "borderRadius",
9571
- "type": {
9572
- "text": "string"
9573
- },
9574
- "default": "\"0\"",
9575
- "description": "CSS border radius.",
9576
- "fieldName": "borderRadius"
9577
- },
9578
- {
9579
- "name": "boxShadow",
9580
- "type": {
9581
- "text": "string"
9582
- },
9583
- "default": "\"none\"",
9584
- "description": "CSS box shadow.",
9585
- "fieldName": "boxShadow"
9586
- },
9587
- {
9588
- "name": "objectFit",
9589
- "type": {
9590
- "text": "string"
9591
- },
9592
- "default": "\"cover\"",
9593
- "description": "CSS object-fit value.",
9594
- "fieldName": "objectFit"
9595
- },
9596
- {
9597
- "name": "objectPosition",
9598
- "type": {
9599
- "text": "string"
9600
- },
9601
- "default": "\"center\"",
9602
- "description": "CSS object-position value.",
9603
- "fieldName": "objectPosition"
9604
- },
9605
- {
9606
- "name": "srcset",
9607
- "type": {
9608
- "text": "string"
9609
- },
9610
- "default": "\"\"",
9611
- "description": "Responsive source set string.",
9612
- "fieldName": "srcset"
9613
- },
9614
- {
9615
- "name": "sizes",
9616
- "type": {
9617
- "text": "string"
9618
- },
9619
- "default": "\"\"",
9620
- "description": "Responsive sizes string.",
9621
- "fieldName": "sizes"
9622
- },
9623
- {
9624
- "name": "autoSizes",
9625
- "type": {
9626
- "text": "boolean"
9627
- },
9628
- "default": "false",
9629
- "description": "Computes `sizes` from host width when true.",
9630
- "fieldName": "autoSizes"
9631
- },
9632
- {
9633
- "name": "loading",
9634
- "type": {
9635
- "text": "SkyImageLoading"
9636
- },
9637
- "default": "\"lazy\"",
9638
- "description": "Native loading hint.",
9639
- "fieldName": "loading"
9640
- },
9641
- {
9642
- "name": "decoding",
9643
- "type": {
9644
- "text": "SkyImageDecoding"
9645
- },
9646
- "default": "\"async\"",
9647
- "description": "Native decoding hint.",
9648
- "fieldName": "decoding"
9649
- },
9650
- {
9651
- "name": "preset",
9652
- "type": {
9653
- "text": "string"
9654
- },
9655
- "default": "\"\"",
9656
- "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
9657
- "fieldName": "preset"
9658
- }
9659
- ],
9660
- "superclass": {
9661
- "name": "LitElement",
9662
- "package": "lit"
9663
- },
9664
- "tagName": "sky-image",
9665
- "customElement": true,
9666
- "summary": "Responsive image component with style controls, `srcset`, and optional auto `sizes`."
9667
- }
9668
- ],
9669
- "exports": [
9670
- {
9671
- "kind": "js",
9672
- "name": "SkyImage",
9673
- "declaration": {
9674
- "name": "SkyImage",
9675
- "module": "src/sky-image/sky-image.ts"
9676
- }
9677
- },
9678
- {
9679
- "kind": "custom-element-definition",
9680
- "name": "sky-image",
9681
- "declaration": {
9682
- "name": "SkyImage",
9683
- "module": "src/sky-image/sky-image.ts"
9684
- }
9685
- }
9686
- ]
9687
- },
9688
- {
9689
- "kind": "javascript-module",
9690
- "path": "src/sky-icon/sky-icon.ts",
9691
- "declarations": [
9692
- {
9693
- "kind": "class",
9694
- "description": "",
9695
- "name": "SkyIcon",
9696
- "cssParts": [
9697
- {
9698
- "description": "The icon container element.",
9699
- "name": "icon"
9700
9612
  },
9701
9613
  {
9702
- "description": "The rendered SVG element.",
9703
- "name": "svg"
9704
- }
9705
- ],
9706
- "slots": [
9707
- {
9708
- "description": "Optional fallback `<svg>` content when remote icon data is unavailable.",
9709
- "name": ""
9710
- }
9711
- ],
9712
- "members": [
9713
- {
9714
- "kind": "field",
9715
- "name": "_iconCache",
9716
- "privacy": "private",
9717
- "static": true,
9718
- "default": "new Map<string, string>()",
9719
- "description": "Cache: icon name -> final SVG string (bounded by MAX_ICON_CACHE_SIZE, LRU eviction)."
9720
- },
9721
- {
9722
- "kind": "field",
9723
- "name": "_iconPromiseCache",
9724
- "privacy": "private",
9725
- "static": true,
9726
- "default": "new Map<string, Promise<string>>()",
9727
- "description": "Cache for in-flight fetches: icon name -> Promise<svg>"
9728
- },
9729
- {
9730
- "kind": "field",
9731
- "name": "_localSets",
9732
- "privacy": "private",
9733
- "static": true,
9734
- "default": "new Map<string, IconifySetData>()",
9735
- "description": "Local icon sets (prefix -> Iconify set data) for offline/custom icons"
9736
- },
9737
- {
9738
- "kind": "field",
9739
- "name": "_localIcons",
9614
+ "kind": "method",
9615
+ "name": "_rotationDeg",
9740
9616
  "privacy": "private",
9741
- "static": true,
9742
- "default": "new Map<string, IconifyIcon>()",
9743
- "description": "Single local icons (full name -> icon data)"
9617
+ "return": {
9618
+ "type": {
9619
+ "text": "number"
9620
+ }
9621
+ }
9744
9622
  },
9745
9623
  {
9746
9624
  "kind": "method",
9747
- "name": "registerLocalSet",
9748
- "static": true,
9625
+ "name": "_flipHas",
9626
+ "privacy": "private",
9749
9627
  "return": {
9750
9628
  "type": {
9751
- "text": "void"
9629
+ "text": "boolean"
9752
9630
  }
9753
9631
  },
9754
9632
  "parameters": [
9755
9633
  {
9756
- "name": "prefix",
9757
- "type": {
9758
- "text": "string"
9759
- },
9760
- "description": "Set prefix (e.g. \"ion\", \"custom\"); use as icon=\"prefix:iconName\"."
9761
- },
9762
- {
9763
- "name": "data",
9634
+ "name": "val",
9764
9635
  "type": {
9765
- "text": "IconifySetData"
9766
- },
9767
- "description": "Set data with `icons` and optional defaults (width, height, left, top)."
9636
+ "text": "'horizontal' | 'vertical'"
9637
+ }
9768
9638
  }
9769
- ],
9770
- "description": "Register a local icon set (Iconify-compatible JSON) for offline or custom icons."
9639
+ ]
9771
9640
  },
9772
9641
  {
9773
9642
  "kind": "method",
9774
- "name": "registerLocalIcon",
9775
- "static": true,
9643
+ "name": "_transform",
9644
+ "privacy": "private",
9776
9645
  "return": {
9777
9646
  "type": {
9778
- "text": "void"
9779
- }
9780
- },
9781
- "parameters": [
9782
- {
9783
- "name": "fullName",
9784
- "type": {
9785
- "text": "string"
9786
- },
9787
- "description": "Full icon name, e.g. \"ion:heart\"."
9788
- },
9789
- {
9790
- "name": "icon",
9791
- "type": {
9792
- "text": "IconifyIcon"
9793
- },
9794
- "description": "Icon data (body, width, height, viewBox, etc.)."
9647
+ "text": "string"
9795
9648
  }
9796
- ],
9797
- "description": "Register a single local icon (one-off custom icon without a full set)."
9649
+ }
9798
9650
  },
9799
9651
  {
9800
- "kind": "field",
9652
+ "kind": "method",
9653
+ "name": "_baseStyle",
9654
+ "privacy": "private",
9655
+ "return": {
9656
+ "type": {
9657
+ "text": "Record<string, string>"
9658
+ }
9659
+ }
9660
+ }
9661
+ ],
9662
+ "attributes": [
9663
+ {
9801
9664
  "name": "preset",
9802
9665
  "type": {
9803
9666
  "text": "string"
9804
9667
  },
9805
9668
  "default": "\"\"",
9806
9669
  "description": "Named prop preset from nearest `sky-config-provider`.",
9807
- "attribute": "preset",
9808
- "reflects": true
9809
- },
9810
- {
9811
- "kind": "field",
9812
- "name": "_presets",
9813
- "privacy": "private",
9814
- "default": "new PresetController(this)"
9670
+ "fieldName": "preset"
9815
9671
  },
9816
9672
  {
9817
- "kind": "field",
9818
9673
  "name": "icon",
9819
9674
  "type": {
9820
9675
  "text": "string"
9821
9676
  },
9822
9677
  "default": "''",
9823
9678
  "description": "Icon name in `prefix:icon-name` format.",
9824
- "attribute": "icon"
9679
+ "fieldName": "icon"
9825
9680
  },
9826
9681
  {
9827
- "kind": "field",
9828
9682
  "name": "width",
9829
9683
  "type": {
9830
9684
  "text": "SkyIconSizeValue"
9831
9685
  },
9832
9686
  "default": "''",
9833
9687
  "description": "Icon width value.",
9834
- "attribute": "width"
9688
+ "fieldName": "width"
9835
9689
  },
9836
9690
  {
9837
- "kind": "field",
9838
9691
  "name": "height",
9839
9692
  "type": {
9840
9693
  "text": "SkyIconSizeValue"
9841
9694
  },
9842
9695
  "default": "''",
9843
9696
  "description": "Icon height value.",
9844
- "attribute": "height"
9697
+ "fieldName": "height"
9845
9698
  },
9846
9699
  {
9847
- "kind": "field",
9848
9700
  "name": "color",
9849
9701
  "type": {
9850
9702
  "text": "string"
9851
9703
  },
9852
9704
  "default": "'currentColor'",
9853
9705
  "description": "Icon color value.",
9854
- "attribute": "color"
9706
+ "fieldName": "color"
9855
9707
  },
9856
9708
  {
9857
- "kind": "field",
9858
9709
  "name": "inline",
9859
9710
  "type": {
9860
9711
  "text": "boolean"
9861
9712
  },
9862
9713
  "default": "false",
9863
9714
  "description": "Applies inline alignment behavior for text contexts.",
9864
- "attribute": "inline"
9715
+ "fieldName": "inline"
9865
9716
  },
9866
9717
  {
9867
- "kind": "field",
9868
9718
  "name": "flip",
9869
9719
  "type": {
9870
9720
  "text": "SkyIconFlip"
9871
9721
  },
9872
9722
  "default": "''",
9873
9723
  "description": "Flip transform descriptor.",
9874
- "attribute": "flip"
9724
+ "fieldName": "flip"
9875
9725
  },
9876
9726
  {
9877
- "kind": "field",
9878
9727
  "name": "hFlip",
9879
9728
  "type": {
9880
9729
  "text": "boolean"
9881
9730
  },
9882
9731
  "default": "false",
9883
9732
  "description": "Horizontal flip shortcut.",
9884
- "attribute": "hFlip"
9733
+ "fieldName": "hFlip"
9885
9734
  },
9886
9735
  {
9887
- "kind": "field",
9888
9736
  "name": "vFlip",
9889
9737
  "type": {
9890
9738
  "text": "boolean"
9891
9739
  },
9892
9740
  "default": "false",
9893
9741
  "description": "Vertical flip shortcut.",
9894
- "attribute": "vFlip"
9742
+ "fieldName": "vFlip"
9895
9743
  },
9896
9744
  {
9897
- "kind": "field",
9898
9745
  "name": "rotate",
9899
9746
  "type": {
9900
9747
  "text": "SkyIconRotateValue"
9901
9748
  },
9902
9749
  "default": "0",
9903
9750
  "description": "Rotation descriptor.",
9904
- "attribute": "rotate"
9751
+ "fieldName": "rotate"
9905
9752
  },
9906
9753
  {
9907
- "kind": "field",
9908
9754
  "name": "lazy",
9909
9755
  "type": {
9910
9756
  "text": "boolean"
9911
9757
  },
9912
9758
  "default": "false",
9913
9759
  "description": "Defers loading until the icon is visible.",
9914
- "attribute": "lazy"
9760
+ "fieldName": "lazy"
9761
+ }
9762
+ ],
9763
+ "superclass": {
9764
+ "name": "LitElement",
9765
+ "package": "lit"
9766
+ },
9767
+ "tagName": "sky-icon",
9768
+ "customElement": true,
9769
+ "summary": "Icon renderer with Iconify fetch/caching, lazy loading, and optional slotted SVG fallback."
9770
+ }
9771
+ ],
9772
+ "exports": [
9773
+ {
9774
+ "kind": "js",
9775
+ "name": "SkyIcon",
9776
+ "declaration": {
9777
+ "name": "SkyIcon",
9778
+ "module": "src/sky-icon/sky-icon.ts"
9779
+ }
9780
+ },
9781
+ {
9782
+ "kind": "custom-element-definition",
9783
+ "name": "sky-icon",
9784
+ "declaration": {
9785
+ "name": "SkyIcon",
9786
+ "module": "src/sky-icon/sky-icon.ts"
9787
+ }
9788
+ }
9789
+ ]
9790
+ },
9791
+ {
9792
+ "kind": "javascript-module",
9793
+ "path": "src/sky-image/sky-image.ts",
9794
+ "declarations": [
9795
+ {
9796
+ "kind": "class",
9797
+ "description": "",
9798
+ "name": "SkyImage",
9799
+ "cssParts": [
9800
+ {
9801
+ "description": "The underlying `<img>` element.",
9802
+ "name": "img"
9803
+ }
9804
+ ],
9805
+ "slots": [
9806
+ {
9807
+ "description": "No slots are exposed; image content is rendered internally.",
9808
+ "name": ""
9809
+ }
9810
+ ],
9811
+ "members": [
9812
+ {
9813
+ "kind": "field",
9814
+ "name": "src",
9815
+ "type": {
9816
+ "text": "string"
9817
+ },
9818
+ "default": "\"\"",
9819
+ "description": "Primary image source URL.",
9820
+ "attribute": "src"
9915
9821
  },
9916
9822
  {
9917
9823
  "kind": "field",
9918
- "name": "_svgContent",
9824
+ "name": "alt",
9825
+ "type": {
9826
+ "text": "string"
9827
+ },
9828
+ "default": "\"Image\"",
9829
+ "description": "Alternative text for accessibility.",
9830
+ "attribute": "alt"
9831
+ },
9832
+ {
9833
+ "kind": "field",
9834
+ "name": "width",
9835
+ "type": {
9836
+ "text": "string"
9837
+ },
9838
+ "default": "\"auto\"",
9839
+ "description": "CSS width for the rendered image.",
9840
+ "attribute": "width"
9841
+ },
9842
+ {
9843
+ "kind": "field",
9844
+ "name": "height",
9845
+ "type": {
9846
+ "text": "string"
9847
+ },
9848
+ "default": "\"auto\"",
9849
+ "description": "CSS height for the rendered image.",
9850
+ "attribute": "height"
9851
+ },
9852
+ {
9853
+ "kind": "field",
9854
+ "name": "aspectRatio",
9919
9855
  "type": {
9920
9856
  "text": "string | null"
9921
9857
  },
9922
- "privacy": "private",
9923
- "default": "null"
9858
+ "default": "null",
9859
+ "description": "CSS `aspect-ratio` value.",
9860
+ "attribute": "aspectRatio"
9924
9861
  },
9925
9862
  {
9926
9863
  "kind": "field",
9927
- "name": "_hasSlottedSvg",
9864
+ "name": "borderRadius",
9928
9865
  "type": {
9929
- "text": "boolean"
9866
+ "text": "string"
9930
9867
  },
9931
- "privacy": "private",
9932
- "default": "false"
9868
+ "default": "\"0\"",
9869
+ "description": "CSS border radius.",
9870
+ "attribute": "borderRadius"
9933
9871
  },
9934
9872
  {
9935
9873
  "kind": "field",
9936
- "name": "_observer",
9874
+ "name": "boxShadow",
9937
9875
  "type": {
9938
- "text": "IntersectionObserver | null"
9876
+ "text": "string"
9939
9877
  },
9940
- "privacy": "private",
9941
- "default": "null"
9878
+ "default": "\"none\"",
9879
+ "description": "CSS box shadow.",
9880
+ "attribute": "boxShadow"
9942
9881
  },
9943
9882
  {
9944
9883
  "kind": "field",
9945
- "name": "_visible",
9884
+ "name": "objectFit",
9885
+ "type": {
9886
+ "text": "string"
9887
+ },
9888
+ "default": "\"cover\"",
9889
+ "description": "CSS object-fit value.",
9890
+ "attribute": "objectFit"
9891
+ },
9892
+ {
9893
+ "kind": "field",
9894
+ "name": "objectPosition",
9895
+ "type": {
9896
+ "text": "string"
9897
+ },
9898
+ "default": "\"center\"",
9899
+ "description": "CSS object-position value.",
9900
+ "attribute": "objectPosition"
9901
+ },
9902
+ {
9903
+ "kind": "field",
9904
+ "name": "srcset",
9905
+ "type": {
9906
+ "text": "string"
9907
+ },
9908
+ "default": "\"\"",
9909
+ "description": "Responsive source set string.",
9910
+ "attribute": "srcset"
9911
+ },
9912
+ {
9913
+ "kind": "field",
9914
+ "name": "sizes",
9915
+ "type": {
9916
+ "text": "string"
9917
+ },
9918
+ "default": "\"\"",
9919
+ "description": "Responsive sizes string.",
9920
+ "attribute": "sizes"
9921
+ },
9922
+ {
9923
+ "kind": "field",
9924
+ "name": "autoSizes",
9946
9925
  "type": {
9947
9926
  "text": "boolean"
9948
9927
  },
9928
+ "default": "false",
9929
+ "description": "Computes `sizes` from host width when true.",
9930
+ "attribute": "autoSizes"
9931
+ },
9932
+ {
9933
+ "kind": "field",
9934
+ "name": "_computedSizes",
9935
+ "type": {
9936
+ "text": "string"
9937
+ },
9949
9938
  "privacy": "private",
9950
- "default": "false"
9939
+ "default": "\"\""
9951
9940
  },
9952
9941
  {
9953
- "kind": "method",
9954
- "name": "_onSlotChange",
9942
+ "kind": "field",
9943
+ "name": "loading",
9944
+ "type": {
9945
+ "text": "SkyImageLoading"
9946
+ },
9947
+ "default": "\"lazy\"",
9948
+ "description": "Native loading hint.",
9949
+ "attribute": "loading"
9950
+ },
9951
+ {
9952
+ "kind": "field",
9953
+ "name": "decoding",
9954
+ "type": {
9955
+ "text": "SkyImageDecoding"
9956
+ },
9957
+ "default": "\"async\"",
9958
+ "description": "Native decoding hint.",
9959
+ "attribute": "decoding"
9960
+ },
9961
+ {
9962
+ "kind": "field",
9963
+ "name": "preset",
9964
+ "type": {
9965
+ "text": "string"
9966
+ },
9967
+ "default": "\"\"",
9968
+ "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
9969
+ "attribute": "preset",
9970
+ "reflects": true
9971
+ },
9972
+ {
9973
+ "kind": "field",
9974
+ "name": "_presets",
9955
9975
  "privacy": "private",
9956
- "return": {
9957
- "type": {
9958
- "text": "void"
9959
- }
9976
+ "default": "new PresetController(this)"
9977
+ },
9978
+ {
9979
+ "kind": "field",
9980
+ "name": "_ro",
9981
+ "type": {
9982
+ "text": "ResizeObserver | undefined"
9960
9983
  },
9961
- "parameters": [
9962
- {
9963
- "name": "e",
9964
- "type": {
9965
- "text": "Event"
9966
- }
9967
- }
9968
- ]
9984
+ "privacy": "private"
9985
+ },
9986
+ {
9987
+ "kind": "field",
9988
+ "name": "_sizesRafId",
9989
+ "type": {
9990
+ "text": "number | null"
9991
+ },
9992
+ "privacy": "private",
9993
+ "default": "null"
9969
9994
  },
9970
9995
  {
9971
- "kind": "method",
9972
- "name": "_startObserver",
9973
- "privacy": "private",
9974
- "return": {
9975
- "type": {
9976
- "text": "void"
9977
- }
9978
- }
9996
+ "kind": "field",
9997
+ "name": "_updateSizes",
9998
+ "privacy": "private"
9979
9999
  },
9980
10000
  {
9981
10001
  "kind": "method",
9982
- "name": "_stopObserver",
10002
+ "name": "_ensureAutoSizesObserver",
9983
10003
  "privacy": "private",
9984
10004
  "return": {
9985
10005
  "type": {
@@ -9989,266 +10009,246 @@
9989
10009
  },
9990
10010
  {
9991
10011
  "kind": "method",
9992
- "name": "_setSvgContent",
10012
+ "name": "_shouldResyncImageSource",
9993
10013
  "privacy": "private",
9994
10014
  "return": {
9995
10015
  "type": {
9996
- "text": "void"
10016
+ "text": "boolean"
9997
10017
  }
9998
10018
  },
9999
10019
  "parameters": [
10000
10020
  {
10001
- "name": "svg",
10021
+ "name": "changed",
10002
10022
  "type": {
10003
- "text": "string | null"
10023
+ "text": "PropertyValues<this>"
10004
10024
  }
10005
10025
  }
10006
- ]
10026
+ ],
10027
+ "description": "Browsers keep the resolved resource when only srcset/sizes attrs change on a live <img>."
10007
10028
  },
10008
10029
  {
10009
10030
  "kind": "method",
10010
- "name": "_loadIcon",
10031
+ "name": "_resolvedSizesAttr",
10011
10032
  "privacy": "private",
10012
10033
  "return": {
10013
10034
  "type": {
10014
- "text": "Promise<void>"
10035
+ "text": "string"
10015
10036
  }
10016
10037
  }
10017
10038
  },
10018
10039
  {
10019
10040
  "kind": "method",
10020
- "name": "_fetchAndBuild",
10041
+ "name": "_displaySrc",
10021
10042
  "privacy": "private",
10022
10043
  "return": {
10023
10044
  "type": {
10024
- "text": "Promise<string>"
10045
+ "text": "string"
10025
10046
  }
10026
10047
  },
10027
- "parameters": [
10028
- {
10029
- "name": "full",
10030
- "type": {
10031
- "text": "string"
10032
- }
10033
- }
10034
- ]
10048
+ "description": "`src` used on <img> — must stay in sync with `srcset` when the set changes."
10035
10049
  },
10036
10050
  {
10037
10051
  "kind": "method",
10038
- "name": "_buildSvg",
10052
+ "name": "_applyImgAttrs",
10039
10053
  "privacy": "private",
10040
10054
  "return": {
10041
10055
  "type": {
10042
- "text": "string"
10056
+ "text": "void"
10043
10057
  }
10044
10058
  },
10045
10059
  "parameters": [
10046
10060
  {
10047
- "name": "icon",
10061
+ "name": "img",
10048
10062
  "type": {
10049
- "text": "IconifyIcon"
10063
+ "text": "HTMLImageElement"
10050
10064
  }
10051
10065
  },
10052
10066
  {
10053
- "name": "set",
10054
- "type": {
10055
- "text": "IconifyCollection"
10056
- }
10057
- }
10058
- ]
10059
- },
10060
- {
10061
- "kind": "method",
10062
- "name": "_normalize",
10063
- "privacy": "private",
10064
- "return": {
10065
- "type": {
10066
- "text": "string"
10067
- }
10068
- },
10069
- "parameters": [
10070
- {
10071
- "name": "v",
10067
+ "name": "srcsetChanged",
10072
10068
  "type": {
10073
- "text": "string | number"
10069
+ "text": "boolean"
10074
10070
  }
10075
10071
  }
10076
10072
  ]
10077
10073
  },
10078
10074
  {
10079
10075
  "kind": "method",
10080
- "name": "_rotationDeg",
10081
- "privacy": "private",
10082
- "return": {
10083
- "type": {
10084
- "text": "number"
10085
- }
10086
- }
10087
- },
10088
- {
10089
- "kind": "method",
10090
- "name": "_flipHas",
10076
+ "name": "_resyncImageSource",
10091
10077
  "privacy": "private",
10092
10078
  "return": {
10093
10079
  "type": {
10094
- "text": "boolean"
10080
+ "text": "void"
10095
10081
  }
10096
10082
  },
10097
10083
  "parameters": [
10098
10084
  {
10099
- "name": "val",
10100
- "type": {
10101
- "text": "'horizontal' | 'vertical'"
10102
- }
10085
+ "name": "srcsetChanged",
10086
+ "default": "false"
10103
10087
  }
10104
10088
  ]
10105
- },
10106
- {
10107
- "kind": "method",
10108
- "name": "_transform",
10109
- "privacy": "private",
10110
- "return": {
10111
- "type": {
10112
- "text": "string"
10113
- }
10114
- }
10115
- },
10116
- {
10117
- "kind": "method",
10118
- "name": "_baseStyle",
10119
- "privacy": "private",
10120
- "return": {
10121
- "type": {
10122
- "text": "Record<string, string>"
10123
- }
10124
- }
10125
10089
  }
10126
10090
  ],
10127
10091
  "attributes": [
10128
10092
  {
10129
- "name": "preset",
10093
+ "name": "src",
10130
10094
  "type": {
10131
10095
  "text": "string"
10132
10096
  },
10133
10097
  "default": "\"\"",
10134
- "description": "Named prop preset from nearest `sky-config-provider`.",
10135
- "fieldName": "preset"
10098
+ "description": "Primary image source URL.",
10099
+ "fieldName": "src"
10136
10100
  },
10137
10101
  {
10138
- "name": "icon",
10102
+ "name": "alt",
10139
10103
  "type": {
10140
10104
  "text": "string"
10141
10105
  },
10142
- "default": "''",
10143
- "description": "Icon name in `prefix:icon-name` format.",
10144
- "fieldName": "icon"
10106
+ "default": "\"Image\"",
10107
+ "description": "Alternative text for accessibility.",
10108
+ "fieldName": "alt"
10145
10109
  },
10146
10110
  {
10147
10111
  "name": "width",
10148
10112
  "type": {
10149
- "text": "SkyIconSizeValue"
10113
+ "text": "string"
10150
10114
  },
10151
- "default": "''",
10152
- "description": "Icon width value.",
10115
+ "default": "\"auto\"",
10116
+ "description": "CSS width for the rendered image.",
10153
10117
  "fieldName": "width"
10154
10118
  },
10155
10119
  {
10156
10120
  "name": "height",
10157
10121
  "type": {
10158
- "text": "SkyIconSizeValue"
10122
+ "text": "string"
10159
10123
  },
10160
- "default": "''",
10161
- "description": "Icon height value.",
10124
+ "default": "\"auto\"",
10125
+ "description": "CSS height for the rendered image.",
10162
10126
  "fieldName": "height"
10163
10127
  },
10164
10128
  {
10165
- "name": "color",
10129
+ "name": "aspectRatio",
10130
+ "type": {
10131
+ "text": "string | null"
10132
+ },
10133
+ "default": "null",
10134
+ "description": "CSS `aspect-ratio` value.",
10135
+ "fieldName": "aspectRatio"
10136
+ },
10137
+ {
10138
+ "name": "borderRadius",
10166
10139
  "type": {
10167
10140
  "text": "string"
10168
10141
  },
10169
- "default": "'currentColor'",
10170
- "description": "Icon color value.",
10171
- "fieldName": "color"
10142
+ "default": "\"0\"",
10143
+ "description": "CSS border radius.",
10144
+ "fieldName": "borderRadius"
10172
10145
  },
10173
10146
  {
10174
- "name": "inline",
10147
+ "name": "boxShadow",
10175
10148
  "type": {
10176
- "text": "boolean"
10149
+ "text": "string"
10177
10150
  },
10178
- "default": "false",
10179
- "description": "Applies inline alignment behavior for text contexts.",
10180
- "fieldName": "inline"
10151
+ "default": "\"none\"",
10152
+ "description": "CSS box shadow.",
10153
+ "fieldName": "boxShadow"
10181
10154
  },
10182
10155
  {
10183
- "name": "flip",
10156
+ "name": "objectFit",
10184
10157
  "type": {
10185
- "text": "SkyIconFlip"
10158
+ "text": "string"
10186
10159
  },
10187
- "default": "''",
10188
- "description": "Flip transform descriptor.",
10189
- "fieldName": "flip"
10160
+ "default": "\"cover\"",
10161
+ "description": "CSS object-fit value.",
10162
+ "fieldName": "objectFit"
10190
10163
  },
10191
10164
  {
10192
- "name": "hFlip",
10165
+ "name": "objectPosition",
10193
10166
  "type": {
10194
- "text": "boolean"
10167
+ "text": "string"
10195
10168
  },
10196
- "default": "false",
10197
- "description": "Horizontal flip shortcut.",
10198
- "fieldName": "hFlip"
10169
+ "default": "\"center\"",
10170
+ "description": "CSS object-position value.",
10171
+ "fieldName": "objectPosition"
10199
10172
  },
10200
10173
  {
10201
- "name": "vFlip",
10174
+ "name": "srcset",
10202
10175
  "type": {
10203
- "text": "boolean"
10176
+ "text": "string"
10204
10177
  },
10205
- "default": "false",
10206
- "description": "Vertical flip shortcut.",
10207
- "fieldName": "vFlip"
10178
+ "default": "\"\"",
10179
+ "description": "Responsive source set string.",
10180
+ "fieldName": "srcset"
10208
10181
  },
10209
10182
  {
10210
- "name": "rotate",
10183
+ "name": "sizes",
10211
10184
  "type": {
10212
- "text": "SkyIconRotateValue"
10185
+ "text": "string"
10213
10186
  },
10214
- "default": "0",
10215
- "description": "Rotation descriptor.",
10216
- "fieldName": "rotate"
10187
+ "default": "\"\"",
10188
+ "description": "Responsive sizes string.",
10189
+ "fieldName": "sizes"
10217
10190
  },
10218
10191
  {
10219
- "name": "lazy",
10192
+ "name": "autoSizes",
10220
10193
  "type": {
10221
10194
  "text": "boolean"
10222
10195
  },
10223
10196
  "default": "false",
10224
- "description": "Defers loading until the icon is visible.",
10225
- "fieldName": "lazy"
10197
+ "description": "Computes `sizes` from host width when true.",
10198
+ "fieldName": "autoSizes"
10199
+ },
10200
+ {
10201
+ "name": "loading",
10202
+ "type": {
10203
+ "text": "SkyImageLoading"
10204
+ },
10205
+ "default": "\"lazy\"",
10206
+ "description": "Native loading hint.",
10207
+ "fieldName": "loading"
10208
+ },
10209
+ {
10210
+ "name": "decoding",
10211
+ "type": {
10212
+ "text": "SkyImageDecoding"
10213
+ },
10214
+ "default": "\"async\"",
10215
+ "description": "Native decoding hint.",
10216
+ "fieldName": "decoding"
10217
+ },
10218
+ {
10219
+ "name": "preset",
10220
+ "type": {
10221
+ "text": "string"
10222
+ },
10223
+ "default": "\"\"",
10224
+ "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
10225
+ "fieldName": "preset"
10226
10226
  }
10227
10227
  ],
10228
10228
  "superclass": {
10229
10229
  "name": "LitElement",
10230
10230
  "package": "lit"
10231
10231
  },
10232
- "tagName": "sky-icon",
10232
+ "tagName": "sky-image",
10233
10233
  "customElement": true,
10234
- "summary": "Icon renderer with Iconify fetch/caching, lazy loading, and optional slotted SVG fallback."
10234
+ "summary": "Responsive image component with style controls, `srcset`, and optional auto `sizes`."
10235
10235
  }
10236
10236
  ],
10237
10237
  "exports": [
10238
10238
  {
10239
10239
  "kind": "js",
10240
- "name": "SkyIcon",
10240
+ "name": "SkyImage",
10241
10241
  "declaration": {
10242
- "name": "SkyIcon",
10243
- "module": "src/sky-icon/sky-icon.ts"
10242
+ "name": "SkyImage",
10243
+ "module": "src/sky-image/sky-image.ts"
10244
10244
  }
10245
10245
  },
10246
10246
  {
10247
10247
  "kind": "custom-element-definition",
10248
- "name": "sky-icon",
10248
+ "name": "sky-image",
10249
10249
  "declaration": {
10250
- "name": "SkyIcon",
10251
- "module": "src/sky-icon/sky-icon.ts"
10250
+ "name": "SkyImage",
10251
+ "module": "src/sky-image/sky-image.ts"
10252
10252
  }
10253
10253
  }
10254
10254
  ]