@juspay/svelte-ui-components 2.120.3 → 2.121.0

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.
@@ -416,6 +416,9 @@
416
416
  .command-menu-item-icon-img-wrapper {
417
417
  --image-width: var(--command-menu-item-icon-size, 20px);
418
418
  --image-height: var(--command-menu-item-icon-size, 20px);
419
+
420
+ /* Mirrors --command-menu-search-icon-color, which this component already had. */
421
+ color: var(--command-menu-item-icon-color, inherit);
419
422
  flex-shrink: 0;
420
423
  display: flex;
421
424
  align-items: center;
@@ -57,11 +57,17 @@
57
57
  .file-dropzone-trigger-icon-sm :global(.file-dropzone-trigger-icon-sm-img) {
58
58
  --image-width: var(--file-dropzone-trigger-icon-sm-size, 16px);
59
59
  --image-height: var(--file-dropzone-trigger-icon-sm-size, 16px);
60
+
61
+ color: var(--file-dropzone-trigger-icon-color, inherit);
60
62
  }
61
63
 
62
64
  .file-dropzone-trigger-icon :global(.file-dropzone-trigger-icon-img) {
63
65
  --image-width: var(--file-dropzone-trigger-icon-size, 24px);
64
66
  --image-height: var(--file-dropzone-trigger-icon-size, 24px);
67
+
68
+ /* Both sizes share one colour token deliberately: they are the same icon at two
69
+ scales, and splitting them would invite the two to drift apart. */
70
+ color: var(--file-dropzone-trigger-icon-color, inherit);
65
71
  }
66
72
 
67
73
  .file-dropzone-trigger-heading {
@@ -664,6 +664,13 @@
664
664
  --image-width: var(--select-left-icon-size, 16px);
665
665
  --image-height: var(--select-left-icon-size, 16px);
666
666
  --image-object-fit: contain;
667
+
668
+ /* The icon inlines, so a currentColor asset resolves against this. Defaults to
669
+ `inherit` — the trigger's text colour, which is what it already did — so this is
670
+ a hook, not a change. Without it a consumer cannot tint the icon independently
671
+ of the label, and an icon migrated to currentColor is forced to match its label
672
+ exactly, flattening any deliberate muted-icon/strong-label hierarchy. */
673
+ color: var(--select-left-icon-color, inherit);
667
674
  flex: none;
668
675
  }
669
676
 
@@ -785,6 +792,7 @@
785
792
  --image-height: var(--select-option-icon-size, 16px);
786
793
  --image-object-fit: contain;
787
794
 
795
+ color: var(--select-option-icon-color, inherit);
788
796
  vertical-align: middle;
789
797
  margin-right: var(--select-option-icon-gap, 8px);
790
798
  }
@@ -54,6 +54,7 @@
54
54
  }
55
55
 
56
56
  .status-image {
57
+ color: var(--status-icon-color, inherit);
57
58
  display: flex;
58
59
  margin-bottom: 25px;
59
60
  }
@@ -589,6 +589,8 @@
589
589
  .builtin-icon-label-icon :global(svg) {
590
590
  width: var(--table-cell-icon-size, 16px);
591
591
  height: var(--table-cell-icon-size, 16px);
592
+
593
+ color: var(--table-cell-icon-color, inherit);
592
594
  display: block;
593
595
  }
594
596
 
@@ -445,6 +445,7 @@
445
445
  --image-height: var(--tabs-item-icon-size, 16px);
446
446
  --image-object-fit: contain;
447
447
 
448
+ color: var(--tabs-item-icon-color, inherit);
448
449
  flex-shrink: 0;
449
450
  }
450
451
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@juspay/svelte-ui-components",
3
- "version": "2.120.3",
3
+ "version": "2.121.0",
4
4
  "description": "A themeable Svelte 5 UI component library with CSS custom property driven styling",
5
5
  "keywords": [
6
6
  "svelte",