@salt-ds/core 1.54.2 → 1.56.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 (144) hide show
  1. package/CHANGELOG.md +77 -0
  2. package/css/salt-core.css +205 -1
  3. package/dist-cjs/button/Button.js +21 -17
  4. package/dist-cjs/button/Button.js.map +1 -1
  5. package/dist-cjs/combo-box/ComboBox.js +6 -2
  6. package/dist-cjs/combo-box/ComboBox.js.map +1 -1
  7. package/dist-cjs/dropdown/Dropdown.js +5 -2
  8. package/dist-cjs/dropdown/Dropdown.js.map +1 -1
  9. package/dist-cjs/form-field/FormField.js.map +1 -1
  10. package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
  11. package/dist-cjs/index.js +17 -0
  12. package/dist-cjs/index.js.map +1 -1
  13. package/dist-cjs/input/Input.js +137 -131
  14. package/dist-cjs/input/Input.js.map +1 -1
  15. package/dist-cjs/multiline-input/MultilineInput.js.map +1 -1
  16. package/dist-cjs/number-input/NumberInput.js +43 -39
  17. package/dist-cjs/number-input/NumberInput.js.map +1 -1
  18. package/dist-cjs/pill-input/PillInput.js.map +1 -1
  19. package/dist-cjs/salt-provider/ThemeApplicator.js.map +1 -1
  20. package/dist-cjs/semantic-icon-provider/SemanticIconProvider.js +7 -1
  21. package/dist-cjs/semantic-icon-provider/SemanticIconProvider.js.map +1 -1
  22. package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js +6 -3
  23. package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
  24. package/dist-cjs/status-adornment/StatusAdornment.js +10 -15
  25. package/dist-cjs/status-adornment/StatusAdornment.js.map +1 -1
  26. package/dist-cjs/status-indicator/StatusIndicator.js +6 -15
  27. package/dist-cjs/status-indicator/StatusIndicator.js.map +1 -1
  28. package/dist-cjs/status-indicator/ValidationStatus.js +2 -6
  29. package/dist-cjs/status-indicator/ValidationStatus.js.map +1 -1
  30. package/dist-cjs/switch/Switch.css.js +1 -1
  31. package/dist-cjs/switch/Switch.js +21 -10
  32. package/dist-cjs/switch/Switch.js.map +1 -1
  33. package/dist-cjs/table/TBody.js +32 -0
  34. package/dist-cjs/table/TBody.js.map +1 -0
  35. package/dist-cjs/table/TD.js +34 -0
  36. package/dist-cjs/table/TD.js.map +1 -0
  37. package/dist-cjs/table/TFoot.js +45 -0
  38. package/dist-cjs/table/TFoot.js.map +1 -0
  39. package/dist-cjs/table/TH.js +34 -0
  40. package/dist-cjs/table/TH.js.map +1 -0
  41. package/dist-cjs/table/THead.js +45 -0
  42. package/dist-cjs/table/THead.js.map +1 -0
  43. package/dist-cjs/table/TR.js +30 -0
  44. package/dist-cjs/table/TR.js.map +1 -0
  45. package/dist-cjs/table/Table.css.js +6 -0
  46. package/dist-cjs/table/Table.css.js.map +1 -0
  47. package/dist-cjs/table/Table.js +71 -0
  48. package/dist-cjs/table/Table.js.map +1 -0
  49. package/dist-cjs/table/TableContainer.js +85 -0
  50. package/dist-cjs/table/TableContainer.js.map +1 -0
  51. package/dist-cjs/table/TableContext.js +26 -0
  52. package/dist-cjs/table/TableContext.js.map +1 -0
  53. package/dist-cjs/theme/Density.js +7 -1
  54. package/dist-cjs/theme/Density.js.map +1 -1
  55. package/dist-cjs/toggle-button/ToggleButton.js +7 -4
  56. package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
  57. package/dist-cjs/tooltip/Tooltip.js +7 -5
  58. package/dist-cjs/tooltip/Tooltip.js.map +1 -1
  59. package/dist-es/button/Button.js +22 -18
  60. package/dist-es/button/Button.js.map +1 -1
  61. package/dist-es/combo-box/ComboBox.js +6 -2
  62. package/dist-es/combo-box/ComboBox.js.map +1 -1
  63. package/dist-es/dropdown/Dropdown.js +6 -3
  64. package/dist-es/dropdown/Dropdown.js.map +1 -1
  65. package/dist-es/form-field/FormField.js.map +1 -1
  66. package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
  67. package/dist-es/index.js +8 -0
  68. package/dist-es/index.js.map +1 -1
  69. package/dist-es/input/Input.js +138 -132
  70. package/dist-es/input/Input.js.map +1 -1
  71. package/dist-es/multiline-input/MultilineInput.js.map +1 -1
  72. package/dist-es/number-input/NumberInput.js +44 -40
  73. package/dist-es/number-input/NumberInput.js.map +1 -1
  74. package/dist-es/pill-input/PillInput.js.map +1 -1
  75. package/dist-es/salt-provider/ThemeApplicator.js.map +1 -1
  76. package/dist-es/semantic-icon-provider/SemanticIconProvider.js +7 -1
  77. package/dist-es/semantic-icon-provider/SemanticIconProvider.js.map +1 -1
  78. package/dist-es/spinner/svgSpinners/SpinnerSVG.js +6 -3
  79. package/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
  80. package/dist-es/status-adornment/StatusAdornment.js +10 -15
  81. package/dist-es/status-adornment/StatusAdornment.js.map +1 -1
  82. package/dist-es/status-indicator/StatusIndicator.js +6 -15
  83. package/dist-es/status-indicator/StatusIndicator.js.map +1 -1
  84. package/dist-es/status-indicator/ValidationStatus.js +2 -6
  85. package/dist-es/status-indicator/ValidationStatus.js.map +1 -1
  86. package/dist-es/switch/Switch.css.js +1 -1
  87. package/dist-es/switch/Switch.js +22 -11
  88. package/dist-es/switch/Switch.js.map +1 -1
  89. package/dist-es/table/TBody.js +30 -0
  90. package/dist-es/table/TBody.js.map +1 -0
  91. package/dist-es/table/TD.js +32 -0
  92. package/dist-es/table/TD.js.map +1 -0
  93. package/dist-es/table/TFoot.js +43 -0
  94. package/dist-es/table/TFoot.js.map +1 -0
  95. package/dist-es/table/TH.js +32 -0
  96. package/dist-es/table/TH.js.map +1 -0
  97. package/dist-es/table/THead.js +43 -0
  98. package/dist-es/table/THead.js.map +1 -0
  99. package/dist-es/table/TR.js +28 -0
  100. package/dist-es/table/TR.js.map +1 -0
  101. package/dist-es/table/Table.css.js +4 -0
  102. package/dist-es/table/Table.css.js.map +1 -0
  103. package/dist-es/table/Table.js +68 -0
  104. package/dist-es/table/Table.js.map +1 -0
  105. package/dist-es/table/TableContainer.js +83 -0
  106. package/dist-es/table/TableContainer.js.map +1 -0
  107. package/dist-es/table/TableContext.js +23 -0
  108. package/dist-es/table/TableContext.js.map +1 -0
  109. package/dist-es/theme/Density.js +7 -1
  110. package/dist-es/theme/Density.js.map +1 -1
  111. package/dist-es/toggle-button/ToggleButton.js +8 -5
  112. package/dist-es/toggle-button/ToggleButton.js.map +1 -1
  113. package/dist-es/tooltip/Tooltip.js +7 -5
  114. package/dist-es/tooltip/Tooltip.js.map +1 -1
  115. package/dist-types/button/Button.d.ts +20 -3
  116. package/dist-types/combo-box/ComboBox.d.ts +3 -3
  117. package/dist-types/dropdown/Dropdown.d.ts +4 -4
  118. package/dist-types/form-field/FormField.d.ts +2 -2
  119. package/dist-types/form-field-context/FormFieldContext.d.ts +5 -1
  120. package/dist-types/index.d.ts +5 -0
  121. package/dist-types/input/Input.d.ts +2 -1
  122. package/dist-types/multiline-input/MultilineInput.d.ts +2 -1
  123. package/dist-types/number-input/NumberInput.d.ts +2 -2
  124. package/dist-types/pill-input/PillInput.d.ts +2 -1
  125. package/dist-types/registerClassNameInjection.d.ts +19 -0
  126. package/dist-types/salt-provider/SaltProvider.d.ts +1 -1
  127. package/dist-types/salt-provider/ThemeApplicator.d.ts +1 -1
  128. package/dist-types/semantic-icon-provider/SemanticIconProvider.d.ts +5 -2
  129. package/dist-types/status-adornment/StatusAdornment.d.ts +2 -1
  130. package/dist-types/status-indicator/ValidationStatus.d.ts +10 -1
  131. package/dist-types/switch/Switch.d.ts +4 -0
  132. package/dist-types/table/TBody.d.ts +4 -0
  133. package/dist-types/table/TD.d.ts +10 -0
  134. package/dist-types/table/TFoot.d.ts +20 -0
  135. package/dist-types/table/TH.d.ts +10 -0
  136. package/dist-types/table/THead.d.ts +20 -0
  137. package/dist-types/table/TR.d.ts +4 -0
  138. package/dist-types/table/Table.d.ts +20 -0
  139. package/dist-types/table/TableContainer.d.ts +4 -0
  140. package/dist-types/table/TableContext.d.ts +8 -0
  141. package/dist-types/table/index.d.ts +8 -0
  142. package/dist-types/theme/Density.d.ts +1 -1
  143. package/dist-types/tooltip/Tooltip.d.ts +3 -2
  144. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,82 @@
1
1
  # @salt-ds/core
2
2
 
3
+ ## 1.56.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 972e37e: Added mobile density tokens.
8
+ - 4507919: Added table components, `Table`, `TBody`, `TD`, `TFoot`, `TH`, `THead`, `TR`, `TableContainer`.
9
+
10
+ `Table` is a basic HTML table intended for simple data display.
11
+
12
+ ```tsx
13
+ <TableContainer>
14
+ <Table>
15
+ <caption>Table name</caption>
16
+ <THead>
17
+ <TR>
18
+ <TH>Header 1</TH>
19
+ <TH>Header 2</TH>
20
+ </TR>
21
+ </THead>
22
+ <TBody>
23
+ <TR>
24
+ <TD>Row 1, Col 1</TD>
25
+ <TD>Row 1, Col 2</TD>
26
+ </TR>
27
+ <TR>
28
+ <TD>Row 2, Col 1</TD>
29
+ <TD>Row 2, Col 2</TD>
30
+ </TR>
31
+ </TBody>
32
+ <TFoot>
33
+ <TR>
34
+ <TD>Footer 1</TD>
35
+ <TD>Footer 2</TD>
36
+ </TR>
37
+ </TFoot>
38
+ </Table>
39
+ </TableContainer>
40
+ ```
41
+
42
+ ## 1.55.0
43
+
44
+ ### Minor Changes
45
+
46
+ - 27c4338: - added experimental extended style support to a subset of Salt components
47
+ - `Button`
48
+ - `ComboBox`
49
+ - `Dropdown`
50
+ - `Input`
51
+ - `NumberInput`
52
+ - `ToggleButton`
53
+ - `Tooltip`
54
+ - 27c4338: - added semantics icons to support status
55
+ - `ErrorStatusAdornment`
56
+ - `WarningStatusAdornment`
57
+ - `SuccessStatusAdornment`
58
+ - refactored `StatusIndicator` so icon can be provided through experimental API
59
+ - 472a1b4: Added support for read-only `Switch` via `readOnly` prop.
60
+
61
+ Example usage:
62
+
63
+ ```jsx
64
+ <Switch readOnly label="Read-only" />
65
+ ```
66
+
67
+ ### Patch Changes
68
+
69
+ - 27c4338: Refactored type definitions to support extended types for experimental features. These changes are non-breaking and aim to improve type safety and flexibility.
70
+
71
+ **Details**:
72
+
73
+ - Refactored `FormFieldValidationStatus` type to omit `"info"` from `ValidationStatuses`.
74
+ - Refactored `ValidationStatusValues` for consistency.
75
+
76
+ - Updated dependencies [27c4338]
77
+ - @salt-ds/styles@0.3.0
78
+ - @salt-ds/icons@1.17.1
79
+
3
80
  ## 1.54.2
4
81
 
5
82
  ### Patch Changes
package/css/salt-core.css CHANGED
@@ -4068,6 +4068,27 @@ a:focus .saltCard-interactable.saltCard-disabled {
4068
4068
  height: calc(var(--salt-size-base) - var(--salt-spacing-100));
4069
4069
  width: calc((var(--salt-size-selectable) + var(--salt-spacing-25) + var(--salt-size-fixed-100)) * 2);
4070
4070
  }
4071
+ .saltSwitch-readOnly {
4072
+ cursor: var(--salt-cursor-text);
4073
+ }
4074
+ .saltSwitch-readOnly .saltSwitch-track,
4075
+ .saltSwitch-readOnly:hover .saltSwitch-track {
4076
+ border-color: var(--salt-selectable-borderColor-readonly);
4077
+ color: var(--salt-content-primary-foreground);
4078
+ }
4079
+ .saltSwitch-readOnly:hover .saltSwitch-thumb {
4080
+ border-color: var(--salt-selectable-borderColor-readonly);
4081
+ }
4082
+ .saltSwitch-readOnly .saltSwitch-thumb,
4083
+ .saltSwitch-readOnly.saltSwitch-checked .saltSwitch-thumb {
4084
+ background: var(--salt-container-primary-background);
4085
+ border: var(--salt-size-fixed-100) var(--salt-borderStyle-dashed) var(--salt-selectable-borderColor-readonly);
4086
+ }
4087
+ .saltSwitch-readOnly .saltSwitch-input:focus-visible + .saltSwitch-track,
4088
+ .saltSwitch-readOnly .saltSwitch-input:focus-visible + .saltSwitch-track .saltSwitch-thumb {
4089
+ border-color: var(--salt-selectable-borderColor-readonly);
4090
+ color: var(--salt-content-primary-foreground);
4091
+ }
4071
4092
  @media (prefers-reduced-motion) {
4072
4093
  .saltSwitch-input:focus-visible + .saltSwitch-track .saltSwitch-thumb,
4073
4094
  .saltSwitch:hover .saltSwitch-thumb {
@@ -4077,12 +4098,195 @@ a:focus .saltCard-interactable.saltCard-disabled {
4077
4098
  .salt-density-high .saltSwitch-thumb {
4078
4099
  border: 0;
4079
4100
  }
4101
+ .salt-density-high .saltSwitch-readOnly .saltSwitch-thumb {
4102
+ border: var(--salt-size-fixed-100) var(--salt-borderStyle-dashed) var(--salt-selectable-borderColor-readonly);
4103
+ }
4080
4104
  .saltFormField-labelRight .saltSwitch,
4081
4105
  .saltFormField-labelLeft .saltSwitch {
4082
4106
  padding-top: var(--salt-spacing-50);
4083
4107
  padding-bottom: var(--salt-spacing-50);
4084
4108
  }
4085
4109
 
4110
+ /* src/table/Table.css */
4111
+ .saltTable {
4112
+ --table-header-height: calc(var(--salt-size-base) + var(--salt-spacing-100) + var(--salt-size-fixed-100));
4113
+ --table-footer-height: calc(var(--salt-size-base) + var(--salt-spacing-100) + var(--salt-size-fixed-100));
4114
+ --table-row-height: calc(var(--salt-size-base) + var(--salt-spacing-100) + var(--salt-size-fixed-100));
4115
+ }
4116
+ .saltTable-primary {
4117
+ --table-background: var(--salt-container-primary-background);
4118
+ }
4119
+ .saltTable-secondary {
4120
+ --table-background: var(--salt-container-secondary-background);
4121
+ }
4122
+ .saltTable-tertiary {
4123
+ --table-background: var(--salt-container-tertiary-background);
4124
+ }
4125
+ .saltTable-divider-primary {
4126
+ --table-divider-color: var(--salt-separable-primary-borderColor);
4127
+ }
4128
+ .saltTable-divider-secondary {
4129
+ --table-divider-color: var(--salt-separable-secondary-borderColor);
4130
+ }
4131
+ .saltTable-divider-tertiary {
4132
+ --table-divider-color: var(--salt-separable-tertiary-borderColor);
4133
+ }
4134
+ table.saltTable-zebra-tertiary tbody tr:nth-of-type(odd) {
4135
+ --table-background: var(--salt-container-tertiary-background);
4136
+ }
4137
+ table.saltTable-primary.saltTable-zebra tbody tr:nth-of-type(odd) {
4138
+ --table-background: var(--salt-container-secondary-background);
4139
+ }
4140
+ table.saltTable-secondary.saltTable-zebra tbody tr:nth-of-type(odd) {
4141
+ --table-background: var(--salt-container-primary-background);
4142
+ }
4143
+ table.saltTable-tertiary.saltTable-zebra tbody tr:nth-of-type(odd) {
4144
+ --table-background: var(--salt-container-primary-background);
4145
+ }
4146
+ table.saltTable {
4147
+ border-spacing: 0;
4148
+ border-radius: var(--salt-palette-corner, 0);
4149
+ border-collapse: collapse;
4150
+ color: var(--salt-content-primary-foreground);
4151
+ font-family: var(--salt-text-fontFamily);
4152
+ font-size: var(--salt-text-fontSize);
4153
+ line-height: var(--salt-text-lineHeight);
4154
+ width: 100%;
4155
+ }
4156
+ table.saltTable tr {
4157
+ background: var(--table-background);
4158
+ }
4159
+ table.saltTable tbody tr {
4160
+ height: var(--table-row-height);
4161
+ min-height: var(--table-row-height);
4162
+ }
4163
+ table.saltTable tbody tr:not(:last-child) {
4164
+ border-bottom: var(--salt-borderStyle-solid) var(--table-divider-color) var(--salt-size-fixed-100);
4165
+ }
4166
+ table.saltTable.saltTable-divider-none tbody tr {
4167
+ --table-divider-color: transparent;
4168
+ }
4169
+ table.saltTable thead {
4170
+ border-start-start-radius: var(--salt-palette-corner);
4171
+ border-start-end-radius: var(--salt-palette-corner);
4172
+ color: var(--salt-content-secondary-foreground);
4173
+ height: var(--table-header-height);
4174
+ min-height: var(--table-header-height);
4175
+ font-size: var(--salt-text-label-fontSize);
4176
+ font-weight: var(--salt-text-label-fontWeight-strong);
4177
+ line-height: var(--salt-text-label-lineHeight);
4178
+ }
4179
+ table.saltTable thead.saltTable-thead-sticky {
4180
+ position: sticky;
4181
+ top: 0;
4182
+ }
4183
+ table.saltTable thead.saltTable-thead-primary tr {
4184
+ background: var(--salt-container-primary-background);
4185
+ }
4186
+ table.saltTable thead.saltTable-thead-secondary tr {
4187
+ background: var(--salt-container-secondary-background);
4188
+ }
4189
+ table.saltTable thead.saltTable-thead-tertiary tr {
4190
+ background: var(--salt-container-tertiary-background);
4191
+ }
4192
+ table.saltTable thead.saltTable-thead tr {
4193
+ border-bottom: var(--salt-borderStyle-solid) var(--table-header-divider-color) var(--salt-size-fixed-100);
4194
+ }
4195
+ table.saltTable thead.saltTable-thead-divider-primary {
4196
+ --table-header-divider-color: var(--salt-separable-primary-borderColor);
4197
+ }
4198
+ table.saltTable thead.saltTable-thead-divider-secondary {
4199
+ --table-header-divider-color: var(--salt-separable-secondary-borderColor);
4200
+ }
4201
+ table.saltTable thead.saltTable-thead-divider-tertiary {
4202
+ --table-header-divider-color: var(--salt-separable-tertiary-borderColor);
4203
+ }
4204
+ table.saltTable thead.saltTable-thead-divider-none {
4205
+ --table-header-divider-color: transparent;
4206
+ }
4207
+ table.saltTable tfoot {
4208
+ border-end-start-radius: var(--salt-palette-corner);
4209
+ border-end-end-radius: var(--salt-palette-corner);
4210
+ color: var(--salt-content-primary-foreground);
4211
+ height: var(--table-footer-height);
4212
+ min-height: var(--table-footer-height);
4213
+ font-size: var(--salt-text-fontSize);
4214
+ line-height: var(--salt-text-lineHeight);
4215
+ font-weight: var(--salt-text-fontWeight-strong);
4216
+ }
4217
+ table.saltTable tfoot.saltTable-tfoot-sticky {
4218
+ position: sticky;
4219
+ bottom: 0;
4220
+ }
4221
+ table.saltTable tfoot.saltTable-tfoot tr {
4222
+ border-top: var(--salt-borderStyle-solid) var(--table-footer-divider-color) var(--salt-size-fixed-100);
4223
+ }
4224
+ table.saltTable tfoot.saltTable-tfoot-primary tr {
4225
+ background: var(--salt-container-primary-background);
4226
+ }
4227
+ table.saltTable tfoot.saltTable-tfoot-secondary tr {
4228
+ background: var(--salt-container-secondary-background);
4229
+ }
4230
+ table.saltTable tfoot.saltTable-tfoot-tertiary tr {
4231
+ background: var(--salt-container-tertiary-background);
4232
+ }
4233
+ table.saltTable tfoot.saltTable-tfoot-divider-primary tr {
4234
+ --table-footer-divider-color: var(--salt-separable-primary-borderColor);
4235
+ }
4236
+ table.saltTable tfoot.saltTable-tfoot-divider-secondary tr {
4237
+ --table-footer-divider-color: var(--salt-separable-secondary-borderColor);
4238
+ }
4239
+ table.saltTable tfoot.saltTable-tfoot-divider-tertiary tr {
4240
+ --table-footer-divider-color: var(--salt-separable-tertiary-borderColor);
4241
+ }
4242
+ table.saltTable tfoot.saltTable-tfoot-divider-none tr {
4243
+ --table-footer-divider-color: transparent;
4244
+ }
4245
+ table.saltTable th {
4246
+ padding: calc(var(--salt-spacing-75) + var(--salt-spacing-50)) var(--salt-spacing-100);
4247
+ padding-top: calc(var(--salt-spacing-75) + var(--salt-spacing-50) + var(--salt-size-fixed-100));
4248
+ position: relative;
4249
+ text-align: start;
4250
+ vertical-align: top;
4251
+ font-weight: inherit;
4252
+ }
4253
+ table.saltTable th.saltTable-th-align-left {
4254
+ text-align: start;
4255
+ }
4256
+ table.saltTable th.saltTable-th-align-right {
4257
+ text-align: end;
4258
+ }
4259
+ table.saltTable tbody th[scope=row] {
4260
+ font-weight: var(--salt-text-fontWeight-strong);
4261
+ line-height: var(--salt-text-lineHeight);
4262
+ }
4263
+ table.saltTable th + th::before {
4264
+ background: var(--salt-separable-tertiary-borderColor);
4265
+ content: "";
4266
+ position: absolute;
4267
+ z-index: 1;
4268
+ display: block;
4269
+ width: var(--salt-size-fixed-100);
4270
+ height: calc(100% - var(--salt-spacing-200));
4271
+ left: 0;
4272
+ top: var(--salt-spacing-100);
4273
+ }
4274
+ table.saltTable td {
4275
+ height: 100%;
4276
+ vertical-align: top;
4277
+ padding: calc(var(--salt-spacing-75) + var(--salt-spacing-50)) var(--salt-spacing-100);
4278
+ }
4279
+ table.saltTable td.saltTable-td-align-left {
4280
+ text-align: start;
4281
+ }
4282
+ table.saltTable td.saltTable-td-align-right {
4283
+ text-align: end;
4284
+ }
4285
+ .saltTable-container {
4286
+ width: 100%;
4287
+ overflow: auto;
4288
+ }
4289
+
4086
4290
  /* src/tag/Tag.css */
4087
4291
  .saltTag {
4088
4292
  height: calc(var(--salt-size-base) - var(--salt-spacing-100));
@@ -5556,4 +5760,4 @@ label.saltText small,
5556
5760
  color: var(--salt-status-error-foreground-informative);
5557
5761
  }
5558
5762
 
5559
- /* src/1506bde8-03dd-48a7-8b24-ffcf6c1e8b46.css */
5763
+ /* src/54a47adf-2206-4fc8-b932-3ebc87962e9a.css */
@@ -39,23 +39,27 @@ function variantToAppearanceAndColor(variant) {
39
39
  }
40
40
  }
41
41
  const Button = React.forwardRef(
42
- function Button2({
43
- children,
44
- className,
45
- disabled,
46
- focusableWhenDisabled,
47
- onKeyUp,
48
- onKeyDown,
49
- onBlur,
50
- onClick,
51
- loading,
52
- loadingAnnouncement,
53
- appearance: appearanceProp,
54
- sentiment: sentimentProp,
55
- type: typeProp = "button",
56
- variant = "primary",
57
- ...restProps
58
- }, ref) {
42
+ function Button2(props, ref) {
43
+ const { className, props: finalProps } = styles.useClassNameInjection(
44
+ "saltButton",
45
+ props
46
+ );
47
+ const {
48
+ children,
49
+ disabled,
50
+ focusableWhenDisabled,
51
+ onKeyUp,
52
+ onKeyDown,
53
+ onBlur,
54
+ onClick,
55
+ loading,
56
+ loadingAnnouncement,
57
+ appearance: appearanceProp,
58
+ sentiment: sentimentProp,
59
+ type: typeProp = "button",
60
+ variant = "primary",
61
+ ...restProps
62
+ } = finalProps;
59
63
  const { active, buttonProps } = useButton.useButton({
60
64
  loading,
61
65
  disabled,
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sources":["../src/button/Button.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type ReactElement,\n} from \"react\";\nimport { Spinner } from \"../spinner\";\nimport { makePrefixer } from \"../utils\";\n\nimport buttonCss from \"./Button.css\";\nimport { useButton } from \"./useButton\";\n\nconst withBaseName = makePrefixer(\"saltButton\");\n\nexport const ButtonVariantValues = [\"primary\", \"secondary\", \"cta\"] as const;\nexport const ButtonAppearanceValues = [\n \"solid\",\n \"bordered\",\n \"transparent\",\n] as const;\nexport const ButtonSentimentValues = [\n \"accented\",\n \"neutral\",\n \"positive\",\n \"negative\",\n \"caution\",\n] as const;\nexport type ButtonVariant = (typeof ButtonVariantValues)[number];\nexport type ButtonAppearance = (typeof ButtonAppearanceValues)[number];\nexport type ButtonSentiment = (typeof ButtonSentimentValues)[number];\n\nexport interface ButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n /**\n * If `true`, the button will be disabled.\n */\n disabled?: boolean;\n /**\n * If `true`, the button will be focusable when disabled.\n */\n focusableWhenDisabled?: boolean;\n /**\n * The variant to use. Options are 'primary', 'secondary' and 'cta'.\n * 'primary' is the default value.\n *\n * @deprecated Use `appearance` and `sentiment` instead.\n *\n * | variant | appearance | sentiment |\n * | ----------- | ------------- | ----------- |\n * | `cta` | `solid` | `accented` |\n * | `primary` | `solid` | `neutral` |\n * | `secondary` | `transparent` | `neutral` |\n */\n variant?: ButtonVariant;\n /**\n * The appearance of the button. Options are 'solid', 'bordered', and 'transparent'.\n * 'solid' is the default value.\n *\n * @since 1.36.0.\n */\n appearance?: ButtonAppearance;\n /**\n * The sentiment of the button. Options are 'accented', 'neutral', 'positive', 'negative' and 'caution'.\n * 'neutral' is the default value.\n *\n * @since 1.36.0.\n */\n sentiment?: ButtonSentiment;\n\n /**\n * If `true`, the button will be in a loading state. This allows a spinner to be nested inside the button.\n *\n * @since 1.38.0.\n */\n loading?: boolean;\n\n /**\n * Text to be announced by screen readers, intended to be used in conjunction with the `loading` prop.\n *\n * @since 1.38.0.\n */\n loadingAnnouncement?: string;\n}\n\nfunction variantToAppearanceAndColor(\n variant: ButtonVariant,\n): Pick<ButtonProps, \"appearance\" | \"sentiment\"> {\n switch (variant) {\n case \"primary\":\n return { appearance: \"solid\", sentiment: \"neutral\" };\n case \"secondary\":\n return { appearance: \"transparent\", sentiment: \"neutral\" };\n case \"cta\":\n return { appearance: \"solid\", sentiment: \"accented\" };\n }\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n children,\n className,\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onBlur,\n onClick,\n loading,\n loadingAnnouncement,\n appearance: appearanceProp,\n sentiment: sentimentProp,\n type: typeProp = \"button\",\n variant = \"primary\",\n ...restProps\n },\n ref?,\n ): ReactElement<ButtonProps> {\n const { active, buttonProps } = useButton({\n loading,\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onBlur,\n onClick,\n });\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-button\",\n css: buttonCss,\n window: targetWindow,\n });\n\n const mapped = variantToAppearanceAndColor(variant);\n const appearance: ButtonAppearance =\n appearanceProp ?? mapped?.appearance ?? \"solid\";\n\n const sentiment: ButtonSentiment =\n sentimentProp ?? mapped?.sentiment ?? \"neutral\";\n\n // we do not want to spread tab index in this case because the button element\n // does not require tabindex=\"0\" attribute\n const { tabIndex, ...restButtonProps } = buttonProps;\n\n /* When the button is in a loading state, we want to prevent form submission. */\n const type = typeProp === \"submit\" && loading ? \"button\" : typeProp;\n\n return (\n <button\n {...restButtonProps}\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"loading\")]: loading,\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"active\")]: active,\n [withBaseName(appearance)]: appearance,\n [withBaseName(sentiment)]: sentiment,\n },\n className,\n )}\n {...restProps}\n ref={ref}\n type={type}\n >\n {loading && (\n <div className={withBaseName(\"spinner\")} aria-hidden>\n <Spinner size=\"small\" aria-hidden disableAnnouncer />\n </div>\n )}\n {typeof loadingAnnouncement === \"string\" && (\n <span role=\"status\" className={withBaseName(\"sr-only\")}>\n {loadingAnnouncement}\n </span>\n )}\n {children}\n </button>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","Button","useButton","useWindow","useComponentCssInjection","buttonCss","jsxs","clsx","jsx","Spinner"],"mappings":"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"}
1
+ {"version":3,"file":"Button.js","sources":["../src/button/Button.tsx"],"sourcesContent":["import {\n useClassNameInjection,\n useComponentCssInjection,\n} from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { Spinner } from \"../spinner\";\nimport { makePrefixer } from \"../utils\";\n\nimport buttonCss from \"./Button.css\";\nimport { useButton } from \"./useButton\";\n\nconst withBaseName = makePrefixer(\"saltButton\");\n\nexport interface ButtonVariants {\n primary: string;\n secondary: string;\n cta: string;\n}\nexport type ButtonVariant = keyof ButtonVariants;\nexport const ButtonVariantValues = [\"primary\", \"secondary\", \"cta\"] as const;\n\nexport interface ButtonAppearances {\n solid: string;\n bordered: string;\n transparent: string;\n}\nexport type ButtonAppearance = keyof ButtonAppearances;\nexport const ButtonAppearanceValues = [\n \"solid\",\n \"bordered\",\n \"transparent\",\n] as const;\n\nexport interface ButtonSentiments {\n accented: string;\n neutral: string;\n positive: string;\n negative: string;\n caution: string;\n}\nexport type ButtonSentiment = keyof ButtonSentiments;\nexport const ButtonSentimentValues = [\n \"accented\",\n \"neutral\",\n \"positive\",\n \"negative\",\n \"caution\",\n] as const;\n\nexport interface ButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n /**\n * If `true`, the button will be disabled.\n */\n disabled?: boolean;\n /**\n * If `true`, the button will be focusable when disabled.\n */\n focusableWhenDisabled?: boolean;\n /**\n * The variant to use. Options are 'primary', 'secondary' and 'cta'.\n * 'primary' is the default value.\n *\n * @deprecated Use `appearance` and `sentiment` instead.\n *\n * | variant | appearance | sentiment |\n * | ----------- | ------------- | ----------- |\n * | `cta` | `solid` | `accented` |\n * | `primary` | `solid` | `neutral` |\n * | `secondary` | `transparent` | `neutral` |\n */\n variant?: ButtonVariant;\n /**\n * The appearance of the button. Options are 'solid', 'bordered', and 'transparent'.\n * 'solid' is the default value.\n *\n * @since 1.36.0.\n */\n appearance?: ButtonAppearance;\n /**\n * The sentiment of the button. Options are 'accented', 'neutral', 'positive', 'negative' and 'caution'.\n * 'neutral' is the default value.\n *\n * @since 1.36.0.\n */\n sentiment?: ButtonSentiment;\n\n /**\n * If `true`, the button will be in a loading state. This allows a spinner to be nested inside the button.\n *\n * @since 1.38.0.\n */\n loading?: boolean;\n\n /**\n * Text to be announced by screen readers, intended to be used in conjunction with the `loading` prop.\n *\n * @since 1.38.0.\n */\n loadingAnnouncement?: string;\n}\n\nfunction variantToAppearanceAndColor(\n variant: ButtonVariant,\n): Pick<ButtonProps, \"appearance\" | \"sentiment\"> {\n switch (variant) {\n case \"primary\":\n return { appearance: \"solid\", sentiment: \"neutral\" };\n case \"secondary\":\n return { appearance: \"transparent\", sentiment: \"neutral\" };\n case \"cta\":\n return { appearance: \"solid\", sentiment: \"accented\" };\n }\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(props, ref) {\n const { className, props: finalProps } = useClassNameInjection(\n \"saltButton\",\n props,\n );\n\n const {\n children,\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onBlur,\n onClick,\n loading,\n loadingAnnouncement,\n appearance: appearanceProp,\n sentiment: sentimentProp,\n type: typeProp = \"button\",\n variant = \"primary\",\n ...restProps\n } = finalProps;\n\n const { active, buttonProps } = useButton({\n loading,\n disabled,\n focusableWhenDisabled,\n onKeyUp,\n onKeyDown,\n onBlur,\n onClick,\n });\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-button\",\n css: buttonCss,\n window: targetWindow,\n });\n\n const mapped = variantToAppearanceAndColor(variant);\n const appearance: ButtonAppearance =\n appearanceProp ?? mapped?.appearance ?? \"solid\";\n\n const sentiment: ButtonSentiment =\n sentimentProp ?? mapped?.sentiment ?? \"neutral\";\n\n // we do not want to spread tab index in this case because the button element\n // does not require tabindex=\"0\" attribute\n const { tabIndex, ...restButtonProps } = buttonProps;\n\n /* When the button is in a loading state, we want to prevent form submission. */\n const type = typeProp === \"submit\" && loading ? \"button\" : typeProp;\n\n return (\n <button\n {...restButtonProps}\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"loading\")]: loading,\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"active\")]: active,\n [withBaseName(appearance)]: appearance,\n [withBaseName(sentiment)]: sentiment,\n },\n className,\n )}\n {...restProps}\n ref={ref}\n type={type}\n >\n {loading && (\n <div className={withBaseName(\"spinner\")} aria-hidden>\n <Spinner size=\"small\" aria-hidden disableAnnouncer />\n </div>\n )}\n {typeof loadingAnnouncement === \"string\" && (\n <span role=\"status\" className={withBaseName(\"sr-only\")}>\n {loadingAnnouncement}\n </span>\n )}\n {children}\n </button>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","Button","useClassNameInjection","useButton","useWindow","useComponentCssInjection","buttonCss","jsxs","clsx","jsx","Spinner"],"mappings":"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"}
@@ -2,6 +2,7 @@
2
2
 
3
3
  var jsxRuntime = require('react/jsx-runtime');
4
4
  var react = require('@floating-ui/react');
5
+ var styles = require('@salt-ds/styles');
5
6
  var clsx = require('clsx');
6
7
  var React = require('react');
7
8
  var Button = require('../button/Button.js');
@@ -24,9 +25,12 @@ var useComboBox = require('./useComboBox.js');
24
25
  const withBaseName = makePrefixer.makePrefixer("saltComboBox");
25
26
  const ComboBox = React.forwardRef(function ComboBox2(props, ref) {
26
27
  var _a, _b;
28
+ const { className, props: finalProps } = styles.useClassNameInjection(
29
+ "saltComboBox",
30
+ props
31
+ );
27
32
  const {
28
33
  children,
29
- className,
30
34
  disabled: disabledProp,
31
35
  endAdornment: endAdornmentProp,
32
36
  readOnly: readOnlyProp,
@@ -52,7 +56,7 @@ const ComboBox = React.forwardRef(function ComboBox2(props, ref) {
52
56
  bordered = false,
53
57
  OverlayProps,
54
58
  ...rest
55
- } = props;
59
+ } = finalProps;
56
60
  const { CollapseIcon, ExpandIcon } = SemanticIconProvider.useIcon();
57
61
  const {
58
62
  a11yProps: { "aria-labelledby": formFieldLabelledBy } = {},
@@ -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 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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"}
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 { useClassNameInjection } from \"@salt-ds/styles\";\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 interface ComboBoxProps<Item = string>\n extends UseComboBoxProps<Item>,\n Omit<PillInputProps, \"onPillRemove\"> {\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}\n\nconst withBaseName = makePrefixer(\"saltComboBox\");\n\nexport const ComboBox = forwardRef(function ComboBox<Item>(\n props: ComboBoxProps<Item>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const { className, props: finalProps } = useClassNameInjection(\n \"saltComboBox\",\n props,\n );\n const {\n children,\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 } = finalProps;\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","useClassNameInjection","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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"}
@@ -28,11 +28,14 @@ function ExpandIcon({ open }) {
28
28
  }
29
29
  const Dropdown = React.forwardRef(function Dropdown2(props, ref) {
30
30
  var _a, _b;
31
+ const { className, props: finalProps } = styles.useClassNameInjection(
32
+ "saltDropdown",
33
+ props
34
+ );
31
35
  const {
32
36
  "aria-labelledby": ariaLabelledBy,
33
37
  "aria-describedby": ariaDescribedBy,
34
38
  children,
35
- className,
36
39
  disabled: disabledProp,
37
40
  emptyReadOnlyMarker = "\u2014",
38
41
  readOnly: readOnlyProp,
@@ -56,7 +59,7 @@ const Dropdown = React.forwardRef(function Dropdown2(props, ref) {
56
59
  bordered = false,
57
60
  OverlayProps,
58
61
  ...rest
59
- } = props;
62
+ } = finalProps;
60
63
  const targetWindow = window$1.useWindow();
61
64
  styles.useComponentCssInjection({
62
65
  testId: "salt-dropdown",