@sky.ui/core 0.0.50 → 0.0.51

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/custom-elements.json +1743 -1743
  2. package/package.json +1 -1
@@ -4,58 +4,38 @@
4
4
  "modules": [
5
5
  {
6
6
  "kind": "javascript-module",
7
- "path": "src/sky-alert/sky-alert.ts",
7
+ "path": "src/sky-appbar/sky-appbar.ts",
8
8
  "declarations": [
9
9
  {
10
10
  "kind": "class",
11
11
  "description": "",
12
- "name": "SkyAlert",
12
+ "name": "SkyAppbar",
13
13
  "cssParts": [
14
14
  {
15
- "description": "The outer alert container.",
16
- "name": "alert"
17
- },
18
- {
19
- "description": "The optional leading icon.",
20
- "name": "icon"
21
- },
22
- {
23
- "description": "The content container (title + message/slot).",
15
+ "description": "Wrapper that contains the leading slot, title, and actions.",
24
16
  "name": "content"
25
17
  },
26
18
  {
27
- "description": "The title text element.",
28
- "name": "title"
19
+ "description": "Container for the leading slot (e.g. menu button).",
20
+ "name": "leading"
29
21
  },
30
22
  {
31
- "description": "The message text element (when `message` is provided).",
32
- "name": "message"
23
+ "description": "The title area (contains .title-text with the title string).",
24
+ "name": "title"
33
25
  },
34
26
  {
35
27
  "description": "The trailing actions container.",
36
28
  "name": "actions"
37
- },
38
- {
39
- "description": "The dismiss button (when `removable`).",
40
- "name": "close-button"
41
- },
42
- {
43
- "description": "Overlay shown when `loading` is true.",
44
- "name": "loading-overlay"
45
- },
46
- {
47
- "description": "Spinner element shown inside the loading overlay.",
48
- "name": "loading-spinner"
49
29
  }
50
30
  ],
51
31
  "slots": [
52
32
  {
53
- "description": "Custom message content (used when `message` is empty).",
54
- "name": ""
33
+ "description": "Leading area (e.g., menu/back button). Defaults to a hamburger icon.",
34
+ "name": "button"
55
35
  },
56
36
  {
57
- "description": "Action buttons or links displayed on the trailing side.",
58
- "name": "actions"
37
+ "description": "Trailing actions (icons/buttons). This is the default slot.",
38
+ "name": ""
59
39
  }
60
40
  ],
61
41
  "members": [
@@ -74,152 +54,69 @@
74
54
  "type": {
75
55
  "text": "string"
76
56
  },
77
- "default": "\"\"",
78
- "description": "Title text shown above the message.",
57
+ "default": "\"App Bar\"",
58
+ "description": "Title text displayed in the app bar.",
79
59
  "attribute": "title"
80
60
  },
81
- {
82
- "kind": "field",
83
- "name": "message",
84
- "type": {
85
- "text": "string"
86
- },
87
- "default": "\"\"",
88
- "description": "Message text rendered inside the alert.",
89
- "attribute": "message"
90
- },
91
- {
92
- "kind": "field",
93
- "name": "removable",
94
- "type": {
95
- "text": "boolean"
96
- },
97
- "default": "false",
98
- "description": "Shows a dismiss button when enabled.",
99
- "attribute": "removable"
100
- },
101
61
  {
102
62
  "kind": "field",
103
63
  "name": "color",
104
64
  "type": {
105
65
  "text": "string"
106
66
  },
107
- "default": "\"primary\"",
108
- "description": "Base color token or CSS color used by the alert.",
67
+ "default": "\"default\"",
68
+ "description": "Semantic token or CSS color for bar background; foreground color is derived for contrast.",
109
69
  "attribute": "color"
110
70
  },
111
71
  {
112
72
  "kind": "field",
113
- "name": "size",
114
- "type": {
115
- "text": "string"
116
- },
117
- "default": "\"md\"",
118
- "description": "Preset size token (`xs | sm | md | lg | xl`) or CSS length.",
119
- "attribute": "size"
120
- },
121
- {
122
- "kind": "field",
123
- "name": "radius",
124
- "type": {
125
- "text": "string"
126
- },
127
- "default": "\"md\"",
128
- "description": "Radius token or CSS length.",
129
- "attribute": "radius"
130
- },
131
- {
132
- "kind": "field",
133
- "name": "icon",
134
- "type": {
135
- "text": "string | null"
136
- },
137
- "default": "null",
138
- "description": "Optional leading icon name for `<sky-icon>`.",
139
- "attribute": "icon"
140
- },
141
- {
142
- "kind": "field",
143
- "name": "strip",
144
- "type": {
145
- "text": "SkyAlertStrip"
146
- },
147
- "default": "\"none\"",
148
- "description": "Strip accent placement.",
149
- "attribute": "strip",
150
- "reflects": true
151
- },
152
- {
153
- "kind": "field",
154
- "name": "stripColor",
73
+ "name": "url",
155
74
  "type": {
156
75
  "text": "string"
157
76
  },
158
- "default": "\"currentColor\"",
159
- "description": "Strip accent color token or CSS color.",
160
- "attribute": "stripColor"
77
+ "default": "\"\"",
78
+ "description": "Background image URL.",
79
+ "attribute": "url"
161
80
  },
162
81
  {
163
82
  "kind": "field",
164
- "name": "variant",
83
+ "name": "banner",
165
84
  "type": {
166
- "text": "SkyAlertVariant"
85
+ "text": "boolean"
167
86
  },
168
- "default": "\"solid\"",
169
- "description": "Visual style variant.",
170
- "attribute": "variant",
171
- "reflects": true
87
+ "default": "true",
88
+ "description": "Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.",
89
+ "attribute": "banner"
172
90
  },
173
91
  {
174
92
  "kind": "field",
175
- "name": "loading",
93
+ "name": "dense",
176
94
  "type": {
177
95
  "text": "boolean"
178
96
  },
179
97
  "default": "false",
180
- "description": "Shows a loading overlay.",
181
- "attribute": "loading"
182
- },
183
- {
184
- "kind": "field",
185
- "name": "roleType",
186
- "type": {
187
- "text": "SkyAlertRoleType"
188
- },
189
- "default": "\"alert\"",
190
- "description": "ARIA role for the alert container.",
191
- "attribute": "roleType",
192
- "reflects": true
193
- },
194
- {
195
- "kind": "field",
196
- "name": "_styleVars",
197
- "type": {
198
- "text": "Record<string, string>"
199
- },
200
- "privacy": "private",
201
- "default": "{}",
202
- "description": "Internal style variables"
98
+ "description": "Enables compact vertical spacing.",
99
+ "attribute": "dense"
203
100
  },
204
101
  {
205
102
  "kind": "field",
206
- "name": "_sizeCache",
103
+ "name": "elevated",
207
104
  "type": {
208
- "text": "{ size: string; result: SkyAlertResolvedSize } | null"
105
+ "text": "boolean"
209
106
  },
210
- "privacy": "private",
211
- "default": "null",
212
- "description": "Cached result of _resolveSize for the last `size` value (avoids recomputing when only color/variant change)."
107
+ "default": "false",
108
+ "description": "Applies elevated shadow styling.",
109
+ "attribute": "elevated"
213
110
  },
214
111
  {
215
112
  "kind": "field",
216
- "name": "_hasActionsSlotContent",
113
+ "name": "leadingLabel",
217
114
  "type": {
218
- "text": "boolean"
115
+ "text": "string"
219
116
  },
220
- "privacy": "private",
221
- "default": "false",
222
- "description": "True when the actions slot has assigned content (used to show separator only when needed)."
117
+ "default": "\"Open menu\"",
118
+ "description": "Accessible label for default leading button fallback.",
119
+ "attribute": "leadingLabel"
223
120
  },
224
121
  {
225
122
  "kind": "field",
@@ -240,213 +137,90 @@
240
137
  },
241
138
  {
242
139
  "kind": "method",
243
- "name": "_resolveSize",
140
+ "name": "_applyColorSurface",
244
141
  "privacy": "private",
245
142
  "return": {
246
143
  "type": {
247
- "text": "SkyAlertResolvedSize"
248
- }
249
- },
250
- "parameters": [
251
- {
252
- "name": "input",
253
- "type": {
254
- "text": "string"
255
- }
144
+ "text": "void"
256
145
  }
257
- ],
258
- "description": "Resolves size to get padding, font sizes, and other metrics.\r\nResult is memoized by `size` to avoid recomputing when only color/variant/radius change."
259
- },
260
- {
261
- "kind": "field",
262
- "name": "_lastPresetRevision",
263
- "type": {
264
- "text": "number"
265
146
  },
266
- "privacy": "private",
267
- "default": "-1"
147
+ "description": "Applies glass vs solid surface tokens from `color`."
268
148
  },
269
149
  {
270
150
  "kind": "method",
271
- "name": "_updateStyleVars",
151
+ "name": "_applyBackgroundImage",
272
152
  "privacy": "private",
273
153
  "return": {
274
154
  "type": {
275
155
  "text": "void"
276
156
  }
277
157
  },
278
- "description": "Computes CSS custom properties from current variant, size, and color inputs."
279
- },
158
+ "description": "Sets background image CSS variable from `url`."
159
+ }
160
+ ],
161
+ "attributes": [
280
162
  {
281
- "kind": "method",
282
- "name": "close",
283
- "privacy": "public",
284
- "return": {
285
- "type": {
286
- "text": "void"
287
- }
163
+ "name": "title",
164
+ "type": {
165
+ "text": "string"
288
166
  },
289
- "description": "Dispatches `alert-closed` and removes the alert from the DOM."
167
+ "default": "\"App Bar\"",
168
+ "description": "Title text displayed in the app bar.",
169
+ "fieldName": "title"
290
170
  },
291
171
  {
292
- "kind": "method",
293
- "name": "getAriaRole",
294
- "privacy": "private",
295
- "return": {
296
- "type": {
297
- "text": "SkyAlertRoleType"
298
- }
172
+ "name": "color",
173
+ "type": {
174
+ "text": "string"
299
175
  },
300
- "description": "Returns the ARIA role applied to the alert container."
176
+ "default": "\"default\"",
177
+ "description": "Semantic token or CSS color for bar background; foreground color is derived for contrast.",
178
+ "fieldName": "color"
301
179
  },
302
180
  {
303
- "kind": "method",
304
- "name": "_checkActionsSlot",
305
- "privacy": "private",
306
- "return": {
307
- "type": {
308
- "text": "void"
309
- }
181
+ "name": "url",
182
+ "type": {
183
+ "text": "string"
310
184
  },
311
- "description": "Checks whether the actions slot currently has meaningful assigned content."
185
+ "default": "\"\"",
186
+ "description": "Background image URL.",
187
+ "fieldName": "url"
312
188
  },
313
189
  {
314
- "kind": "method",
315
- "name": "_onActionsSlotChange",
316
- "privacy": "private",
317
- "return": {
318
- "type": {
319
- "text": "void"
320
- }
321
- },
322
- "parameters": [
323
- {
324
- "name": "e",
325
- "type": {
326
- "text": "Event"
327
- }
328
- }
329
- ],
330
- "description": "Updates action-slot state when the slot assignment changes."
331
- }
332
- ],
333
- "events": [
334
- {
335
- "type": {
336
- "text": "CustomEvent<SkyAlertClosedEventDetail>"
337
- },
338
- "description": "Fired when the alert is dismissed via the close button; bubbles and is composed.",
339
- "name": "alert-closed"
340
- }
341
- ],
342
- "attributes": [
343
- {
344
- "name": "title",
345
- "type": {
346
- "text": "string"
347
- },
348
- "default": "\"\"",
349
- "description": "Title text shown above the message.",
350
- "fieldName": "title"
351
- },
352
- {
353
- "name": "message",
190
+ "name": "banner",
354
191
  "type": {
355
- "text": "string"
192
+ "text": "boolean"
356
193
  },
357
- "default": "\"\"",
358
- "description": "Message text rendered inside the alert.",
359
- "fieldName": "message"
194
+ "default": "true",
195
+ "description": "Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.",
196
+ "fieldName": "banner"
360
197
  },
361
198
  {
362
- "name": "removable",
199
+ "name": "dense",
363
200
  "type": {
364
201
  "text": "boolean"
365
202
  },
366
203
  "default": "false",
367
- "description": "Shows a dismiss button when enabled.",
368
- "fieldName": "removable"
369
- },
370
- {
371
- "name": "color",
372
- "type": {
373
- "text": "string"
374
- },
375
- "default": "\"primary\"",
376
- "description": "Base color token or CSS color used by the alert.",
377
- "fieldName": "color"
378
- },
379
- {
380
- "name": "size",
381
- "type": {
382
- "text": "string"
383
- },
384
- "default": "\"md\"",
385
- "description": "Preset size token (`xs | sm | md | lg | xl`) or CSS length.",
386
- "fieldName": "size"
387
- },
388
- {
389
- "name": "radius",
390
- "type": {
391
- "text": "string"
392
- },
393
- "default": "\"md\"",
394
- "description": "Radius token or CSS length.",
395
- "fieldName": "radius"
396
- },
397
- {
398
- "name": "icon",
399
- "type": {
400
- "text": "string | null"
401
- },
402
- "default": "null",
403
- "description": "Optional leading icon name for `<sky-icon>`.",
404
- "fieldName": "icon"
405
- },
406
- {
407
- "name": "strip",
408
- "type": {
409
- "text": "SkyAlertStrip"
410
- },
411
- "default": "\"none\"",
412
- "description": "Strip accent placement.",
413
- "fieldName": "strip"
414
- },
415
- {
416
- "name": "stripColor",
417
- "type": {
418
- "text": "string"
419
- },
420
- "default": "\"currentColor\"",
421
- "description": "Strip accent color token or CSS color.",
422
- "fieldName": "stripColor"
423
- },
424
- {
425
- "name": "variant",
426
- "type": {
427
- "text": "SkyAlertVariant"
428
- },
429
- "default": "\"solid\"",
430
- "description": "Visual style variant.",
431
- "fieldName": "variant"
204
+ "description": "Enables compact vertical spacing.",
205
+ "fieldName": "dense"
432
206
  },
433
207
  {
434
- "name": "loading",
208
+ "name": "elevated",
435
209
  "type": {
436
210
  "text": "boolean"
437
211
  },
438
212
  "default": "false",
439
- "description": "Shows a loading overlay.",
440
- "fieldName": "loading"
213
+ "description": "Applies elevated shadow styling.",
214
+ "fieldName": "elevated"
441
215
  },
442
216
  {
443
- "name": "roleType",
217
+ "name": "leadingLabel",
444
218
  "type": {
445
- "text": "SkyAlertRoleType"
219
+ "text": "string"
446
220
  },
447
- "default": "\"alert\"",
448
- "description": "ARIA role for the alert container.",
449
- "fieldName": "roleType"
221
+ "default": "\"Open menu\"",
222
+ "description": "Accessible label for default leading button fallback.",
223
+ "fieldName": "leadingLabel"
450
224
  },
451
225
  {
452
226
  "name": "preset",
@@ -462,64 +236,84 @@
462
236
  "name": "LitElement",
463
237
  "package": "lit"
464
238
  },
465
- "tagName": "sky-alert",
239
+ "tagName": "sky-appbar",
466
240
  "customElement": true,
467
- "summary": "Status alert banner with variants, optional icon, strip accents, actions, dismiss behavior, and loading state."
241
+ "summary": "Application top bar with title, optional leading control, trailing actions, and optional color/image background."
468
242
  }
469
243
  ],
470
244
  "exports": [
471
245
  {
472
246
  "kind": "js",
473
- "name": "SkyAlert",
247
+ "name": "SkyAppbar",
474
248
  "declaration": {
475
- "name": "SkyAlert",
476
- "module": "src/sky-alert/sky-alert.ts"
249
+ "name": "SkyAppbar",
250
+ "module": "src/sky-appbar/sky-appbar.ts"
477
251
  }
478
252
  },
479
253
  {
480
254
  "kind": "custom-element-definition",
481
- "name": "sky-alert",
255
+ "name": "sky-appbar",
482
256
  "declaration": {
483
- "name": "SkyAlert",
484
- "module": "src/sky-alert/sky-alert.ts"
257
+ "name": "SkyAppbar",
258
+ "module": "src/sky-appbar/sky-appbar.ts"
485
259
  }
486
260
  }
487
261
  ]
488
262
  },
489
263
  {
490
264
  "kind": "javascript-module",
491
- "path": "src/sky-appbar/sky-appbar.ts",
265
+ "path": "src/sky-alert/sky-alert.ts",
492
266
  "declarations": [
493
267
  {
494
268
  "kind": "class",
495
269
  "description": "",
496
- "name": "SkyAppbar",
270
+ "name": "SkyAlert",
497
271
  "cssParts": [
498
272
  {
499
- "description": "Wrapper that contains the leading slot, title, and actions.",
500
- "name": "content"
273
+ "description": "The outer alert container.",
274
+ "name": "alert"
501
275
  },
502
276
  {
503
- "description": "Container for the leading slot (e.g. menu button).",
504
- "name": "leading"
277
+ "description": "The optional leading icon.",
278
+ "name": "icon"
505
279
  },
506
280
  {
507
- "description": "The title area (contains .title-text with the title string).",
281
+ "description": "The content container (title + message/slot).",
282
+ "name": "content"
283
+ },
284
+ {
285
+ "description": "The title text element.",
508
286
  "name": "title"
509
287
  },
288
+ {
289
+ "description": "The message text element (when `message` is provided).",
290
+ "name": "message"
291
+ },
510
292
  {
511
293
  "description": "The trailing actions container.",
512
294
  "name": "actions"
295
+ },
296
+ {
297
+ "description": "The dismiss button (when `removable`).",
298
+ "name": "close-button"
299
+ },
300
+ {
301
+ "description": "Overlay shown when `loading` is true.",
302
+ "name": "loading-overlay"
303
+ },
304
+ {
305
+ "description": "Spinner element shown inside the loading overlay.",
306
+ "name": "loading-spinner"
513
307
  }
514
308
  ],
515
309
  "slots": [
516
310
  {
517
- "description": "Leading area (e.g., menu/back button). Defaults to a hamburger icon.",
518
- "name": "button"
311
+ "description": "Custom message content (used when `message` is empty).",
312
+ "name": ""
519
313
  },
520
314
  {
521
- "description": "Trailing actions (icons/buttons). This is the default slot.",
522
- "name": ""
315
+ "description": "Action buttons or links displayed on the trailing side.",
316
+ "name": "actions"
523
317
  }
524
318
  ],
525
319
  "members": [
@@ -538,108 +332,269 @@
538
332
  "type": {
539
333
  "text": "string"
540
334
  },
541
- "default": "\"App Bar\"",
542
- "description": "Title text displayed in the app bar.",
335
+ "default": "\"\"",
336
+ "description": "Title text shown above the message.",
543
337
  "attribute": "title"
544
338
  },
545
339
  {
546
340
  "kind": "field",
547
- "name": "color",
548
- "type": {
549
- "text": "string"
550
- },
551
- "default": "\"default\"",
552
- "description": "Semantic token or CSS color for bar background; foreground color is derived for contrast.",
553
- "attribute": "color"
554
- },
555
- {
556
- "kind": "field",
557
- "name": "url",
341
+ "name": "message",
558
342
  "type": {
559
343
  "text": "string"
560
344
  },
561
345
  "default": "\"\"",
562
- "description": "Background image URL.",
563
- "attribute": "url"
346
+ "description": "Message text rendered inside the alert.",
347
+ "attribute": "message"
564
348
  },
565
349
  {
566
350
  "kind": "field",
567
- "name": "banner",
351
+ "name": "removable",
568
352
  "type": {
569
353
  "text": "boolean"
570
354
  },
571
- "default": "true",
572
- "description": "Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.",
573
- "attribute": "banner"
355
+ "default": "false",
356
+ "description": "Shows a dismiss button when enabled.",
357
+ "attribute": "removable"
574
358
  },
575
359
  {
576
360
  "kind": "field",
577
- "name": "dense",
361
+ "name": "color",
578
362
  "type": {
579
- "text": "boolean"
363
+ "text": "string"
580
364
  },
581
- "default": "false",
582
- "description": "Enables compact vertical spacing.",
583
- "attribute": "dense"
365
+ "default": "\"primary\"",
366
+ "description": "Base color token or CSS color used by the alert.",
367
+ "attribute": "color"
584
368
  },
585
369
  {
586
370
  "kind": "field",
587
- "name": "elevated",
371
+ "name": "size",
588
372
  "type": {
589
- "text": "boolean"
373
+ "text": "string"
590
374
  },
591
- "default": "false",
592
- "description": "Applies elevated shadow styling.",
593
- "attribute": "elevated"
375
+ "default": "\"md\"",
376
+ "description": "Preset size token (`xs | sm | md | lg | xl`) or CSS length.",
377
+ "attribute": "size"
594
378
  },
595
379
  {
596
380
  "kind": "field",
597
- "name": "leadingLabel",
381
+ "name": "radius",
598
382
  "type": {
599
383
  "text": "string"
600
384
  },
601
- "default": "\"Open menu\"",
602
- "description": "Accessible label for default leading button fallback.",
603
- "attribute": "leadingLabel"
385
+ "default": "\"md\"",
386
+ "description": "Radius token or CSS length.",
387
+ "attribute": "radius"
604
388
  },
605
389
  {
606
390
  "kind": "field",
607
- "name": "preset",
391
+ "name": "icon",
608
392
  "type": {
609
- "text": "string"
393
+ "text": "string | null"
610
394
  },
611
- "default": "\"\"",
612
- "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
613
- "attribute": "preset",
614
- "reflects": true
395
+ "default": "null",
396
+ "description": "Optional leading icon name for `<sky-icon>`.",
397
+ "attribute": "icon"
615
398
  },
616
399
  {
617
400
  "kind": "field",
618
- "name": "_presets",
619
- "privacy": "private",
620
- "default": "new PresetController(this)"
401
+ "name": "strip",
402
+ "type": {
403
+ "text": "SkyAlertStrip"
404
+ },
405
+ "default": "\"none\"",
406
+ "description": "Strip accent placement.",
407
+ "attribute": "strip",
408
+ "reflects": true
409
+ },
410
+ {
411
+ "kind": "field",
412
+ "name": "stripColor",
413
+ "type": {
414
+ "text": "string"
415
+ },
416
+ "default": "\"currentColor\"",
417
+ "description": "Strip accent color token or CSS color.",
418
+ "attribute": "stripColor"
419
+ },
420
+ {
421
+ "kind": "field",
422
+ "name": "variant",
423
+ "type": {
424
+ "text": "SkyAlertVariant"
425
+ },
426
+ "default": "\"solid\"",
427
+ "description": "Visual style variant.",
428
+ "attribute": "variant",
429
+ "reflects": true
430
+ },
431
+ {
432
+ "kind": "field",
433
+ "name": "loading",
434
+ "type": {
435
+ "text": "boolean"
436
+ },
437
+ "default": "false",
438
+ "description": "Shows a loading overlay.",
439
+ "attribute": "loading"
440
+ },
441
+ {
442
+ "kind": "field",
443
+ "name": "roleType",
444
+ "type": {
445
+ "text": "SkyAlertRoleType"
446
+ },
447
+ "default": "\"alert\"",
448
+ "description": "ARIA role for the alert container.",
449
+ "attribute": "roleType",
450
+ "reflects": true
451
+ },
452
+ {
453
+ "kind": "field",
454
+ "name": "_styleVars",
455
+ "type": {
456
+ "text": "Record<string, string>"
457
+ },
458
+ "privacy": "private",
459
+ "default": "{}",
460
+ "description": "Internal style variables"
461
+ },
462
+ {
463
+ "kind": "field",
464
+ "name": "_sizeCache",
465
+ "type": {
466
+ "text": "{ size: string; result: SkyAlertResolvedSize } | null"
467
+ },
468
+ "privacy": "private",
469
+ "default": "null",
470
+ "description": "Cached result of _resolveSize for the last `size` value (avoids recomputing when only color/variant change)."
471
+ },
472
+ {
473
+ "kind": "field",
474
+ "name": "_hasActionsSlotContent",
475
+ "type": {
476
+ "text": "boolean"
477
+ },
478
+ "privacy": "private",
479
+ "default": "false",
480
+ "description": "True when the actions slot has assigned content (used to show separator only when needed)."
481
+ },
482
+ {
483
+ "kind": "field",
484
+ "name": "preset",
485
+ "type": {
486
+ "text": "string"
487
+ },
488
+ "default": "\"\"",
489
+ "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
490
+ "attribute": "preset",
491
+ "reflects": true
492
+ },
493
+ {
494
+ "kind": "field",
495
+ "name": "_presets",
496
+ "privacy": "private",
497
+ "default": "new PresetController(this)"
621
498
  },
622
499
  {
623
500
  "kind": "method",
624
- "name": "_applyColorSurface",
501
+ "name": "_resolveSize",
502
+ "privacy": "private",
503
+ "return": {
504
+ "type": {
505
+ "text": "SkyAlertResolvedSize"
506
+ }
507
+ },
508
+ "parameters": [
509
+ {
510
+ "name": "input",
511
+ "type": {
512
+ "text": "string"
513
+ }
514
+ }
515
+ ],
516
+ "description": "Resolves size to get padding, font sizes, and other metrics.\r\nResult is memoized by `size` to avoid recomputing when only color/variant/radius change."
517
+ },
518
+ {
519
+ "kind": "field",
520
+ "name": "_lastPresetRevision",
521
+ "type": {
522
+ "text": "number"
523
+ },
524
+ "privacy": "private",
525
+ "default": "-1"
526
+ },
527
+ {
528
+ "kind": "method",
529
+ "name": "_updateStyleVars",
625
530
  "privacy": "private",
626
531
  "return": {
627
532
  "type": {
628
533
  "text": "void"
629
534
  }
630
535
  },
631
- "description": "Applies glass vs solid surface tokens from `color`."
536
+ "description": "Computes CSS custom properties from current variant, size, and color inputs."
632
537
  },
633
538
  {
634
539
  "kind": "method",
635
- "name": "_applyBackgroundImage",
540
+ "name": "close",
541
+ "privacy": "public",
542
+ "return": {
543
+ "type": {
544
+ "text": "void"
545
+ }
546
+ },
547
+ "description": "Dispatches `alert-closed` and removes the alert from the DOM."
548
+ },
549
+ {
550
+ "kind": "method",
551
+ "name": "getAriaRole",
552
+ "privacy": "private",
553
+ "return": {
554
+ "type": {
555
+ "text": "SkyAlertRoleType"
556
+ }
557
+ },
558
+ "description": "Returns the ARIA role applied to the alert container."
559
+ },
560
+ {
561
+ "kind": "method",
562
+ "name": "_checkActionsSlot",
636
563
  "privacy": "private",
637
564
  "return": {
638
565
  "type": {
639
566
  "text": "void"
640
567
  }
641
568
  },
642
- "description": "Sets background image CSS variable from `url`."
569
+ "description": "Checks whether the actions slot currently has meaningful assigned content."
570
+ },
571
+ {
572
+ "kind": "method",
573
+ "name": "_onActionsSlotChange",
574
+ "privacy": "private",
575
+ "return": {
576
+ "type": {
577
+ "text": "void"
578
+ }
579
+ },
580
+ "parameters": [
581
+ {
582
+ "name": "e",
583
+ "type": {
584
+ "text": "Event"
585
+ }
586
+ }
587
+ ],
588
+ "description": "Updates action-slot state when the slot assignment changes."
589
+ }
590
+ ],
591
+ "events": [
592
+ {
593
+ "type": {
594
+ "text": "CustomEvent<SkyAlertClosedEventDetail>"
595
+ },
596
+ "description": "Fired when the alert is dismissed via the close button; bubbles and is composed.",
597
+ "name": "alert-closed"
643
598
  }
644
599
  ],
645
600
  "attributes": [
@@ -648,63 +603,108 @@
648
603
  "type": {
649
604
  "text": "string"
650
605
  },
651
- "default": "\"App Bar\"",
652
- "description": "Title text displayed in the app bar.",
606
+ "default": "\"\"",
607
+ "description": "Title text shown above the message.",
653
608
  "fieldName": "title"
654
609
  },
610
+ {
611
+ "name": "message",
612
+ "type": {
613
+ "text": "string"
614
+ },
615
+ "default": "\"\"",
616
+ "description": "Message text rendered inside the alert.",
617
+ "fieldName": "message"
618
+ },
619
+ {
620
+ "name": "removable",
621
+ "type": {
622
+ "text": "boolean"
623
+ },
624
+ "default": "false",
625
+ "description": "Shows a dismiss button when enabled.",
626
+ "fieldName": "removable"
627
+ },
655
628
  {
656
629
  "name": "color",
657
630
  "type": {
658
631
  "text": "string"
659
632
  },
660
- "default": "\"default\"",
661
- "description": "Semantic token or CSS color for bar background; foreground color is derived for contrast.",
633
+ "default": "\"primary\"",
634
+ "description": "Base color token or CSS color used by the alert.",
662
635
  "fieldName": "color"
663
636
  },
664
637
  {
665
- "name": "url",
638
+ "name": "size",
666
639
  "type": {
667
640
  "text": "string"
668
641
  },
669
- "default": "\"\"",
670
- "description": "Background image URL.",
671
- "fieldName": "url"
642
+ "default": "\"md\"",
643
+ "description": "Preset size token (`xs | sm | md | lg | xl`) or CSS length.",
644
+ "fieldName": "size"
672
645
  },
673
646
  {
674
- "name": "banner",
647
+ "name": "radius",
675
648
  "type": {
676
- "text": "boolean"
649
+ "text": "string"
677
650
  },
678
- "default": "true",
679
- "description": "Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.",
680
- "fieldName": "banner"
651
+ "default": "\"md\"",
652
+ "description": "Radius token or CSS length.",
653
+ "fieldName": "radius"
681
654
  },
682
655
  {
683
- "name": "dense",
656
+ "name": "icon",
684
657
  "type": {
685
- "text": "boolean"
658
+ "text": "string | null"
686
659
  },
687
- "default": "false",
688
- "description": "Enables compact vertical spacing.",
689
- "fieldName": "dense"
660
+ "default": "null",
661
+ "description": "Optional leading icon name for `<sky-icon>`.",
662
+ "fieldName": "icon"
690
663
  },
691
664
  {
692
- "name": "elevated",
665
+ "name": "strip",
666
+ "type": {
667
+ "text": "SkyAlertStrip"
668
+ },
669
+ "default": "\"none\"",
670
+ "description": "Strip accent placement.",
671
+ "fieldName": "strip"
672
+ },
673
+ {
674
+ "name": "stripColor",
675
+ "type": {
676
+ "text": "string"
677
+ },
678
+ "default": "\"currentColor\"",
679
+ "description": "Strip accent color token or CSS color.",
680
+ "fieldName": "stripColor"
681
+ },
682
+ {
683
+ "name": "variant",
684
+ "type": {
685
+ "text": "SkyAlertVariant"
686
+ },
687
+ "default": "\"solid\"",
688
+ "description": "Visual style variant.",
689
+ "fieldName": "variant"
690
+ },
691
+ {
692
+ "name": "loading",
693
693
  "type": {
694
694
  "text": "boolean"
695
695
  },
696
696
  "default": "false",
697
- "description": "Applies elevated shadow styling.",
698
- "fieldName": "elevated"
697
+ "description": "Shows a loading overlay.",
698
+ "fieldName": "loading"
699
699
  },
700
700
  {
701
- "name": "leadingLabel",
701
+ "name": "roleType",
702
702
  "type": {
703
- "text": "string"
703
+ "text": "SkyAlertRoleType"
704
704
  },
705
- "default": "\"Open menu\"",
706
- "description": "Accessible label for default leading button fallback.",
707
- "fieldName": "leadingLabel"
705
+ "default": "\"alert\"",
706
+ "description": "ARIA role for the alert container.",
707
+ "fieldName": "roleType"
708
708
  },
709
709
  {
710
710
  "name": "preset",
@@ -720,161 +720,259 @@
720
720
  "name": "LitElement",
721
721
  "package": "lit"
722
722
  },
723
- "tagName": "sky-appbar",
723
+ "tagName": "sky-alert",
724
724
  "customElement": true,
725
- "summary": "Application top bar with title, optional leading control, trailing actions, and optional color/image background."
725
+ "summary": "Status alert banner with variants, optional icon, strip accents, actions, dismiss behavior, and loading state."
726
726
  }
727
727
  ],
728
728
  "exports": [
729
729
  {
730
730
  "kind": "js",
731
- "name": "SkyAppbar",
731
+ "name": "SkyAlert",
732
732
  "declaration": {
733
- "name": "SkyAppbar",
734
- "module": "src/sky-appbar/sky-appbar.ts"
733
+ "name": "SkyAlert",
734
+ "module": "src/sky-alert/sky-alert.ts"
735
735
  }
736
736
  },
737
737
  {
738
738
  "kind": "custom-element-definition",
739
- "name": "sky-appbar",
739
+ "name": "sky-alert",
740
740
  "declaration": {
741
- "name": "SkyAppbar",
742
- "module": "src/sky-appbar/sky-appbar.ts"
741
+ "name": "SkyAlert",
742
+ "module": "src/sky-alert/sky-alert.ts"
743
743
  }
744
744
  }
745
745
  ]
746
746
  },
747
747
  {
748
748
  "kind": "javascript-module",
749
- "path": "src/sky-avatar/sky-avatar.ts",
749
+ "path": "src/sky-badge/sky-badge.ts",
750
750
  "declarations": [
751
751
  {
752
752
  "kind": "class",
753
753
  "description": "",
754
- "name": "SkyAvatar",
754
+ "name": "SkyBadge",
755
755
  "cssParts": [
756
756
  {
757
- "description": "The avatar container element.",
758
- "name": "avatar"
757
+ "description": "Wrapper around the slotted content and the badge.",
758
+ "name": "container"
759
759
  },
760
760
  {
761
- "description": "The loading overlay container (shown when `loading` is true).",
762
- "name": "loading-overlay"
761
+ "description": "The badge element. Use `badgeRef` for positioning (e.g. tooltip anchor).",
762
+ "name": "badge"
763
763
  },
764
764
  {
765
- "description": "The spinner element shown when loading.",
766
- "name": "spinner"
765
+ "description": "The icon element when `isIcon` is true.",
766
+ "name": "icon"
767
767
  }
768
768
  ],
769
769
  "slots": [
770
770
  {
771
- "description": "Fallback content (e.g., initials or an icon) rendered when `image` is empty.",
771
+ "description": "The content the badge attaches to.",
772
772
  "name": ""
773
+ },
774
+ {
775
+ "description": "Optional slot to override the badge content entirely.",
776
+ "name": "badge"
773
777
  }
774
778
  ],
775
779
  "members": [
780
+ {
781
+ "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",
792
+ "type": {
793
+ "text": "string"
794
+ },
795
+ "default": "\"success\"",
796
+ "description": "Badge background token or CSS color.",
797
+ "attribute": "statusColor",
798
+ "reflects": true
799
+ },
800
+ {
801
+ "kind": "field",
802
+ "name": "textColor",
803
+ "type": {
804
+ "text": "string"
805
+ },
806
+ "default": "\"default\"",
807
+ "description": "Text color token or CSS color.",
808
+ "attribute": "textColor",
809
+ "reflects": true
810
+ },
811
+ {
812
+ "kind": "field",
813
+ "name": "iconColor",
814
+ "type": {
815
+ "text": "string"
816
+ },
817
+ "default": "\"\"",
818
+ "description": "Icon color token or CSS color; falls back to `textColor` when empty.",
819
+ "attribute": "iconColor",
820
+ "reflects": true
821
+ },
822
+ {
823
+ "kind": "field",
824
+ "name": "position",
825
+ "type": {
826
+ "text": "SkyBadgePosition"
827
+ },
828
+ "default": "\"default\"",
829
+ "description": "Layout mode: `default | floating | inline`.",
830
+ "attribute": "position",
831
+ "reflects": true
832
+ },
833
+ {
834
+ "kind": "field",
835
+ "name": "value",
836
+ "type": {
837
+ "text": "string"
838
+ },
839
+ "default": "\"\"",
840
+ "description": "Badge text/count or icon name in icon mode.",
841
+ "attribute": "value"
842
+ },
843
+ {
844
+ "kind": "field",
845
+ "name": "isIcon",
846
+ "type": {
847
+ "text": "boolean"
848
+ },
849
+ "default": "false",
850
+ "description": "Renders icon mode when true.",
851
+ "attribute": "isIcon",
852
+ "reflects": true
853
+ },
776
854
  {
777
855
  "kind": "field",
778
856
  "name": "size",
779
857
  "type": {
780
858
  "text": "string"
781
859
  },
782
- "default": "\"50px\"",
783
- "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
784
- "attribute": "size"
860
+ "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
875
+ },
876
+ {
877
+ "kind": "field",
878
+ "name": "max",
879
+ "type": {
880
+ "text": "number"
881
+ },
882
+ "default": "99",
883
+ "description": "Maximum numeric count before rendering overflow label.",
884
+ "attribute": "max"
785
885
  },
786
886
  {
787
887
  "kind": "field",
788
- "name": "image",
888
+ "name": "hideWhenZero",
789
889
  "type": {
790
- "text": "string"
890
+ "text": "boolean"
791
891
  },
792
- "default": "\"\"",
793
- "description": "Image URL; fallback slot is shown on load error.",
794
- "attribute": "image"
892
+ "default": "false",
893
+ "description": "Hides badge when value resolves to numeric zero.",
894
+ "attribute": "hideWhenZero"
795
895
  },
796
896
  {
797
897
  "kind": "field",
798
- "name": "fit",
898
+ "name": "show",
799
899
  "type": {
800
- "text": "SkyAvatarFit"
900
+ "text": "boolean"
801
901
  },
802
- "default": "\"cover\"",
803
- "description": "Image fill mode: `cover` (default) or `contain`.",
804
- "attribute": "fit",
902
+ "default": "true",
903
+ "description": "Forces badge visibility independent of value.",
904
+ "attribute": "show",
805
905
  "reflects": true
806
906
  },
807
907
  {
808
908
  "kind": "field",
809
- "name": "radius",
909
+ "name": "offsetX",
810
910
  "type": {
811
911
  "text": "string"
812
912
  },
813
- "default": "\"md\"",
814
- "description": "Border radius token or CSS value.",
815
- "attribute": "radius"
913
+ "default": "\"0px\"",
914
+ "description": "Horizontal offset CSS length.",
915
+ "attribute": "offsetX"
816
916
  },
817
917
  {
818
918
  "kind": "field",
819
- "name": "alt",
919
+ "name": "offsetY",
820
920
  "type": {
821
921
  "text": "string"
822
922
  },
823
- "default": "\"\"",
824
- "description": "Accessible name when image content conveys meaning.",
825
- "attribute": "alt"
923
+ "default": "\"0px\"",
924
+ "description": "Vertical offset CSS length.",
925
+ "attribute": "offsetY"
826
926
  },
827
927
  {
828
928
  "kind": "field",
829
- "name": "color",
929
+ "name": "ring",
830
930
  "type": {
831
- "text": "string"
931
+ "text": "boolean"
832
932
  },
833
- "default": "\"dark\"",
834
- "description": "Token or CSS color applied to fallback slot content.",
835
- "attribute": "color"
933
+ "default": "false",
934
+ "description": "Enables visual ring around the badge.",
935
+ "attribute": "ring"
836
936
  },
837
937
  {
838
938
  "kind": "field",
839
- "name": "outline",
939
+ "name": "ringColor",
840
940
  "type": {
841
941
  "text": "string"
842
942
  },
843
- "default": "\"\"",
844
- "description": "CSS `outline` value.",
845
- "attribute": "outline"
943
+ "default": "\"primary\"",
944
+ "description": "Ring color token or CSS color.",
945
+ "attribute": "ringColor"
846
946
  },
847
947
  {
848
948
  "kind": "field",
849
- "name": "outlineOffset",
949
+ "name": "ringOffset",
850
950
  "type": {
851
951
  "text": "string"
852
952
  },
853
- "default": "\"2px\"",
854
- "description": "CSS `outline-offset` value.",
855
- "attribute": "outlineOffset"
953
+ "default": "\"1px\"",
954
+ "description": "Ring offset CSS length.",
955
+ "attribute": "ringOffset"
856
956
  },
857
957
  {
858
958
  "kind": "field",
859
- "name": "loading",
959
+ "name": "badgeLabel",
860
960
  "type": {
861
- "text": "boolean"
961
+ "text": "string | null"
862
962
  },
863
- "default": "false",
864
- "description": "Shows loading overlay when true.",
865
- "attribute": "loading",
866
- "reflects": true
963
+ "default": "null",
964
+ "description": "ARIA label override.",
965
+ "attribute": "badgeLabel"
867
966
  },
868
967
  {
869
968
  "kind": "field",
870
- "name": "disabled",
969
+ "name": "badgeAriaHidden",
871
970
  "type": {
872
971
  "text": "boolean"
873
972
  },
874
973
  "default": "false",
875
- "description": "Dims and disables pointer interactions.",
876
- "attribute": "disabled",
877
- "reflects": true
974
+ "description": "Hides badge from assistive technology when true.",
975
+ "attribute": "badgeAriaHidden"
878
976
  },
879
977
  {
880
978
  "kind": "field",
@@ -883,30 +981,20 @@
883
981
  "text": "boolean"
884
982
  },
885
983
  "default": "false",
886
- "description": "Enables interactive behavior with keyboard/click activation.",
984
+ "description": "Enables focus/activation and `badge-click` emission.",
887
985
  "attribute": "interactive"
888
986
  },
889
987
  {
890
988
  "kind": "field",
891
- "name": "shadow",
989
+ "name": "placement",
892
990
  "type": {
893
- "text": "boolean"
991
+ "text": "SkyBadgePlacement"
894
992
  },
895
- "default": "false",
896
- "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
897
- "attribute": "shadow",
993
+ "default": "\"custom\"",
994
+ "description": "Anchor placement preset for badge positioning.",
995
+ "attribute": "placement",
898
996
  "reflects": true
899
997
  },
900
- {
901
- "kind": "field",
902
- "name": "_imageError",
903
- "type": {
904
- "text": "boolean"
905
- },
906
- "privacy": "private",
907
- "default": "false",
908
- "description": "True when image failed to load; show slot instead."
909
- },
910
998
  {
911
999
  "kind": "field",
912
1000
  "name": "preset",
@@ -926,164 +1014,302 @@
926
1014
  },
927
1015
  {
928
1016
  "kind": "field",
929
- "name": "_onImageLoad",
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)."
1028
+ },
1029
+ {
1030
+ "kind": "field",
1031
+ "name": "shadowRootOptions",
1032
+ "type": {
1033
+ "text": "ShadowRootInit"
1034
+ },
1035
+ "static": true,
1036
+ "default": "{ mode: \"open\", delegatesFocus: true, }"
1037
+ },
1038
+ {
1039
+ "kind": "method",
1040
+ "name": "showBadge",
1041
+ "privacy": "public",
1042
+ "return": {
1043
+ "type": {
1044
+ "text": "void"
1045
+ }
1046
+ },
1047
+ "description": "Forces badge visibility on."
1048
+ },
1049
+ {
1050
+ "kind": "method",
1051
+ "name": "hideBadge",
1052
+ "privacy": "public",
1053
+ "return": {
1054
+ "type": {
1055
+ "text": "void"
1056
+ }
1057
+ },
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",
930
1083
  "privacy": "private",
931
- "description": "Marks image load success and keeps image rendering active."
1084
+ "description": "Emits `badge-click` for interactive activation."
932
1085
  },
933
1086
  {
934
1087
  "kind": "field",
935
- "name": "_onImageError",
1088
+ "name": "_onKeydown",
936
1089
  "privacy": "private",
937
- "description": "Marks image load failure and enables fallback slot rendering."
1090
+ "description": "Handles keyboard activation with Enter and Space."
938
1091
  },
939
1092
  {
940
1093
  "kind": "method",
941
- "name": "_handleInteractiveClick",
1094
+ "name": "_computeAriaLabel",
942
1095
  "privacy": "private",
943
1096
  "return": {
944
1097
  "type": {
945
- "text": "void"
1098
+ "text": "string | null"
946
1099
  }
947
1100
  },
948
1101
  "parameters": [
949
1102
  {
950
- "name": "e",
1103
+ "name": "displayValue",
951
1104
  "type": {
952
- "text": "Event"
1105
+ "text": "string | null"
953
1106
  }
954
1107
  }
955
1108
  ],
956
- "description": "Re-dispatches click in interactive mode for host-level consumers."
1109
+ "description": "Computes accessible badge label from current render state."
957
1110
  },
958
1111
  {
959
1112
  "kind": "method",
960
- "name": "_handleInteractiveKeydown",
1113
+ "name": "_computeAnchors",
961
1114
  "privacy": "private",
962
1115
  "return": {
963
1116
  "type": {
964
- "text": "void"
1117
+ "text": "{\r\n top: string;\r\n right: string;\r\n bottom: string;\r\n left: string;\r\n }"
1118
+ }
1119
+ },
1120
+ "parameters": [
1121
+ {
1122
+ "name": "placement",
1123
+ "type": {
1124
+ "text": "SkyBadgePlacement"
1125
+ }
1126
+ }
1127
+ ],
1128
+ "description": "Resolves anchor edges from placement preset."
1129
+ },
1130
+ {
1131
+ "kind": "method",
1132
+ "name": "_resolveBadgeSurface",
1133
+ "privacy": "private",
1134
+ "return": {
1135
+ "type": {
1136
+ "text": "{\r\n bg: string;\r\n color: string;\r\n border: string;\r\n }"
965
1137
  }
966
1138
  },
967
- "parameters": [
968
- {
969
- "name": "e",
970
- "type": {
971
- "text": "KeyboardEvent"
972
- }
973
- }
974
- ],
975
- "description": "Handles keyboard activation in interactive mode."
1139
+ "description": "Maps semantic status tokens to soft badge surface colors."
1140
+ }
1141
+ ],
1142
+ "events": [
1143
+ {
1144
+ "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"
1149
+ }
1150
+ ],
1151
+ "attributes": [
1152
+ {
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",
1163
+ "type": {
1164
+ "text": "string"
1165
+ },
1166
+ "default": "\"default\"",
1167
+ "description": "Text color token or CSS color.",
1168
+ "fieldName": "textColor"
1169
+ },
1170
+ {
1171
+ "name": "iconColor",
1172
+ "type": {
1173
+ "text": "string"
1174
+ },
1175
+ "default": "\"\"",
1176
+ "description": "Icon color token or CSS color; falls back to `textColor` when empty.",
1177
+ "fieldName": "iconColor"
1178
+ },
1179
+ {
1180
+ "name": "position",
1181
+ "type": {
1182
+ "text": "SkyBadgePosition"
1183
+ },
1184
+ "default": "\"default\"",
1185
+ "description": "Layout mode: `default | floating | inline`.",
1186
+ "fieldName": "position"
976
1187
  },
977
1188
  {
978
- "kind": "method",
979
- "name": "adjustSpinnerSize",
980
- "privacy": "private",
981
- "return": {
982
- "type": {
983
- "text": "void"
984
- }
1189
+ "name": "value",
1190
+ "type": {
1191
+ "text": "string"
985
1192
  },
986
- "description": "Derives spinner dimensions from current avatar size."
987
- }
988
- ],
989
- "events": [
1193
+ "default": "\"\"",
1194
+ "description": "Badge text/count or icon name in icon mode.",
1195
+ "fieldName": "value"
1196
+ },
990
1197
  {
991
- "name": "click",
1198
+ "name": "isIcon",
992
1199
  "type": {
993
- "text": "Event"
994
- }
995
- }
996
- ],
997
- "attributes": [
1200
+ "text": "boolean"
1201
+ },
1202
+ "default": "false",
1203
+ "description": "Renders icon mode when true.",
1204
+ "fieldName": "isIcon"
1205
+ },
998
1206
  {
999
1207
  "name": "size",
1000
1208
  "type": {
1001
1209
  "text": "string"
1002
1210
  },
1003
- "default": "\"50px\"",
1004
- "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
1211
+ "default": "\"\"",
1212
+ "description": "Badge and icon size CSS length.",
1005
1213
  "fieldName": "size"
1006
1214
  },
1007
1215
  {
1008
- "name": "image",
1216
+ "name": "shape",
1009
1217
  "type": {
1010
- "text": "string"
1218
+ "text": "SkyBadgeShape"
1011
1219
  },
1012
- "default": "\"\"",
1013
- "description": "Image URL; fallback slot is shown on load error.",
1014
- "fieldName": "image"
1220
+ "default": "\"custom\"",
1221
+ "description": "Badge shape: `circle | pill | custom`.",
1222
+ "fieldName": "shape"
1015
1223
  },
1016
1224
  {
1017
- "name": "fit",
1225
+ "name": "max",
1018
1226
  "type": {
1019
- "text": "SkyAvatarFit"
1227
+ "text": "number"
1020
1228
  },
1021
- "default": "\"cover\"",
1022
- "description": "Image fill mode: `cover` (default) or `contain`.",
1023
- "fieldName": "fit"
1229
+ "default": "99",
1230
+ "description": "Maximum numeric count before rendering overflow label.",
1231
+ "fieldName": "max"
1024
1232
  },
1025
1233
  {
1026
- "name": "radius",
1234
+ "name": "hideWhenZero",
1027
1235
  "type": {
1028
- "text": "string"
1236
+ "text": "boolean"
1029
1237
  },
1030
- "default": "\"md\"",
1031
- "description": "Border radius token or CSS value.",
1032
- "fieldName": "radius"
1238
+ "default": "false",
1239
+ "description": "Hides badge when value resolves to numeric zero.",
1240
+ "fieldName": "hideWhenZero"
1033
1241
  },
1034
1242
  {
1035
- "name": "alt",
1243
+ "name": "show",
1244
+ "type": {
1245
+ "text": "boolean"
1246
+ },
1247
+ "default": "true",
1248
+ "description": "Forces badge visibility independent of value.",
1249
+ "fieldName": "show"
1250
+ },
1251
+ {
1252
+ "name": "offsetX",
1036
1253
  "type": {
1037
1254
  "text": "string"
1038
1255
  },
1039
- "default": "\"\"",
1040
- "description": "Accessible name when image content conveys meaning.",
1041
- "fieldName": "alt"
1256
+ "default": "\"0px\"",
1257
+ "description": "Horizontal offset CSS length.",
1258
+ "fieldName": "offsetX"
1042
1259
  },
1043
1260
  {
1044
- "name": "color",
1261
+ "name": "offsetY",
1045
1262
  "type": {
1046
1263
  "text": "string"
1047
1264
  },
1048
- "default": "\"dark\"",
1049
- "description": "Token or CSS color applied to fallback slot content.",
1050
- "fieldName": "color"
1265
+ "default": "\"0px\"",
1266
+ "description": "Vertical offset CSS length.",
1267
+ "fieldName": "offsetY"
1051
1268
  },
1052
1269
  {
1053
- "name": "outline",
1270
+ "name": "ring",
1271
+ "type": {
1272
+ "text": "boolean"
1273
+ },
1274
+ "default": "false",
1275
+ "description": "Enables visual ring around the badge.",
1276
+ "fieldName": "ring"
1277
+ },
1278
+ {
1279
+ "name": "ringColor",
1054
1280
  "type": {
1055
1281
  "text": "string"
1056
1282
  },
1057
- "default": "\"\"",
1058
- "description": "CSS `outline` value.",
1059
- "fieldName": "outline"
1283
+ "default": "\"primary\"",
1284
+ "description": "Ring color token or CSS color.",
1285
+ "fieldName": "ringColor"
1060
1286
  },
1061
1287
  {
1062
- "name": "outlineOffset",
1288
+ "name": "ringOffset",
1063
1289
  "type": {
1064
1290
  "text": "string"
1065
1291
  },
1066
- "default": "\"2px\"",
1067
- "description": "CSS `outline-offset` value.",
1068
- "fieldName": "outlineOffset"
1292
+ "default": "\"1px\"",
1293
+ "description": "Ring offset CSS length.",
1294
+ "fieldName": "ringOffset"
1069
1295
  },
1070
1296
  {
1071
- "name": "loading",
1297
+ "name": "badgeLabel",
1072
1298
  "type": {
1073
- "text": "boolean"
1299
+ "text": "string | null"
1074
1300
  },
1075
- "default": "false",
1076
- "description": "Shows loading overlay when true.",
1077
- "fieldName": "loading"
1301
+ "default": "null",
1302
+ "description": "ARIA label override.",
1303
+ "fieldName": "badgeLabel"
1078
1304
  },
1079
1305
  {
1080
- "name": "disabled",
1306
+ "name": "badgeAriaHidden",
1081
1307
  "type": {
1082
1308
  "text": "boolean"
1083
1309
  },
1084
1310
  "default": "false",
1085
- "description": "Dims and disables pointer interactions.",
1086
- "fieldName": "disabled"
1311
+ "description": "Hides badge from assistive technology when true.",
1312
+ "fieldName": "badgeAriaHidden"
1087
1313
  },
1088
1314
  {
1089
1315
  "name": "interactive",
@@ -1091,17 +1317,17 @@
1091
1317
  "text": "boolean"
1092
1318
  },
1093
1319
  "default": "false",
1094
- "description": "Enables interactive behavior with keyboard/click activation.",
1320
+ "description": "Enables focus/activation and `badge-click` emission.",
1095
1321
  "fieldName": "interactive"
1096
1322
  },
1097
1323
  {
1098
- "name": "shadow",
1324
+ "name": "placement",
1099
1325
  "type": {
1100
- "text": "boolean"
1326
+ "text": "SkyBadgePlacement"
1101
1327
  },
1102
- "default": "false",
1103
- "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
1104
- "fieldName": "shadow"
1328
+ "default": "\"custom\"",
1329
+ "description": "Anchor placement preset for badge positioning.",
1330
+ "fieldName": "placement"
1105
1331
  },
1106
1332
  {
1107
1333
  "name": "preset",
@@ -1117,26 +1343,26 @@
1117
1343
  "name": "LitElement",
1118
1344
  "package": "lit"
1119
1345
  },
1120
- "tagName": "sky-avatar",
1346
+ "tagName": "sky-badge",
1121
1347
  "customElement": true,
1122
- "summary": "Avatar that renders image content or fallback slot content with configurable size, radius, outline, and loading state."
1348
+ "summary": "Badge for status dots, counts, or icons anchored to slotted content."
1123
1349
  }
1124
1350
  ],
1125
1351
  "exports": [
1126
1352
  {
1127
1353
  "kind": "js",
1128
- "name": "SkyAvatar",
1354
+ "name": "SkyBadge",
1129
1355
  "declaration": {
1130
- "name": "SkyAvatar",
1131
- "module": "src/sky-avatar/sky-avatar.ts"
1356
+ "name": "SkyBadge",
1357
+ "module": "src/sky-badge/sky-badge.ts"
1132
1358
  }
1133
1359
  },
1134
1360
  {
1135
1361
  "kind": "custom-element-definition",
1136
- "name": "sky-avatar",
1362
+ "name": "sky-badge",
1137
1363
  "declaration": {
1138
- "name": "SkyAvatar",
1139
- "module": "src/sky-avatar/sky-avatar.ts"
1364
+ "name": "SkyBadge",
1365
+ "module": "src/sky-badge/sky-badge.ts"
1140
1366
  }
1141
1367
  }
1142
1368
  ]
@@ -1777,254 +2003,166 @@
1777
2003
  },
1778
2004
  {
1779
2005
  "kind": "javascript-module",
1780
- "path": "src/sky-badge/sky-badge.ts",
2006
+ "path": "src/sky-avatar/sky-avatar.ts",
1781
2007
  "declarations": [
1782
2008
  {
1783
- "kind": "class",
1784
- "description": "",
1785
- "name": "SkyBadge",
1786
- "cssParts": [
1787
- {
1788
- "description": "Wrapper around the slotted content and the badge.",
1789
- "name": "container"
1790
- },
1791
- {
1792
- "description": "The badge element. Use `badgeRef` for positioning (e.g. tooltip anchor).",
1793
- "name": "badge"
1794
- },
1795
- {
1796
- "description": "The icon element when `isIcon` is true.",
1797
- "name": "icon"
1798
- }
1799
- ],
1800
- "slots": [
1801
- {
1802
- "description": "The content the badge attaches to.",
1803
- "name": ""
1804
- },
1805
- {
1806
- "description": "Optional slot to override the badge content entirely.",
1807
- "name": "badge"
1808
- }
1809
- ],
1810
- "members": [
1811
- {
1812
- "kind": "field",
1813
- "name": "dependencies",
1814
- "type": {
1815
- "text": "Record<string, CustomElementConstructor>"
1816
- },
1817
- "static": true,
1818
- "default": "{ \"sky-icon\": SkyIcon, }"
1819
- },
1820
- {
1821
- "kind": "field",
1822
- "name": "statusColor",
1823
- "type": {
1824
- "text": "string"
1825
- },
1826
- "default": "\"success\"",
1827
- "description": "Badge background token or CSS color.",
1828
- "attribute": "statusColor",
1829
- "reflects": true
1830
- },
1831
- {
1832
- "kind": "field",
1833
- "name": "textColor",
1834
- "type": {
1835
- "text": "string"
1836
- },
1837
- "default": "\"default\"",
1838
- "description": "Text color token or CSS color.",
1839
- "attribute": "textColor",
1840
- "reflects": true
1841
- },
1842
- {
1843
- "kind": "field",
1844
- "name": "iconColor",
1845
- "type": {
1846
- "text": "string"
1847
- },
1848
- "default": "\"\"",
1849
- "description": "Icon color token or CSS color; falls back to `textColor` when empty.",
1850
- "attribute": "iconColor",
1851
- "reflects": true
1852
- },
1853
- {
1854
- "kind": "field",
1855
- "name": "position",
1856
- "type": {
1857
- "text": "SkyBadgePosition"
1858
- },
1859
- "default": "\"default\"",
1860
- "description": "Layout mode: `default | floating | inline`.",
1861
- "attribute": "position",
1862
- "reflects": true
2009
+ "kind": "class",
2010
+ "description": "",
2011
+ "name": "SkyAvatar",
2012
+ "cssParts": [
2013
+ {
2014
+ "description": "The avatar container element.",
2015
+ "name": "avatar"
1863
2016
  },
1864
2017
  {
1865
- "kind": "field",
1866
- "name": "value",
1867
- "type": {
1868
- "text": "string"
1869
- },
1870
- "default": "\"\"",
1871
- "description": "Badge text/count or icon name in icon mode.",
1872
- "attribute": "value"
2018
+ "description": "The loading overlay container (shown when `loading` is true).",
2019
+ "name": "loading-overlay"
1873
2020
  },
2021
+ {
2022
+ "description": "The spinner element shown when loading.",
2023
+ "name": "spinner"
2024
+ }
2025
+ ],
2026
+ "slots": [
2027
+ {
2028
+ "description": "Fallback content (e.g., initials or an icon) rendered when `image` is empty.",
2029
+ "name": ""
2030
+ }
2031
+ ],
2032
+ "members": [
1874
2033
  {
1875
2034
  "kind": "field",
1876
- "name": "isIcon",
2035
+ "name": "size",
1877
2036
  "type": {
1878
- "text": "boolean"
2037
+ "text": "string"
1879
2038
  },
1880
- "default": "false",
1881
- "description": "Renders icon mode when true.",
1882
- "attribute": "isIcon",
1883
- "reflects": true
2039
+ "default": "\"50px\"",
2040
+ "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
2041
+ "attribute": "size"
1884
2042
  },
1885
2043
  {
1886
2044
  "kind": "field",
1887
- "name": "size",
2045
+ "name": "image",
1888
2046
  "type": {
1889
2047
  "text": "string"
1890
2048
  },
1891
2049
  "default": "\"\"",
1892
- "description": "Badge and icon size CSS length.",
1893
- "attribute": "size",
1894
- "reflects": true
2050
+ "description": "Image URL; fallback slot is shown on load error.",
2051
+ "attribute": "image"
1895
2052
  },
1896
2053
  {
1897
2054
  "kind": "field",
1898
- "name": "shape",
2055
+ "name": "fit",
1899
2056
  "type": {
1900
- "text": "SkyBadgeShape"
2057
+ "text": "SkyAvatarFit"
1901
2058
  },
1902
- "default": "\"custom\"",
1903
- "description": "Badge shape: `circle | pill | custom`.",
1904
- "attribute": "shape",
2059
+ "default": "\"cover\"",
2060
+ "description": "Image fill mode: `cover` (default) or `contain`.",
2061
+ "attribute": "fit",
1905
2062
  "reflects": true
1906
2063
  },
1907
2064
  {
1908
2065
  "kind": "field",
1909
- "name": "max",
2066
+ "name": "radius",
1910
2067
  "type": {
1911
- "text": "number"
2068
+ "text": "string"
1912
2069
  },
1913
- "default": "99",
1914
- "description": "Maximum numeric count before rendering overflow label.",
1915
- "attribute": "max"
2070
+ "default": "\"md\"",
2071
+ "description": "Border radius token or CSS value.",
2072
+ "attribute": "radius"
1916
2073
  },
1917
2074
  {
1918
2075
  "kind": "field",
1919
- "name": "hideWhenZero",
2076
+ "name": "alt",
1920
2077
  "type": {
1921
- "text": "boolean"
2078
+ "text": "string"
1922
2079
  },
1923
- "default": "false",
1924
- "description": "Hides badge when value resolves to numeric zero.",
1925
- "attribute": "hideWhenZero"
2080
+ "default": "\"\"",
2081
+ "description": "Accessible name when image content conveys meaning.",
2082
+ "attribute": "alt"
1926
2083
  },
1927
2084
  {
1928
2085
  "kind": "field",
1929
- "name": "show",
2086
+ "name": "color",
1930
2087
  "type": {
1931
- "text": "boolean"
2088
+ "text": "string"
1932
2089
  },
1933
- "default": "true",
1934
- "description": "Forces badge visibility independent of value.",
1935
- "attribute": "show",
1936
- "reflects": true
2090
+ "default": "\"dark\"",
2091
+ "description": "Token or CSS color applied to fallback slot content.",
2092
+ "attribute": "color"
1937
2093
  },
1938
2094
  {
1939
2095
  "kind": "field",
1940
- "name": "offsetX",
2096
+ "name": "outline",
1941
2097
  "type": {
1942
2098
  "text": "string"
1943
2099
  },
1944
- "default": "\"0px\"",
1945
- "description": "Horizontal offset CSS length.",
1946
- "attribute": "offsetX"
2100
+ "default": "\"\"",
2101
+ "description": "CSS `outline` value.",
2102
+ "attribute": "outline"
1947
2103
  },
1948
2104
  {
1949
2105
  "kind": "field",
1950
- "name": "offsetY",
2106
+ "name": "outlineOffset",
1951
2107
  "type": {
1952
2108
  "text": "string"
1953
2109
  },
1954
- "default": "\"0px\"",
1955
- "description": "Vertical offset CSS length.",
1956
- "attribute": "offsetY"
2110
+ "default": "\"2px\"",
2111
+ "description": "CSS `outline-offset` value.",
2112
+ "attribute": "outlineOffset"
1957
2113
  },
1958
2114
  {
1959
2115
  "kind": "field",
1960
- "name": "ring",
2116
+ "name": "loading",
1961
2117
  "type": {
1962
2118
  "text": "boolean"
1963
2119
  },
1964
2120
  "default": "false",
1965
- "description": "Enables visual ring around the badge.",
1966
- "attribute": "ring"
1967
- },
1968
- {
1969
- "kind": "field",
1970
- "name": "ringColor",
1971
- "type": {
1972
- "text": "string"
1973
- },
1974
- "default": "\"primary\"",
1975
- "description": "Ring color token or CSS color.",
1976
- "attribute": "ringColor"
1977
- },
1978
- {
1979
- "kind": "field",
1980
- "name": "ringOffset",
1981
- "type": {
1982
- "text": "string"
1983
- },
1984
- "default": "\"1px\"",
1985
- "description": "Ring offset CSS length.",
1986
- "attribute": "ringOffset"
2121
+ "description": "Shows loading overlay when true.",
2122
+ "attribute": "loading",
2123
+ "reflects": true
1987
2124
  },
1988
2125
  {
1989
2126
  "kind": "field",
1990
- "name": "badgeLabel",
2127
+ "name": "disabled",
1991
2128
  "type": {
1992
- "text": "string | null"
2129
+ "text": "boolean"
1993
2130
  },
1994
- "default": "null",
1995
- "description": "ARIA label override.",
1996
- "attribute": "badgeLabel"
2131
+ "default": "false",
2132
+ "description": "Dims and disables pointer interactions.",
2133
+ "attribute": "disabled",
2134
+ "reflects": true
1997
2135
  },
1998
2136
  {
1999
2137
  "kind": "field",
2000
- "name": "badgeAriaHidden",
2138
+ "name": "interactive",
2001
2139
  "type": {
2002
2140
  "text": "boolean"
2003
2141
  },
2004
2142
  "default": "false",
2005
- "description": "Hides badge from assistive technology when true.",
2006
- "attribute": "badgeAriaHidden"
2143
+ "description": "Enables interactive behavior with keyboard/click activation.",
2144
+ "attribute": "interactive"
2007
2145
  },
2008
2146
  {
2009
2147
  "kind": "field",
2010
- "name": "interactive",
2148
+ "name": "shadow",
2011
2149
  "type": {
2012
2150
  "text": "boolean"
2013
2151
  },
2014
2152
  "default": "false",
2015
- "description": "Enables focus/activation and `badge-click` emission.",
2016
- "attribute": "interactive"
2153
+ "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
2154
+ "attribute": "shadow",
2155
+ "reflects": true
2017
2156
  },
2018
2157
  {
2019
2158
  "kind": "field",
2020
- "name": "placement",
2159
+ "name": "_imageError",
2021
2160
  "type": {
2022
- "text": "SkyBadgePlacement"
2161
+ "text": "boolean"
2023
2162
  },
2024
- "default": "\"custom\"",
2025
- "description": "Anchor placement preset for badge positioning.",
2026
- "attribute": "placement",
2027
- "reflects": true
2163
+ "privacy": "private",
2164
+ "default": "false",
2165
+ "description": "True when image failed to load; show slot instead."
2028
2166
  },
2029
2167
  {
2030
2168
  "kind": "field",
@@ -2045,302 +2183,164 @@
2045
2183
  },
2046
2184
  {
2047
2185
  "kind": "field",
2048
- "name": "_badgeEl",
2049
- "type": {
2050
- "text": "HTMLSpanElement"
2051
- },
2052
- "privacy": "private"
2053
- },
2054
- {
2055
- "kind": "field",
2056
- "name": "badgeRef",
2057
- "privacy": "public",
2058
- "description": "Ref for the badge element (e.g. for tooltip anchor or positioning)."
2059
- },
2060
- {
2061
- "kind": "field",
2062
- "name": "shadowRootOptions",
2063
- "type": {
2064
- "text": "ShadowRootInit"
2065
- },
2066
- "static": true,
2067
- "default": "{ mode: \"open\", delegatesFocus: true, }"
2068
- },
2069
- {
2070
- "kind": "method",
2071
- "name": "showBadge",
2072
- "privacy": "public",
2073
- "return": {
2074
- "type": {
2075
- "text": "void"
2076
- }
2077
- },
2078
- "description": "Forces badge visibility on."
2079
- },
2080
- {
2081
- "kind": "method",
2082
- "name": "hideBadge",
2083
- "privacy": "public",
2084
- "return": {
2085
- "type": {
2086
- "text": "void"
2087
- }
2088
- },
2089
- "description": "Forces badge visibility off."
2090
- },
2091
- {
2092
- "kind": "method",
2093
- "name": "setValue",
2094
- "privacy": "public",
2095
- "return": {
2096
- "type": {
2097
- "text": "void"
2098
- }
2099
- },
2100
- "parameters": [
2101
- {
2102
- "name": "value",
2103
- "type": {
2104
- "text": "string"
2105
- },
2106
- "description": "Badge value or icon name."
2107
- }
2108
- ],
2109
- "description": "Updates badge value for text/count or icon modes."
2110
- },
2111
- {
2112
- "kind": "field",
2113
- "name": "_onActivate",
2186
+ "name": "_onImageLoad",
2114
2187
  "privacy": "private",
2115
- "description": "Emits `badge-click` for interactive activation."
2188
+ "description": "Marks image load success and keeps image rendering active."
2116
2189
  },
2117
2190
  {
2118
2191
  "kind": "field",
2119
- "name": "_onKeydown",
2192
+ "name": "_onImageError",
2120
2193
  "privacy": "private",
2121
- "description": "Handles keyboard activation with Enter and Space."
2194
+ "description": "Marks image load failure and enables fallback slot rendering."
2122
2195
  },
2123
2196
  {
2124
2197
  "kind": "method",
2125
- "name": "_computeAriaLabel",
2198
+ "name": "_handleInteractiveClick",
2126
2199
  "privacy": "private",
2127
2200
  "return": {
2128
2201
  "type": {
2129
- "text": "string | null"
2202
+ "text": "void"
2130
2203
  }
2131
2204
  },
2132
2205
  "parameters": [
2133
2206
  {
2134
- "name": "displayValue",
2207
+ "name": "e",
2135
2208
  "type": {
2136
- "text": "string | null"
2209
+ "text": "Event"
2137
2210
  }
2138
2211
  }
2139
2212
  ],
2140
- "description": "Computes accessible badge label from current render state."
2213
+ "description": "Re-dispatches click in interactive mode for host-level consumers."
2141
2214
  },
2142
2215
  {
2143
2216
  "kind": "method",
2144
- "name": "_computeAnchors",
2217
+ "name": "_handleInteractiveKeydown",
2145
2218
  "privacy": "private",
2146
2219
  "return": {
2147
2220
  "type": {
2148
- "text": "{\r\n top: string;\r\n right: string;\r\n bottom: string;\r\n left: string;\r\n }"
2221
+ "text": "void"
2149
2222
  }
2150
2223
  },
2151
2224
  "parameters": [
2152
2225
  {
2153
- "name": "placement",
2226
+ "name": "e",
2154
2227
  "type": {
2155
- "text": "SkyBadgePlacement"
2228
+ "text": "KeyboardEvent"
2156
2229
  }
2157
2230
  }
2158
2231
  ],
2159
- "description": "Resolves anchor edges from placement preset."
2232
+ "description": "Handles keyboard activation in interactive mode."
2160
2233
  },
2161
2234
  {
2162
2235
  "kind": "method",
2163
- "name": "_resolveBadgeSurface",
2236
+ "name": "adjustSpinnerSize",
2164
2237
  "privacy": "private",
2165
2238
  "return": {
2166
2239
  "type": {
2167
- "text": "{\r\n bg: string;\r\n color: string;\r\n border: string;\r\n }"
2240
+ "text": "void"
2168
2241
  }
2169
2242
  },
2170
- "description": "Maps semantic status tokens to soft badge surface colors."
2243
+ "description": "Derives spinner dimensions from current avatar size."
2171
2244
  }
2172
2245
  ],
2173
2246
  "events": [
2174
2247
  {
2248
+ "name": "click",
2175
2249
  "type": {
2176
- "text": "CustomEvent<SkyBadgeClickEventDetail>"
2177
- },
2178
- "description": "Emitted when badge activation occurs via click, Enter, or Space while `interactive` is true.",
2179
- "name": "badge-click"
2250
+ "text": "Event"
2251
+ }
2180
2252
  }
2181
2253
  ],
2182
2254
  "attributes": [
2183
2255
  {
2184
- "name": "statusColor",
2185
- "type": {
2186
- "text": "string"
2187
- },
2188
- "default": "\"success\"",
2189
- "description": "Badge background token or CSS color.",
2190
- "fieldName": "statusColor"
2191
- },
2192
- {
2193
- "name": "textColor",
2256
+ "name": "size",
2194
2257
  "type": {
2195
2258
  "text": "string"
2196
2259
  },
2197
- "default": "\"default\"",
2198
- "description": "Text color token or CSS color.",
2199
- "fieldName": "textColor"
2260
+ "default": "\"50px\"",
2261
+ "description": "Avatar size: preset `sm` | `md` | `lg` or CSS length (for example `50px`).",
2262
+ "fieldName": "size"
2200
2263
  },
2201
2264
  {
2202
- "name": "iconColor",
2265
+ "name": "image",
2203
2266
  "type": {
2204
2267
  "text": "string"
2205
2268
  },
2206
2269
  "default": "\"\"",
2207
- "description": "Icon color token or CSS color; falls back to `textColor` when empty.",
2208
- "fieldName": "iconColor"
2270
+ "description": "Image URL; fallback slot is shown on load error.",
2271
+ "fieldName": "image"
2209
2272
  },
2210
2273
  {
2211
- "name": "position",
2274
+ "name": "fit",
2212
2275
  "type": {
2213
- "text": "SkyBadgePosition"
2276
+ "text": "SkyAvatarFit"
2214
2277
  },
2215
- "default": "\"default\"",
2216
- "description": "Layout mode: `default | floating | inline`.",
2217
- "fieldName": "position"
2278
+ "default": "\"cover\"",
2279
+ "description": "Image fill mode: `cover` (default) or `contain`.",
2280
+ "fieldName": "fit"
2218
2281
  },
2219
2282
  {
2220
- "name": "value",
2283
+ "name": "radius",
2221
2284
  "type": {
2222
2285
  "text": "string"
2223
2286
  },
2224
- "default": "\"\"",
2225
- "description": "Badge text/count or icon name in icon mode.",
2226
- "fieldName": "value"
2227
- },
2228
- {
2229
- "name": "isIcon",
2230
- "type": {
2231
- "text": "boolean"
2232
- },
2233
- "default": "false",
2234
- "description": "Renders icon mode when true.",
2235
- "fieldName": "isIcon"
2287
+ "default": "\"md\"",
2288
+ "description": "Border radius token or CSS value.",
2289
+ "fieldName": "radius"
2236
2290
  },
2237
2291
  {
2238
- "name": "size",
2292
+ "name": "alt",
2239
2293
  "type": {
2240
2294
  "text": "string"
2241
2295
  },
2242
2296
  "default": "\"\"",
2243
- "description": "Badge and icon size CSS length.",
2244
- "fieldName": "size"
2245
- },
2246
- {
2247
- "name": "shape",
2248
- "type": {
2249
- "text": "SkyBadgeShape"
2250
- },
2251
- "default": "\"custom\"",
2252
- "description": "Badge shape: `circle | pill | custom`.",
2253
- "fieldName": "shape"
2254
- },
2255
- {
2256
- "name": "max",
2257
- "type": {
2258
- "text": "number"
2259
- },
2260
- "default": "99",
2261
- "description": "Maximum numeric count before rendering overflow label.",
2262
- "fieldName": "max"
2263
- },
2264
- {
2265
- "name": "hideWhenZero",
2266
- "type": {
2267
- "text": "boolean"
2268
- },
2269
- "default": "false",
2270
- "description": "Hides badge when value resolves to numeric zero.",
2271
- "fieldName": "hideWhenZero"
2297
+ "description": "Accessible name when image content conveys meaning.",
2298
+ "fieldName": "alt"
2272
2299
  },
2273
2300
  {
2274
- "name": "show",
2301
+ "name": "color",
2275
2302
  "type": {
2276
- "text": "boolean"
2303
+ "text": "string"
2277
2304
  },
2278
- "default": "true",
2279
- "description": "Forces badge visibility independent of value.",
2280
- "fieldName": "show"
2305
+ "default": "\"dark\"",
2306
+ "description": "Token or CSS color applied to fallback slot content.",
2307
+ "fieldName": "color"
2281
2308
  },
2282
2309
  {
2283
- "name": "offsetX",
2310
+ "name": "outline",
2284
2311
  "type": {
2285
2312
  "text": "string"
2286
2313
  },
2287
- "default": "\"0px\"",
2288
- "description": "Horizontal offset CSS length.",
2289
- "fieldName": "offsetX"
2314
+ "default": "\"\"",
2315
+ "description": "CSS `outline` value.",
2316
+ "fieldName": "outline"
2290
2317
  },
2291
2318
  {
2292
- "name": "offsetY",
2319
+ "name": "outlineOffset",
2293
2320
  "type": {
2294
2321
  "text": "string"
2295
2322
  },
2296
- "default": "\"0px\"",
2297
- "description": "Vertical offset CSS length.",
2298
- "fieldName": "offsetY"
2323
+ "default": "\"2px\"",
2324
+ "description": "CSS `outline-offset` value.",
2325
+ "fieldName": "outlineOffset"
2299
2326
  },
2300
2327
  {
2301
- "name": "ring",
2328
+ "name": "loading",
2302
2329
  "type": {
2303
2330
  "text": "boolean"
2304
2331
  },
2305
2332
  "default": "false",
2306
- "description": "Enables visual ring around the badge.",
2307
- "fieldName": "ring"
2308
- },
2309
- {
2310
- "name": "ringColor",
2311
- "type": {
2312
- "text": "string"
2313
- },
2314
- "default": "\"primary\"",
2315
- "description": "Ring color token or CSS color.",
2316
- "fieldName": "ringColor"
2317
- },
2318
- {
2319
- "name": "ringOffset",
2320
- "type": {
2321
- "text": "string"
2322
- },
2323
- "default": "\"1px\"",
2324
- "description": "Ring offset CSS length.",
2325
- "fieldName": "ringOffset"
2326
- },
2327
- {
2328
- "name": "badgeLabel",
2329
- "type": {
2330
- "text": "string | null"
2331
- },
2332
- "default": "null",
2333
- "description": "ARIA label override.",
2334
- "fieldName": "badgeLabel"
2333
+ "description": "Shows loading overlay when true.",
2334
+ "fieldName": "loading"
2335
2335
  },
2336
2336
  {
2337
- "name": "badgeAriaHidden",
2337
+ "name": "disabled",
2338
2338
  "type": {
2339
2339
  "text": "boolean"
2340
2340
  },
2341
2341
  "default": "false",
2342
- "description": "Hides badge from assistive technology when true.",
2343
- "fieldName": "badgeAriaHidden"
2342
+ "description": "Dims and disables pointer interactions.",
2343
+ "fieldName": "disabled"
2344
2344
  },
2345
2345
  {
2346
2346
  "name": "interactive",
@@ -2348,17 +2348,17 @@
2348
2348
  "text": "boolean"
2349
2349
  },
2350
2350
  "default": "false",
2351
- "description": "Enables focus/activation and `badge-click` emission.",
2351
+ "description": "Enables interactive behavior with keyboard/click activation.",
2352
2352
  "fieldName": "interactive"
2353
2353
  },
2354
2354
  {
2355
- "name": "placement",
2355
+ "name": "shadow",
2356
2356
  "type": {
2357
- "text": "SkyBadgePlacement"
2357
+ "text": "boolean"
2358
2358
  },
2359
- "default": "\"custom\"",
2360
- "description": "Anchor placement preset for badge positioning.",
2361
- "fieldName": "placement"
2359
+ "default": "false",
2360
+ "description": "When true, applies solid surface, border ring, and elevation; no backdrop blur.",
2361
+ "fieldName": "shadow"
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-badge",
2377
+ "tagName": "sky-avatar",
2378
2378
  "customElement": true,
2379
- "summary": "Badge for status dots, counts, or icons anchored to slotted content."
2379
+ "summary": "Avatar that renders image content or fallback slot content with configurable size, radius, outline, and loading state."
2380
2380
  }
2381
2381
  ],
2382
2382
  "exports": [
2383
2383
  {
2384
2384
  "kind": "js",
2385
- "name": "SkyBadge",
2385
+ "name": "SkyAvatar",
2386
2386
  "declaration": {
2387
- "name": "SkyBadge",
2388
- "module": "src/sky-badge/sky-badge.ts"
2387
+ "name": "SkyAvatar",
2388
+ "module": "src/sky-avatar/sky-avatar.ts"
2389
2389
  }
2390
2390
  },
2391
2391
  {
2392
2392
  "kind": "custom-element-definition",
2393
- "name": "sky-badge",
2393
+ "name": "sky-avatar",
2394
2394
  "declaration": {
2395
- "name": "SkyBadge",
2396
- "module": "src/sky-badge/sky-badge.ts"
2395
+ "name": "SkyAvatar",
2396
+ "module": "src/sky-avatar/sky-avatar.ts"
2397
2397
  }
2398
2398
  }
2399
2399
  ]
@@ -9213,308 +9213,225 @@
9213
9213
  {
9214
9214
  "kind": "custom-element-definition",
9215
9215
  "name": "sky-grid",
9216
- "declaration": {
9217
- "name": "SkyGrid",
9218
- "module": "src/sky-grid/sky-grid.ts"
9219
- }
9220
- }
9221
- ]
9222
- },
9223
- {
9224
- "kind": "javascript-module",
9225
- "path": "src/sky-icon/sky-icon.ts",
9226
- "declarations": [
9227
- {
9228
- "kind": "class",
9229
- "description": "",
9230
- "name": "SkyIcon",
9231
- "cssParts": [
9232
- {
9233
- "description": "The icon container element.",
9234
- "name": "icon"
9235
- },
9236
- {
9237
- "description": "The rendered SVG element.",
9238
- "name": "svg"
9239
- }
9240
- ],
9241
- "slots": [
9242
- {
9243
- "description": "Optional fallback `<svg>` content when remote icon data is unavailable.",
9244
- "name": ""
9245
- }
9246
- ],
9247
- "members": [
9248
- {
9249
- "kind": "field",
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)."
9255
- },
9256
- {
9257
- "kind": "field",
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>"
9263
- },
9264
- {
9265
- "kind": "field",
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"
9271
- },
9272
- {
9273
- "kind": "field",
9274
- "name": "_localIcons",
9275
- "privacy": "private",
9276
- "static": true,
9277
- "default": "new Map<string, IconifyIcon>()",
9278
- "description": "Single local icons (full name -> icon data)"
9279
- },
9216
+ "declaration": {
9217
+ "name": "SkyGrid",
9218
+ "module": "src/sky-grid/sky-grid.ts"
9219
+ }
9220
+ }
9221
+ ]
9222
+ },
9223
+ {
9224
+ "kind": "javascript-module",
9225
+ "path": "src/sky-image/sky-image.ts",
9226
+ "declarations": [
9227
+ {
9228
+ "kind": "class",
9229
+ "description": "",
9230
+ "name": "SkyImage",
9231
+ "cssParts": [
9280
9232
  {
9281
- "kind": "method",
9282
- "name": "registerLocalSet",
9283
- "static": true,
9284
- "return": {
9285
- "type": {
9286
- "text": "void"
9287
- }
9288
- },
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
- },
9233
+ "description": "The underlying `<img>` element.",
9234
+ "name": "img"
9235
+ }
9236
+ ],
9237
+ "slots": [
9307
9238
  {
9308
- "kind": "method",
9309
- "name": "registerLocalIcon",
9310
- "static": true,
9311
- "return": {
9312
- "type": {
9313
- "text": "void"
9314
- }
9315
- },
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)."
9333
- },
9239
+ "description": "No slots are exposed; image content is rendered internally.",
9240
+ "name": ""
9241
+ }
9242
+ ],
9243
+ "members": [
9334
9244
  {
9335
9245
  "kind": "field",
9336
- "name": "preset",
9246
+ "name": "src",
9337
9247
  "type": {
9338
9248
  "text": "string"
9339
9249
  },
9340
9250
  "default": "\"\"",
9341
- "description": "Named prop preset from nearest `sky-config-provider`.",
9342
- "attribute": "preset",
9343
- "reflects": true
9344
- },
9345
- {
9346
- "kind": "field",
9347
- "name": "_presets",
9348
- "privacy": "private",
9349
- "default": "new PresetController(this)"
9251
+ "description": "Primary image source URL.",
9252
+ "attribute": "src"
9350
9253
  },
9351
9254
  {
9352
9255
  "kind": "field",
9353
- "name": "icon",
9256
+ "name": "alt",
9354
9257
  "type": {
9355
9258
  "text": "string"
9356
9259
  },
9357
- "default": "''",
9358
- "description": "Icon name in `prefix:icon-name` format.",
9359
- "attribute": "icon"
9260
+ "default": "\"Image\"",
9261
+ "description": "Alternative text for accessibility.",
9262
+ "attribute": "alt"
9360
9263
  },
9361
9264
  {
9362
9265
  "kind": "field",
9363
9266
  "name": "width",
9364
9267
  "type": {
9365
- "text": "SkyIconSizeValue"
9268
+ "text": "string"
9366
9269
  },
9367
- "default": "''",
9368
- "description": "Icon width value.",
9270
+ "default": "\"auto\"",
9271
+ "description": "CSS width for the rendered image.",
9369
9272
  "attribute": "width"
9370
9273
  },
9371
9274
  {
9372
9275
  "kind": "field",
9373
9276
  "name": "height",
9374
9277
  "type": {
9375
- "text": "SkyIconSizeValue"
9278
+ "text": "string"
9376
9279
  },
9377
- "default": "''",
9378
- "description": "Icon height value.",
9280
+ "default": "\"auto\"",
9281
+ "description": "CSS height for the rendered image.",
9379
9282
  "attribute": "height"
9380
9283
  },
9381
9284
  {
9382
9285
  "kind": "field",
9383
- "name": "color",
9286
+ "name": "aspectRatio",
9287
+ "type": {
9288
+ "text": "string | null"
9289
+ },
9290
+ "default": "null",
9291
+ "description": "CSS `aspect-ratio` value.",
9292
+ "attribute": "aspectRatio"
9293
+ },
9294
+ {
9295
+ "kind": "field",
9296
+ "name": "borderRadius",
9384
9297
  "type": {
9385
9298
  "text": "string"
9386
9299
  },
9387
- "default": "'currentColor'",
9388
- "description": "Icon color value.",
9389
- "attribute": "color"
9300
+ "default": "\"0\"",
9301
+ "description": "CSS border radius.",
9302
+ "attribute": "borderRadius"
9390
9303
  },
9391
9304
  {
9392
9305
  "kind": "field",
9393
- "name": "inline",
9306
+ "name": "boxShadow",
9394
9307
  "type": {
9395
- "text": "boolean"
9308
+ "text": "string"
9396
9309
  },
9397
- "default": "false",
9398
- "description": "Applies inline alignment behavior for text contexts.",
9399
- "attribute": "inline"
9310
+ "default": "\"none\"",
9311
+ "description": "CSS box shadow.",
9312
+ "attribute": "boxShadow"
9400
9313
  },
9401
9314
  {
9402
9315
  "kind": "field",
9403
- "name": "flip",
9316
+ "name": "objectFit",
9404
9317
  "type": {
9405
- "text": "SkyIconFlip"
9318
+ "text": "string"
9406
9319
  },
9407
- "default": "''",
9408
- "description": "Flip transform descriptor.",
9409
- "attribute": "flip"
9320
+ "default": "\"cover\"",
9321
+ "description": "CSS object-fit value.",
9322
+ "attribute": "objectFit"
9410
9323
  },
9411
9324
  {
9412
9325
  "kind": "field",
9413
- "name": "hFlip",
9326
+ "name": "objectPosition",
9414
9327
  "type": {
9415
- "text": "boolean"
9328
+ "text": "string"
9416
9329
  },
9417
- "default": "false",
9418
- "description": "Horizontal flip shortcut.",
9419
- "attribute": "hFlip"
9330
+ "default": "\"center\"",
9331
+ "description": "CSS object-position value.",
9332
+ "attribute": "objectPosition"
9420
9333
  },
9421
9334
  {
9422
9335
  "kind": "field",
9423
- "name": "vFlip",
9336
+ "name": "srcset",
9424
9337
  "type": {
9425
- "text": "boolean"
9338
+ "text": "string"
9426
9339
  },
9427
- "default": "false",
9428
- "description": "Vertical flip shortcut.",
9429
- "attribute": "vFlip"
9340
+ "default": "\"\"",
9341
+ "description": "Responsive source set string.",
9342
+ "attribute": "srcset"
9430
9343
  },
9431
9344
  {
9432
9345
  "kind": "field",
9433
- "name": "rotate",
9346
+ "name": "sizes",
9434
9347
  "type": {
9435
- "text": "SkyIconRotateValue"
9348
+ "text": "string"
9436
9349
  },
9437
- "default": "0",
9438
- "description": "Rotation descriptor.",
9439
- "attribute": "rotate"
9350
+ "default": "\"\"",
9351
+ "description": "Responsive sizes string.",
9352
+ "attribute": "sizes"
9440
9353
  },
9441
9354
  {
9442
9355
  "kind": "field",
9443
- "name": "lazy",
9356
+ "name": "autoSizes",
9444
9357
  "type": {
9445
9358
  "text": "boolean"
9446
9359
  },
9447
9360
  "default": "false",
9448
- "description": "Defers loading until the icon is visible.",
9449
- "attribute": "lazy"
9361
+ "description": "Computes `sizes` from host width when true.",
9362
+ "attribute": "autoSizes"
9450
9363
  },
9451
9364
  {
9452
9365
  "kind": "field",
9453
- "name": "_svgContent",
9366
+ "name": "_computedSizes",
9454
9367
  "type": {
9455
- "text": "string | null"
9368
+ "text": "string"
9456
9369
  },
9457
9370
  "privacy": "private",
9458
- "default": "null"
9371
+ "default": "\"\""
9459
9372
  },
9460
9373
  {
9461
9374
  "kind": "field",
9462
- "name": "_hasSlottedSvg",
9375
+ "name": "loading",
9463
9376
  "type": {
9464
- "text": "boolean"
9377
+ "text": "SkyImageLoading"
9465
9378
  },
9466
- "privacy": "private",
9467
- "default": "false"
9379
+ "default": "\"lazy\"",
9380
+ "description": "Native loading hint.",
9381
+ "attribute": "loading"
9468
9382
  },
9469
9383
  {
9470
9384
  "kind": "field",
9471
- "name": "_observer",
9385
+ "name": "decoding",
9472
9386
  "type": {
9473
- "text": "IntersectionObserver | null"
9387
+ "text": "SkyImageDecoding"
9474
9388
  },
9475
- "privacy": "private",
9476
- "default": "null"
9389
+ "default": "\"async\"",
9390
+ "description": "Native decoding hint.",
9391
+ "attribute": "decoding"
9477
9392
  },
9478
9393
  {
9479
9394
  "kind": "field",
9480
- "name": "_visible",
9395
+ "name": "preset",
9481
9396
  "type": {
9482
- "text": "boolean"
9397
+ "text": "string"
9483
9398
  },
9484
- "privacy": "private",
9485
- "default": "false"
9399
+ "default": "\"\"",
9400
+ "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
9401
+ "attribute": "preset",
9402
+ "reflects": true
9486
9403
  },
9487
9404
  {
9488
- "kind": "method",
9489
- "name": "_onSlotChange",
9405
+ "kind": "field",
9406
+ "name": "_presets",
9490
9407
  "privacy": "private",
9491
- "return": {
9492
- "type": {
9493
- "text": "void"
9494
- }
9408
+ "default": "new PresetController(this)"
9409
+ },
9410
+ {
9411
+ "kind": "field",
9412
+ "name": "_ro",
9413
+ "type": {
9414
+ "text": "ResizeObserver | undefined"
9495
9415
  },
9496
- "parameters": [
9497
- {
9498
- "name": "e",
9499
- "type": {
9500
- "text": "Event"
9501
- }
9502
- }
9503
- ]
9416
+ "privacy": "private"
9504
9417
  },
9505
9418
  {
9506
- "kind": "method",
9507
- "name": "_startObserver",
9419
+ "kind": "field",
9420
+ "name": "_sizesRafId",
9421
+ "type": {
9422
+ "text": "number | null"
9423
+ },
9508
9424
  "privacy": "private",
9509
- "return": {
9510
- "type": {
9511
- "text": "void"
9512
- }
9513
- }
9425
+ "default": "null"
9426
+ },
9427
+ {
9428
+ "kind": "field",
9429
+ "name": "_updateSizes",
9430
+ "privacy": "private"
9514
9431
  },
9515
9432
  {
9516
9433
  "kind": "method",
9517
- "name": "_stopObserver",
9434
+ "name": "_ensureAutoSizesObserver",
9518
9435
  "privacy": "private",
9519
9436
  "return": {
9520
9437
  "type": {
@@ -9524,482 +9441,545 @@
9524
9441
  },
9525
9442
  {
9526
9443
  "kind": "method",
9527
- "name": "_setSvgContent",
9444
+ "name": "_shouldResyncImageSource",
9528
9445
  "privacy": "private",
9529
9446
  "return": {
9530
9447
  "type": {
9531
- "text": "void"
9448
+ "text": "boolean"
9532
9449
  }
9533
9450
  },
9534
9451
  "parameters": [
9535
9452
  {
9536
- "name": "svg",
9453
+ "name": "changed",
9537
9454
  "type": {
9538
- "text": "string | null"
9455
+ "text": "PropertyValues<this>"
9539
9456
  }
9540
9457
  }
9541
- ]
9458
+ ],
9459
+ "description": "Browsers keep the resolved resource when only srcset/sizes attrs change on a live <img>."
9542
9460
  },
9543
9461
  {
9544
9462
  "kind": "method",
9545
- "name": "_loadIcon",
9463
+ "name": "_resolvedSizesAttr",
9546
9464
  "privacy": "private",
9547
9465
  "return": {
9548
9466
  "type": {
9549
- "text": "Promise<void>"
9467
+ "text": "string"
9550
9468
  }
9551
9469
  }
9552
9470
  },
9553
9471
  {
9554
9472
  "kind": "method",
9555
- "name": "_fetchAndBuild",
9473
+ "name": "_displaySrc",
9556
9474
  "privacy": "private",
9557
9475
  "return": {
9558
9476
  "type": {
9559
- "text": "Promise<string>"
9477
+ "text": "string"
9560
9478
  }
9561
9479
  },
9562
- "parameters": [
9563
- {
9564
- "name": "full",
9565
- "type": {
9566
- "text": "string"
9567
- }
9568
- }
9569
- ]
9480
+ "description": "`src` used on <img> — must stay in sync with `srcset` when the set changes."
9570
9481
  },
9571
9482
  {
9572
9483
  "kind": "method",
9573
- "name": "_buildSvg",
9484
+ "name": "_applyImgAttrs",
9574
9485
  "privacy": "private",
9575
9486
  "return": {
9576
9487
  "type": {
9577
- "text": "string"
9488
+ "text": "void"
9578
9489
  }
9579
9490
  },
9580
9491
  "parameters": [
9581
9492
  {
9582
- "name": "icon",
9493
+ "name": "img",
9583
9494
  "type": {
9584
- "text": "IconifyIcon"
9495
+ "text": "HTMLImageElement"
9585
9496
  }
9586
9497
  },
9587
9498
  {
9588
- "name": "set",
9589
- "type": {
9590
- "text": "IconifyCollection"
9591
- }
9592
- }
9593
- ]
9594
- },
9595
- {
9596
- "kind": "method",
9597
- "name": "_normalize",
9598
- "privacy": "private",
9599
- "return": {
9600
- "type": {
9601
- "text": "string"
9602
- }
9603
- },
9604
- "parameters": [
9605
- {
9606
- "name": "v",
9499
+ "name": "srcsetChanged",
9607
9500
  "type": {
9608
- "text": "string | number"
9501
+ "text": "boolean"
9609
9502
  }
9610
9503
  }
9611
9504
  ]
9612
9505
  },
9613
9506
  {
9614
9507
  "kind": "method",
9615
- "name": "_rotationDeg",
9616
- "privacy": "private",
9617
- "return": {
9618
- "type": {
9619
- "text": "number"
9620
- }
9621
- }
9622
- },
9623
- {
9624
- "kind": "method",
9625
- "name": "_flipHas",
9508
+ "name": "_resyncImageSource",
9626
9509
  "privacy": "private",
9627
9510
  "return": {
9628
9511
  "type": {
9629
- "text": "boolean"
9512
+ "text": "void"
9630
9513
  }
9631
9514
  },
9632
9515
  "parameters": [
9633
9516
  {
9634
- "name": "val",
9635
- "type": {
9636
- "text": "'horizontal' | 'vertical'"
9637
- }
9517
+ "name": "srcsetChanged",
9518
+ "default": "false"
9638
9519
  }
9639
9520
  ]
9640
- },
9641
- {
9642
- "kind": "method",
9643
- "name": "_transform",
9644
- "privacy": "private",
9645
- "return": {
9646
- "type": {
9647
- "text": "string"
9648
- }
9649
- }
9650
- },
9651
- {
9652
- "kind": "method",
9653
- "name": "_baseStyle",
9654
- "privacy": "private",
9655
- "return": {
9656
- "type": {
9657
- "text": "Record<string, string>"
9658
- }
9659
- }
9660
9521
  }
9661
9522
  ],
9662
9523
  "attributes": [
9663
9524
  {
9664
- "name": "preset",
9525
+ "name": "src",
9665
9526
  "type": {
9666
9527
  "text": "string"
9667
9528
  },
9668
9529
  "default": "\"\"",
9669
- "description": "Named prop preset from nearest `sky-config-provider`.",
9670
- "fieldName": "preset"
9530
+ "description": "Primary image source URL.",
9531
+ "fieldName": "src"
9671
9532
  },
9672
9533
  {
9673
- "name": "icon",
9534
+ "name": "alt",
9674
9535
  "type": {
9675
9536
  "text": "string"
9676
9537
  },
9677
- "default": "''",
9678
- "description": "Icon name in `prefix:icon-name` format.",
9679
- "fieldName": "icon"
9538
+ "default": "\"Image\"",
9539
+ "description": "Alternative text for accessibility.",
9540
+ "fieldName": "alt"
9680
9541
  },
9681
9542
  {
9682
9543
  "name": "width",
9683
9544
  "type": {
9684
- "text": "SkyIconSizeValue"
9545
+ "text": "string"
9685
9546
  },
9686
- "default": "''",
9687
- "description": "Icon width value.",
9547
+ "default": "\"auto\"",
9548
+ "description": "CSS width for the rendered image.",
9688
9549
  "fieldName": "width"
9689
9550
  },
9690
9551
  {
9691
9552
  "name": "height",
9692
9553
  "type": {
9693
- "text": "SkyIconSizeValue"
9554
+ "text": "string"
9694
9555
  },
9695
- "default": "''",
9696
- "description": "Icon height value.",
9556
+ "default": "\"auto\"",
9557
+ "description": "CSS height for the rendered image.",
9697
9558
  "fieldName": "height"
9698
9559
  },
9699
9560
  {
9700
- "name": "color",
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",
9701
9571
  "type": {
9702
9572
  "text": "string"
9703
9573
  },
9704
- "default": "'currentColor'",
9705
- "description": "Icon color value.",
9706
- "fieldName": "color"
9574
+ "default": "\"0\"",
9575
+ "description": "CSS border radius.",
9576
+ "fieldName": "borderRadius"
9707
9577
  },
9708
9578
  {
9709
- "name": "inline",
9579
+ "name": "boxShadow",
9710
9580
  "type": {
9711
- "text": "boolean"
9581
+ "text": "string"
9712
9582
  },
9713
- "default": "false",
9714
- "description": "Applies inline alignment behavior for text contexts.",
9715
- "fieldName": "inline"
9583
+ "default": "\"none\"",
9584
+ "description": "CSS box shadow.",
9585
+ "fieldName": "boxShadow"
9716
9586
  },
9717
9587
  {
9718
- "name": "flip",
9588
+ "name": "objectFit",
9719
9589
  "type": {
9720
- "text": "SkyIconFlip"
9590
+ "text": "string"
9721
9591
  },
9722
- "default": "''",
9723
- "description": "Flip transform descriptor.",
9724
- "fieldName": "flip"
9592
+ "default": "\"cover\"",
9593
+ "description": "CSS object-fit value.",
9594
+ "fieldName": "objectFit"
9725
9595
  },
9726
9596
  {
9727
- "name": "hFlip",
9597
+ "name": "objectPosition",
9728
9598
  "type": {
9729
- "text": "boolean"
9599
+ "text": "string"
9730
9600
  },
9731
- "default": "false",
9732
- "description": "Horizontal flip shortcut.",
9733
- "fieldName": "hFlip"
9601
+ "default": "\"center\"",
9602
+ "description": "CSS object-position value.",
9603
+ "fieldName": "objectPosition"
9734
9604
  },
9735
9605
  {
9736
- "name": "vFlip",
9606
+ "name": "srcset",
9737
9607
  "type": {
9738
- "text": "boolean"
9608
+ "text": "string"
9739
9609
  },
9740
- "default": "false",
9741
- "description": "Vertical flip shortcut.",
9742
- "fieldName": "vFlip"
9610
+ "default": "\"\"",
9611
+ "description": "Responsive source set string.",
9612
+ "fieldName": "srcset"
9743
9613
  },
9744
9614
  {
9745
- "name": "rotate",
9615
+ "name": "sizes",
9746
9616
  "type": {
9747
- "text": "SkyIconRotateValue"
9617
+ "text": "string"
9748
9618
  },
9749
- "default": "0",
9750
- "description": "Rotation descriptor.",
9751
- "fieldName": "rotate"
9619
+ "default": "\"\"",
9620
+ "description": "Responsive sizes string.",
9621
+ "fieldName": "sizes"
9752
9622
  },
9753
9623
  {
9754
- "name": "lazy",
9624
+ "name": "autoSizes",
9755
9625
  "type": {
9756
9626
  "text": "boolean"
9757
9627
  },
9758
9628
  "default": "false",
9759
- "description": "Defers loading until the icon is visible.",
9760
- "fieldName": "lazy"
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"
9761
9658
  }
9762
9659
  ],
9763
9660
  "superclass": {
9764
9661
  "name": "LitElement",
9765
9662
  "package": "lit"
9766
9663
  },
9767
- "tagName": "sky-icon",
9664
+ "tagName": "sky-image",
9768
9665
  "customElement": true,
9769
- "summary": "Icon renderer with Iconify fetch/caching, lazy loading, and optional slotted SVG fallback."
9666
+ "summary": "Responsive image component with style controls, `srcset`, and optional auto `sizes`."
9770
9667
  }
9771
9668
  ],
9772
9669
  "exports": [
9773
9670
  {
9774
9671
  "kind": "js",
9775
- "name": "SkyIcon",
9672
+ "name": "SkyImage",
9776
9673
  "declaration": {
9777
- "name": "SkyIcon",
9778
- "module": "src/sky-icon/sky-icon.ts"
9674
+ "name": "SkyImage",
9675
+ "module": "src/sky-image/sky-image.ts"
9779
9676
  }
9780
9677
  },
9781
9678
  {
9782
9679
  "kind": "custom-element-definition",
9783
- "name": "sky-icon",
9680
+ "name": "sky-image",
9784
9681
  "declaration": {
9785
- "name": "SkyIcon",
9786
- "module": "src/sky-icon/sky-icon.ts"
9682
+ "name": "SkyImage",
9683
+ "module": "src/sky-image/sky-image.ts"
9787
9684
  }
9788
9685
  }
9789
9686
  ]
9790
9687
  },
9791
9688
  {
9792
9689
  "kind": "javascript-module",
9793
- "path": "src/sky-image/sky-image.ts",
9690
+ "path": "src/sky-icon/sky-icon.ts",
9794
9691
  "declarations": [
9795
9692
  {
9796
9693
  "kind": "class",
9797
9694
  "description": "",
9798
- "name": "SkyImage",
9695
+ "name": "SkyIcon",
9799
9696
  "cssParts": [
9800
9697
  {
9801
- "description": "The underlying `<img>` element.",
9802
- "name": "img"
9698
+ "description": "The icon container element.",
9699
+ "name": "icon"
9700
+ },
9701
+ {
9702
+ "description": "The rendered SVG element.",
9703
+ "name": "svg"
9803
9704
  }
9804
9705
  ],
9805
9706
  "slots": [
9806
9707
  {
9807
- "description": "No slots are exposed; image content is rendered internally.",
9708
+ "description": "Optional fallback `<svg>` content when remote icon data is unavailable.",
9808
9709
  "name": ""
9809
9710
  }
9810
9711
  ],
9811
9712
  "members": [
9812
9713
  {
9813
9714
  "kind": "field",
9814
- "name": "src",
9815
- "type": {
9816
- "text": "string"
9817
- },
9818
- "default": "\"\"",
9819
- "description": "Primary image source URL.",
9820
- "attribute": "src"
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)."
9821
9720
  },
9822
9721
  {
9823
9722
  "kind": "field",
9824
- "name": "alt",
9825
- "type": {
9826
- "text": "string"
9827
- },
9828
- "default": "\"Image\"",
9829
- "description": "Alternative text for accessibility.",
9830
- "attribute": "alt"
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>"
9831
9728
  },
9832
9729
  {
9833
9730
  "kind": "field",
9834
- "name": "width",
9835
- "type": {
9836
- "text": "string"
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",
9740
+ "privacy": "private",
9741
+ "static": true,
9742
+ "default": "new Map<string, IconifyIcon>()",
9743
+ "description": "Single local icons (full name -> icon data)"
9744
+ },
9745
+ {
9746
+ "kind": "method",
9747
+ "name": "registerLocalSet",
9748
+ "static": true,
9749
+ "return": {
9750
+ "type": {
9751
+ "text": "void"
9752
+ }
9837
9753
  },
9838
- "default": "\"auto\"",
9839
- "description": "CSS width for the rendered image.",
9840
- "attribute": "width"
9754
+ "parameters": [
9755
+ {
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",
9764
+ "type": {
9765
+ "text": "IconifySetData"
9766
+ },
9767
+ "description": "Set data with `icons` and optional defaults (width, height, left, top)."
9768
+ }
9769
+ ],
9770
+ "description": "Register a local icon set (Iconify-compatible JSON) for offline or custom icons."
9771
+ },
9772
+ {
9773
+ "kind": "method",
9774
+ "name": "registerLocalIcon",
9775
+ "static": true,
9776
+ "return": {
9777
+ "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.)."
9795
+ }
9796
+ ],
9797
+ "description": "Register a single local icon (one-off custom icon without a full set)."
9841
9798
  },
9842
9799
  {
9843
9800
  "kind": "field",
9844
- "name": "height",
9801
+ "name": "preset",
9845
9802
  "type": {
9846
9803
  "text": "string"
9847
9804
  },
9848
- "default": "\"auto\"",
9849
- "description": "CSS height for the rendered image.",
9850
- "attribute": "height"
9805
+ "default": "\"\"",
9806
+ "description": "Named prop preset from nearest `sky-config-provider`.",
9807
+ "attribute": "preset",
9808
+ "reflects": true
9851
9809
  },
9852
9810
  {
9853
9811
  "kind": "field",
9854
- "name": "aspectRatio",
9855
- "type": {
9856
- "text": "string | null"
9857
- },
9858
- "default": "null",
9859
- "description": "CSS `aspect-ratio` value.",
9860
- "attribute": "aspectRatio"
9812
+ "name": "_presets",
9813
+ "privacy": "private",
9814
+ "default": "new PresetController(this)"
9861
9815
  },
9862
9816
  {
9863
9817
  "kind": "field",
9864
- "name": "borderRadius",
9818
+ "name": "icon",
9865
9819
  "type": {
9866
9820
  "text": "string"
9867
9821
  },
9868
- "default": "\"0\"",
9869
- "description": "CSS border radius.",
9870
- "attribute": "borderRadius"
9822
+ "default": "''",
9823
+ "description": "Icon name in `prefix:icon-name` format.",
9824
+ "attribute": "icon"
9871
9825
  },
9872
9826
  {
9873
9827
  "kind": "field",
9874
- "name": "boxShadow",
9828
+ "name": "width",
9875
9829
  "type": {
9876
- "text": "string"
9830
+ "text": "SkyIconSizeValue"
9877
9831
  },
9878
- "default": "\"none\"",
9879
- "description": "CSS box shadow.",
9880
- "attribute": "boxShadow"
9832
+ "default": "''",
9833
+ "description": "Icon width value.",
9834
+ "attribute": "width"
9881
9835
  },
9882
9836
  {
9883
9837
  "kind": "field",
9884
- "name": "objectFit",
9838
+ "name": "height",
9885
9839
  "type": {
9886
- "text": "string"
9840
+ "text": "SkyIconSizeValue"
9887
9841
  },
9888
- "default": "\"cover\"",
9889
- "description": "CSS object-fit value.",
9890
- "attribute": "objectFit"
9842
+ "default": "''",
9843
+ "description": "Icon height value.",
9844
+ "attribute": "height"
9891
9845
  },
9892
9846
  {
9893
9847
  "kind": "field",
9894
- "name": "objectPosition",
9848
+ "name": "color",
9895
9849
  "type": {
9896
9850
  "text": "string"
9897
9851
  },
9898
- "default": "\"center\"",
9899
- "description": "CSS object-position value.",
9900
- "attribute": "objectPosition"
9852
+ "default": "'currentColor'",
9853
+ "description": "Icon color value.",
9854
+ "attribute": "color"
9901
9855
  },
9902
9856
  {
9903
9857
  "kind": "field",
9904
- "name": "srcset",
9858
+ "name": "inline",
9905
9859
  "type": {
9906
- "text": "string"
9860
+ "text": "boolean"
9907
9861
  },
9908
- "default": "\"\"",
9909
- "description": "Responsive source set string.",
9910
- "attribute": "srcset"
9862
+ "default": "false",
9863
+ "description": "Applies inline alignment behavior for text contexts.",
9864
+ "attribute": "inline"
9911
9865
  },
9912
9866
  {
9913
9867
  "kind": "field",
9914
- "name": "sizes",
9868
+ "name": "flip",
9915
9869
  "type": {
9916
- "text": "string"
9870
+ "text": "SkyIconFlip"
9917
9871
  },
9918
- "default": "\"\"",
9919
- "description": "Responsive sizes string.",
9920
- "attribute": "sizes"
9872
+ "default": "''",
9873
+ "description": "Flip transform descriptor.",
9874
+ "attribute": "flip"
9921
9875
  },
9922
9876
  {
9923
9877
  "kind": "field",
9924
- "name": "autoSizes",
9878
+ "name": "hFlip",
9925
9879
  "type": {
9926
9880
  "text": "boolean"
9927
9881
  },
9928
9882
  "default": "false",
9929
- "description": "Computes `sizes` from host width when true.",
9930
- "attribute": "autoSizes"
9883
+ "description": "Horizontal flip shortcut.",
9884
+ "attribute": "hFlip"
9931
9885
  },
9932
9886
  {
9933
9887
  "kind": "field",
9934
- "name": "_computedSizes",
9888
+ "name": "vFlip",
9935
9889
  "type": {
9936
- "text": "string"
9890
+ "text": "boolean"
9937
9891
  },
9938
- "privacy": "private",
9939
- "default": "\"\""
9892
+ "default": "false",
9893
+ "description": "Vertical flip shortcut.",
9894
+ "attribute": "vFlip"
9940
9895
  },
9941
9896
  {
9942
9897
  "kind": "field",
9943
- "name": "loading",
9898
+ "name": "rotate",
9944
9899
  "type": {
9945
- "text": "SkyImageLoading"
9900
+ "text": "SkyIconRotateValue"
9946
9901
  },
9947
- "default": "\"lazy\"",
9948
- "description": "Native loading hint.",
9949
- "attribute": "loading"
9902
+ "default": "0",
9903
+ "description": "Rotation descriptor.",
9904
+ "attribute": "rotate"
9950
9905
  },
9951
9906
  {
9952
9907
  "kind": "field",
9953
- "name": "decoding",
9908
+ "name": "lazy",
9954
9909
  "type": {
9955
- "text": "SkyImageDecoding"
9910
+ "text": "boolean"
9956
9911
  },
9957
- "default": "\"async\"",
9958
- "description": "Native decoding hint.",
9959
- "attribute": "decoding"
9912
+ "default": "false",
9913
+ "description": "Defers loading until the icon is visible.",
9914
+ "attribute": "lazy"
9960
9915
  },
9961
9916
  {
9962
9917
  "kind": "field",
9963
- "name": "preset",
9918
+ "name": "_svgContent",
9964
9919
  "type": {
9965
- "text": "string"
9920
+ "text": "string | null"
9966
9921
  },
9967
- "default": "\"\"",
9968
- "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
9969
- "attribute": "preset",
9970
- "reflects": true
9922
+ "privacy": "private",
9923
+ "default": "null"
9971
9924
  },
9972
9925
  {
9973
9926
  "kind": "field",
9974
- "name": "_presets",
9927
+ "name": "_hasSlottedSvg",
9928
+ "type": {
9929
+ "text": "boolean"
9930
+ },
9975
9931
  "privacy": "private",
9976
- "default": "new PresetController(this)"
9932
+ "default": "false"
9977
9933
  },
9978
9934
  {
9979
9935
  "kind": "field",
9980
- "name": "_ro",
9936
+ "name": "_observer",
9981
9937
  "type": {
9982
- "text": "ResizeObserver | undefined"
9938
+ "text": "IntersectionObserver | null"
9983
9939
  },
9984
- "privacy": "private"
9940
+ "privacy": "private",
9941
+ "default": "null"
9985
9942
  },
9986
9943
  {
9987
9944
  "kind": "field",
9988
- "name": "_sizesRafId",
9945
+ "name": "_visible",
9989
9946
  "type": {
9990
- "text": "number | null"
9947
+ "text": "boolean"
9991
9948
  },
9992
9949
  "privacy": "private",
9993
- "default": "null"
9950
+ "default": "false"
9951
+ },
9952
+ {
9953
+ "kind": "method",
9954
+ "name": "_onSlotChange",
9955
+ "privacy": "private",
9956
+ "return": {
9957
+ "type": {
9958
+ "text": "void"
9959
+ }
9960
+ },
9961
+ "parameters": [
9962
+ {
9963
+ "name": "e",
9964
+ "type": {
9965
+ "text": "Event"
9966
+ }
9967
+ }
9968
+ ]
9994
9969
  },
9995
9970
  {
9996
- "kind": "field",
9997
- "name": "_updateSizes",
9998
- "privacy": "private"
9971
+ "kind": "method",
9972
+ "name": "_startObserver",
9973
+ "privacy": "private",
9974
+ "return": {
9975
+ "type": {
9976
+ "text": "void"
9977
+ }
9978
+ }
9999
9979
  },
10000
9980
  {
10001
9981
  "kind": "method",
10002
- "name": "_ensureAutoSizesObserver",
9982
+ "name": "_stopObserver",
10003
9983
  "privacy": "private",
10004
9984
  "return": {
10005
9985
  "type": {
@@ -10009,246 +9989,266 @@
10009
9989
  },
10010
9990
  {
10011
9991
  "kind": "method",
10012
- "name": "_shouldResyncImageSource",
9992
+ "name": "_setSvgContent",
10013
9993
  "privacy": "private",
10014
9994
  "return": {
10015
9995
  "type": {
10016
- "text": "boolean"
9996
+ "text": "void"
10017
9997
  }
10018
9998
  },
10019
9999
  "parameters": [
10020
10000
  {
10021
- "name": "changed",
10001
+ "name": "svg",
10022
10002
  "type": {
10023
- "text": "PropertyValues<this>"
10003
+ "text": "string | null"
10024
10004
  }
10025
10005
  }
10026
- ],
10027
- "description": "Browsers keep the resolved resource when only srcset/sizes attrs change on a live <img>."
10006
+ ]
10028
10007
  },
10029
10008
  {
10030
10009
  "kind": "method",
10031
- "name": "_resolvedSizesAttr",
10010
+ "name": "_loadIcon",
10032
10011
  "privacy": "private",
10033
10012
  "return": {
10034
10013
  "type": {
10035
- "text": "string"
10014
+ "text": "Promise<void>"
10036
10015
  }
10037
10016
  }
10038
10017
  },
10039
10018
  {
10040
10019
  "kind": "method",
10041
- "name": "_displaySrc",
10020
+ "name": "_fetchAndBuild",
10042
10021
  "privacy": "private",
10043
10022
  "return": {
10044
10023
  "type": {
10045
- "text": "string"
10024
+ "text": "Promise<string>"
10046
10025
  }
10047
10026
  },
10048
- "description": "`src` used on <img> — must stay in sync with `srcset` when the set changes."
10027
+ "parameters": [
10028
+ {
10029
+ "name": "full",
10030
+ "type": {
10031
+ "text": "string"
10032
+ }
10033
+ }
10034
+ ]
10049
10035
  },
10050
10036
  {
10051
10037
  "kind": "method",
10052
- "name": "_applyImgAttrs",
10038
+ "name": "_buildSvg",
10053
10039
  "privacy": "private",
10054
10040
  "return": {
10055
10041
  "type": {
10056
- "text": "void"
10042
+ "text": "string"
10057
10043
  }
10058
10044
  },
10059
10045
  "parameters": [
10060
10046
  {
10061
- "name": "img",
10047
+ "name": "icon",
10062
10048
  "type": {
10063
- "text": "HTMLImageElement"
10049
+ "text": "IconifyIcon"
10064
10050
  }
10065
10051
  },
10066
10052
  {
10067
- "name": "srcsetChanged",
10053
+ "name": "set",
10068
10054
  "type": {
10069
- "text": "boolean"
10055
+ "text": "IconifyCollection"
10070
10056
  }
10071
10057
  }
10072
10058
  ]
10073
10059
  },
10074
10060
  {
10075
10061
  "kind": "method",
10076
- "name": "_resyncImageSource",
10062
+ "name": "_normalize",
10077
10063
  "privacy": "private",
10078
10064
  "return": {
10079
10065
  "type": {
10080
- "text": "void"
10066
+ "text": "string"
10081
10067
  }
10082
10068
  },
10083
10069
  "parameters": [
10084
10070
  {
10085
- "name": "srcsetChanged",
10086
- "default": "false"
10071
+ "name": "v",
10072
+ "type": {
10073
+ "text": "string | number"
10074
+ }
10075
+ }
10076
+ ]
10077
+ },
10078
+ {
10079
+ "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",
10091
+ "privacy": "private",
10092
+ "return": {
10093
+ "type": {
10094
+ "text": "boolean"
10095
+ }
10096
+ },
10097
+ "parameters": [
10098
+ {
10099
+ "name": "val",
10100
+ "type": {
10101
+ "text": "'horizontal' | 'vertical'"
10102
+ }
10087
10103
  }
10088
10104
  ]
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
+ }
10089
10125
  }
10090
10126
  ],
10091
10127
  "attributes": [
10092
10128
  {
10093
- "name": "src",
10129
+ "name": "preset",
10094
10130
  "type": {
10095
10131
  "text": "string"
10096
10132
  },
10097
10133
  "default": "\"\"",
10098
- "description": "Primary image source URL.",
10099
- "fieldName": "src"
10134
+ "description": "Named prop preset from nearest `sky-config-provider`.",
10135
+ "fieldName": "preset"
10100
10136
  },
10101
10137
  {
10102
- "name": "alt",
10138
+ "name": "icon",
10103
10139
  "type": {
10104
10140
  "text": "string"
10105
10141
  },
10106
- "default": "\"Image\"",
10107
- "description": "Alternative text for accessibility.",
10108
- "fieldName": "alt"
10142
+ "default": "''",
10143
+ "description": "Icon name in `prefix:icon-name` format.",
10144
+ "fieldName": "icon"
10109
10145
  },
10110
10146
  {
10111
10147
  "name": "width",
10112
10148
  "type": {
10113
- "text": "string"
10149
+ "text": "SkyIconSizeValue"
10114
10150
  },
10115
- "default": "\"auto\"",
10116
- "description": "CSS width for the rendered image.",
10151
+ "default": "''",
10152
+ "description": "Icon width value.",
10117
10153
  "fieldName": "width"
10118
10154
  },
10119
10155
  {
10120
10156
  "name": "height",
10121
10157
  "type": {
10122
- "text": "string"
10158
+ "text": "SkyIconSizeValue"
10123
10159
  },
10124
- "default": "\"auto\"",
10125
- "description": "CSS height for the rendered image.",
10160
+ "default": "''",
10161
+ "description": "Icon height value.",
10126
10162
  "fieldName": "height"
10127
10163
  },
10128
10164
  {
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",
10139
- "type": {
10140
- "text": "string"
10141
- },
10142
- "default": "\"0\"",
10143
- "description": "CSS border radius.",
10144
- "fieldName": "borderRadius"
10145
- },
10146
- {
10147
- "name": "boxShadow",
10148
- "type": {
10149
- "text": "string"
10150
- },
10151
- "default": "\"none\"",
10152
- "description": "CSS box shadow.",
10153
- "fieldName": "boxShadow"
10154
- },
10155
- {
10156
- "name": "objectFit",
10157
- "type": {
10158
- "text": "string"
10159
- },
10160
- "default": "\"cover\"",
10161
- "description": "CSS object-fit value.",
10162
- "fieldName": "objectFit"
10163
- },
10164
- {
10165
- "name": "objectPosition",
10165
+ "name": "color",
10166
10166
  "type": {
10167
10167
  "text": "string"
10168
10168
  },
10169
- "default": "\"center\"",
10170
- "description": "CSS object-position value.",
10171
- "fieldName": "objectPosition"
10169
+ "default": "'currentColor'",
10170
+ "description": "Icon color value.",
10171
+ "fieldName": "color"
10172
10172
  },
10173
10173
  {
10174
- "name": "srcset",
10174
+ "name": "inline",
10175
10175
  "type": {
10176
- "text": "string"
10176
+ "text": "boolean"
10177
10177
  },
10178
- "default": "\"\"",
10179
- "description": "Responsive source set string.",
10180
- "fieldName": "srcset"
10178
+ "default": "false",
10179
+ "description": "Applies inline alignment behavior for text contexts.",
10180
+ "fieldName": "inline"
10181
10181
  },
10182
10182
  {
10183
- "name": "sizes",
10183
+ "name": "flip",
10184
10184
  "type": {
10185
- "text": "string"
10185
+ "text": "SkyIconFlip"
10186
10186
  },
10187
- "default": "\"\"",
10188
- "description": "Responsive sizes string.",
10189
- "fieldName": "sizes"
10187
+ "default": "''",
10188
+ "description": "Flip transform descriptor.",
10189
+ "fieldName": "flip"
10190
10190
  },
10191
10191
  {
10192
- "name": "autoSizes",
10192
+ "name": "hFlip",
10193
10193
  "type": {
10194
10194
  "text": "boolean"
10195
10195
  },
10196
10196
  "default": "false",
10197
- "description": "Computes `sizes` from host width when true.",
10198
- "fieldName": "autoSizes"
10197
+ "description": "Horizontal flip shortcut.",
10198
+ "fieldName": "hFlip"
10199
10199
  },
10200
10200
  {
10201
- "name": "loading",
10201
+ "name": "vFlip",
10202
10202
  "type": {
10203
- "text": "SkyImageLoading"
10203
+ "text": "boolean"
10204
10204
  },
10205
- "default": "\"lazy\"",
10206
- "description": "Native loading hint.",
10207
- "fieldName": "loading"
10205
+ "default": "false",
10206
+ "description": "Vertical flip shortcut.",
10207
+ "fieldName": "vFlip"
10208
10208
  },
10209
10209
  {
10210
- "name": "decoding",
10210
+ "name": "rotate",
10211
10211
  "type": {
10212
- "text": "SkyImageDecoding"
10212
+ "text": "SkyIconRotateValue"
10213
10213
  },
10214
- "default": "\"async\"",
10215
- "description": "Native decoding hint.",
10216
- "fieldName": "decoding"
10214
+ "default": "0",
10215
+ "description": "Rotation descriptor.",
10216
+ "fieldName": "rotate"
10217
10217
  },
10218
10218
  {
10219
- "name": "preset",
10219
+ "name": "lazy",
10220
10220
  "type": {
10221
- "text": "string"
10221
+ "text": "boolean"
10222
10222
  },
10223
- "default": "\"\"",
10224
- "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
10225
- "fieldName": "preset"
10223
+ "default": "false",
10224
+ "description": "Defers loading until the icon is visible.",
10225
+ "fieldName": "lazy"
10226
10226
  }
10227
10227
  ],
10228
10228
  "superclass": {
10229
10229
  "name": "LitElement",
10230
10230
  "package": "lit"
10231
10231
  },
10232
- "tagName": "sky-image",
10232
+ "tagName": "sky-icon",
10233
10233
  "customElement": true,
10234
- "summary": "Responsive image component with style controls, `srcset`, and optional auto `sizes`."
10234
+ "summary": "Icon renderer with Iconify fetch/caching, lazy loading, and optional slotted SVG fallback."
10235
10235
  }
10236
10236
  ],
10237
10237
  "exports": [
10238
10238
  {
10239
10239
  "kind": "js",
10240
- "name": "SkyImage",
10240
+ "name": "SkyIcon",
10241
10241
  "declaration": {
10242
- "name": "SkyImage",
10243
- "module": "src/sky-image/sky-image.ts"
10242
+ "name": "SkyIcon",
10243
+ "module": "src/sky-icon/sky-icon.ts"
10244
10244
  }
10245
10245
  },
10246
10246
  {
10247
10247
  "kind": "custom-element-definition",
10248
- "name": "sky-image",
10248
+ "name": "sky-icon",
10249
10249
  "declaration": {
10250
- "name": "SkyImage",
10251
- "module": "src/sky-image/sky-image.ts"
10250
+ "name": "SkyIcon",
10251
+ "module": "src/sky-icon/sky-icon.ts"
10252
10252
  }
10253
10253
  }
10254
10254
  ]
@@ -12367,6 +12367,262 @@
12367
12367
  }
12368
12368
  ]
12369
12369
  },
12370
+ {
12371
+ "kind": "javascript-module",
12372
+ "path": "src/sky-listitem/sky-listitem.ts",
12373
+ "declarations": [
12374
+ {
12375
+ "kind": "class",
12376
+ "description": "",
12377
+ "name": "SkyListitem",
12378
+ "cssParts": [
12379
+ {
12380
+ "description": "The main list item container.",
12381
+ "name": "list-item"
12382
+ },
12383
+ {
12384
+ "description": "The leading section (avatar container).",
12385
+ "name": "leading"
12386
+ },
12387
+ {
12388
+ "description": "The avatar image element.",
12389
+ "name": "avatar"
12390
+ },
12391
+ {
12392
+ "description": "The content wrapper for the main slot.",
12393
+ "name": "content"
12394
+ },
12395
+ {
12396
+ "description": "The trailing actions container.",
12397
+ "name": "actions"
12398
+ },
12399
+ {
12400
+ "description": "The subheader divider element.",
12401
+ "name": "subheader"
12402
+ }
12403
+ ],
12404
+ "slots": [
12405
+ {
12406
+ "description": "Main content of the list item (usually label or text).",
12407
+ "name": "content"
12408
+ },
12409
+ {
12410
+ "description": "Trailing action elements (e.g., icons, buttons).",
12411
+ "name": "actions"
12412
+ }
12413
+ ],
12414
+ "members": [
12415
+ {
12416
+ "kind": "field",
12417
+ "name": "avatar",
12418
+ "type": {
12419
+ "text": "string"
12420
+ },
12421
+ "default": "\"\"",
12422
+ "description": "Optional avatar image URL.",
12423
+ "attribute": "avatar"
12424
+ },
12425
+ {
12426
+ "kind": "field",
12427
+ "name": "value",
12428
+ "type": {
12429
+ "text": "string"
12430
+ },
12431
+ "default": "\"\"",
12432
+ "description": "Stable id for selection (`sky-list` `selectedValues` / `list-change`). Default: `\"\"`.",
12433
+ "attribute": "value"
12434
+ },
12435
+ {
12436
+ "kind": "field",
12437
+ "name": "subheader",
12438
+ "type": {
12439
+ "text": "string"
12440
+ },
12441
+ "default": "\"\"",
12442
+ "description": "Subheader text; when set, item renders as a section header.",
12443
+ "attribute": "subheader",
12444
+ "reflects": true
12445
+ },
12446
+ {
12447
+ "kind": "field",
12448
+ "name": "selected",
12449
+ "type": {
12450
+ "text": "boolean"
12451
+ },
12452
+ "default": "false",
12453
+ "description": "Whether item is selected.",
12454
+ "attribute": "selected",
12455
+ "reflects": true
12456
+ },
12457
+ {
12458
+ "kind": "field",
12459
+ "name": "dense",
12460
+ "type": {
12461
+ "text": "boolean"
12462
+ },
12463
+ "default": "false",
12464
+ "description": "Whether compact spacing is used.",
12465
+ "attribute": "dense",
12466
+ "reflects": true
12467
+ },
12468
+ {
12469
+ "kind": "field",
12470
+ "name": "disabled",
12471
+ "type": {
12472
+ "text": "boolean"
12473
+ },
12474
+ "default": "false",
12475
+ "description": "Whether interaction is disabled.",
12476
+ "attribute": "disabled",
12477
+ "reflects": true
12478
+ },
12479
+ {
12480
+ "kind": "field",
12481
+ "name": "preset",
12482
+ "type": {
12483
+ "text": "string"
12484
+ },
12485
+ "default": "\"\"",
12486
+ "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
12487
+ "attribute": "preset",
12488
+ "reflects": true
12489
+ },
12490
+ {
12491
+ "kind": "field",
12492
+ "name": "_presets",
12493
+ "privacy": "private",
12494
+ "default": "new PresetController(this)"
12495
+ },
12496
+ {
12497
+ "kind": "method",
12498
+ "name": "onClick",
12499
+ "privacy": "private",
12500
+ "return": {
12501
+ "type": {
12502
+ "text": "void"
12503
+ }
12504
+ }
12505
+ },
12506
+ {
12507
+ "kind": "method",
12508
+ "name": "setSelected",
12509
+ "return": {
12510
+ "type": {
12511
+ "text": "void"
12512
+ }
12513
+ },
12514
+ "parameters": [
12515
+ {
12516
+ "name": "selected",
12517
+ "type": {
12518
+ "text": "boolean"
12519
+ }
12520
+ }
12521
+ ]
12522
+ }
12523
+ ],
12524
+ "events": [
12525
+ {
12526
+ "name": "item-activate",
12527
+ "type": {
12528
+ "text": "CustomEvent<SkyListitemActivateDetail>"
12529
+ },
12530
+ "description": "Fired when the item is activated."
12531
+ }
12532
+ ],
12533
+ "attributes": [
12534
+ {
12535
+ "name": "avatar",
12536
+ "type": {
12537
+ "text": "string"
12538
+ },
12539
+ "default": "\"\"",
12540
+ "description": "Optional avatar image URL.",
12541
+ "fieldName": "avatar"
12542
+ },
12543
+ {
12544
+ "name": "value",
12545
+ "type": {
12546
+ "text": "string"
12547
+ },
12548
+ "default": "\"\"",
12549
+ "description": "Stable id for selection (`sky-list` `selectedValues` / `list-change`). Default: `\"\"`.",
12550
+ "fieldName": "value"
12551
+ },
12552
+ {
12553
+ "name": "subheader",
12554
+ "type": {
12555
+ "text": "string"
12556
+ },
12557
+ "default": "\"\"",
12558
+ "description": "Subheader text; when set, item renders as a section header.",
12559
+ "fieldName": "subheader"
12560
+ },
12561
+ {
12562
+ "name": "selected",
12563
+ "type": {
12564
+ "text": "boolean"
12565
+ },
12566
+ "default": "false",
12567
+ "description": "Whether item is selected.",
12568
+ "fieldName": "selected"
12569
+ },
12570
+ {
12571
+ "name": "dense",
12572
+ "type": {
12573
+ "text": "boolean"
12574
+ },
12575
+ "default": "false",
12576
+ "description": "Whether compact spacing is used.",
12577
+ "fieldName": "dense"
12578
+ },
12579
+ {
12580
+ "name": "disabled",
12581
+ "type": {
12582
+ "text": "boolean"
12583
+ },
12584
+ "default": "false",
12585
+ "description": "Whether interaction is disabled.",
12586
+ "fieldName": "disabled"
12587
+ },
12588
+ {
12589
+ "name": "preset",
12590
+ "type": {
12591
+ "text": "string"
12592
+ },
12593
+ "default": "\"\"",
12594
+ "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
12595
+ "fieldName": "preset"
12596
+ }
12597
+ ],
12598
+ "superclass": {
12599
+ "name": "LitElement",
12600
+ "package": "lit"
12601
+ },
12602
+ "tagName": "sky-listitem",
12603
+ "customElement": true,
12604
+ "summary": "List item with optional avatar, actions, subheader mode, and selectable state."
12605
+ }
12606
+ ],
12607
+ "exports": [
12608
+ {
12609
+ "kind": "js",
12610
+ "name": "SkyListitem",
12611
+ "declaration": {
12612
+ "name": "SkyListitem",
12613
+ "module": "src/sky-listitem/sky-listitem.ts"
12614
+ }
12615
+ },
12616
+ {
12617
+ "kind": "custom-element-definition",
12618
+ "name": "sky-listitem",
12619
+ "declaration": {
12620
+ "name": "SkyListitem",
12621
+ "module": "src/sky-listitem/sky-listitem.ts"
12622
+ }
12623
+ }
12624
+ ]
12625
+ },
12370
12626
  {
12371
12627
  "kind": "javascript-module",
12372
12628
  "path": "src/sky-radio/sky-radio.ts",
@@ -12810,262 +13066,6 @@
12810
13066
  }
12811
13067
  ]
12812
13068
  },
12813
- {
12814
- "kind": "javascript-module",
12815
- "path": "src/sky-listitem/sky-listitem.ts",
12816
- "declarations": [
12817
- {
12818
- "kind": "class",
12819
- "description": "",
12820
- "name": "SkyListitem",
12821
- "cssParts": [
12822
- {
12823
- "description": "The main list item container.",
12824
- "name": "list-item"
12825
- },
12826
- {
12827
- "description": "The leading section (avatar container).",
12828
- "name": "leading"
12829
- },
12830
- {
12831
- "description": "The avatar image element.",
12832
- "name": "avatar"
12833
- },
12834
- {
12835
- "description": "The content wrapper for the main slot.",
12836
- "name": "content"
12837
- },
12838
- {
12839
- "description": "The trailing actions container.",
12840
- "name": "actions"
12841
- },
12842
- {
12843
- "description": "The subheader divider element.",
12844
- "name": "subheader"
12845
- }
12846
- ],
12847
- "slots": [
12848
- {
12849
- "description": "Main content of the list item (usually label or text).",
12850
- "name": "content"
12851
- },
12852
- {
12853
- "description": "Trailing action elements (e.g., icons, buttons).",
12854
- "name": "actions"
12855
- }
12856
- ],
12857
- "members": [
12858
- {
12859
- "kind": "field",
12860
- "name": "avatar",
12861
- "type": {
12862
- "text": "string"
12863
- },
12864
- "default": "\"\"",
12865
- "description": "Optional avatar image URL.",
12866
- "attribute": "avatar"
12867
- },
12868
- {
12869
- "kind": "field",
12870
- "name": "value",
12871
- "type": {
12872
- "text": "string"
12873
- },
12874
- "default": "\"\"",
12875
- "description": "Stable id for selection (`sky-list` `selectedValues` / `list-change`). Default: `\"\"`.",
12876
- "attribute": "value"
12877
- },
12878
- {
12879
- "kind": "field",
12880
- "name": "subheader",
12881
- "type": {
12882
- "text": "string"
12883
- },
12884
- "default": "\"\"",
12885
- "description": "Subheader text; when set, item renders as a section header.",
12886
- "attribute": "subheader",
12887
- "reflects": true
12888
- },
12889
- {
12890
- "kind": "field",
12891
- "name": "selected",
12892
- "type": {
12893
- "text": "boolean"
12894
- },
12895
- "default": "false",
12896
- "description": "Whether item is selected.",
12897
- "attribute": "selected",
12898
- "reflects": true
12899
- },
12900
- {
12901
- "kind": "field",
12902
- "name": "dense",
12903
- "type": {
12904
- "text": "boolean"
12905
- },
12906
- "default": "false",
12907
- "description": "Whether compact spacing is used.",
12908
- "attribute": "dense",
12909
- "reflects": true
12910
- },
12911
- {
12912
- "kind": "field",
12913
- "name": "disabled",
12914
- "type": {
12915
- "text": "boolean"
12916
- },
12917
- "default": "false",
12918
- "description": "Whether interaction is disabled.",
12919
- "attribute": "disabled",
12920
- "reflects": true
12921
- },
12922
- {
12923
- "kind": "field",
12924
- "name": "preset",
12925
- "type": {
12926
- "text": "string"
12927
- },
12928
- "default": "\"\"",
12929
- "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
12930
- "attribute": "preset",
12931
- "reflects": true
12932
- },
12933
- {
12934
- "kind": "field",
12935
- "name": "_presets",
12936
- "privacy": "private",
12937
- "default": "new PresetController(this)"
12938
- },
12939
- {
12940
- "kind": "method",
12941
- "name": "onClick",
12942
- "privacy": "private",
12943
- "return": {
12944
- "type": {
12945
- "text": "void"
12946
- }
12947
- }
12948
- },
12949
- {
12950
- "kind": "method",
12951
- "name": "setSelected",
12952
- "return": {
12953
- "type": {
12954
- "text": "void"
12955
- }
12956
- },
12957
- "parameters": [
12958
- {
12959
- "name": "selected",
12960
- "type": {
12961
- "text": "boolean"
12962
- }
12963
- }
12964
- ]
12965
- }
12966
- ],
12967
- "events": [
12968
- {
12969
- "name": "item-activate",
12970
- "type": {
12971
- "text": "CustomEvent<SkyListitemActivateDetail>"
12972
- },
12973
- "description": "Fired when the item is activated."
12974
- }
12975
- ],
12976
- "attributes": [
12977
- {
12978
- "name": "avatar",
12979
- "type": {
12980
- "text": "string"
12981
- },
12982
- "default": "\"\"",
12983
- "description": "Optional avatar image URL.",
12984
- "fieldName": "avatar"
12985
- },
12986
- {
12987
- "name": "value",
12988
- "type": {
12989
- "text": "string"
12990
- },
12991
- "default": "\"\"",
12992
- "description": "Stable id for selection (`sky-list` `selectedValues` / `list-change`). Default: `\"\"`.",
12993
- "fieldName": "value"
12994
- },
12995
- {
12996
- "name": "subheader",
12997
- "type": {
12998
- "text": "string"
12999
- },
13000
- "default": "\"\"",
13001
- "description": "Subheader text; when set, item renders as a section header.",
13002
- "fieldName": "subheader"
13003
- },
13004
- {
13005
- "name": "selected",
13006
- "type": {
13007
- "text": "boolean"
13008
- },
13009
- "default": "false",
13010
- "description": "Whether item is selected.",
13011
- "fieldName": "selected"
13012
- },
13013
- {
13014
- "name": "dense",
13015
- "type": {
13016
- "text": "boolean"
13017
- },
13018
- "default": "false",
13019
- "description": "Whether compact spacing is used.",
13020
- "fieldName": "dense"
13021
- },
13022
- {
13023
- "name": "disabled",
13024
- "type": {
13025
- "text": "boolean"
13026
- },
13027
- "default": "false",
13028
- "description": "Whether interaction is disabled.",
13029
- "fieldName": "disabled"
13030
- },
13031
- {
13032
- "name": "preset",
13033
- "type": {
13034
- "text": "string"
13035
- },
13036
- "default": "\"\"",
13037
- "description": "Named prop preset from nearest `sky-config-provider`. Default: `\"\"`.",
13038
- "fieldName": "preset"
13039
- }
13040
- ],
13041
- "superclass": {
13042
- "name": "LitElement",
13043
- "package": "lit"
13044
- },
13045
- "tagName": "sky-listitem",
13046
- "customElement": true,
13047
- "summary": "List item with optional avatar, actions, subheader mode, and selectable state."
13048
- }
13049
- ],
13050
- "exports": [
13051
- {
13052
- "kind": "js",
13053
- "name": "SkyListitem",
13054
- "declaration": {
13055
- "name": "SkyListitem",
13056
- "module": "src/sky-listitem/sky-listitem.ts"
13057
- }
13058
- },
13059
- {
13060
- "kind": "custom-element-definition",
13061
- "name": "sky-listitem",
13062
- "declaration": {
13063
- "name": "SkyListitem",
13064
- "module": "src/sky-listitem/sky-listitem.ts"
13065
- }
13066
- }
13067
- ]
13068
- },
13069
13069
  {
13070
13070
  "kind": "javascript-module",
13071
13071
  "path": "src/sky-row/sky-row.ts",