@salt-ds/core 1.53.0 → 1.54.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.
Files changed (91) hide show
  1. package/CHANGELOG.md +29 -0
  2. package/css/salt-core.css +47 -45
  3. package/dist-cjs/avatar/Avatar.css.js +1 -1
  4. package/dist-cjs/badge/Badge.css.js +1 -1
  5. package/dist-cjs/combo-box/ComboBox.js +2 -1
  6. package/dist-cjs/combo-box/ComboBox.js.map +1 -1
  7. package/dist-cjs/index.js +2 -0
  8. package/dist-cjs/index.js.map +1 -1
  9. package/dist-cjs/menu/MenuBase.js +5 -2
  10. package/dist-cjs/menu/MenuBase.js.map +1 -1
  11. package/dist-cjs/menu/MenuContext.js +3 -1
  12. package/dist-cjs/menu/MenuContext.js.map +1 -1
  13. package/dist-cjs/menu/MenuItem.js +5 -0
  14. package/dist-cjs/menu/MenuItem.js.map +1 -1
  15. package/dist-cjs/multiline-input/MultilineInput.js +2 -1
  16. package/dist-cjs/multiline-input/MultilineInput.js.map +1 -1
  17. package/dist-cjs/number-input/NumberInput.js +7 -7
  18. package/dist-cjs/number-input/NumberInput.js.map +1 -1
  19. package/dist-cjs/number-input/internal/useLongPressPointerAction.js +63 -0
  20. package/dist-cjs/number-input/internal/useLongPressPointerAction.js.map +1 -0
  21. package/dist-cjs/pill/Pill.js +72 -9
  22. package/dist-cjs/pill/Pill.js.map +1 -1
  23. package/dist-cjs/pill/PillCheckIcon.css.js +6 -0
  24. package/dist-cjs/pill/PillCheckIcon.css.js.map +1 -0
  25. package/dist-cjs/pill/PillCheckIcon.js +48 -0
  26. package/dist-cjs/pill/PillCheckIcon.js.map +1 -0
  27. package/dist-cjs/pill/PillGroup.css.js +6 -0
  28. package/dist-cjs/pill/PillGroup.css.js.map +1 -0
  29. package/dist-cjs/pill/PillGroup.js +83 -0
  30. package/dist-cjs/pill/PillGroup.js.map +1 -0
  31. package/dist-cjs/pill/PillGroupContext.js +27 -0
  32. package/dist-cjs/pill/PillGroupContext.js.map +1 -0
  33. package/dist-cjs/pill-input/PillInput.js +1 -0
  34. package/dist-cjs/pill-input/PillInput.js.map +1 -1
  35. package/dist-cjs/slider/internal/useRangeSliderThumb.js +14 -5
  36. package/dist-cjs/slider/internal/useRangeSliderThumb.js.map +1 -1
  37. package/dist-cjs/slider/internal/useSliderThumb.js +14 -5
  38. package/dist-cjs/slider/internal/useSliderThumb.js.map +1 -1
  39. package/dist-cjs/tag/Tag.css.js +1 -1
  40. package/dist-cjs/toggle-button/ToggleButton.css.js +1 -1
  41. package/dist-es/avatar/Avatar.css.js +1 -1
  42. package/dist-es/badge/Badge.css.js +1 -1
  43. package/dist-es/combo-box/ComboBox.js +3 -2
  44. package/dist-es/combo-box/ComboBox.js.map +1 -1
  45. package/dist-es/index.js +1 -0
  46. package/dist-es/index.js.map +1 -1
  47. package/dist-es/menu/MenuBase.js +5 -2
  48. package/dist-es/menu/MenuBase.js.map +1 -1
  49. package/dist-es/menu/MenuContext.js +3 -1
  50. package/dist-es/menu/MenuContext.js.map +1 -1
  51. package/dist-es/menu/MenuItem.js +6 -1
  52. package/dist-es/menu/MenuItem.js.map +1 -1
  53. package/dist-es/multiline-input/MultilineInput.js +3 -2
  54. package/dist-es/multiline-input/MultilineInput.js.map +1 -1
  55. package/dist-es/number-input/NumberInput.js +7 -7
  56. package/dist-es/number-input/NumberInput.js.map +1 -1
  57. package/dist-es/number-input/internal/useLongPressPointerAction.js +61 -0
  58. package/dist-es/number-input/internal/useLongPressPointerAction.js.map +1 -0
  59. package/dist-es/pill/Pill.js +74 -11
  60. package/dist-es/pill/Pill.js.map +1 -1
  61. package/dist-es/pill/PillCheckIcon.css.js +4 -0
  62. package/dist-es/pill/PillCheckIcon.css.js.map +1 -0
  63. package/dist-es/pill/PillCheckIcon.js +46 -0
  64. package/dist-es/pill/PillCheckIcon.js.map +1 -0
  65. package/dist-es/pill/PillGroup.css.js +4 -0
  66. package/dist-es/pill/PillGroup.css.js.map +1 -0
  67. package/dist-es/pill/PillGroup.js +81 -0
  68. package/dist-es/pill/PillGroup.js.map +1 -0
  69. package/dist-es/pill/PillGroupContext.js +24 -0
  70. package/dist-es/pill/PillGroupContext.js.map +1 -0
  71. package/dist-es/pill-input/PillInput.js +1 -0
  72. package/dist-es/pill-input/PillInput.js.map +1 -1
  73. package/dist-es/slider/internal/useRangeSliderThumb.js +14 -5
  74. package/dist-es/slider/internal/useRangeSliderThumb.js.map +1 -1
  75. package/dist-es/slider/internal/useSliderThumb.js +14 -5
  76. package/dist-es/slider/internal/useSliderThumb.js.map +1 -1
  77. package/dist-es/tag/Tag.css.js +1 -1
  78. package/dist-es/toggle-button/ToggleButton.css.js +1 -1
  79. package/dist-types/menu/MenuContext.d.ts +2 -0
  80. package/dist-types/number-input/internal/useLongPressPointerAction.d.ts +2 -0
  81. package/dist-types/pill/Pill.d.ts +1 -0
  82. package/dist-types/pill/PillCheckIcon.d.ts +7 -0
  83. package/dist-types/pill/PillGroup.d.ts +34 -0
  84. package/dist-types/pill/PillGroupContext.d.ts +9 -0
  85. package/dist-types/pill/index.d.ts +1 -0
  86. package/package.json +1 -1
  87. package/dist-cjs/number-input/internal/useActivateWhileMouseDown.js +0 -50
  88. package/dist-cjs/number-input/internal/useActivateWhileMouseDown.js.map +0 -1
  89. package/dist-es/number-input/internal/useActivateWhileMouseDown.js +0 -48
  90. package/dist-es/number-input/internal/useActivateWhileMouseDown.js.map +0 -1
  91. package/dist-types/number-input/internal/useActivateWhileMouseDown.d.ts +0 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,34 @@
1
1
  # @salt-ds/core
2
2
 
3
+ ## 1.54.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 64afd57: Introduced a PillGroup component.
8
+ This enhancement allows for multi-selection functionality, making it easier to capture user choices in grouped pill interfaces.
9
+
10
+ Usage example:
11
+
12
+ ```tsx
13
+ <PillGroup>
14
+ <Pill value="one">Pill 1</Pill>
15
+ <Pill value="two">Pill 2</Pill>
16
+ <Pill value="three">Pill 3</Pill>
17
+ </PillGroup>
18
+ ```
19
+
20
+ - 1511c0d: Based on consumer feedback, we have enhanced our button's solid appearance hover state to include a fill color change along with the border, improving visual affordance. Additionally, for the transparent button appearance, the border is now removed in both hover and active states, and the fill uses a subtler style—applying a black alpha in light mode and a white alpha in dark mode.
21
+
22
+ ### Patch Changes
23
+
24
+ - 89779b5: Updated foreground tokens used in Avatar, Badge and Tag.
25
+ - 10ffed9: Fixed disabled `MenuItem`s opening submenus on hover.
26
+ - 12ef4c9: Fixed right click behavior on `NumberInput` and `Slider`.
27
+
28
+ Previously, when users right-clicked on the increment/decrement buttons of the `NumberInput` or the thumb of the `Slider`, these components could remain stuck in a pressed state. The components have been updated to properly handle right-clicks and other pointer events by canceling the pressed state when such interactions occur.
29
+
30
+ - e31acee: Removed `useLayoutEffect` usage to fix warnings being logged during SSR.
31
+
3
32
  ## 1.53.0
4
33
 
5
34
  ### Minor Changes
package/css/salt-core.css CHANGED
@@ -125,7 +125,7 @@
125
125
  --saltIcon-size: calc(var(--avatar-container-size) / 2);
126
126
  }
127
127
  .saltAvatar {
128
- color: var(--saltAvatar-foreground, var(--avatar-foreground));
128
+ color: var(--saltAvatar-foreground, var(--salt-content-bold-foreground));
129
129
  background: var(--saltAvatar-background, var(--avatar-background));
130
130
  font-size: var(--avatar-fontSize);
131
131
  line-height: var(--saltAvatar-lineHeight, var(--salt-text-notation-lineHeight));
@@ -144,87 +144,66 @@
144
144
  }
145
145
  .saltAvatar-accent {
146
146
  --avatar-background: var(--salt-accent-background);
147
- --avatar-foreground: var(--salt-accent-foreground);
148
147
  }
149
148
  .saltAvatar-category-1 {
150
149
  --avatar-background: var(--salt-category-1-bold-background);
151
- --avatar-foreground: var(--salt-category-1-bold-foreground);
152
150
  }
153
151
  .saltAvatar-category-2 {
154
152
  --avatar-background: var(--salt-category-2-bold-background);
155
- --avatar-foreground: var(--salt-category-2-bold-foreground);
156
153
  }
157
154
  .saltAvatar-category-3 {
158
155
  --avatar-background: var(--salt-category-3-bold-background);
159
- --avatar-foreground: var(--salt-category-3-bold-foreground);
160
156
  }
161
157
  .saltAvatar-category-4 {
162
158
  --avatar-background: var(--salt-category-4-bold-background);
163
- --avatar-foreground: var(--salt-category-4-bold-foreground);
164
159
  }
165
160
  .saltAvatar-category-5 {
166
161
  --avatar-background: var(--salt-category-5-bold-background);
167
- --avatar-foreground: var(--salt-category-5-bold-foreground);
168
162
  }
169
163
  .saltAvatar-category-6 {
170
164
  --avatar-background: var(--salt-category-6-bold-background);
171
- --avatar-foreground: var(--salt-category-6-bold-foreground);
172
165
  }
173
166
  .saltAvatar-category-7 {
174
167
  --avatar-background: var(--salt-category-7-bold-background);
175
- --avatar-foreground: var(--salt-category-7-bold-foreground);
176
168
  }
177
169
  .saltAvatar-category-8 {
178
170
  --avatar-background: var(--salt-category-8-bold-background);
179
- --avatar-foreground: var(--salt-category-8-bold-foreground);
180
171
  }
181
172
  .saltAvatar-category-9 {
182
173
  --avatar-background: var(--salt-category-9-bold-background);
183
- --avatar-foreground: var(--salt-category-9-bold-foreground);
184
174
  }
185
175
  .saltAvatar-category-10 {
186
176
  --avatar-background: var(--salt-category-10-bold-background);
187
- --avatar-foreground: var(--salt-category-10-bold-foreground);
188
177
  }
189
178
  .saltAvatar-category-11 {
190
179
  --avatar-background: var(--salt-category-11-bold-background);
191
- --avatar-foreground: var(--salt-category-11-bold-foreground);
192
180
  }
193
181
  .saltAvatar-category-12 {
194
182
  --avatar-background: var(--salt-category-12-bold-background);
195
- --avatar-foreground: var(--salt-category-12-bold-foreground);
196
183
  }
197
184
  .saltAvatar-category-13 {
198
185
  --avatar-background: var(--salt-category-13-bold-background);
199
- --avatar-foreground: var(--salt-category-13-bold-foreground);
200
186
  }
201
187
  .saltAvatar-category-14 {
202
188
  --avatar-background: var(--salt-category-14-bold-background);
203
- --avatar-foreground: var(--salt-category-14-bold-foreground);
204
189
  }
205
190
  .saltAvatar-category-15 {
206
191
  --avatar-background: var(--salt-category-15-bold-background);
207
- --avatar-foreground: var(--salt-category-15-bold-foreground);
208
192
  }
209
193
  .saltAvatar-category-16 {
210
194
  --avatar-background: var(--salt-category-16-bold-background);
211
- --avatar-foreground: var(--salt-category-16-bold-foreground);
212
195
  }
213
196
  .saltAvatar-category-17 {
214
197
  --avatar-background: var(--salt-category-17-bold-background);
215
- --avatar-foreground: var(--salt-category-17-bold-foreground);
216
198
  }
217
199
  .saltAvatar-category-18 {
218
200
  --avatar-background: var(--salt-category-18-bold-background);
219
- --avatar-foreground: var(--salt-category-18-bold-foreground);
220
201
  }
221
202
  .saltAvatar-category-19 {
222
203
  --avatar-background: var(--salt-category-19-bold-background);
223
- --avatar-foreground: var(--salt-category-19-bold-foreground);
224
204
  }
225
205
  .saltAvatar-category-20 {
226
206
  --avatar-background: var(--salt-category-20-bold-background);
227
- --avatar-foreground: var(--salt-category-20-bold-foreground);
228
207
  }
229
208
  .saltAvatar:has(img),
230
209
  .saltAvatar-withImage {
@@ -262,7 +241,7 @@
262
241
  font-family: var(--salt-text-fontFamily);
263
242
  line-height: var(--salt-text-notation-lineHeight);
264
243
  background: var(--salt-accent-background);
265
- color: var(--salt-accent-foreground);
244
+ color: var(--salt-content-bold-foreground);
266
245
  -webkit-font-smoothing: antialiased;
267
246
  -moz-osx-font-smoothing: grayscale;
268
247
  }
@@ -3251,6 +3230,38 @@ a:focus .saltCard-interactable.saltCard-disabled {
3251
3230
  opacity: 0.4;
3252
3231
  }
3253
3232
 
3233
+ /* src/pill/PillCheckIcon.css */
3234
+ .saltPillCheckIcon {
3235
+ --checkbox-size: var(--salt-size-selectable);
3236
+ width: var(--checkbox-size);
3237
+ min-width: var(--checkbox-size);
3238
+ height: var(--checkbox-size);
3239
+ min-height: var(--checkbox-size);
3240
+ border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid);
3241
+ border-radius: var(--salt-palette-corner-weaker, 0);
3242
+ position: relative;
3243
+ --saltIcon-size: 100%;
3244
+ display: flex;
3245
+ pointer-events: none;
3246
+ clip-path: border-box;
3247
+ box-sizing: border-box;
3248
+ }
3249
+ .saltPillCheckIcon > svg {
3250
+ pointer-events: none;
3251
+ position: absolute;
3252
+ transform: scale(1.01);
3253
+ }
3254
+
3255
+ /* src/pill/PillGroup.css */
3256
+ .saltPillGroup {
3257
+ border: none;
3258
+ padding: 0;
3259
+ margin: 0;
3260
+ display: flex;
3261
+ flex-wrap: wrap;
3262
+ gap: var(--salt-spacing-50);
3263
+ }
3264
+
3254
3265
  /* src/pill-input/PillInput.css */
3255
3266
  .saltPillInput {
3256
3267
  align-items: center;
@@ -4100,7 +4111,7 @@ a:focus .saltCard-interactable.saltCard-disabled {
4100
4111
  }
4101
4112
  .saltTag-secondary {
4102
4113
  background: var(--tag-secondary-background, var(--salt-category-1-bold-background));
4103
- color: var(--tag-secondary-foreground, var(--salt-category-1-bold-foreground));
4114
+ color: var(--salt-content-bold-foreground);
4104
4115
  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) transparent;
4105
4116
  }
4106
4117
  .saltTag-category-1 {
@@ -4108,140 +4119,120 @@ a:focus .saltCard-interactable.saltCard-disabled {
4108
4119
  --tag-primary-foreground: var(--salt-category-1-subtle-foreground);
4109
4120
  --tag-primary-borderColor: var(--salt-category-1-subtle-borderColor);
4110
4121
  --tag-secondary-background: var(--salt-category-1-bold-background);
4111
- --tag-secondary-foreground: var(--salt-category-1-bold-foreground);
4112
4122
  }
4113
4123
  .saltTag-category-2 {
4114
4124
  --tag-primary-background: var(--salt-category-2-subtle-background);
4115
4125
  --tag-primary-foreground: var(--salt-category-2-subtle-foreground);
4116
4126
  --tag-primary-borderColor: var(--salt-category-2-subtle-borderColor);
4117
4127
  --tag-secondary-background: var(--salt-category-2-bold-background);
4118
- --tag-secondary-foreground: var(--salt-category-2-bold-foreground);
4119
4128
  }
4120
4129
  .saltTag-category-3 {
4121
4130
  --tag-primary-background: var(--salt-category-3-subtle-background);
4122
4131
  --tag-primary-foreground: var(--salt-category-3-subtle-foreground);
4123
4132
  --tag-primary-borderColor: var(--salt-category-3-subtle-borderColor);
4124
4133
  --tag-secondary-background: var(--salt-category-3-bold-background);
4125
- --tag-secondary-foreground: var(--salt-category-3-bold-foreground);
4126
4134
  }
4127
4135
  .saltTag-category-4 {
4128
4136
  --tag-primary-background: var(--salt-category-4-subtle-background);
4129
4137
  --tag-primary-foreground: var(--salt-category-4-subtle-foreground);
4130
4138
  --tag-primary-borderColor: var(--salt-category-4-subtle-borderColor);
4131
4139
  --tag-secondary-background: var(--salt-category-4-bold-background);
4132
- --tag-secondary-foreground: var(--salt-category-4-bold-foreground);
4133
4140
  }
4134
4141
  .saltTag-category-5 {
4135
4142
  --tag-primary-background: var(--salt-category-5-subtle-background);
4136
4143
  --tag-primary-foreground: var(--salt-category-5-subtle-foreground);
4137
4144
  --tag-primary-borderColor: var(--salt-category-5-subtle-borderColor);
4138
4145
  --tag-secondary-background: var(--salt-category-5-bold-background);
4139
- --tag-secondary-foreground: var(--salt-category-5-bold-foreground);
4140
4146
  }
4141
4147
  .saltTag-category-6 {
4142
4148
  --tag-primary-background: var(--salt-category-6-subtle-background);
4143
4149
  --tag-primary-foreground: var(--salt-category-6-subtle-foreground);
4144
4150
  --tag-primary-borderColor: var(--salt-category-6-subtle-borderColor);
4145
4151
  --tag-secondary-background: var(--salt-category-6-bold-background);
4146
- --tag-secondary-foreground: var(--salt-category-6-bold-foreground);
4147
4152
  }
4148
4153
  .saltTag-category-7 {
4149
4154
  --tag-primary-background: var(--salt-category-7-subtle-background);
4150
4155
  --tag-primary-foreground: var(--salt-category-7-subtle-foreground);
4151
4156
  --tag-primary-borderColor: var(--salt-category-7-subtle-borderColor);
4152
4157
  --tag-secondary-background: var(--salt-category-7-bold-background);
4153
- --tag-secondary-foreground: var(--salt-category-7-bold-foreground);
4154
4158
  }
4155
4159
  .saltTag-category-8 {
4156
4160
  --tag-primary-background: var(--salt-category-8-subtle-background);
4157
4161
  --tag-primary-foreground: var(--salt-category-8-subtle-foreground);
4158
4162
  --tag-primary-borderColor: var(--salt-category-8-subtle-borderColor);
4159
4163
  --tag-secondary-background: var(--salt-category-8-bold-background);
4160
- --tag-secondary-foreground: var(--salt-category-8-bold-foreground);
4161
4164
  }
4162
4165
  .saltTag-category-9 {
4163
4166
  --tag-primary-background: var(--salt-category-9-subtle-background);
4164
4167
  --tag-primary-foreground: var(--salt-category-9-subtle-foreground);
4165
4168
  --tag-primary-borderColor: var(--salt-category-9-subtle-borderColor);
4166
4169
  --tag-secondary-background: var(--salt-category-9-bold-background);
4167
- --tag-secondary-foreground: var(--salt-category-9-bold-foreground);
4168
4170
  }
4169
4171
  .saltTag-category-10 {
4170
4172
  --tag-primary-background: var(--salt-category-10-subtle-background);
4171
4173
  --tag-primary-foreground: var(--salt-category-10-subtle-foreground);
4172
4174
  --tag-primary-borderColor: var(--salt-category-10-subtle-borderColor);
4173
4175
  --tag-secondary-background: var(--salt-category-10-bold-background);
4174
- --tag-secondary-foreground: var(--salt-category-10-bold-foreground);
4175
4176
  }
4176
4177
  .saltTag-category-11 {
4177
4178
  --tag-primary-background: var(--salt-category-11-subtle-background);
4178
4179
  --tag-primary-foreground: var(--salt-category-11-subtle-foreground);
4179
4180
  --tag-primary-borderColor: var(--salt-category-11-subtle-borderColor);
4180
4181
  --tag-secondary-background: var(--salt-category-11-bold-background);
4181
- --tag-secondary-foreground: var(--salt-category-11-bold-foreground);
4182
4182
  }
4183
4183
  .saltTag-category-12 {
4184
4184
  --tag-primary-background: var(--salt-category-12-subtle-background);
4185
4185
  --tag-primary-foreground: var(--salt-category-12-subtle-foreground);
4186
4186
  --tag-primary-borderColor: var(--salt-category-12-subtle-borderColor);
4187
4187
  --tag-secondary-background: var(--salt-category-12-bold-background);
4188
- --tag-secondary-foreground: var(--salt-category-12-bold-foreground);
4189
4188
  }
4190
4189
  .saltTag-category-13 {
4191
4190
  --tag-primary-background: var(--salt-category-13-subtle-background);
4192
4191
  --tag-primary-foreground: var(--salt-category-13-subtle-foreground);
4193
4192
  --tag-primary-borderColor: var(--salt-category-13-subtle-borderColor);
4194
4193
  --tag-secondary-background: var(--salt-category-13-bold-background);
4195
- --tag-secondary-foreground: var(--salt-category-13-bold-foreground);
4196
4194
  }
4197
4195
  .saltTag-category-14 {
4198
4196
  --tag-primary-background: var(--salt-category-14-subtle-background);
4199
4197
  --tag-primary-foreground: var(--salt-category-14-subtle-foreground);
4200
4198
  --tag-primary-borderColor: var(--salt-category-14-subtle-borderColor);
4201
4199
  --tag-secondary-background: var(--salt-category-14-bold-background);
4202
- --tag-secondary-foreground: var(--salt-category-14-bold-foreground);
4203
4200
  }
4204
4201
  .saltTag-category-15 {
4205
4202
  --tag-primary-background: var(--salt-category-15-subtle-background);
4206
4203
  --tag-primary-foreground: var(--salt-category-15-subtle-foreground);
4207
4204
  --tag-primary-borderColor: var(--salt-category-15-subtle-borderColor);
4208
4205
  --tag-secondary-background: var(--salt-category-15-bold-background);
4209
- --tag-secondary-foreground: var(--salt-category-15-bold-foreground);
4210
4206
  }
4211
4207
  .saltTag-category-16 {
4212
4208
  --tag-primary-background: var(--salt-category-16-subtle-background);
4213
4209
  --tag-primary-foreground: var(--salt-category-16-subtle-foreground);
4214
4210
  --tag-primary-borderColor: var(--salt-category-16-subtle-borderColor);
4215
4211
  --tag-secondary-background: var(--salt-category-16-bold-background);
4216
- --tag-secondary-foreground: var(--salt-category-16-bold-foreground);
4217
4212
  }
4218
4213
  .saltTag-category-17 {
4219
4214
  --tag-primary-background: var(--salt-category-17-subtle-background);
4220
4215
  --tag-primary-foreground: var(--salt-category-17-subtle-foreground);
4221
4216
  --tag-primary-borderColor: var(--salt-category-17-subtle-borderColor);
4222
4217
  --tag-secondary-background: var(--salt-category-17-bold-background);
4223
- --tag-secondary-foreground: var(--salt-category-17-bold-foreground);
4224
4218
  }
4225
4219
  .saltTag-category-18 {
4226
4220
  --tag-primary-background: var(--salt-category-18-subtle-background);
4227
4221
  --tag-primary-foreground: var(--salt-category-18-subtle-foreground);
4228
4222
  --tag-primary-borderColor: var(--salt-category-18-subtle-borderColor);
4229
4223
  --tag-secondary-background: var(--salt-category-18-bold-background);
4230
- --tag-secondary-foreground: var(--salt-category-18-bold-foreground);
4231
4224
  }
4232
4225
  .saltTag-category-19 {
4233
4226
  --tag-primary-background: var(--salt-category-19-subtle-background);
4234
4227
  --tag-primary-foreground: var(--salt-category-19-subtle-foreground);
4235
4228
  --tag-primary-borderColor: var(--salt-category-19-subtle-borderColor);
4236
4229
  --tag-secondary-background: var(--salt-category-19-bold-background);
4237
- --tag-secondary-foreground: var(--salt-category-19-bold-foreground);
4238
4230
  }
4239
4231
  .saltTag-category-20 {
4240
4232
  --tag-primary-background: var(--salt-category-20-subtle-background);
4241
4233
  --tag-primary-foreground: var(--salt-category-20-subtle-foreground);
4242
4234
  --tag-primary-borderColor: var(--salt-category-20-subtle-borderColor);
4243
4235
  --tag-secondary-background: var(--salt-category-20-bold-background);
4244
- --tag-secondary-foreground: var(--salt-category-20-bold-foreground);
4245
4236
  }
4246
4237
 
4247
4238
  /* src/text/Text.css */
@@ -4580,6 +4571,7 @@ label.saltText small,
4580
4571
  cursor: unset;
4581
4572
  }
4582
4573
  .saltToggleButton[aria-pressed=true]:hover {
4574
+ background: var(--toggleButton-background-selectedHover);
4583
4575
  border-color: var(--toggleButton-borderColor-selectedHover);
4584
4576
  }
4585
4577
  .saltToggleButton[aria-disabled=true] {
@@ -4623,6 +4615,7 @@ label.saltText small,
4623
4615
  --toggleButton-borderColor-active: var(--salt-actionable-subtle-borderColor-active);
4624
4616
  --toggleButton-borderColor-selected: var(--salt-actionable-borderColor-selected);
4625
4617
  --toggleButton-borderColor-selectedHover: var(--salt-actionable-bold-borderColor-hover);
4618
+ --toggleButton-background-selectedHover: var(--salt-actionable-bold-background-hover);
4626
4619
  }
4627
4620
  .saltToggleButton-accented.saltToggleButton-solid {
4628
4621
  --toggleButton-text-color: var(--salt-actionable-accented-subtle-foreground);
@@ -4638,6 +4631,7 @@ label.saltText small,
4638
4631
  --toggleButton-borderColor-active: var(--salt-actionable-accented-subtle-borderColor-active);
4639
4632
  --toggleButton-borderColor-selected: var(--salt-actionable-accented-borderColor-selected);
4640
4633
  --toggleButton-borderColor-selectedHover: var(--salt-actionable-accented-bold-borderColor-hover);
4634
+ --toggleButton-background-selectedHover: var(--salt-actionable-accented-bold-background-hover);
4641
4635
  }
4642
4636
  .saltToggleButton-positive.saltToggleButton-solid {
4643
4637
  --toggleButton-text-color: var(--salt-actionable-positive-subtle-foreground);
@@ -4653,6 +4647,7 @@ label.saltText small,
4653
4647
  --toggleButton-borderColor-active: var(--salt-actionable-positive-subtle-borderColor-active);
4654
4648
  --toggleButton-borderColor-selected: var(--salt-actionable-positive-borderColor-selected);
4655
4649
  --toggleButton-borderColor-selectedHover: var(--salt-actionable-positive-bold-borderColor-hover);
4650
+ --toggleButton-background-selectedHover: var(--salt-actionable-accented-bold-background-hover);
4656
4651
  }
4657
4652
  .saltToggleButton-negative.saltToggleButton-solid {
4658
4653
  --toggleButton-text-color: var(--salt-actionable-negative-subtle-foreground);
@@ -4668,6 +4663,7 @@ label.saltText small,
4668
4663
  --toggleButton-borderColor-active: var(--salt-actionable-negative-subtle-borderColor-active);
4669
4664
  --toggleButton-borderColor-selected: var(--salt-actionable-negative-borderColor-selected);
4670
4665
  --toggleButton-borderColor-selectedHover: var(--salt-actionable-negative-bold-borderColor-hover);
4666
+ --toggleButton-background-selectedHover: var(--salt-actionable-negative-bold-background-hover);
4671
4667
  }
4672
4668
  .saltToggleButton-caution.saltToggleButton-solid {
4673
4669
  --toggleButton-text-color: var(--salt-actionable-caution-subtle-foreground);
@@ -4683,6 +4679,7 @@ label.saltText small,
4683
4679
  --toggleButton-borderColor-active: var(--salt-actionable-caution-subtle-borderColor-active);
4684
4680
  --toggleButton-borderColor-selected: var(--salt-actionable-caution-borderColor-selected);
4685
4681
  --toggleButton-borderColor-selectedHover: var(--salt-actionable-caution-bold-borderColor-hover);
4682
+ --toggleButton-background-selectedHover: var(--salt-actionable-caution-bold-background-hover);
4686
4683
  }
4687
4684
  .saltToggleButton-neutral.saltToggleButton-bordered {
4688
4685
  --toggleButton-text-color: var(--salt-actionable-foreground);
@@ -4698,6 +4695,7 @@ label.saltText small,
4698
4695
  --toggleButton-borderColor-active: var(--salt-actionable-borderColor);
4699
4696
  --toggleButton-borderColor-selected: var(--salt-actionable-borderColor-selected);
4700
4697
  --toggleButton-borderColor-selectedHover: var(--salt-actionable-bold-borderColor-hover);
4698
+ --toggleButton-background-selectedHover: var(--salt-actionable-bold-background-hover);
4701
4699
  }
4702
4700
  .saltToggleButton-accented.saltToggleButton-bordered {
4703
4701
  --toggleButton-text-color: var(--salt-actionable-accented-foreground);
@@ -4713,6 +4711,7 @@ label.saltText small,
4713
4711
  --toggleButton-borderColor-active: var(--salt-actionable-accented-borderColor);
4714
4712
  --toggleButton-borderColor-selected: var(--salt-actionable-accented-borderColor-selected);
4715
4713
  --toggleButton-borderColor-selectedHover: var(--salt-actionable-accented-bold-borderColor-hover);
4714
+ --toggleButton-background-selectedHover: var(--salt-actionable-accented-bold-background-hover);
4716
4715
  }
4717
4716
  .saltToggleButton-positive.saltToggleButton-bordered {
4718
4717
  --toggleButton-text-color: var(--salt-actionable-positive-foreground);
@@ -4728,6 +4727,7 @@ label.saltText small,
4728
4727
  --toggleButton-borderColor-active: var(--salt-actionable-positive-borderColor);
4729
4728
  --toggleButton-borderColor-selected: var(--salt-actionable-positive-borderColor-selected);
4730
4729
  --toggleButton-borderColor-selectedHover: var(--salt-actionable-positive-bold-borderColor-hover);
4730
+ --toggleButton-background-selectedHover: var(--salt-actionable-positive-bold-background-hover);
4731
4731
  }
4732
4732
  .saltToggleButton-negative.saltToggleButton-bordered {
4733
4733
  --toggleButton-text-color: var(--salt-actionable-negative-foreground);
@@ -4743,6 +4743,7 @@ label.saltText small,
4743
4743
  --toggleButton-borderColor-active: var(--salt-actionable-negative-borderColor);
4744
4744
  --toggleButton-borderColor-selected: var(--salt-actionable-negative-borderColor-selected);
4745
4745
  --toggleButton-borderColor-selectedHover: var(--salt-actionable-negative-bold-borderColor-hover);
4746
+ --toggleButton-background-selectedHover: var(--salt-actionable-negative-bold-background-hover);
4746
4747
  }
4747
4748
  .saltToggleButton-caution.saltToggleButton-bordered {
4748
4749
  --toggleButton-text-color: var(--salt-actionable-caution-foreground);
@@ -4758,6 +4759,7 @@ label.saltText small,
4758
4759
  --toggleButton-borderColor-active: var(--salt-actionable-caution-borderColor);
4759
4760
  --toggleButton-borderColor-selected: var(--salt-actionable-caution-borderColor-selected);
4760
4761
  --toggleButton-borderColor-selectedHover: var(--salt-actionable-caution-bold-borderColor-hover);
4762
+ --toggleButton-background-selectedHover: var(--salt-actionable-caution-bold-background-hover);
4761
4763
  }
4762
4764
 
4763
4765
  /* src/toggle-button-group/ToggleButtonGroup.css */
@@ -5554,4 +5556,4 @@ label.saltText small,
5554
5556
  color: var(--salt-status-error-foreground-informative);
5555
5557
  }
5556
5558
 
5557
- /* src/6e6ab152-19e8-4f22-8b9f-b5e6b2237225.css */
5559
+ /* src/5a699fff-d814-4b2c-a9d7-dab7b34e2781.css */
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var css_248z = "/* Default variables applied to the root element */\n.saltAvatar {\n --avatar-size-multiplier: var(--saltAvatar-size-multiplier, 1);\n --avatar-base-size: var(--salt-size-base);\n --avatar-base-fontSize: var(--saltAvatar-fontSize, var(--salt-text-notation-fontSize));\n --avatar-container-size: calc(var(--avatar-base-size) * var(--avatar-size-multiplier));\n --avatar-fontSize: calc(var(--avatar-base-fontSize) * var(--avatar-size-multiplier));\n /* Icon styling */\n --saltIcon-size: calc(var(--avatar-container-size) / 2);\n}\n\n/* Style applied to the root element */\n.saltAvatar {\n color: var(--saltAvatar-foreground, var(--avatar-foreground));\n background: var(--saltAvatar-background, var(--avatar-background));\n font-size: var(--avatar-fontSize);\n line-height: var(--saltAvatar-lineHeight, var(--salt-text-notation-lineHeight));\n font-family: var(--salt-text-fontFamily);\n font-weight: var(--salt-text-fontWeight);\n width: var(--avatar-container-size);\n min-width: var(--avatar-container-size);\n height: var(--avatar-container-size);\n min-height: var(--avatar-container-size);\n border-radius: var(--saltAvatar-borderRadius, var(--salt-palette-corner-strongest, 50%));\n\n display: flex;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n user-select: none;\n}\n\n.saltAvatar-accent {\n --avatar-background: var(--salt-accent-background);\n --avatar-foreground: var(--salt-accent-foreground);\n}\n\n.saltAvatar-category-1 {\n --avatar-background: var(--salt-category-1-bold-background);\n --avatar-foreground: var(--salt-category-1-bold-foreground);\n}\n.saltAvatar-category-2 {\n --avatar-background: var(--salt-category-2-bold-background);\n --avatar-foreground: var(--salt-category-2-bold-foreground);\n}\n\n.saltAvatar-category-3 {\n --avatar-background: var(--salt-category-3-bold-background);\n --avatar-foreground: var(--salt-category-3-bold-foreground);\n}\n\n.saltAvatar-category-4 {\n --avatar-background: var(--salt-category-4-bold-background);\n --avatar-foreground: var(--salt-category-4-bold-foreground);\n}\n\n.saltAvatar-category-5 {\n --avatar-background: var(--salt-category-5-bold-background);\n --avatar-foreground: var(--salt-category-5-bold-foreground);\n}\n\n.saltAvatar-category-6 {\n --avatar-background: var(--salt-category-6-bold-background);\n --avatar-foreground: var(--salt-category-6-bold-foreground);\n}\n\n.saltAvatar-category-7 {\n --avatar-background: var(--salt-category-7-bold-background);\n --avatar-foreground: var(--salt-category-7-bold-foreground);\n}\n\n.saltAvatar-category-8 {\n --avatar-background: var(--salt-category-8-bold-background);\n --avatar-foreground: var(--salt-category-8-bold-foreground);\n}\n\n.saltAvatar-category-9 {\n --avatar-background: var(--salt-category-9-bold-background);\n --avatar-foreground: var(--salt-category-9-bold-foreground);\n}\n\n.saltAvatar-category-10 {\n --avatar-background: var(--salt-category-10-bold-background);\n --avatar-foreground: var(--salt-category-10-bold-foreground);\n}\n.saltAvatar-category-11 {\n --avatar-background: var(--salt-category-11-bold-background);\n --avatar-foreground: var(--salt-category-11-bold-foreground);\n}\n.saltAvatar-category-12 {\n --avatar-background: var(--salt-category-12-bold-background);\n --avatar-foreground: var(--salt-category-12-bold-foreground);\n}\n.saltAvatar-category-13 {\n --avatar-background: var(--salt-category-13-bold-background);\n --avatar-foreground: var(--salt-category-13-bold-foreground);\n}\n.saltAvatar-category-14 {\n --avatar-background: var(--salt-category-14-bold-background);\n --avatar-foreground: var(--salt-category-14-bold-foreground);\n}\n.saltAvatar-category-15 {\n --avatar-background: var(--salt-category-15-bold-background);\n --avatar-foreground: var(--salt-category-15-bold-foreground);\n}\n.saltAvatar-category-16 {\n --avatar-background: var(--salt-category-16-bold-background);\n --avatar-foreground: var(--salt-category-16-bold-foreground);\n}\n.saltAvatar-category-17 {\n --avatar-background: var(--salt-category-17-bold-background);\n --avatar-foreground: var(--salt-category-17-bold-foreground);\n}\n.saltAvatar-category-18 {\n --avatar-background: var(--salt-category-18-bold-background);\n --avatar-foreground: var(--salt-category-18-bold-foreground);\n}\n.saltAvatar-category-19 {\n --avatar-background: var(--salt-category-19-bold-background);\n --avatar-foreground: var(--salt-category-19-bold-foreground);\n}\n.saltAvatar-category-20 {\n --avatar-background: var(--salt-category-20-bold-background);\n --avatar-foreground: var(--salt-category-20-bold-foreground);\n}\n\n.saltAvatar:has(img),\n.saltAvatar-withImage {\n --avatar-background: none;\n}\n\n/* Style applied to the image/svg element. We specifically allow SVGs as the Avatar image to enable SVGs such as Flags to take up the full Avatar space */\n.saltAvatar > img,\n.saltAvatar > svg:not(.saltIcon) {\n width: 100%;\n height: 100%;\n}\n";
3
+ var css_248z = "/* Default variables applied to the root element */\n.saltAvatar {\n --avatar-size-multiplier: var(--saltAvatar-size-multiplier, 1);\n --avatar-base-size: var(--salt-size-base);\n --avatar-base-fontSize: var(--saltAvatar-fontSize, var(--salt-text-notation-fontSize));\n --avatar-container-size: calc(var(--avatar-base-size) * var(--avatar-size-multiplier));\n --avatar-fontSize: calc(var(--avatar-base-fontSize) * var(--avatar-size-multiplier));\n /* Icon styling */\n --saltIcon-size: calc(var(--avatar-container-size) / 2);\n}\n\n/* Style applied to the root element */\n.saltAvatar {\n color: var(--saltAvatar-foreground, var(--salt-content-bold-foreground));\n background: var(--saltAvatar-background, var(--avatar-background));\n font-size: var(--avatar-fontSize);\n line-height: var(--saltAvatar-lineHeight, var(--salt-text-notation-lineHeight));\n font-family: var(--salt-text-fontFamily);\n font-weight: var(--salt-text-fontWeight);\n width: var(--avatar-container-size);\n min-width: var(--avatar-container-size);\n height: var(--avatar-container-size);\n min-height: var(--avatar-container-size);\n border-radius: var(--saltAvatar-borderRadius, var(--salt-palette-corner-strongest, 50%));\n\n display: flex;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n user-select: none;\n}\n\n.saltAvatar-accent {\n --avatar-background: var(--salt-accent-background);\n}\n\n.saltAvatar-category-1 {\n --avatar-background: var(--salt-category-1-bold-background);\n}\n.saltAvatar-category-2 {\n --avatar-background: var(--salt-category-2-bold-background);\n}\n\n.saltAvatar-category-3 {\n --avatar-background: var(--salt-category-3-bold-background);\n}\n\n.saltAvatar-category-4 {\n --avatar-background: var(--salt-category-4-bold-background);\n}\n\n.saltAvatar-category-5 {\n --avatar-background: var(--salt-category-5-bold-background);\n}\n\n.saltAvatar-category-6 {\n --avatar-background: var(--salt-category-6-bold-background);\n}\n\n.saltAvatar-category-7 {\n --avatar-background: var(--salt-category-7-bold-background);\n}\n\n.saltAvatar-category-8 {\n --avatar-background: var(--salt-category-8-bold-background);\n}\n\n.saltAvatar-category-9 {\n --avatar-background: var(--salt-category-9-bold-background);\n}\n\n.saltAvatar-category-10 {\n --avatar-background: var(--salt-category-10-bold-background);\n}\n.saltAvatar-category-11 {\n --avatar-background: var(--salt-category-11-bold-background);\n}\n.saltAvatar-category-12 {\n --avatar-background: var(--salt-category-12-bold-background);\n}\n.saltAvatar-category-13 {\n --avatar-background: var(--salt-category-13-bold-background);\n}\n.saltAvatar-category-14 {\n --avatar-background: var(--salt-category-14-bold-background);\n}\n.saltAvatar-category-15 {\n --avatar-background: var(--salt-category-15-bold-background);\n}\n.saltAvatar-category-16 {\n --avatar-background: var(--salt-category-16-bold-background);\n}\n.saltAvatar-category-17 {\n --avatar-background: var(--salt-category-17-bold-background);\n}\n.saltAvatar-category-18 {\n --avatar-background: var(--salt-category-18-bold-background);\n}\n.saltAvatar-category-19 {\n --avatar-background: var(--salt-category-19-bold-background);\n}\n.saltAvatar-category-20 {\n --avatar-background: var(--salt-category-20-bold-background);\n}\n\n.saltAvatar:has(img),\n.saltAvatar-withImage {\n --avatar-background: none;\n}\n\n/* Style applied to the image/svg element. We specifically allow SVGs as the Avatar image to enable SVGs such as Flags to take up the full Avatar space */\n.saltAvatar > img,\n.saltAvatar > svg:not(.saltIcon) {\n width: 100%;\n height: 100%;\n}\n";
4
4
 
5
5
  module.exports = css_248z;
6
6
  //# sourceMappingURL=Avatar.css.js.map
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var css_248z = "/* Style applied to the root element */\n.saltBadge {\n display: inline-flex;\n position: relative;\n flex-shrink: 0;\n vertical-align: middle;\n --badge-size: var(--salt-text-notation-lineHeight);\n}\n\n.saltBadge-badge {\n /* Should this vary according to touch size */\n padding-left: var(--salt-spacing-50);\n padding-right: var(--salt-spacing-50);\n height: var(--badge-size);\n min-width: var(--badge-size);\n border-radius: var(--salt-palette-corner-strongest, 9999px);\n\n white-space: nowrap;\n z-index: var(--salt-zIndex-default);\n box-sizing: border-box;\n\n align-items: center;\n justify-content: center;\n display: inline-flex;\n margin: auto;\n\n font-size: var(--salt-text-notation-fontSize);\n font-weight: var(--salt-text-notation-fontWeight);\n font-family: var(--salt-text-fontFamily);\n line-height: var(--salt-text-notation-lineHeight);\n background: var(--salt-accent-background);\n color: var(--salt-accent-foreground);\n\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\n.saltBadge-topRight {\n position: absolute;\n right: var(--salt-spacing-100);\n transform: translateX(100%) translateY(calc(-1 * (var(--badge-size) / 2)));\n}\n\n.saltBadge-dotBadge {\n height: var(--salt-size-adornment);\n min-width: var(--salt-size-adornment);\n padding: 0;\n --badge-size: var(--salt-size-adornment);\n}\n\n.saltBadge-dotBadge.saltBadge-topRight {\n right: calc((var(--salt-size-adornment) / 2));\n}\n";
3
+ var css_248z = "/* Style applied to the root element */\n.saltBadge {\n display: inline-flex;\n position: relative;\n flex-shrink: 0;\n vertical-align: middle;\n --badge-size: var(--salt-text-notation-lineHeight);\n}\n\n.saltBadge-badge {\n /* Should this vary according to touch size */\n padding-left: var(--salt-spacing-50);\n padding-right: var(--salt-spacing-50);\n height: var(--badge-size);\n min-width: var(--badge-size);\n border-radius: var(--salt-palette-corner-strongest, 9999px);\n\n white-space: nowrap;\n z-index: var(--salt-zIndex-default);\n box-sizing: border-box;\n\n align-items: center;\n justify-content: center;\n display: inline-flex;\n margin: auto;\n\n font-size: var(--salt-text-notation-fontSize);\n font-weight: var(--salt-text-notation-fontWeight);\n font-family: var(--salt-text-fontFamily);\n line-height: var(--salt-text-notation-lineHeight);\n background: var(--salt-accent-background);\n color: var(--salt-content-bold-foreground);\n\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\n.saltBadge-topRight {\n position: absolute;\n right: var(--salt-spacing-100);\n transform: translateX(100%) translateY(calc(-1 * (var(--badge-size) / 2)));\n}\n\n.saltBadge-dotBadge {\n height: var(--salt-size-adornment);\n min-width: var(--salt-size-adornment);\n padding: 0;\n --badge-size: var(--salt-size-adornment);\n}\n\n.saltBadge-dotBadge.saltBadge-topRight {\n right: calc((var(--salt-size-adornment) / 2));\n}\n";
4
4
 
5
5
  module.exports = css_248z;
6
6
  //# sourceMappingURL=Badge.css.js.map
@@ -13,6 +13,7 @@ var OptionList = require('../option/OptionList.js');
13
13
  var PillInput = require('../pill-input/PillInput.js');
14
14
  var SemanticIconProvider = require('../semantic-icon-provider/SemanticIconProvider.js');
15
15
  var makePrefixer = require('../utils/makePrefixer.js');
16
+ var useIsomorphicLayoutEffect = require('../utils/useIsomorphicLayoutEffect.js');
16
17
  var useFloatingUI = require('../utils/useFloatingUI/useFloatingUI.js');
17
18
  var useForkRef = require('../utils/useForkRef.js');
18
19
  var useId = require('../utils/useId.js');
@@ -280,7 +281,7 @@ const ComboBox = React.forwardRef(function ComboBox2(props, ref) {
280
281
  var _a2;
281
282
  (_a2 = inputRef.current) == null ? void 0 : _a2.focus();
282
283
  };
283
- React.useLayoutEffect(() => {
284
+ useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
284
285
  if (value) {
285
286
  shouldAutoSelectRef.current = true;
286
287
  }
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.js","sources":["../src/combo-box/ComboBox.tsx"],"sourcesContent":["import {\n flip,\n offset,\n size,\n useClick,\n useDismiss,\n useFocus,\n useInteractions,\n} from \"@floating-ui/react\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n Children,\n type ComponentPropsWithoutRef,\n type FocusEvent,\n type ForwardedRef,\n forwardRef,\n type KeyboardEvent,\n type MouseEvent,\n type ReactNode,\n type Ref,\n type SyntheticEvent,\n useEffect,\n useLayoutEffect,\n useRef,\n} from \"react\";\nimport { Button } from \"../button\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport {\n ListControlContext,\n type OptionValue,\n} from \"../list-control/ListControlContext\";\nimport { defaultValueToString } from \"../list-control/ListControlState\";\nimport { OptionList } from \"../option/OptionList\";\nimport { PillInput, type PillInputProps } from \"../pill-input\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport type { DataAttributes } from \"../types\";\nimport {\n makePrefixer,\n type UseFloatingUIProps,\n useFloatingUI,\n useForkRef,\n useId,\n} from \"../utils\";\nimport { type UseComboBoxProps, useComboBox } from \"./useComboBox\";\n\nexport type ComboBoxProps<Item = string> = {\n /**\n * The options to display in the combo box.\n */\n children?: ReactNode;\n /**\n * If true, options will be selected when the tab key is pressed.\n */\n selectOnTab?: boolean;\n /**\n * Props to pass to ComboBox's overlay.\n */\n OverlayProps?: Omit<ComponentPropsWithoutRef<\"div\">, \"children\" | \"id\"> &\n DataAttributes;\n} & UseComboBoxProps<Item> &\n Omit<PillInputProps, \"onPillRemove\">;\n\nconst withBaseName = makePrefixer(\"saltComboBox\");\n\nexport const ComboBox = forwardRef(function ComboBox<Item>(\n props: ComboBoxProps<Item>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const {\n children,\n className,\n disabled: disabledProp,\n endAdornment: endAdornmentProp,\n readOnly: readOnlyProp,\n multiselect,\n selectOnTab = !multiselect,\n onSelectionChange,\n selected,\n defaultSelected,\n defaultOpen,\n onOpenChange,\n onChange,\n open,\n inputRef: inputRefProp,\n inputProps: inputPropsProp,\n variant = \"primary\",\n onKeyDown,\n onFocus,\n onBlur,\n value,\n defaultValue,\n valueToString = defaultValueToString,\n truncate,\n bordered = false,\n OverlayProps,\n ...rest\n } = props;\n\n const { CollapseIcon, ExpandIcon } = useIcon();\n const {\n a11yProps: { \"aria-labelledby\": formFieldLabelledBy } = {},\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n } = useFormFieldProps();\n\n const disabled = Boolean(disabledProp) || formFieldDisabled;\n const readOnly = Boolean(readOnlyProp) || formFieldReadOnly;\n const inputRef = useRef<HTMLInputElement>(null);\n const handleInputRef = useForkRef(inputRef, inputRefProp);\n const shouldAutoSelectRef = useRef(false);\n\n const listControl = useComboBox<Item>({\n open,\n defaultOpen,\n onOpenChange,\n multiselect,\n defaultSelected,\n selected,\n onSelectionChange,\n value,\n defaultValue,\n disabled,\n readOnly,\n valueToString,\n });\n\n const {\n activeState,\n setActive,\n openState,\n setOpen,\n openKey,\n getOptionsMatching,\n getFirstOption,\n getLastOption,\n getOptionAfter,\n getOptionBefore,\n getOptionPageAbove,\n getOptionPageBelow,\n selectedState,\n select,\n clear,\n focusVisibleState,\n setFocusVisibleState,\n focusedState,\n setFocusedState,\n listRef,\n setListRef,\n valueState,\n setValueState,\n removePill,\n } = listControl;\n\n const handleOpenChange: UseFloatingUIProps[\"onOpenChange\"] = (\n newOpen,\n _event,\n reason,\n ) => {\n const focusNotBlur = reason === \"focus\" && newOpen;\n if (reason === \"focus\") {\n setFocusedState(newOpen);\n }\n\n if (reason === \"focus\" && !newOpen) {\n setFocusVisibleState(false);\n }\n\n if (readOnly || focusNotBlur) return;\n setOpen(newOpen);\n\n if (newOpen) {\n inputRef.current?.focus();\n }\n };\n\n const hasValidChildren =\n Children.toArray(children).filter(Boolean).length > 0;\n\n const { x, y, strategy, elements, floating, reference, context } =\n useFloatingUI({\n open: openState && !readOnly && hasValidChildren,\n onOpenChange: handleOpenChange,\n placement: \"bottom-start\",\n strategy: \"fixed\",\n middleware: [\n offset(1),\n size({\n apply({ rects, elements, availableHeight }) {\n elements.floating.style.setProperty(\n \"--overlay-minWidth\",\n `${rects.reference.width}px`,\n );\n elements.floating.style.setProperty(\n \"--overlay-maxHeight\",\n `max(calc((var(--salt-size-base) + var(--salt-spacing-100)) * 5), calc(${availableHeight}px - var(--salt-spacing-100)))`,\n );\n },\n }),\n flip({ fallbackStrategy: \"initialPlacement\" }),\n ],\n });\n\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useDismiss(context),\n useFocus(context),\n useClick(context, { keyboardHandlers: false, toggle: false }),\n ]);\n\n const handleRef = useForkRef<HTMLDivElement>(reference, ref);\n\n const handleButtonClick = (event: MouseEvent<HTMLButtonElement>) => {\n if (!readOnly) {\n event.stopPropagation();\n setFocusVisibleState(false);\n setOpen(!openState, \"manual\");\n }\n };\n\n const handleButtonFocus = () => {\n inputRef.current?.focus();\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n\n if (!event.repeat) {\n shouldAutoSelectRef.current = false;\n }\n\n if (readOnly) {\n return;\n }\n\n if (!openState) {\n if (event.key === \"ArrowDown\" || event.key === \"ArrowUp\") {\n setOpen(true, undefined, event.key);\n return;\n }\n }\n\n const activeOption = activeState;\n\n let newActive:\n | { data: OptionValue<Item>; element: HTMLElement }\n | undefined;\n switch (event.key) {\n case \"ArrowDown\":\n newActive = activeOption\n ? getOptionAfter(activeOption)\n : getFirstOption();\n break;\n case \"ArrowUp\":\n newActive = activeOption\n ? getOptionBefore(activeOption)\n : getLastOption();\n break;\n case \"Home\":\n newActive = getFirstOption();\n break;\n case \"End\":\n newActive = getLastOption();\n break;\n case \"PageUp\":\n if (activeOption) {\n newActive = getOptionPageAbove(activeOption);\n } else {\n const lastOption = getLastOption();\n if (lastOption) {\n newActive = getOptionPageAbove(lastOption?.data);\n }\n }\n break;\n case \"PageDown\":\n if (activeOption) {\n newActive = getOptionPageBelow(activeOption);\n } else {\n const firstOption = getFirstOption();\n if (firstOption) {\n newActive = getOptionPageBelow(firstOption.data);\n }\n }\n break;\n case \"Enter\":\n if (openState && activeState?.disabled) {\n event.preventDefault();\n return;\n }\n\n if (!openState || !activeState) {\n return;\n }\n\n select(event, activeState);\n\n if (!multiselect) {\n event.preventDefault();\n }\n\n break;\n case \"Tab\":\n if (\n openState &&\n selectOnTab &&\n activeState &&\n !activeState?.disabled &&\n !selectedState.includes(activeState?.value)\n ) {\n select(event, activeState);\n }\n break;\n }\n\n if (newActive) {\n setFocusVisibleState(true);\n }\n\n if (newActive && newActive.data.id !== activeState?.id) {\n event.preventDefault();\n setActive(newActive.data);\n }\n };\n\n const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n if (event.currentTarget === inputRef.current) {\n setFocusedState(true);\n } else {\n setActive(undefined);\n }\n onFocus?.(event);\n };\n\n const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n event.persist();\n if (!listRef.current || !listRef.current.contains(event.relatedTarget)) {\n onBlur?.(event);\n shouldAutoSelectRef.current = false;\n }\n };\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const value = event.target.value;\n\n if (!openState) {\n setOpen(true, \"input\");\n }\n\n if (value === \"\" && !multiselect) {\n clear(event);\n }\n\n setValueState(value);\n\n // Clean active item if no text is present.\n if (value === \"\") {\n setActive(undefined);\n } else {\n shouldAutoSelectRef.current = true;\n }\n\n onChange?.(event);\n };\n\n const handlePillRemove = (event: SyntheticEvent, index: number) => {\n event.stopPropagation();\n const removed = selectedState[index];\n removePill(event, removed);\n };\n\n const handleListMouseOver = () => {\n setFocusVisibleState(false);\n };\n\n const handleListMouseLeave = () => {\n setActive(undefined);\n };\n\n const handleFocusInput = () => {\n inputRef.current?.focus();\n };\n\n useLayoutEffect(() => {\n if (value) {\n shouldAutoSelectRef.current = true;\n }\n }, [value]);\n\n useEffect(() => {\n if (openState && value) {\n queueMicrotask(() => {\n const newOption = getFirstOption();\n if (newOption && shouldAutoSelectRef.current) {\n setActive(newOption.data);\n }\n });\n }\n }, [value, setActive, openState, getFirstOption]);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: We only want this to run when the list's openState or the displayed options change.\n useEffect(() => {\n let newActive: ReturnType<typeof getFirstOption>;\n\n if (!openState) {\n setActive(undefined);\n return;\n }\n\n // If we have selected an item, we should make that the active item\n if (selectedState.length > 0) {\n newActive = getOptionsMatching(\n (option) => option.value === selectedState[0],\n ).pop();\n }\n\n // If we still don't have an active item, we should check if the list has been opened with the keyboard\n if (!newActive) {\n if (openKey.current === \"ArrowDown\") {\n newActive = getFirstOption();\n setFocusVisibleState(true);\n } else if (openKey.current === \"ArrowUp\") {\n newActive = getLastOption();\n setFocusVisibleState(true);\n }\n }\n\n if (newActive) {\n setActive(newActive?.data);\n }\n }, [openState]);\n\n const buttonId = useId();\n const listId = useId();\n\n const handleListRef = useForkRef<HTMLDivElement>(setListRef, floating);\n\n const showOptionsButton = (\n <Button\n aria-labelledby={clsx(buttonId, formFieldLabelledBy)}\n aria-label=\"Show options\"\n aria-expanded={openState}\n aria-controls={openState ? listId : undefined}\n aria-haspopup=\"listbox\"\n disabled={disabled}\n appearance=\"transparent\"\n onClick={handleButtonClick}\n onFocus={handleButtonFocus}\n tabIndex={-1}\n >\n {openState ? <CollapseIcon aria-hidden /> : <ExpandIcon aria-hidden />}\n </Button>\n );\n\n // avoid render empty fragment, or empty div appear in PillInput\n const endAdornment =\n !readOnly && hasValidChildren ? (\n <>\n {endAdornmentProp}\n {showOptionsButton}\n </>\n ) : (\n endAdornmentProp\n );\n\n return (\n <ListControlContext.Provider value={listControl}>\n <PillInput\n // Ensures that the field is focused when you don't directly click on the input.\n tabIndex={!disabled ? -1 : undefined}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"focused\")]: focusedState,\n [withBaseName(\"focusVisible\")]: focusVisibleState,\n },\n className,\n )}\n endAdornment={endAdornment}\n onChange={handleChange}\n // Workaround to have readonly conveyed by screen readers (https://github.com/jpmorganchase/salt-ds/issues/4586)\n role={readOnly ? \"textbox\" : \"combobox\"}\n disabled={disabled}\n readOnly={readOnly}\n inputProps={{\n \"aria-readonly\": readOnly ? \"true\" : undefined,\n \"aria-expanded\": !readOnly ? openState : undefined,\n \"aria-controls\": openState && !readOnly ? listId : undefined,\n onKeyDown: handleKeyDown,\n ...inputPropsProp,\n }}\n aria-activedescendant={activeState?.id}\n variant={variant}\n inputRef={handleInputRef}\n value={valueState}\n ref={handleRef}\n bordered={bordered}\n {...getReferenceProps({\n onBlur: handleBlur,\n onFocus: handleFocus,\n ...rest,\n })}\n pills={\n multiselect ? selectedState.map((item) => valueToString(item)) : []\n }\n truncate={truncate && !focusedState && !openState}\n onPillRemove={handlePillRemove}\n hidePillClose={!focusedState || readOnly}\n emptyReadOnlyMarker={\n readOnly && selectedState.length > 0 ? \"\" : undefined\n }\n />\n <OptionList\n aria-multiselectable={multiselect}\n open={(openState || focusedState) && !readOnly && hasValidChildren}\n collapsed={!openState}\n ref={handleListRef}\n id={listId}\n tabIndex={-1}\n {...getFloatingProps({\n onMouseOver: handleListMouseOver,\n onFocus: handleFocusInput,\n onClick: handleFocusInput,\n onMouseLeave: handleListMouseLeave,\n ...OverlayProps,\n })}\n left={x ?? 0}\n top={y ?? 0}\n position={strategy}\n width={elements.floating?.offsetWidth}\n height={elements.floating?.offsetHeight}\n >\n {children}\n </OptionList>\n </ListControlContext.Provider>\n );\n}) as <Item = string>(\n props: ComboBoxProps<Item> & { ref?: Ref<HTMLDivElement> },\n) => JSX.Element;\n"],"names":["makePrefixer","forwardRef","ComboBox","defaultValueToString","useIcon","useFormFieldProps","useRef","useForkRef","useComboBox","_a","Children","useFloatingUI","offset","size","elements","flip","useInteractions","useDismiss","useFocus","useClick","value","useLayoutEffect","useEffect","useId","jsx","Button","clsx","jsxs","Fragment","ListControlContext","PillInput","OptionList"],"mappings":"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"}
1
+ {"version":3,"file":"ComboBox.js","sources":["../src/combo-box/ComboBox.tsx"],"sourcesContent":["import {\n flip,\n offset,\n size,\n useClick,\n useDismiss,\n useFocus,\n useInteractions,\n} from \"@floating-ui/react\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n Children,\n type ComponentPropsWithoutRef,\n type FocusEvent,\n type ForwardedRef,\n forwardRef,\n type KeyboardEvent,\n type MouseEvent,\n type ReactNode,\n type Ref,\n type SyntheticEvent,\n useEffect,\n useRef,\n} from \"react\";\nimport { Button } from \"../button\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport {\n ListControlContext,\n type OptionValue,\n} from \"../list-control/ListControlContext\";\nimport { defaultValueToString } from \"../list-control/ListControlState\";\nimport { OptionList } from \"../option/OptionList\";\nimport { PillInput, type PillInputProps } from \"../pill-input\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport type { DataAttributes } from \"../types\";\nimport {\n makePrefixer,\n type UseFloatingUIProps,\n useFloatingUI,\n useForkRef,\n useId,\n useIsomorphicLayoutEffect,\n} from \"../utils\";\nimport { type UseComboBoxProps, useComboBox } from \"./useComboBox\";\n\nexport type ComboBoxProps<Item = string> = {\n /**\n * The options to display in the combo box.\n */\n children?: ReactNode;\n /**\n * If true, options will be selected when the tab key is pressed.\n */\n selectOnTab?: boolean;\n /**\n * Props to pass to ComboBox's overlay.\n */\n OverlayProps?: Omit<ComponentPropsWithoutRef<\"div\">, \"children\" | \"id\"> &\n DataAttributes;\n} & UseComboBoxProps<Item> &\n Omit<PillInputProps, \"onPillRemove\">;\n\nconst withBaseName = makePrefixer(\"saltComboBox\");\n\nexport const ComboBox = forwardRef(function ComboBox<Item>(\n props: ComboBoxProps<Item>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const {\n children,\n className,\n disabled: disabledProp,\n endAdornment: endAdornmentProp,\n readOnly: readOnlyProp,\n multiselect,\n selectOnTab = !multiselect,\n onSelectionChange,\n selected,\n defaultSelected,\n defaultOpen,\n onOpenChange,\n onChange,\n open,\n inputRef: inputRefProp,\n inputProps: inputPropsProp,\n variant = \"primary\",\n onKeyDown,\n onFocus,\n onBlur,\n value,\n defaultValue,\n valueToString = defaultValueToString,\n truncate,\n bordered = false,\n OverlayProps,\n ...rest\n } = props;\n\n const { CollapseIcon, ExpandIcon } = useIcon();\n const {\n a11yProps: { \"aria-labelledby\": formFieldLabelledBy } = {},\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n } = useFormFieldProps();\n\n const disabled = Boolean(disabledProp) || formFieldDisabled;\n const readOnly = Boolean(readOnlyProp) || formFieldReadOnly;\n const inputRef = useRef<HTMLInputElement>(null);\n const handleInputRef = useForkRef(inputRef, inputRefProp);\n const shouldAutoSelectRef = useRef(false);\n\n const listControl = useComboBox<Item>({\n open,\n defaultOpen,\n onOpenChange,\n multiselect,\n defaultSelected,\n selected,\n onSelectionChange,\n value,\n defaultValue,\n disabled,\n readOnly,\n valueToString,\n });\n\n const {\n activeState,\n setActive,\n openState,\n setOpen,\n openKey,\n getOptionsMatching,\n getFirstOption,\n getLastOption,\n getOptionAfter,\n getOptionBefore,\n getOptionPageAbove,\n getOptionPageBelow,\n selectedState,\n select,\n clear,\n focusVisibleState,\n setFocusVisibleState,\n focusedState,\n setFocusedState,\n listRef,\n setListRef,\n valueState,\n setValueState,\n removePill,\n } = listControl;\n\n const handleOpenChange: UseFloatingUIProps[\"onOpenChange\"] = (\n newOpen,\n _event,\n reason,\n ) => {\n const focusNotBlur = reason === \"focus\" && newOpen;\n if (reason === \"focus\") {\n setFocusedState(newOpen);\n }\n\n if (reason === \"focus\" && !newOpen) {\n setFocusVisibleState(false);\n }\n\n if (readOnly || focusNotBlur) return;\n setOpen(newOpen);\n\n if (newOpen) {\n inputRef.current?.focus();\n }\n };\n\n const hasValidChildren =\n Children.toArray(children).filter(Boolean).length > 0;\n\n const { x, y, strategy, elements, floating, reference, context } =\n useFloatingUI({\n open: openState && !readOnly && hasValidChildren,\n onOpenChange: handleOpenChange,\n placement: \"bottom-start\",\n strategy: \"fixed\",\n middleware: [\n offset(1),\n size({\n apply({ rects, elements, availableHeight }) {\n elements.floating.style.setProperty(\n \"--overlay-minWidth\",\n `${rects.reference.width}px`,\n );\n elements.floating.style.setProperty(\n \"--overlay-maxHeight\",\n `max(calc((var(--salt-size-base) + var(--salt-spacing-100)) * 5), calc(${availableHeight}px - var(--salt-spacing-100)))`,\n );\n },\n }),\n flip({ fallbackStrategy: \"initialPlacement\" }),\n ],\n });\n\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useDismiss(context),\n useFocus(context),\n useClick(context, { keyboardHandlers: false, toggle: false }),\n ]);\n\n const handleRef = useForkRef<HTMLDivElement>(reference, ref);\n\n const handleButtonClick = (event: MouseEvent<HTMLButtonElement>) => {\n if (!readOnly) {\n event.stopPropagation();\n setFocusVisibleState(false);\n setOpen(!openState, \"manual\");\n }\n };\n\n const handleButtonFocus = () => {\n inputRef.current?.focus();\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n\n if (!event.repeat) {\n shouldAutoSelectRef.current = false;\n }\n\n if (readOnly) {\n return;\n }\n\n if (!openState) {\n if (event.key === \"ArrowDown\" || event.key === \"ArrowUp\") {\n setOpen(true, undefined, event.key);\n return;\n }\n }\n\n const activeOption = activeState;\n\n let newActive:\n | { data: OptionValue<Item>; element: HTMLElement }\n | undefined;\n switch (event.key) {\n case \"ArrowDown\":\n newActive = activeOption\n ? getOptionAfter(activeOption)\n : getFirstOption();\n break;\n case \"ArrowUp\":\n newActive = activeOption\n ? getOptionBefore(activeOption)\n : getLastOption();\n break;\n case \"Home\":\n newActive = getFirstOption();\n break;\n case \"End\":\n newActive = getLastOption();\n break;\n case \"PageUp\":\n if (activeOption) {\n newActive = getOptionPageAbove(activeOption);\n } else {\n const lastOption = getLastOption();\n if (lastOption) {\n newActive = getOptionPageAbove(lastOption?.data);\n }\n }\n break;\n case \"PageDown\":\n if (activeOption) {\n newActive = getOptionPageBelow(activeOption);\n } else {\n const firstOption = getFirstOption();\n if (firstOption) {\n newActive = getOptionPageBelow(firstOption.data);\n }\n }\n break;\n case \"Enter\":\n if (openState && activeState?.disabled) {\n event.preventDefault();\n return;\n }\n\n if (!openState || !activeState) {\n return;\n }\n\n select(event, activeState);\n\n if (!multiselect) {\n event.preventDefault();\n }\n\n break;\n case \"Tab\":\n if (\n openState &&\n selectOnTab &&\n activeState &&\n !activeState?.disabled &&\n !selectedState.includes(activeState?.value)\n ) {\n select(event, activeState);\n }\n break;\n }\n\n if (newActive) {\n setFocusVisibleState(true);\n }\n\n if (newActive && newActive.data.id !== activeState?.id) {\n event.preventDefault();\n setActive(newActive.data);\n }\n };\n\n const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n if (event.currentTarget === inputRef.current) {\n setFocusedState(true);\n } else {\n setActive(undefined);\n }\n onFocus?.(event);\n };\n\n const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n event.persist();\n if (!listRef.current || !listRef.current.contains(event.relatedTarget)) {\n onBlur?.(event);\n shouldAutoSelectRef.current = false;\n }\n };\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const value = event.target.value;\n\n if (!openState) {\n setOpen(true, \"input\");\n }\n\n if (value === \"\" && !multiselect) {\n clear(event);\n }\n\n setValueState(value);\n\n // Clean active item if no text is present.\n if (value === \"\") {\n setActive(undefined);\n } else {\n shouldAutoSelectRef.current = true;\n }\n\n onChange?.(event);\n };\n\n const handlePillRemove = (event: SyntheticEvent, index: number) => {\n event.stopPropagation();\n const removed = selectedState[index];\n removePill(event, removed);\n };\n\n const handleListMouseOver = () => {\n setFocusVisibleState(false);\n };\n\n const handleListMouseLeave = () => {\n setActive(undefined);\n };\n\n const handleFocusInput = () => {\n inputRef.current?.focus();\n };\n\n useIsomorphicLayoutEffect(() => {\n if (value) {\n shouldAutoSelectRef.current = true;\n }\n }, [value]);\n\n useEffect(() => {\n if (openState && value) {\n queueMicrotask(() => {\n const newOption = getFirstOption();\n if (newOption && shouldAutoSelectRef.current) {\n setActive(newOption.data);\n }\n });\n }\n }, [value, setActive, openState, getFirstOption]);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: We only want this to run when the list's openState or the displayed options change.\n useEffect(() => {\n let newActive: ReturnType<typeof getFirstOption>;\n\n if (!openState) {\n setActive(undefined);\n return;\n }\n\n // If we have selected an item, we should make that the active item\n if (selectedState.length > 0) {\n newActive = getOptionsMatching(\n (option) => option.value === selectedState[0],\n ).pop();\n }\n\n // If we still don't have an active item, we should check if the list has been opened with the keyboard\n if (!newActive) {\n if (openKey.current === \"ArrowDown\") {\n newActive = getFirstOption();\n setFocusVisibleState(true);\n } else if (openKey.current === \"ArrowUp\") {\n newActive = getLastOption();\n setFocusVisibleState(true);\n }\n }\n\n if (newActive) {\n setActive(newActive?.data);\n }\n }, [openState]);\n\n const buttonId = useId();\n const listId = useId();\n\n const handleListRef = useForkRef<HTMLDivElement>(setListRef, floating);\n\n const showOptionsButton = (\n <Button\n aria-labelledby={clsx(buttonId, formFieldLabelledBy)}\n aria-label=\"Show options\"\n aria-expanded={openState}\n aria-controls={openState ? listId : undefined}\n aria-haspopup=\"listbox\"\n disabled={disabled}\n appearance=\"transparent\"\n onClick={handleButtonClick}\n onFocus={handleButtonFocus}\n tabIndex={-1}\n >\n {openState ? <CollapseIcon aria-hidden /> : <ExpandIcon aria-hidden />}\n </Button>\n );\n\n // avoid render empty fragment, or empty div appear in PillInput\n const endAdornment =\n !readOnly && hasValidChildren ? (\n <>\n {endAdornmentProp}\n {showOptionsButton}\n </>\n ) : (\n endAdornmentProp\n );\n\n return (\n <ListControlContext.Provider value={listControl}>\n <PillInput\n // Ensures that the field is focused when you don't directly click on the input.\n tabIndex={!disabled ? -1 : undefined}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"focused\")]: focusedState,\n [withBaseName(\"focusVisible\")]: focusVisibleState,\n },\n className,\n )}\n endAdornment={endAdornment}\n onChange={handleChange}\n // Workaround to have readonly conveyed by screen readers (https://github.com/jpmorganchase/salt-ds/issues/4586)\n role={readOnly ? \"textbox\" : \"combobox\"}\n disabled={disabled}\n readOnly={readOnly}\n inputProps={{\n \"aria-readonly\": readOnly ? \"true\" : undefined,\n \"aria-expanded\": !readOnly ? openState : undefined,\n \"aria-controls\": openState && !readOnly ? listId : undefined,\n onKeyDown: handleKeyDown,\n ...inputPropsProp,\n }}\n aria-activedescendant={activeState?.id}\n variant={variant}\n inputRef={handleInputRef}\n value={valueState}\n ref={handleRef}\n bordered={bordered}\n {...getReferenceProps({\n onBlur: handleBlur,\n onFocus: handleFocus,\n ...rest,\n })}\n pills={\n multiselect ? selectedState.map((item) => valueToString(item)) : []\n }\n truncate={truncate && !focusedState && !openState}\n onPillRemove={handlePillRemove}\n hidePillClose={!focusedState || readOnly}\n emptyReadOnlyMarker={\n readOnly && selectedState.length > 0 ? \"\" : undefined\n }\n />\n <OptionList\n aria-multiselectable={multiselect}\n open={(openState || focusedState) && !readOnly && hasValidChildren}\n collapsed={!openState}\n ref={handleListRef}\n id={listId}\n tabIndex={-1}\n {...getFloatingProps({\n onMouseOver: handleListMouseOver,\n onFocus: handleFocusInput,\n onClick: handleFocusInput,\n onMouseLeave: handleListMouseLeave,\n ...OverlayProps,\n })}\n left={x ?? 0}\n top={y ?? 0}\n position={strategy}\n width={elements.floating?.offsetWidth}\n height={elements.floating?.offsetHeight}\n >\n {children}\n </OptionList>\n </ListControlContext.Provider>\n );\n}) as <Item = string>(\n props: ComboBoxProps<Item> & { ref?: Ref<HTMLDivElement> },\n) => JSX.Element;\n"],"names":["makePrefixer","forwardRef","ComboBox","defaultValueToString","useIcon","useFormFieldProps","useRef","useForkRef","useComboBox","_a","Children","useFloatingUI","offset","size","elements","flip","useInteractions","useDismiss","useFocus","useClick","value","useIsomorphicLayoutEffect","useEffect","useId","jsx","Button","clsx","jsxs","Fragment","ListControlContext","PillInput","OptionList"],"mappings":"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"}
package/dist-cjs/index.js CHANGED
@@ -83,6 +83,7 @@ var Paginator = require('./pagination/Paginator.js');
83
83
  var Panel = require('./panel/Panel.js');
84
84
  var ParentChildLayout = require('./parent-child-layout/ParentChildLayout.js');
85
85
  var Pill = require('./pill/Pill.js');
86
+ var PillGroup = require('./pill/PillGroup.js');
86
87
  var CircularProgress = require('./progress/CircularProgress/CircularProgress.js');
87
88
  var LinearProgress = require('./progress/LinearProgress/LinearProgress.js');
88
89
  var RadioButton = require('./radio-button/RadioButton.js');
@@ -256,6 +257,7 @@ exports.Paginator = Paginator.Paginator;
256
257
  exports.Panel = Panel.Panel;
257
258
  exports.ParentChildLayout = ParentChildLayout.ParentChildLayout;
258
259
  exports.Pill = Pill.Pill;
260
+ exports.PillGroup = PillGroup.PillGroup;
259
261
  exports.CircularProgress = CircularProgress.CircularProgress;
260
262
  exports.LinearProgress = LinearProgress.LinearProgress;
261
263
  exports.RadioButton = RadioButton.RadioButton;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}