@boostdev/design-system-components 0.1.14 → 0.1.15

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 (19) hide show
  1. package/dist/client.cjs +401 -361
  2. package/dist/client.css +480 -415
  3. package/dist/client.d.cts +22 -2
  4. package/dist/client.d.ts +22 -2
  5. package/dist/client.js +400 -361
  6. package/dist/index.cjs +401 -361
  7. package/dist/index.css +480 -415
  8. package/dist/index.d.cts +22 -2
  9. package/dist/index.d.ts +22 -2
  10. package/dist/index.js +400 -361
  11. package/package.json +1 -1
  12. package/src/components/ui/Collapsible/Collapsible.mdx +59 -0
  13. package/src/components/ui/Collapsible/Collapsible.module.css +76 -0
  14. package/src/components/ui/Collapsible/Collapsible.spec.tsx +75 -0
  15. package/src/components/ui/Collapsible/Collapsible.stories.tsx +57 -0
  16. package/src/components/ui/Collapsible/Collapsible.tsx +55 -0
  17. package/src/components/ui/Collapsible/index.ts +2 -0
  18. package/src/index.ts +2 -0
  19. package/src/stories/Introduction.mdx +2 -2
package/dist/index.css CHANGED
@@ -1,22 +1,22 @@
1
1
  /* src/components/ui/Accordion/Accordion.module.css */
2
2
  @layer component {
3
- .bds0114Accordion-accordion {
3
+ .bds0115Accordion-accordion {
4
4
  display: flex;
5
5
  flex-direction: column;
6
6
  border: 1px solid var(--color_bg--subtle);
7
7
  border-radius: var(--border_radius--s);
8
8
  overflow: hidden;
9
9
  }
10
- .bds0114Accordion-item {
10
+ .bds0115Accordion-item {
11
11
  border-bottom: 1px solid var(--color_bg--subtle);
12
12
  }
13
- .bds0114Accordion-item:last-child {
13
+ .bds0115Accordion-item:last-child {
14
14
  border-bottom: none;
15
15
  }
16
- .bds0114Accordion-heading {
16
+ .bds0115Accordion-heading {
17
17
  margin: 0;
18
18
  }
19
- .bds0114Accordion-trigger {
19
+ .bds0115Accordion-trigger {
20
20
  all: unset;
21
21
  display: flex;
22
22
  align-items: center;
@@ -31,44 +31,44 @@
31
31
  transition: var(--animation_transition);
32
32
  box-sizing: border-box;
33
33
  }
34
- .bds0114Accordion-trigger:disabled {
34
+ .bds0115Accordion-trigger:disabled {
35
35
  opacity: 0.4;
36
36
  cursor: not-allowed;
37
37
  }
38
- .bds0114Accordion-trigger:focus-visible {
38
+ .bds0115Accordion-trigger:focus-visible {
39
39
  outline: var(--outline_default);
40
40
  outline-offset: calc(var(--outline_offset) * -1);
41
41
  border-radius: var(--border_radius--xs);
42
42
  }
43
43
  @media (hover: hover) and (pointer: fine) {
44
- .bds0114Accordion-trigger:not(:disabled):hover {
44
+ .bds0115Accordion-trigger:not(:disabled):hover {
45
45
  background-color: var(--color_bg--subtle);
46
46
  }
47
47
  }
48
- .bds0114Accordion-triggerLabel {
48
+ .bds0115Accordion-triggerLabel {
49
49
  flex: 1;
50
50
  text-align: start;
51
51
  }
52
- .bds0114Accordion-chevron {
52
+ .bds0115Accordion-chevron {
53
53
  width: 1.25rem;
54
54
  height: 1.25rem;
55
55
  flex-shrink: 0;
56
56
  transition: transform var(--animation_transition-duration) var(--animation_easing);
57
57
  }
58
- .bds0114Accordion-item.bds0114Accordion---open .bds0114Accordion-chevron {
58
+ .bds0115Accordion-item.bds0115Accordion---open .bds0115Accordion-chevron {
59
59
  transform: rotate(180deg);
60
60
  }
61
- .bds0114Accordion-panel {
61
+ .bds0115Accordion-panel {
62
62
  overflow: hidden;
63
63
  }
64
- .bds0114Accordion-panelContent {
64
+ .bds0115Accordion-panelContent {
65
65
  padding: 0 var(--space_m) var(--space_m);
66
66
  color: var(--color_on-bg);
67
67
  font-size: var(--font_size--body);
68
68
  line-height: var(--font_line-height--body);
69
69
  }
70
70
  @media (prefers-reduced-motion: reduce) {
71
- .bds0114Accordion-chevron {
71
+ .bds0115Accordion-chevron {
72
72
  transition: none;
73
73
  }
74
74
  }
@@ -76,7 +76,7 @@
76
76
 
77
77
  /* src/components/ui/Alert/Alert.module.css */
78
78
  @layer component {
79
- .bds0114Alert-alert {
79
+ .bds0115Alert-alert {
80
80
  display: flex;
81
81
  align-items: flex-start;
82
82
  gap: var(--space_s);
@@ -88,43 +88,43 @@
88
88
  font-size: var(--font_size--body);
89
89
  line-height: var(--font_line-height--body);
90
90
  }
91
- .bds0114Alert---variant_info {
91
+ .bds0115Alert---variant_info {
92
92
  --alert_bg: var(--color_blue--subtle);
93
93
  --alert_text: var(--color_on-blue--subtle);
94
94
  --alert_border: var(--color_blue);
95
95
  }
96
- .bds0114Alert---variant_success {
96
+ .bds0115Alert---variant_success {
97
97
  --alert_bg: var(--color_success--subtle);
98
98
  --alert_text: var(--color_on-success--subtle);
99
99
  --alert_border: var(--color_success);
100
100
  }
101
- .bds0114Alert---variant_warning {
101
+ .bds0115Alert---variant_warning {
102
102
  --alert_bg: var(--color_orange--subtle);
103
103
  --alert_text: var(--color_on-orange--subtle);
104
104
  --alert_border: var(--color_warning);
105
105
  }
106
- .bds0114Alert---variant_error {
106
+ .bds0115Alert---variant_error {
107
107
  --alert_bg: rgb(from var(--color_error) r g b / 12%);
108
108
  --alert_text: var(--color_on-bg);
109
109
  --alert_border: var(--color_error);
110
110
  }
111
- .bds0114Alert-icon {
111
+ .bds0115Alert-icon {
112
112
  display: flex;
113
113
  align-items: center;
114
114
  flex-shrink: 0;
115
115
  margin-block-start: 0.1em;
116
116
  }
117
- .bds0114Alert-content {
117
+ .bds0115Alert-content {
118
118
  flex: 1;
119
119
  display: flex;
120
120
  flex-direction: column;
121
121
  gap: var(--space_xxs);
122
122
  }
123
- .bds0114Alert-title {
123
+ .bds0115Alert-title {
124
124
  font-weight: var(--font_weight--semibold);
125
125
  font-size: var(--font_size--body);
126
126
  }
127
- .bds0114Alert-dismiss {
127
+ .bds0115Alert-dismiss {
128
128
  all: unset;
129
129
  display: flex;
130
130
  align-items: center;
@@ -136,16 +136,16 @@
136
136
  border: 1px solid currentcolor;
137
137
  border-radius: 50%;
138
138
  }
139
- .bds0114Alert-dismiss svg {
139
+ .bds0115Alert-dismiss svg {
140
140
  width: 1rem;
141
141
  height: 1rem;
142
142
  }
143
- .bds0114Alert-dismiss:focus-visible {
143
+ .bds0115Alert-dismiss:focus-visible {
144
144
  outline: var(--outline_default);
145
145
  outline-offset: var(--outline_offset);
146
146
  }
147
147
  @media (hover: hover) and (pointer: fine) {
148
- .bds0114Alert-dismiss:hover {
148
+ .bds0115Alert-dismiss:hover {
149
149
  opacity: 0.7;
150
150
  }
151
151
  }
@@ -153,7 +153,7 @@
153
153
 
154
154
  /* src/components/ui/Avatar/Avatar.module.css */
155
155
  @layer component {
156
- .bds0114Avatar-avatar {
156
+ .bds0115Avatar-avatar {
157
157
  display: inline-flex;
158
158
  align-items: center;
159
159
  justify-content: center;
@@ -163,42 +163,42 @@
163
163
  overflow: hidden;
164
164
  flex-shrink: 0;
165
165
  }
166
- .bds0114Avatar-avatar.bds0114Avatar---fallback {
166
+ .bds0115Avatar-avatar.bds0115Avatar---fallback {
167
167
  background-color: var(--avatar_bg, var(--color_blue));
168
168
  color: var(--avatar_text, var(--color_on-blue));
169
169
  font-weight: var(--font_weight--semibold);
170
170
  }
171
- .bds0114Avatar-avatar.bds0114Avatar---size_small {
171
+ .bds0115Avatar-avatar.bds0115Avatar---size_small {
172
172
  --avatar_size: 2em;
173
173
  }
174
- .bds0114Avatar-avatar.bds0114Avatar---size_medium {
174
+ .bds0115Avatar-avatar.bds0115Avatar---size_medium {
175
175
  --avatar_size: 3em;
176
176
  }
177
- .bds0114Avatar-avatar.bds0114Avatar---size_large {
177
+ .bds0115Avatar-avatar.bds0115Avatar---size_large {
178
178
  --avatar_size: 4.5em;
179
179
  }
180
- .bds0114Avatar-image {
180
+ .bds0115Avatar-image {
181
181
  width: 100%;
182
182
  height: 100%;
183
183
  object-fit: cover;
184
184
  display: block;
185
185
  }
186
- .bds0114Avatar-initials {
186
+ .bds0115Avatar-initials {
187
187
  line-height: 1;
188
188
  user-select: none;
189
189
  font-size: var(--font_size--body);
190
190
  }
191
- .bds0114Avatar-avatar.bds0114Avatar---size_small .bds0114Avatar-initials {
191
+ .bds0115Avatar-avatar.bds0115Avatar---size_small .bds0115Avatar-initials {
192
192
  font-size: var(--font_size--body--s);
193
193
  }
194
- .bds0114Avatar-avatar.bds0114Avatar---size_large .bds0114Avatar-initials {
194
+ .bds0115Avatar-avatar.bds0115Avatar---size_large .bds0115Avatar-initials {
195
195
  font-size: var(--font_size--heading-3);
196
196
  }
197
197
  }
198
198
 
199
199
  /* src/components/ui/Badge/Badge.module.css */
200
200
  @layer component {
201
- .bds0114Badge-badge {
201
+ .bds0115Badge-badge {
202
202
  display: inline-flex;
203
203
  align-items: center;
204
204
  justify-content: center;
@@ -211,23 +211,23 @@
211
211
  background-color: var(--badge_bg, var(--color_blue));
212
212
  color: var(--badge_text, var(--color_on-blue));
213
213
  }
214
- .bds0114Badge---variant_primary {
214
+ .bds0115Badge---variant_primary {
215
215
  --badge_bg: var(--color_interactive);
216
216
  --badge_text: var(--color_on-interactive);
217
217
  }
218
- .bds0114Badge---variant_secondary {
218
+ .bds0115Badge---variant_secondary {
219
219
  --badge_bg: var(--color_bg);
220
220
  --badge_text: var(--color_on-bg);
221
221
  }
222
- .bds0114Badge---variant_success {
222
+ .bds0115Badge---variant_success {
223
223
  --badge_bg: var(--color_success);
224
224
  --badge_text: var(--color_on-success);
225
225
  }
226
- .bds0114Badge---variant_error {
226
+ .bds0115Badge---variant_error {
227
227
  --badge_bg: var(--color_error);
228
228
  --badge_text: var(--color_on-error);
229
229
  }
230
- .bds0114Badge---variant_warning {
230
+ .bds0115Badge---variant_warning {
231
231
  --badge_bg: var(--color_warning);
232
232
  --badge_text: var(--color_on-warning);
233
233
  }
@@ -235,10 +235,10 @@
235
235
 
236
236
  /* src/components/ui/Breadcrumb/Breadcrumb.module.css */
237
237
  @layer component {
238
- .bds0114Breadcrumb-breadcrumb {
238
+ .bds0115Breadcrumb-breadcrumb {
239
239
  font-size: var(--font_size--body--s);
240
240
  }
241
- .bds0114Breadcrumb-list {
241
+ .bds0115Breadcrumb-list {
242
242
  display: flex;
243
243
  flex-wrap: wrap;
244
244
  align-items: center;
@@ -247,40 +247,105 @@
247
247
  margin: 0;
248
248
  padding: 0;
249
249
  }
250
- .bds0114Breadcrumb-item {
250
+ .bds0115Breadcrumb-item {
251
251
  display: flex;
252
252
  align-items: center;
253
253
  gap: var(--space_xxs);
254
254
  }
255
- .bds0114Breadcrumb-link {
255
+ .bds0115Breadcrumb-link {
256
256
  color: var(--color_interactive);
257
257
  text-decoration: none;
258
258
  transition: var(--animation_transition);
259
259
  }
260
- .bds0114Breadcrumb-link:focus-visible {
260
+ .bds0115Breadcrumb-link:focus-visible {
261
261
  outline: var(--outline_default);
262
262
  outline-offset: var(--outline_offset);
263
263
  border-radius: var(--border_radius--xs);
264
264
  }
265
265
  @media (hover: hover) and (pointer: fine) {
266
- .bds0114Breadcrumb-link:hover {
266
+ .bds0115Breadcrumb-link:hover {
267
267
  text-decoration: underline;
268
268
  text-underline-offset: 0.2em;
269
269
  }
270
270
  }
271
- .bds0114Breadcrumb-separator {
271
+ .bds0115Breadcrumb-separator {
272
272
  color: var(--color_on-bg--subtle);
273
273
  user-select: none;
274
274
  }
275
- .bds0114Breadcrumb-current {
275
+ .bds0115Breadcrumb-current {
276
276
  color: var(--color_on-bg--subtle);
277
277
  font-weight: var(--font_weight--semibold);
278
278
  }
279
279
  }
280
280
 
281
+ /* src/components/ui/Collapsible/Collapsible.module.css */
282
+ @layer component {
283
+ .bds0115Collapsible-collapsible {
284
+ border: var(--collapsible_border-width, 1px) solid var(--collapsible_border-color, var(--color_bg--subtle));
285
+ border-radius: var(--collapsible_border-radius, var(--border_radius--m));
286
+ overflow: hidden;
287
+ }
288
+ .bds0115Collapsible-summary {
289
+ list-style: none;
290
+ display: flex;
291
+ align-items: center;
292
+ justify-content: space-between;
293
+ gap: var(--space_m);
294
+ padding: var(--space_m);
295
+ cursor: pointer;
296
+ font-weight: var(--font_weight--semibold);
297
+ font-size: var(--font_size--body);
298
+ color: var(--collapsible_color, var(--color_on-bg));
299
+ background-color: var(--collapsible_bg, var(--color_bg));
300
+ user-select: none;
301
+ transition: var(--animation_transition);
302
+ }
303
+ .bds0115Collapsible-summary::-webkit-details-marker {
304
+ display: none;
305
+ }
306
+ .bds0115Collapsible-summary:focus-visible {
307
+ outline: var(--outline_default);
308
+ outline-offset: calc(var(--outline_offset) * -1);
309
+ }
310
+ @media (hover: hover) and (pointer: fine) {
311
+ .bds0115Collapsible-summary:hover {
312
+ background-color: var(--collapsible_bg--hover, var(--color_bg--subtle));
313
+ }
314
+ }
315
+ .bds0115Collapsible-collapsible[open] > .bds0115Collapsible-summary {
316
+ border-block-end: var(--collapsible_border-width, 1px) solid var(--collapsible_border-color, var(--color_bg--subtle));
317
+ }
318
+ .bds0115Collapsible-summaryContent {
319
+ flex: 1;
320
+ }
321
+ .bds0115Collapsible-icon {
322
+ width: 0.5rem;
323
+ height: 0.5rem;
324
+ border-right: 2px solid currentcolor;
325
+ border-bottom: 2px solid currentcolor;
326
+ transform: rotate(45deg);
327
+ flex-shrink: 0;
328
+ transition: transform var(--animation_transition-duration) var(--animation_easing);
329
+ }
330
+ .bds0115Collapsible-collapsible[open] > .bds0115Collapsible-summary .bds0115Collapsible-icon {
331
+ transform: rotate(-135deg);
332
+ }
333
+ .bds0115Collapsible-content {
334
+ padding: var(--space_m);
335
+ color: var(--collapsible_on-color, var(--color_on-bg));
336
+ font-size: var(--font_size--body);
337
+ line-height: var(--font_line-height--body);
338
+ }
339
+ @media (prefers-reduced-motion: reduce) {
340
+ .bds0115Collapsible-icon {
341
+ transition: none;
342
+ }
343
+ }
344
+ }
345
+
281
346
  /* src/components/ui/Calendar/Calendar.module.css */
282
347
  @layer component {
283
- .bds0114Calendar-calendar {
348
+ .bds0115Calendar-calendar {
284
349
  display: inline-flex;
285
350
  flex-direction: column;
286
351
  gap: var(--space_s);
@@ -291,17 +356,17 @@
291
356
  box-shadow: var(--shadow_s);
292
357
  width: 20rem;
293
358
  }
294
- .bds0114Calendar-header {
359
+ .bds0115Calendar-header {
295
360
  display: flex;
296
361
  align-items: center;
297
362
  justify-content: space-between;
298
363
  }
299
- .bds0114Calendar-monthYear {
364
+ .bds0115Calendar-monthYear {
300
365
  font-size: var(--font_size--body);
301
366
  font-weight: var(--font_weight--semibold);
302
367
  color: var(--color_on-bg);
303
368
  }
304
- .bds0114Calendar-navBtn {
369
+ .bds0115Calendar-navBtn {
305
370
  all: unset;
306
371
  display: flex;
307
372
  align-items: center;
@@ -313,35 +378,35 @@
313
378
  color: var(--color_on-bg);
314
379
  transition: var(--animation_transition);
315
380
  }
316
- .bds0114Calendar-navBtn svg {
381
+ .bds0115Calendar-navBtn svg {
317
382
  width: 1rem;
318
383
  height: 1rem;
319
384
  }
320
- .bds0114Calendar-navBtn:focus-visible {
385
+ .bds0115Calendar-navBtn:focus-visible {
321
386
  outline: var(--outline_default);
322
387
  outline-offset: var(--outline_offset);
323
388
  }
324
389
  @media (hover: hover) and (pointer: fine) {
325
- .bds0114Calendar-navBtn:hover {
390
+ .bds0115Calendar-navBtn:hover {
326
391
  background-color: var(--color_bg--subtle);
327
392
  }
328
393
  }
329
- .bds0114Calendar-grid {
394
+ .bds0115Calendar-grid {
330
395
  border-collapse: collapse;
331
396
  width: 100%;
332
397
  table-layout: fixed;
333
398
  }
334
- .bds0114Calendar-weekday {
399
+ .bds0115Calendar-weekday {
335
400
  font-size: var(--font_size--body--s);
336
401
  font-weight: var(--font_weight--semibold);
337
402
  color: var(--color_on-bg--muted);
338
403
  text-align: center;
339
404
  padding-block-end: var(--space_xs);
340
405
  }
341
- .bds0114Calendar-empty {
406
+ .bds0115Calendar-empty {
342
407
  padding: 0;
343
408
  }
344
- .bds0114Calendar-day {
409
+ .bds0115Calendar-day {
345
410
  all: unset;
346
411
  display: flex;
347
412
  align-items: center;
@@ -355,30 +420,30 @@
355
420
  transition: var(--animation_transition);
356
421
  box-sizing: border-box;
357
422
  }
358
- .bds0114Calendar-day:focus-visible {
423
+ .bds0115Calendar-day:focus-visible {
359
424
  outline: var(--outline_default);
360
425
  outline-offset: var(--outline_offset);
361
426
  }
362
427
  @media (hover: hover) and (pointer: fine) {
363
- .bds0114Calendar-day:not(.bds0114Calendar-disabled, .bds0114Calendar-selected):hover {
428
+ .bds0115Calendar-day:not(.bds0115Calendar-disabled, .bds0115Calendar-selected):hover {
364
429
  background-color: var(--color_bg--subtle);
365
430
  }
366
431
  }
367
- .bds0114Calendar-today {
432
+ .bds0115Calendar-today {
368
433
  border: 2px solid var(--color_interactive);
369
434
  font-weight: var(--font_weight--semibold);
370
435
  }
371
- .bds0114Calendar-selected {
436
+ .bds0115Calendar-selected {
372
437
  background-color: var(--color_interactive);
373
438
  color: var(--color_on-interactive);
374
439
  font-weight: var(--font_weight--semibold);
375
440
  }
376
- .bds0114Calendar-disabled {
441
+ .bds0115Calendar-disabled {
377
442
  opacity: 0.35;
378
443
  cursor: not-allowed;
379
444
  }
380
445
  @media (prefers-reduced-motion: reduce) {
381
- .bds0114Calendar-day {
446
+ .bds0115Calendar-day {
382
447
  transition: none;
383
448
  }
384
449
  }
@@ -386,13 +451,13 @@
386
451
 
387
452
  /* src/components/ui/Carousel/Carousel.module.css */
388
453
  @layer component {
389
- .bds0114Carousel-carousel {
454
+ .bds0115Carousel-carousel {
390
455
  position: relative;
391
456
  display: flex;
392
457
  align-items: center;
393
458
  gap: var(--space_xs);
394
459
  }
395
- .bds0114Carousel-track {
460
+ .bds0115Carousel-track {
396
461
  display: flex;
397
462
  gap: var(--space_m);
398
463
  overflow-x: auto;
@@ -401,14 +466,14 @@
401
466
  flex: 1;
402
467
  scroll-behavior: smooth;
403
468
  }
404
- .bds0114Carousel-track::-webkit-scrollbar {
469
+ .bds0115Carousel-track::-webkit-scrollbar {
405
470
  display: none;
406
471
  }
407
- .bds0114Carousel-slide {
472
+ .bds0115Carousel-slide {
408
473
  scroll-snap-align: start;
409
474
  flex-shrink: 0;
410
475
  }
411
- .bds0114Carousel-navBtn {
476
+ .bds0115Carousel-navBtn {
412
477
  all: unset;
413
478
  display: flex;
414
479
  align-items: center;
@@ -424,21 +489,21 @@
424
489
  transition: var(--animation_transition);
425
490
  box-shadow: var(--shadow_s);
426
491
  }
427
- .bds0114Carousel-navBtn svg {
492
+ .bds0115Carousel-navBtn svg {
428
493
  width: 1.25rem;
429
494
  height: 1.25rem;
430
495
  }
431
- .bds0114Carousel-navBtn:focus-visible {
496
+ .bds0115Carousel-navBtn:focus-visible {
432
497
  outline: var(--outline_default);
433
498
  outline-offset: var(--outline_offset);
434
499
  }
435
500
  @media (hover: hover) and (pointer: fine) {
436
- .bds0114Carousel-navBtn:hover {
501
+ .bds0115Carousel-navBtn:hover {
437
502
  background-color: var(--color_bg--subtle);
438
503
  }
439
504
  }
440
505
  @media (prefers-reduced-motion: reduce) {
441
- .bds0114Carousel-track {
506
+ .bds0115Carousel-track {
442
507
  scroll-behavior: auto;
443
508
  }
444
509
  }
@@ -446,7 +511,7 @@
446
511
 
447
512
  /* src/components/ui/DescriptionList/DescriptionList.module.css */
448
513
  @layer component {
449
- .bds0114DescriptionList-list {
514
+ .bds0115DescriptionList-list {
450
515
  display: flex;
451
516
  flex-direction: column;
452
517
  gap: var(--space_s);
@@ -455,61 +520,61 @@
455
520
  font-size: var(--font_size--body);
456
521
  color: var(--color_on-bg);
457
522
  }
458
- .bds0114DescriptionList-group {
523
+ .bds0115DescriptionList-group {
459
524
  display: flex;
460
525
  flex-direction: column;
461
526
  gap: var(--space_xxs);
462
527
  }
463
- .bds0114DescriptionList-term {
528
+ .bds0115DescriptionList-term {
464
529
  font-weight: var(--font_weight--semibold);
465
530
  color: var(--color_on-bg);
466
531
  }
467
- .bds0114DescriptionList-details {
532
+ .bds0115DescriptionList-details {
468
533
  margin: 0;
469
534
  color: var(--color_on-bg--muted);
470
535
  }
471
- .bds0114DescriptionList---layout_inline .bds0114DescriptionList-group {
536
+ .bds0115DescriptionList---layout_inline .bds0115DescriptionList-group {
472
537
  display: grid;
473
538
  grid-template-columns: minmax(8rem, 1fr) 2fr;
474
539
  gap: var(--space_xs);
475
540
  align-items: baseline;
476
541
  }
477
- .bds0114DescriptionList---layout_inline .bds0114DescriptionList-term {
542
+ .bds0115DescriptionList---layout_inline .bds0115DescriptionList-term {
478
543
  grid-column: 1;
479
544
  }
480
- .bds0114DescriptionList---layout_inline .bds0114DescriptionList-details {
545
+ .bds0115DescriptionList---layout_inline .bds0115DescriptionList-details {
481
546
  grid-column: 2;
482
547
  }
483
548
  }
484
549
 
485
550
  /* src/components/ui/Link/Link.module.css */
486
551
  @layer component {
487
- .bds0114Link-link {
552
+ .bds0115Link-link {
488
553
  color: var(--link_color, var(--color_interactive));
489
554
  text-decoration: underline;
490
555
  text-underline-offset: 0.2em;
491
556
  transition: var(--animation_transition);
492
557
  cursor: pointer;
493
558
  }
494
- .bds0114Link-link:focus-visible {
559
+ .bds0115Link-link:focus-visible {
495
560
  outline: var(--outline_default);
496
561
  outline-offset: var(--outline_offset);
497
562
  border-radius: var(--border_radius--xs);
498
563
  }
499
564
  @media (hover: hover) and (pointer: fine) {
500
- .bds0114Link-link:hover {
565
+ .bds0115Link-link:hover {
501
566
  --link_color: var(--link_color-hover, var(--color_blue--strong));
502
567
  }
503
568
  }
504
- .bds0114Link---variant_default {
569
+ .bds0115Link---variant_default {
505
570
  --link_color: var(--color_interactive);
506
571
  --link_color-hover: var(--color_blue--strong);
507
572
  }
508
- .bds0114Link---variant_subtle {
573
+ .bds0115Link---variant_subtle {
509
574
  --link_color: var(--color_on-bg);
510
575
  --link_color-hover: var(--color_interactive);
511
576
  }
512
- .bds0114Link---variant_standalone {
577
+ .bds0115Link---variant_standalone {
513
578
  --link_color: var(--color_interactive);
514
579
  --link_color-hover: var(--color_blue--strong);
515
580
  display: inline-flex;
@@ -519,12 +584,12 @@
519
584
  text-decoration: none;
520
585
  }
521
586
  @media (hover: hover) and (pointer: fine) {
522
- .bds0114Link---variant_standalone:hover {
587
+ .bds0115Link---variant_standalone:hover {
523
588
  text-decoration: underline;
524
589
  text-underline-offset: 0.2em;
525
590
  }
526
591
  }
527
- .bds0114Link-externalLabel {
592
+ .bds0115Link-externalLabel {
528
593
  position: absolute;
529
594
  width: 1px;
530
595
  height: 1px;
@@ -539,12 +604,12 @@
539
604
 
540
605
  /* src/components/ui/Loading/Loading.module.css */
541
606
  @layer component {
542
- .bds0114Loading-loading {
607
+ .bds0115Loading-loading {
543
608
  display: flex;
544
609
  justify-content: center;
545
610
  align-items: center;
546
611
  }
547
- .bds0114Loading-spinner {
612
+ .bds0115Loading-spinner {
548
613
  width: 2.5em;
549
614
  height: 2.5em;
550
615
  border: 4px solid var(--color_bg);
@@ -552,12 +617,12 @@
552
617
  border-radius: 50%;
553
618
  animation: spin 1s linear infinite;
554
619
  }
555
- .bds0114Loading---size_small .bds0114Loading-spinner {
620
+ .bds0115Loading---size_small .bds0115Loading-spinner {
556
621
  width: 1.5em;
557
622
  height: 1.5em;
558
623
  border-width: 2px;
559
624
  }
560
- .bds0114Loading---size_large .bds0114Loading-spinner {
625
+ .bds0115Loading---size_large .bds0115Loading-spinner {
561
626
  width: 4em;
562
627
  height: 4em;
563
628
  border-width: 6px;
@@ -574,7 +639,7 @@
574
639
 
575
640
  /* src/components/ui/NotificationBanner/NotificationBanner.module.css */
576
641
  @layer component {
577
- .bds0114NotificationBanner-banner {
642
+ .bds0115NotificationBanner-banner {
578
643
  display: flex;
579
644
  align-items: center;
580
645
  gap: var(--space_m);
@@ -586,33 +651,33 @@
586
651
  line-height: var(--font_line-height--body);
587
652
  width: 100%;
588
653
  }
589
- .bds0114NotificationBanner---variant_info {
654
+ .bds0115NotificationBanner---variant_info {
590
655
  --banner_bg: var(--color_blue--subtle);
591
656
  --banner_text: var(--color_on-blue--subtle);
592
657
  --banner_border: var(--color_blue);
593
658
  }
594
- .bds0114NotificationBanner---variant_success {
659
+ .bds0115NotificationBanner---variant_success {
595
660
  --banner_bg: var(--color_success--subtle);
596
661
  --banner_text: var(--color_on-success--subtle);
597
662
  --banner_border: var(--color_success);
598
663
  }
599
- .bds0114NotificationBanner---variant_warning {
664
+ .bds0115NotificationBanner---variant_warning {
600
665
  --banner_bg: var(--color_orange--subtle);
601
666
  --banner_text: var(--color_on-orange--subtle);
602
667
  --banner_border: var(--color_warning);
603
668
  }
604
- .bds0114NotificationBanner---variant_error {
669
+ .bds0115NotificationBanner---variant_error {
605
670
  --banner_bg: rgb(from var(--color_error) r g b / 12%);
606
671
  --banner_text: var(--color_on-bg);
607
672
  --banner_border: var(--color_error);
608
673
  }
609
- .bds0114NotificationBanner-content {
674
+ .bds0115NotificationBanner-content {
610
675
  flex: 1;
611
676
  }
612
- .bds0114NotificationBanner-action {
677
+ .bds0115NotificationBanner-action {
613
678
  flex-shrink: 0;
614
679
  }
615
- .bds0114NotificationBanner-dismiss {
680
+ .bds0115NotificationBanner-dismiss {
616
681
  all: unset;
617
682
  display: flex;
618
683
  align-items: center;
@@ -624,16 +689,16 @@
624
689
  border: 1px solid currentcolor;
625
690
  transition: var(--animation_transition);
626
691
  }
627
- .bds0114NotificationBanner-dismiss svg {
692
+ .bds0115NotificationBanner-dismiss svg {
628
693
  width: 1rem;
629
694
  height: 1rem;
630
695
  }
631
- .bds0114NotificationBanner-dismiss:focus-visible {
696
+ .bds0115NotificationBanner-dismiss:focus-visible {
632
697
  outline: var(--outline_default);
633
698
  outline-offset: var(--outline_offset);
634
699
  }
635
700
  @media (hover: hover) and (pointer: fine) {
636
- .bds0114NotificationBanner-dismiss:hover {
701
+ .bds0115NotificationBanner-dismiss:hover {
637
702
  opacity: 0.7;
638
703
  }
639
704
  }
@@ -641,11 +706,11 @@
641
706
 
642
707
  /* src/components/ui/Pagination/Pagination.module.css */
643
708
  @layer component {
644
- .bds0114Pagination-pagination {
709
+ .bds0115Pagination-pagination {
645
710
  display: flex;
646
711
  justify-content: center;
647
712
  }
648
- .bds0114Pagination-list {
713
+ .bds0115Pagination-list {
649
714
  display: flex;
650
715
  align-items: center;
651
716
  gap: var(--space_xxs);
@@ -653,7 +718,7 @@
653
718
  margin: 0;
654
719
  padding: 0;
655
720
  }
656
- .bds0114Pagination-button {
721
+ .bds0115Pagination-button {
657
722
  all: unset;
658
723
  display: inline-flex;
659
724
  align-items: center;
@@ -672,30 +737,30 @@
672
737
  transition: var(--animation_transition);
673
738
  box-sizing: border-box;
674
739
  }
675
- .bds0114Pagination-button:disabled {
740
+ .bds0115Pagination-button:disabled {
676
741
  opacity: 0.4;
677
742
  cursor: not-allowed;
678
743
  }
679
- .bds0114Pagination-button:focus-visible {
744
+ .bds0115Pagination-button:focus-visible {
680
745
  outline: var(--outline_default);
681
746
  outline-offset: var(--outline_offset);
682
747
  }
683
748
  @media (hover: hover) and (pointer: fine) {
684
- .bds0114Pagination-button:not(:disabled, .bds0114Pagination---active):hover {
749
+ .bds0115Pagination-button:not(:disabled, .bds0115Pagination---active):hover {
685
750
  --btn_bg: var(--color_bg--subtle);
686
751
  --btn_color: var(--color_interactive);
687
752
  }
688
753
  }
689
- .bds0114Pagination-button.bds0114Pagination---active {
754
+ .bds0115Pagination-button.bds0115Pagination---active {
690
755
  --btn_bg: var(--color_interactive);
691
756
  --btn_color: var(--color_on-interactive);
692
757
  --btn_border: var(--color_interactive);
693
758
  }
694
- .bds0114Pagination-button.bds0114Pagination---nav svg {
759
+ .bds0115Pagination-button.bds0115Pagination---nav svg {
695
760
  width: 1rem;
696
761
  height: 1rem;
697
762
  }
698
- .bds0114Pagination-ellipsis {
763
+ .bds0115Pagination-ellipsis {
699
764
  display: inline-flex;
700
765
  align-items: center;
701
766
  justify-content: center;
@@ -709,49 +774,49 @@
709
774
 
710
775
  /* src/components/ui/Progress/Progress.module.css */
711
776
  @layer component {
712
- .bds0114Progress-container {
777
+ .bds0115Progress-container {
713
778
  display: flex;
714
779
  flex-direction: column;
715
780
  gap: var(--space_xxs);
716
781
  width: 100%;
717
782
  }
718
- .bds0114Progress-labelRow {
783
+ .bds0115Progress-labelRow {
719
784
  display: flex;
720
785
  justify-content: space-between;
721
786
  align-items: baseline;
722
787
  font-size: var(--font_size--body--s);
723
788
  color: var(--color_on-bg);
724
789
  }
725
- .bds0114Progress-label {
790
+ .bds0115Progress-label {
726
791
  font-weight: var(--font_weight--semibold);
727
792
  }
728
- .bds0114Progress-value {
793
+ .bds0115Progress-value {
729
794
  font-variant-numeric: tabular-nums;
730
795
  }
731
- .bds0114Progress-track {
796
+ .bds0115Progress-track {
732
797
  width: 100%;
733
798
  height: var(--progress_height, var(--space_xs));
734
799
  background-color: var(--color_bg--subtle);
735
800
  border-radius: 999px;
736
801
  overflow: hidden;
737
802
  }
738
- .bds0114Progress-track.bds0114Progress---size_small {
803
+ .bds0115Progress-track.bds0115Progress---size_small {
739
804
  --progress_height: var(--space_xxs);
740
805
  }
741
- .bds0114Progress-track.bds0114Progress---size_medium {
806
+ .bds0115Progress-track.bds0115Progress---size_medium {
742
807
  --progress_height: var(--space_xs);
743
808
  }
744
- .bds0114Progress-track.bds0114Progress---size_large {
809
+ .bds0115Progress-track.bds0115Progress---size_large {
745
810
  --progress_height: var(--space_s);
746
811
  }
747
- .bds0114Progress-fill {
812
+ .bds0115Progress-fill {
748
813
  height: 100%;
749
814
  background-color: var(--progress_color-active, var(--color_active));
750
815
  border-radius: 999px;
751
816
  transition: width var(--animation_transition-duration) var(--animation_easing);
752
817
  }
753
818
  @media (prefers-reduced-motion: reduce) {
754
- .bds0114Progress-fill {
819
+ .bds0115Progress-fill {
755
820
  transition: none;
756
821
  }
757
822
  }
@@ -759,23 +824,23 @@
759
824
 
760
825
  /* src/components/ui/ProgressCircle/ProgressCircle.module.css */
761
826
  @layer component {
762
- .bds0114ProgressCircle-wrapper {
827
+ .bds0115ProgressCircle-wrapper {
763
828
  position: relative;
764
829
  display: inline-flex;
765
830
  align-items: center;
766
831
  justify-content: center;
767
832
  }
768
- .bds0114ProgressCircle-svg {
833
+ .bds0115ProgressCircle-svg {
769
834
  display: block;
770
835
  }
771
- .bds0114ProgressCircle-track {
836
+ .bds0115ProgressCircle-track {
772
837
  stroke: var(--color_bg--subtle);
773
838
  }
774
- .bds0114ProgressCircle-fill {
839
+ .bds0115ProgressCircle-fill {
775
840
  stroke: var(--progressCircle_color-active, var(--color_active));
776
841
  transition: stroke-dashoffset var(--animation_transition-duration) var(--animation_easing);
777
842
  }
778
- .bds0114ProgressCircle-value {
843
+ .bds0115ProgressCircle-value {
779
844
  position: absolute;
780
845
  font-size: var(--font_size--body--s);
781
846
  font-weight: var(--font_weight--semibold);
@@ -783,17 +848,17 @@
783
848
  color: var(--color_on-bg);
784
849
  line-height: 1;
785
850
  }
786
- .bds0114ProgressCircle---size_small .bds0114ProgressCircle-value {
851
+ .bds0115ProgressCircle---size_small .bds0115ProgressCircle-value {
787
852
  font-size: 0.5rem;
788
853
  }
789
- .bds0114ProgressCircle---size_medium .bds0114ProgressCircle-value {
854
+ .bds0115ProgressCircle---size_medium .bds0115ProgressCircle-value {
790
855
  font-size: var(--font_size--body--s);
791
856
  }
792
- .bds0114ProgressCircle---size_large .bds0114ProgressCircle-value {
857
+ .bds0115ProgressCircle---size_large .bds0115ProgressCircle-value {
793
858
  font-size: var(--font_size--body);
794
859
  }
795
860
  @media (prefers-reduced-motion: reduce) {
796
- .bds0114ProgressCircle-fill {
861
+ .bds0115ProgressCircle-fill {
797
862
  transition: none;
798
863
  }
799
864
  }
@@ -801,16 +866,16 @@
801
866
 
802
867
  /* src/components/ui/Separator/Separator.module.css */
803
868
  @layer component {
804
- .bds0114Separator-separator {
869
+ .bds0115Separator-separator {
805
870
  border: none;
806
871
  background-color: var(--separator_color, var(--color_on-bg));
807
872
  }
808
- .bds0114Separator-separator.bds0114Separator---horizontal {
873
+ .bds0115Separator-separator.bds0115Separator---horizontal {
809
874
  display: block;
810
875
  width: 100%;
811
876
  height: var(--separator_thickness, 1px);
812
877
  }
813
- .bds0114Separator-separator.bds0114Separator---vertical {
878
+ .bds0115Separator-separator.bds0115Separator---vertical {
814
879
  display: inline-block;
815
880
  width: var(--separator_thickness, 1px);
816
881
  align-self: stretch;
@@ -819,7 +884,7 @@
819
884
 
820
885
  /* src/components/ui/Skeleton/Skeleton.module.css */
821
886
  @layer component {
822
- .bds0114Skeleton-skeleton {
887
+ .bds0115Skeleton-skeleton {
823
888
  background:
824
889
  linear-gradient(
825
890
  90deg,
@@ -843,7 +908,7 @@
843
908
 
844
909
  /* src/components/ui/SkipLink/SkipLink.module.css */
845
910
  @layer component {
846
- .bds0114SkipLink-skipLink {
911
+ .bds0115SkipLink-skipLink {
847
912
  position: absolute;
848
913
  inset-block-start: var(--space_s);
849
914
  inset-inline-start: var(--space_s);
@@ -859,13 +924,13 @@
859
924
  transform: translateY(-200%);
860
925
  transition: transform var(--animation_transition-duration) var(--animation_easing);
861
926
  }
862
- .bds0114SkipLink-skipLink:focus-visible {
927
+ .bds0115SkipLink-skipLink:focus-visible {
863
928
  transform: translateY(0);
864
929
  outline: var(--outline_default);
865
930
  outline-offset: var(--outline_offset);
866
931
  }
867
932
  @media (prefers-reduced-motion: reduce) {
868
- .bds0114SkipLink-skipLink {
933
+ .bds0115SkipLink-skipLink {
869
934
  transition: none;
870
935
  }
871
936
  }
@@ -873,29 +938,29 @@
873
938
 
874
939
  /* src/components/ui/Table/Table.module.css */
875
940
  @layer component {
876
- .bds0114Table-wrapper {
941
+ .bds0115Table-wrapper {
877
942
  width: 100%;
878
943
  overflow-x: auto;
879
944
  border-radius: var(--border_radius--s);
880
945
  border: 1px solid var(--color_bg--subtle);
881
946
  }
882
- .bds0114Table-table {
947
+ .bds0115Table-table {
883
948
  width: 100%;
884
949
  border-collapse: collapse;
885
950
  font-size: var(--font_size--body);
886
951
  font-family: var(--font_family--body);
887
952
  }
888
- .bds0114Table-caption {
953
+ .bds0115Table-caption {
889
954
  caption-side: top;
890
955
  text-align: start;
891
956
  padding: var(--space_s) var(--space_m);
892
957
  font-weight: var(--font_weight--semibold);
893
958
  color: var(--color_on-bg);
894
959
  }
895
- .bds0114Table-thead {
960
+ .bds0115Table-thead {
896
961
  background-color: var(--color_bg--subtle);
897
962
  }
898
- .bds0114Table-th {
963
+ .bds0115Table-th {
899
964
  padding: var(--space_s) var(--space_m);
900
965
  text-align: start;
901
966
  font-weight: var(--font_weight--semibold);
@@ -904,10 +969,10 @@
904
969
  white-space: nowrap;
905
970
  border-bottom: 1px solid var(--color_bg--subtle);
906
971
  }
907
- .bds0114Table-th.bds0114Table---sortable {
972
+ .bds0115Table-th.bds0115Table---sortable {
908
973
  padding: 0;
909
974
  }
910
- .bds0114Table-sortButton {
975
+ .bds0115Table-sortButton {
911
976
  all: unset;
912
977
  display: flex;
913
978
  align-items: center;
@@ -921,47 +986,47 @@
921
986
  transition: var(--animation_transition);
922
987
  box-sizing: border-box;
923
988
  }
924
- .bds0114Table-sortButton:focus-visible {
989
+ .bds0115Table-sortButton:focus-visible {
925
990
  outline: var(--outline_default);
926
991
  outline-offset: calc(var(--outline_offset) * -1);
927
992
  }
928
993
  @media (hover: hover) and (pointer: fine) {
929
- .bds0114Table-sortButton:hover {
994
+ .bds0115Table-sortButton:hover {
930
995
  color: var(--color_on-bg);
931
996
  }
932
997
  }
933
- .bds0114Table-sortIcon {
998
+ .bds0115Table-sortIcon {
934
999
  width: 1rem;
935
1000
  height: 1rem;
936
1001
  opacity: 0.4;
937
1002
  transition: transform var(--animation_transition-duration) var(--animation_easing), opacity var(--animation_transition-duration) var(--animation_easing);
938
1003
  }
939
- .bds0114Table-sortIcon.bds0114Table---sort-active {
1004
+ .bds0115Table-sortIcon.bds0115Table---sort-active {
940
1005
  opacity: 1;
941
1006
  color: var(--color_interactive);
942
1007
  }
943
- .bds0114Table-sortIcon.bds0114Table---sort-desc {
1008
+ .bds0115Table-sortIcon.bds0115Table---sort-desc {
944
1009
  transform: rotate(180deg);
945
1010
  }
946
- .bds0114Table-tbody .bds0114Table-tr {
1011
+ .bds0115Table-tbody .bds0115Table-tr {
947
1012
  border-bottom: 1px solid var(--color_bg--subtle);
948
1013
  transition: var(--animation_transition);
949
1014
  }
950
- .bds0114Table-tbody .bds0114Table-tr:last-child {
1015
+ .bds0115Table-tbody .bds0115Table-tr:last-child {
951
1016
  border-bottom: none;
952
1017
  }
953
1018
  @media (hover: hover) and (pointer: fine) {
954
- .bds0114Table-tbody .bds0114Table-tr:hover {
1019
+ .bds0115Table-tbody .bds0115Table-tr:hover {
955
1020
  background-color: var(--color_bg--subtle);
956
1021
  }
957
1022
  }
958
- .bds0114Table-td {
1023
+ .bds0115Table-td {
959
1024
  padding: var(--space_s) var(--space_m);
960
1025
  color: var(--color_on-bg);
961
1026
  vertical-align: middle;
962
1027
  }
963
1028
  @media (prefers-reduced-motion: reduce) {
964
- .bds0114Table-sortIcon {
1029
+ .bds0115Table-sortIcon {
965
1030
  transition: none;
966
1031
  }
967
1032
  }
@@ -969,16 +1034,16 @@
969
1034
 
970
1035
  /* src/components/ui/Tabs/Tabs.module.css */
971
1036
  @layer component {
972
- .bds0114Tabs-tabs {
1037
+ .bds0115Tabs-tabs {
973
1038
  display: flex;
974
1039
  flex-direction: column;
975
1040
  }
976
- .bds0114Tabs-tabList {
1041
+ .bds0115Tabs-tabList {
977
1042
  display: flex;
978
1043
  border-bottom: 1px solid var(--color_bg--subtle);
979
1044
  gap: var(--space_xxs);
980
1045
  }
981
- .bds0114Tabs-tab {
1046
+ .bds0115Tabs-tab {
982
1047
  all: unset;
983
1048
  display: inline-flex;
984
1049
  align-items: center;
@@ -992,28 +1057,28 @@
992
1057
  cursor: pointer;
993
1058
  transition: var(--animation_transition);
994
1059
  }
995
- .bds0114Tabs-tab.bds0114Tabs---active {
1060
+ .bds0115Tabs-tab.bds0115Tabs---active {
996
1061
  --tab_color: var(--color_interactive);
997
1062
  --tab_border-color: var(--color_interactive);
998
1063
  }
999
- .bds0114Tabs-tab:disabled {
1064
+ .bds0115Tabs-tab:disabled {
1000
1065
  opacity: 0.4;
1001
1066
  cursor: not-allowed;
1002
1067
  }
1003
- .bds0114Tabs-tab:focus-visible {
1068
+ .bds0115Tabs-tab:focus-visible {
1004
1069
  outline: var(--outline_default);
1005
1070
  outline-offset: var(--outline_offset);
1006
1071
  border-radius: var(--border_radius--xs);
1007
1072
  }
1008
1073
  @media (hover: hover) and (pointer: fine) {
1009
- .bds0114Tabs-tab:not(:disabled, .bds0114Tabs---active):hover {
1074
+ .bds0115Tabs-tab:not(:disabled, .bds0115Tabs---active):hover {
1010
1075
  --tab_color: var(--color_interactive);
1011
1076
  }
1012
1077
  }
1013
- .bds0114Tabs-panel {
1078
+ .bds0115Tabs-panel {
1014
1079
  padding-block-start: var(--space_m);
1015
1080
  }
1016
- .bds0114Tabs-panel:focus-visible {
1081
+ .bds0115Tabs-panel:focus-visible {
1017
1082
  outline: var(--outline_default);
1018
1083
  outline-offset: var(--outline_offset);
1019
1084
  }
@@ -1021,12 +1086,12 @@
1021
1086
 
1022
1087
  /* src/components/ui/Tooltip/Tooltip.module.css */
1023
1088
  @layer component {
1024
- .bds0114Tooltip-wrapper {
1089
+ .bds0115Tooltip-wrapper {
1025
1090
  position: relative;
1026
1091
  display: inline-flex;
1027
1092
  align-items: center;
1028
1093
  }
1029
- .bds0114Tooltip-tooltip {
1094
+ .bds0115Tooltip-tooltip {
1030
1095
  position: absolute;
1031
1096
  z-index: var(--z-index_popover);
1032
1097
  padding: var(--space_xxs) var(--space_xs);
@@ -1041,33 +1106,33 @@
1041
1106
  opacity: 0;
1042
1107
  transition: opacity var(--animation_transition-duration) var(--animation_easing);
1043
1108
  }
1044
- .bds0114Tooltip-wrapper:hover .bds0114Tooltip-tooltip,
1045
- .bds0114Tooltip-wrapper:focus-within .bds0114Tooltip-tooltip {
1109
+ .bds0115Tooltip-wrapper:hover .bds0115Tooltip-tooltip,
1110
+ .bds0115Tooltip-wrapper:focus-within .bds0115Tooltip-tooltip {
1046
1111
  visibility: visible;
1047
1112
  opacity: 1;
1048
1113
  }
1049
- .bds0114Tooltip---placement_top {
1114
+ .bds0115Tooltip---placement_top {
1050
1115
  bottom: calc(100% + var(--space_xs));
1051
1116
  left: 50%;
1052
1117
  transform: translateX(-50%);
1053
1118
  }
1054
- .bds0114Tooltip---placement_bottom {
1119
+ .bds0115Tooltip---placement_bottom {
1055
1120
  top: calc(100% + var(--space_xs));
1056
1121
  left: 50%;
1057
1122
  transform: translateX(-50%);
1058
1123
  }
1059
- .bds0114Tooltip---placement_left {
1124
+ .bds0115Tooltip---placement_left {
1060
1125
  right: calc(100% + var(--space_xs));
1061
1126
  top: 50%;
1062
1127
  transform: translateY(-50%);
1063
1128
  }
1064
- .bds0114Tooltip---placement_right {
1129
+ .bds0115Tooltip---placement_right {
1065
1130
  left: calc(100% + var(--space_xs));
1066
1131
  top: 50%;
1067
1132
  transform: translateY(-50%);
1068
1133
  }
1069
1134
  @media (prefers-reduced-motion: reduce) {
1070
- .bds0114Tooltip-tooltip {
1135
+ .bds0115Tooltip-tooltip {
1071
1136
  transition: none;
1072
1137
  }
1073
1138
  }
@@ -1075,34 +1140,34 @@
1075
1140
 
1076
1141
  /* src/components/ui/Typography/Typography.module.css */
1077
1142
  @layer component {
1078
- .bds0114Typography-typography {
1143
+ .bds0115Typography-typography {
1079
1144
  margin: 0;
1080
1145
  font-family: var(--font_family--body);
1081
1146
  color: var(--typography_color, var(--color_on-bg));
1082
1147
  }
1083
- .bds0114Typography---h1 {
1148
+ .bds0115Typography---h1 {
1084
1149
  font-family: var(--font_family--heading);
1085
1150
  font-size: var(--font_size--heading-1);
1086
1151
  font-weight: var(--font_weight--bold);
1087
1152
  line-height: var(--font_line-height--heading);
1088
1153
  }
1089
- .bds0114Typography---h2 {
1154
+ .bds0115Typography---h2 {
1090
1155
  font-family: var(--font_family--heading);
1091
1156
  font-size: var(--font_size--heading-2);
1092
1157
  font-weight: var(--font_weight--semibold);
1093
1158
  line-height: var(--font_line-height--heading);
1094
1159
  }
1095
- .bds0114Typography---h3 {
1160
+ .bds0115Typography---h3 {
1096
1161
  font-family: var(--font_family--heading);
1097
1162
  font-size: var(--font_size--heading-3);
1098
1163
  font-weight: var(--font_weight--semibold);
1099
1164
  line-height: var(--font_line-height--heading);
1100
1165
  }
1101
- .bds0114Typography---body {
1166
+ .bds0115Typography---body {
1102
1167
  font-size: var(--font_size--body);
1103
1168
  line-height: var(--font_line-height--body);
1104
1169
  }
1105
- .bds0114Typography---body_s {
1170
+ .bds0115Typography---body_s {
1106
1171
  font-size: var(--font_size--body--s);
1107
1172
  line-height: var(--font_line-height--body);
1108
1173
  }
@@ -1124,8 +1189,8 @@
1124
1189
  }
1125
1190
  }
1126
1191
  @layer component {
1127
- .bds0114Button-button,
1128
- .bds0114Button-button[href] {
1192
+ .bds0115Button-button,
1193
+ .bds0115Button-button[href] {
1129
1194
  all: unset;
1130
1195
  position: relative;
1131
1196
  font: inherit;
@@ -1146,68 +1211,68 @@
1146
1211
  border: 2px solid var(--button_border-color, var(--color_cta));
1147
1212
  transition: var(--animation_transition);
1148
1213
  }
1149
- .bds0114Button-button.bds0114Button---primary {
1214
+ .bds0115Button-button.bds0115Button---primary {
1150
1215
  --button_border-color: transparent;
1151
1216
  }
1152
- .bds0114Button-button.bds0114Button---secondary {
1217
+ .bds0115Button-button.bds0115Button---secondary {
1153
1218
  --button_bg: var(--color_bg);
1154
1219
  --button_text: var(--color_on-bg);
1155
1220
  --button_border-color: var(--button_text);
1156
1221
  }
1157
- .bds0114Button-button.bds0114Button---size_small {
1222
+ .bds0115Button-button.bds0115Button---size_small {
1158
1223
  --button_height: 2.25em;
1159
1224
  --button_font-size: var(--font_size--body--s);
1160
1225
  --button_border_radius--s: var(--border_radius--xs);
1161
1226
  padding-inline: var(--space_m);
1162
1227
  }
1163
- .bds0114Button-button.bds0114Button---size_medium {
1228
+ .bds0115Button-button.bds0115Button---size_medium {
1164
1229
  --button_height: 3em;
1165
1230
  padding-inline: var(--space_l);
1166
1231
  }
1167
- .bds0114Button-button.bds0114Button---size_large {
1232
+ .bds0115Button-button.bds0115Button---size_large {
1168
1233
  --button_font-size: var(--font_size--heading-3);
1169
1234
  padding-inline: var(--space_xl);
1170
1235
  --button_border_radius--s: var(--border_radius--m);
1171
1236
  }
1172
- .bds0114Button-button.bds0114Button---hasPulse {
1237
+ .bds0115Button-button.bds0115Button---hasPulse {
1173
1238
  animation: pulse 3s infinite;
1174
1239
  }
1175
- .bds0114Button-button[href] {
1240
+ .bds0115Button-button[href] {
1176
1241
  text-decoration: none;
1177
1242
  }
1178
- .bds0114Button-button svg {
1243
+ .bds0115Button-button svg {
1179
1244
  --icon__stroke: currentcolor;
1180
1245
  fill: currentcolor;
1181
1246
  color: currentcolor;
1182
1247
  flex-shrink: 0;
1183
1248
  }
1184
- .bds0114Button-prefix {
1249
+ .bds0115Button-prefix {
1185
1250
  display: flex;
1186
1251
  align-items: center;
1187
1252
  margin-inline-start: calc(var(--space_s) * -1);
1188
1253
  transition: var(--animation_transition);
1189
1254
  }
1190
- .bds0114Button-suffix {
1255
+ .bds0115Button-suffix {
1191
1256
  display: flex;
1192
1257
  align-items: center;
1193
1258
  margin-inline-end: calc(var(--space_s) * -1);
1194
1259
  transition: var(--animation_transition);
1195
1260
  }
1196
1261
  @media (hover: hover) and (pointer: fine) {
1197
- .bds0114Button-button:hover .bds0114Button-prefix svg {
1262
+ .bds0115Button-button:hover .bds0115Button-prefix svg {
1198
1263
  animation: 2s infinite fadeZoom ease-out;
1199
1264
  }
1200
- .bds0114Button-button:hover .bds0114Button-suffix svg {
1265
+ .bds0115Button-button:hover .bds0115Button-suffix svg {
1201
1266
  animation: 2s infinite fadeZoom ease-out;
1202
1267
  }
1203
1268
  }
1204
- .bds0114Button-button:focus-visible {
1269
+ .bds0115Button-button:focus-visible {
1205
1270
  outline-offset: var(--outline_offset);
1206
1271
  outline: var(--outline_default);
1207
1272
  border-radius: var(--border_radius--s);
1208
1273
  }
1209
1274
  @media (hover: hover) and (pointer: fine) {
1210
- .bds0114Button-button:hover {
1275
+ .bds0115Button-button:hover {
1211
1276
  --button_bg: var(--color_bg);
1212
1277
  --button_text: var(--color_interactive);
1213
1278
  --button_pulse-color: var(--color_interactive);
@@ -1218,7 +1283,7 @@
1218
1283
 
1219
1284
  /* src/components/interaction/Command/Command.module.css */
1220
1285
  @layer component {
1221
- .bds0114Command-dialog {
1286
+ .bds0115Command-dialog {
1222
1287
  padding: 0;
1223
1288
  border: none;
1224
1289
  border-radius: var(--border_radius--m);
@@ -1228,11 +1293,11 @@
1228
1293
  overflow: visible;
1229
1294
  margin-block-start: 10vh;
1230
1295
  }
1231
- .bds0114Command-dialog::backdrop {
1296
+ .bds0115Command-dialog::backdrop {
1232
1297
  background-color: var(--command_backdrop-color, rgb(0 0 0 / 50%));
1233
1298
  backdrop-filter: blur(3px);
1234
1299
  }
1235
- .bds0114Command-palette {
1300
+ .bds0115Command-palette {
1236
1301
  display: flex;
1237
1302
  flex-direction: column;
1238
1303
  background-color: var(--command_color, var(--color_bg));
@@ -1243,7 +1308,7 @@
1243
1308
  max-height: 70vh;
1244
1309
  border: 1px solid currentcolor;
1245
1310
  }
1246
- .bds0114Command-searchRow {
1311
+ .bds0115Command-searchRow {
1247
1312
  display: flex;
1248
1313
  align-items: center;
1249
1314
  gap: var(--space_xs);
@@ -1251,13 +1316,13 @@
1251
1316
  border-block-end: 1px solid currentcolor;
1252
1317
  flex-shrink: 0;
1253
1318
  }
1254
- .bds0114Command-searchIcon {
1319
+ .bds0115Command-searchIcon {
1255
1320
  width: 1.25rem;
1256
1321
  height: 1.25rem;
1257
1322
  color: var(--color_on-bg--muted);
1258
1323
  flex-shrink: 0;
1259
1324
  }
1260
- .bds0114Command-search {
1325
+ .bds0115Command-search {
1261
1326
  flex: 1;
1262
1327
  border: none;
1263
1328
  outline: none;
@@ -1267,10 +1332,10 @@
1267
1332
  background: transparent;
1268
1333
  min-width: 0;
1269
1334
  }
1270
- .bds0114Command-search::placeholder {
1335
+ .bds0115Command-search::placeholder {
1271
1336
  color: var(--color_on-bg--muted);
1272
1337
  }
1273
- .bds0114Command-escHint {
1338
+ .bds0115Command-escHint {
1274
1339
  font-size: var(--font_size--body--s);
1275
1340
  color: var(--color_on-bg--muted);
1276
1341
  border: 1px solid currentcolor;
@@ -1278,18 +1343,18 @@
1278
1343
  padding: 0.1em 0.4em;
1279
1344
  flex-shrink: 0;
1280
1345
  }
1281
- .bds0114Command-list {
1346
+ .bds0115Command-list {
1282
1347
  overflow-y: auto;
1283
1348
  list-style: none;
1284
1349
  margin: 0;
1285
1350
  padding: var(--space_xs) 0;
1286
1351
  }
1287
- .bds0114Command-groupList {
1352
+ .bds0115Command-groupList {
1288
1353
  list-style: none;
1289
1354
  margin: 0;
1290
1355
  padding: 0;
1291
1356
  }
1292
- .bds0114Command-group {
1357
+ .bds0115Command-group {
1293
1358
  padding: var(--space_xs) var(--space_m);
1294
1359
  font-size: var(--font_size--body--s);
1295
1360
  font-weight: var(--font_weight--semibold);
@@ -1297,7 +1362,7 @@
1297
1362
  text-transform: uppercase;
1298
1363
  letter-spacing: 0.05em;
1299
1364
  }
1300
- .bds0114Command-item {
1365
+ .bds0115Command-item {
1301
1366
  display: flex;
1302
1367
  align-items: center;
1303
1368
  gap: var(--space_s);
@@ -1305,26 +1370,26 @@
1305
1370
  cursor: pointer;
1306
1371
  transition: background-color var(--animation_transition-duration) var(--animation_easing);
1307
1372
  }
1308
- .bds0114Command-itemActive {
1373
+ .bds0115Command-itemActive {
1309
1374
  background-color: var(--color_bg--subtle);
1310
1375
  }
1311
- .bds0114Command-itemLabel {
1376
+ .bds0115Command-itemLabel {
1312
1377
  flex: 1;
1313
1378
  font-size: var(--font_size--body);
1314
1379
  color: var(--color_on-bg);
1315
1380
  }
1316
- .bds0114Command-itemDesc {
1381
+ .bds0115Command-itemDesc {
1317
1382
  font-size: var(--font_size--body--s);
1318
1383
  color: var(--color_on-bg--muted);
1319
1384
  }
1320
- .bds0114Command-shortcut {
1385
+ .bds0115Command-shortcut {
1321
1386
  font-size: var(--font_size--body--s);
1322
1387
  color: var(--color_on-bg--muted);
1323
1388
  border: 1px solid currentcolor;
1324
1389
  border-radius: var(--border_radius--xs);
1325
1390
  padding: 0.1em 0.4em;
1326
1391
  }
1327
- .bds0114Command-empty {
1392
+ .bds0115Command-empty {
1328
1393
  padding: var(--space_l) var(--space_m);
1329
1394
  text-align: center;
1330
1395
  color: var(--color_on-bg--muted);
@@ -1334,7 +1399,7 @@
1334
1399
 
1335
1400
  /* src/components/interaction/Dialog/Dialog.module.css */
1336
1401
  @layer component {
1337
- .bds0114Dialog-dialog {
1402
+ .bds0115Dialog-dialog {
1338
1403
  font-size: var(--font_size--body--s);
1339
1404
  border: 2px solid currentcolor;
1340
1405
  background-color: var(--dialog_color ,var(--color_grey--subtle));
@@ -1345,19 +1410,19 @@
1345
1410
  max-height: 90svh;
1346
1411
  overflow: visible;
1347
1412
  }
1348
- .bds0114Dialog-dialogContent {
1413
+ .bds0115Dialog-dialogContent {
1349
1414
  display: grid;
1350
1415
  gap: var(--grid_gap);
1351
1416
  overflow-y: auto;
1352
1417
  min-height: 0;
1353
1418
  flex: 1;
1354
1419
  }
1355
- .bds0114Dialog-closeForm {
1420
+ .bds0115Dialog-closeForm {
1356
1421
  position: absolute;
1357
1422
  inset-block-start: -1em;
1358
1423
  inset-inline-end: -1em;
1359
1424
  }
1360
- .bds0114Dialog-closeButton {
1425
+ .bds0115Dialog-closeButton {
1361
1426
  all: unset;
1362
1427
  width: 2em;
1363
1428
  height: 2em;
@@ -1370,11 +1435,11 @@
1370
1435
  border: 2px solid currentcolor;
1371
1436
  cursor: pointer;
1372
1437
  }
1373
- .bds0114Dialog-closeButton svg {
1438
+ .bds0115Dialog-closeButton svg {
1374
1439
  width: 1.25em;
1375
1440
  height: 1.25em;
1376
1441
  }
1377
- .bds0114Dialog-dialog::backdrop {
1442
+ .bds0115Dialog-dialog::backdrop {
1378
1443
  background-color: var(--dialog_backdrop-color, rgb(0 0 0 / 50%));
1379
1444
  backdrop-filter: blur(3px);
1380
1445
  }
@@ -1382,7 +1447,7 @@
1382
1447
 
1383
1448
  /* src/components/interaction/Drawer/Drawer.module.css */
1384
1449
  @layer component {
1385
- .bds0114Drawer-drawer {
1450
+ .bds0115Drawer-drawer {
1386
1451
  position: fixed;
1387
1452
  inset: 0;
1388
1453
  margin: 0;
@@ -1395,11 +1460,11 @@
1395
1460
  background: transparent;
1396
1461
  overflow: hidden;
1397
1462
  }
1398
- .bds0114Drawer-drawer::backdrop {
1463
+ .bds0115Drawer-drawer::backdrop {
1399
1464
  background-color: var(--drawer_backdrop-color, rgb(0 0 0 / 50%));
1400
1465
  backdrop-filter: blur(3px);
1401
1466
  }
1402
- .bds0114Drawer-panel {
1467
+ .bds0115Drawer-panel {
1403
1468
  position: absolute;
1404
1469
  inset-block: 0;
1405
1470
  display: flex;
@@ -1412,13 +1477,13 @@
1412
1477
  overflow: hidden;
1413
1478
  transition: var(--animation_transition);
1414
1479
  }
1415
- .bds0114Drawer---side_right .bds0114Drawer-panel {
1480
+ .bds0115Drawer---side_right .bds0115Drawer-panel {
1416
1481
  inset-inline-end: 0;
1417
1482
  }
1418
- .bds0114Drawer---side_left .bds0114Drawer-panel {
1483
+ .bds0115Drawer---side_left .bds0115Drawer-panel {
1419
1484
  inset-inline-start: 0;
1420
1485
  }
1421
- .bds0114Drawer-header {
1486
+ .bds0115Drawer-header {
1422
1487
  display: flex;
1423
1488
  align-items: center;
1424
1489
  justify-content: space-between;
@@ -1426,7 +1491,7 @@
1426
1491
  border-block-end: 1px solid currentcolor;
1427
1492
  flex-shrink: 0;
1428
1493
  }
1429
- .bds0114Drawer-closeButton {
1494
+ .bds0115Drawer-closeButton {
1430
1495
  all: unset;
1431
1496
  display: flex;
1432
1497
  align-items: center;
@@ -1437,26 +1502,26 @@
1437
1502
  cursor: pointer;
1438
1503
  transition: var(--animation_transition);
1439
1504
  }
1440
- .bds0114Drawer-closeButton svg {
1505
+ .bds0115Drawer-closeButton svg {
1441
1506
  width: 1.25rem;
1442
1507
  height: 1.25rem;
1443
1508
  }
1444
- .bds0114Drawer-closeButton:focus-visible {
1509
+ .bds0115Drawer-closeButton:focus-visible {
1445
1510
  outline: var(--outline_default);
1446
1511
  outline-offset: var(--outline_offset);
1447
1512
  }
1448
1513
  @media (hover: hover) and (pointer: fine) {
1449
- .bds0114Drawer-closeButton:hover {
1514
+ .bds0115Drawer-closeButton:hover {
1450
1515
  background-color: var(--color_bg--subtle);
1451
1516
  }
1452
1517
  }
1453
- .bds0114Drawer-body {
1518
+ .bds0115Drawer-body {
1454
1519
  flex: 1;
1455
1520
  overflow-y: auto;
1456
1521
  padding: var(--space_l);
1457
1522
  }
1458
1523
  @media (prefers-reduced-motion: reduce) {
1459
- .bds0114Drawer-panel {
1524
+ .bds0115Drawer-panel {
1460
1525
  transition: none;
1461
1526
  }
1462
1527
  }
@@ -1464,11 +1529,11 @@
1464
1529
 
1465
1530
  /* src/components/interaction/DropdownMenu/DropdownMenu.module.css */
1466
1531
  @layer component {
1467
- .bds0114DropdownMenu-wrapper {
1532
+ .bds0115DropdownMenu-wrapper {
1468
1533
  position: relative;
1469
1534
  display: inline-flex;
1470
1535
  }
1471
- .bds0114DropdownMenu-menu {
1536
+ .bds0115DropdownMenu-menu {
1472
1537
  position: absolute;
1473
1538
  top: calc(100% + var(--space_xxs));
1474
1539
  z-index: var(--z-index_dropdown);
@@ -1482,19 +1547,19 @@
1482
1547
  list-style: none;
1483
1548
  margin: 0;
1484
1549
  }
1485
- .bds0114DropdownMenu---placement_bottom-start {
1550
+ .bds0115DropdownMenu---placement_bottom-start {
1486
1551
  left: 0;
1487
1552
  }
1488
- .bds0114DropdownMenu---placement_bottom-end {
1553
+ .bds0115DropdownMenu---placement_bottom-end {
1489
1554
  right: 0;
1490
1555
  }
1491
- .bds0114DropdownMenu-separator {
1556
+ .bds0115DropdownMenu-separator {
1492
1557
  border: none;
1493
1558
  border-top: 1px solid currentcolor;
1494
1559
  margin: var(--space_xxs) 0;
1495
1560
  opacity: 0.15;
1496
1561
  }
1497
- .bds0114DropdownMenu-item {
1562
+ .bds0115DropdownMenu-item {
1498
1563
  all: unset;
1499
1564
  display: flex;
1500
1565
  align-items: center;
@@ -1508,22 +1573,22 @@
1508
1573
  box-sizing: border-box;
1509
1574
  transition: var(--animation_transition);
1510
1575
  }
1511
- .bds0114DropdownMenu-item:disabled {
1576
+ .bds0115DropdownMenu-item:disabled {
1512
1577
  opacity: 0.4;
1513
1578
  cursor: not-allowed;
1514
1579
  }
1515
- .bds0114DropdownMenu-item:focus-visible {
1580
+ .bds0115DropdownMenu-item:focus-visible {
1516
1581
  outline: var(--outline_default);
1517
1582
  outline-offset: calc(var(--outline_offset) * -1);
1518
1583
  border-radius: var(--border_radius--xs);
1519
1584
  }
1520
1585
  @media (hover: hover) and (pointer: fine) {
1521
- .bds0114DropdownMenu-item:not(:disabled):hover {
1586
+ .bds0115DropdownMenu-item:not(:disabled):hover {
1522
1587
  background-color: var(--color_bg--subtle);
1523
1588
  color: var(--color_interactive);
1524
1589
  }
1525
1590
  }
1526
- .bds0114DropdownMenu-icon {
1591
+ .bds0115DropdownMenu-icon {
1527
1592
  display: flex;
1528
1593
  align-items: center;
1529
1594
  flex-shrink: 0;
@@ -1532,11 +1597,11 @@
1532
1597
 
1533
1598
  /* src/components/interaction/Popover/Popover.module.css */
1534
1599
  @layer component {
1535
- .bds0114Popover-wrapper {
1600
+ .bds0115Popover-wrapper {
1536
1601
  position: relative;
1537
1602
  display: inline-flex;
1538
1603
  }
1539
- .bds0114Popover-panel {
1604
+ .bds0115Popover-panel {
1540
1605
  position: absolute;
1541
1606
  z-index: var(--z-index_popover);
1542
1607
  min-width: 12rem;
@@ -1548,19 +1613,19 @@
1548
1613
  color: var(--popover_on-color, var(--color_on-bg));
1549
1614
  font-size: var(--font_size--body);
1550
1615
  }
1551
- .bds0114Popover---placement_bottom {
1616
+ .bds0115Popover---placement_bottom {
1552
1617
  top: calc(100% + var(--space_xs));
1553
1618
  left: 0;
1554
1619
  }
1555
- .bds0114Popover---placement_top {
1620
+ .bds0115Popover---placement_top {
1556
1621
  bottom: calc(100% + var(--space_xs));
1557
1622
  left: 0;
1558
1623
  }
1559
- .bds0114Popover---placement_right {
1624
+ .bds0115Popover---placement_right {
1560
1625
  left: calc(100% + var(--space_xs));
1561
1626
  top: 0;
1562
1627
  }
1563
- .bds0114Popover---placement_left {
1628
+ .bds0115Popover---placement_left {
1564
1629
  right: calc(100% + var(--space_xs));
1565
1630
  top: 0;
1566
1631
  }
@@ -1568,23 +1633,23 @@
1568
1633
 
1569
1634
  /* src/components/interaction/Rating/Rating.module.css */
1570
1635
  @layer component {
1571
- .bds0114Rating-rating {
1636
+ .bds0115Rating-rating {
1572
1637
  display: inline-flex;
1573
1638
  gap: var(--space_xxxs);
1574
1639
  color: var(--color_bg);
1575
1640
  }
1576
- .bds0114Rating-star {
1641
+ .bds0115Rating-star {
1577
1642
  width: 1.5em;
1578
1643
  height: 1.5em;
1579
1644
  }
1580
- .bds0114Rating---filled {
1645
+ .bds0115Rating---filled {
1581
1646
  color: var(--color_warning);
1582
1647
  }
1583
1648
  }
1584
1649
 
1585
1650
  /* src/components/interaction/Toast/Toast.module.css */
1586
1651
  @layer component {
1587
- .bds0114Toast-toastContainer {
1652
+ .bds0115Toast-toastContainer {
1588
1653
  position: fixed;
1589
1654
  bottom: var(--space_xl);
1590
1655
  right: var(--space_xl);
@@ -1593,7 +1658,7 @@
1593
1658
  gap: var(--space_m);
1594
1659
  z-index: var(--z-index_toast);
1595
1660
  }
1596
- .bds0114Toast-toast {
1661
+ .bds0115Toast-toast {
1597
1662
  padding: var(--space_m) var(--space_l);
1598
1663
  background-color: var(--toast_color, var(--color_bg));
1599
1664
  color: var(--toast_on-color, var(--color_on-bg));
@@ -1605,26 +1670,26 @@
1605
1670
  min-width: 300px;
1606
1671
  animation: slideIn var(--animation_duration--fast) var(--animation_easing);
1607
1672
  }
1608
- .bds0114Toast-toast.bds0114Toast---variant_success {
1673
+ .bds0115Toast-toast.bds0115Toast---variant_success {
1609
1674
  --toast_color: var(--color_success);
1610
1675
  --toast_on-color: var(--color_on-success);
1611
1676
  }
1612
- .bds0114Toast-toast.bds0114Toast---variant_warning {
1677
+ .bds0115Toast-toast.bds0115Toast---variant_warning {
1613
1678
  --toast_color: var(--color_warning);
1614
1679
  --toast_on-color: var(--color_on-warning);
1615
1680
  }
1616
- .bds0114Toast-toast.bds0114Toast---variant_info {
1681
+ .bds0115Toast-toast.bds0115Toast---variant_info {
1617
1682
  --toast_color: var(--color_bg--subtle);
1618
1683
  --toast_on-color: var(--color_on-bg--subtle);
1619
1684
  }
1620
- .bds0114Toast-toast.bds0114Toast---variant_error {
1685
+ .bds0115Toast-toast.bds0115Toast---variant_error {
1621
1686
  --toast_color: var(--color_error);
1622
1687
  --toast_on-color: var(--color_on-error);
1623
1688
  }
1624
- .bds0114Toast-message {
1689
+ .bds0115Toast-message {
1625
1690
  flex: 1;
1626
1691
  }
1627
- .bds0114Toast-closeButton {
1692
+ .bds0115Toast-closeButton {
1628
1693
  display: flex;
1629
1694
  align-items: center;
1630
1695
  justify-content: center;
@@ -1637,7 +1702,7 @@
1637
1702
  cursor: pointer;
1638
1703
  color: var(--toast_on-color);
1639
1704
  }
1640
- .bds0114Toast-closeButton svg {
1705
+ .bds0115Toast-closeButton svg {
1641
1706
  width: 1rem;
1642
1707
  height: 1rem;
1643
1708
  }
@@ -1655,17 +1720,17 @@
1655
1720
 
1656
1721
  /* src/components/interaction/form/Checkbox/Checkbox.module.css */
1657
1722
  @layer component {
1658
- .bds0114Checkbox-checkboxGroup {
1723
+ .bds0115Checkbox-checkboxGroup {
1659
1724
  --inputSize: calc(var(--space_s) * 2);
1660
1725
  display: flex;
1661
1726
  flex-direction: column;
1662
1727
  }
1663
- .bds0114Checkbox-inputWrapper {
1728
+ .bds0115Checkbox-inputWrapper {
1664
1729
  display: flex;
1665
1730
  align-items: stretch;
1666
1731
  gap: var(--space_xs);
1667
1732
  }
1668
- .bds0114Checkbox-checkbox {
1733
+ .bds0115Checkbox-checkbox {
1669
1734
  margin-block-start: 0.25em;
1670
1735
  width: var(--inputSize);
1671
1736
  height: var(--inputSize);
@@ -1678,11 +1743,11 @@
1678
1743
  position: relative;
1679
1744
  transition: background-color 0.3s ease, border-color 0.3s ease;
1680
1745
  }
1681
- .bds0114Checkbox-checkbox:checked {
1746
+ .bds0115Checkbox-checkbox:checked {
1682
1747
  background-color: var(--checkbox_color-active, var(--color_active));
1683
1748
  border-color: var(--checkbox_color-active, var(--color_active));
1684
1749
  }
1685
- .bds0114Checkbox-checkbox:checked::after {
1750
+ .bds0115Checkbox-checkbox:checked::after {
1686
1751
  content: "";
1687
1752
  position: absolute;
1688
1753
  left: 0.6em;
@@ -1693,15 +1758,15 @@
1693
1758
  border-width: 0 2px 2px 0;
1694
1759
  transform: rotate(45deg);
1695
1760
  }
1696
- .bds0114Checkbox-checkbox:focus {
1761
+ .bds0115Checkbox-checkbox:focus {
1697
1762
  outline: none;
1698
1763
  border-color: var(--color_interactive);
1699
1764
  box-shadow: 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%);
1700
1765
  }
1701
- .bds0114Checkbox-checkboxError {
1766
+ .bds0115Checkbox-checkboxError {
1702
1767
  border-color: var(--color_error);
1703
1768
  }
1704
- .bds0114Checkbox-checkboxError:focus {
1769
+ .bds0115Checkbox-checkboxError:focus {
1705
1770
  border-color: var(--color_error);
1706
1771
  box-shadow: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
1707
1772
  }
@@ -1709,19 +1774,19 @@
1709
1774
 
1710
1775
  /* src/components/interaction/form/atoms/Message.module.css */
1711
1776
  @layer component {
1712
- .bds0114Message-error,
1713
- .bds0114Message-hint {
1777
+ .bds0115Message-error,
1778
+ .bds0115Message-hint {
1714
1779
  font-size: var(--font_size--body--s);
1715
1780
  margin-inline-start: var(--labelPosition);
1716
1781
  }
1717
- .bds0114Message-error {
1782
+ .bds0115Message-error {
1718
1783
  color: var(--color_error);
1719
1784
  }
1720
1785
  }
1721
1786
 
1722
1787
  /* src/components/interaction/form/atoms/Label.module.css */
1723
1788
  @layer component {
1724
- .bds0114Label-label {
1789
+ .bds0115Label-label {
1725
1790
  display: flex;
1726
1791
  align-items: center;
1727
1792
  font-family: var(--font_family--body);
@@ -1733,7 +1798,7 @@
1733
1798
 
1734
1799
  /* src/components/interaction/form/atoms/InputContainer.module.css */
1735
1800
  @layer component {
1736
- .bds0114InputContainer-container {
1801
+ .bds0115InputContainer-container {
1737
1802
  --labelPosition: calc(var(--inputSize) + var(--space_m));
1738
1803
  display: flex;
1739
1804
  flex-direction: column;
@@ -1743,16 +1808,16 @@
1743
1808
 
1744
1809
  /* src/components/interaction/form/Combobox/Combobox.module.css */
1745
1810
  @layer component {
1746
- .bds0114Combobox-formGroup {
1811
+ .bds0115Combobox-formGroup {
1747
1812
  display: flex;
1748
1813
  flex-direction: column;
1749
1814
  }
1750
- .bds0114Combobox-inputWrapper {
1815
+ .bds0115Combobox-inputWrapper {
1751
1816
  position: relative;
1752
1817
  display: flex;
1753
1818
  align-items: center;
1754
1819
  }
1755
- .bds0114Combobox-input {
1820
+ .bds0115Combobox-input {
1756
1821
  appearance: none;
1757
1822
  width: 100%;
1758
1823
  font-family: var(--font_family--body);
@@ -1765,22 +1830,22 @@
1765
1830
  color: var(--combobox_color, var(--color_on-bg));
1766
1831
  transition: var(--animation_transition);
1767
1832
  }
1768
- .bds0114Combobox-input:focus {
1833
+ .bds0115Combobox-input:focus {
1769
1834
  --combobox_border-color: var(--color_interactive);
1770
1835
  outline: none;
1771
1836
  box-shadow: var(--combobox_focus-ring, 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%));
1772
1837
  }
1773
- .bds0114Combobox-input:disabled {
1838
+ .bds0115Combobox-input:disabled {
1774
1839
  opacity: 0.5;
1775
1840
  cursor: not-allowed;
1776
1841
  }
1777
- .bds0114Combobox-inputError {
1842
+ .bds0115Combobox-inputError {
1778
1843
  --combobox_border-color: var(--color_error);
1779
1844
  }
1780
- .bds0114Combobox-inputError:focus {
1845
+ .bds0115Combobox-inputError:focus {
1781
1846
  --combobox_focus-ring: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
1782
1847
  }
1783
- .bds0114Combobox-chevron {
1848
+ .bds0115Combobox-chevron {
1784
1849
  position: absolute;
1785
1850
  inset-inline-end: var(--space_s);
1786
1851
  display: flex;
@@ -1788,11 +1853,11 @@
1788
1853
  pointer-events: none;
1789
1854
  color: var(--combobox_color, var(--color_on-bg));
1790
1855
  }
1791
- .bds0114Combobox-chevron svg {
1856
+ .bds0115Combobox-chevron svg {
1792
1857
  width: 1rem;
1793
1858
  height: 1rem;
1794
1859
  }
1795
- .bds0114Combobox-listbox {
1860
+ .bds0115Combobox-listbox {
1796
1861
  position: absolute;
1797
1862
  top: calc(100% + var(--space_xxs));
1798
1863
  left: 0;
@@ -1809,7 +1874,7 @@
1809
1874
  color: var(--combobox_on-color, var(--color_on-bg));
1810
1875
  box-shadow: var(--shadow_m);
1811
1876
  }
1812
- .bds0114Combobox-option {
1877
+ .bds0115Combobox-option {
1813
1878
  display: flex;
1814
1879
  align-items: center;
1815
1880
  padding: var(--space_xs) var(--space_m);
@@ -1818,14 +1883,14 @@
1818
1883
  cursor: pointer;
1819
1884
  transition: var(--animation_transition);
1820
1885
  }
1821
- .bds0114Combobox-option.bds0114Combobox---highlighted {
1886
+ .bds0115Combobox-option.bds0115Combobox---highlighted {
1822
1887
  background-color: var(--color_bg--subtle);
1823
1888
  color: var(--color_interactive);
1824
1889
  }
1825
- .bds0114Combobox-option.bds0114Combobox---selected {
1890
+ .bds0115Combobox-option.bds0115Combobox---selected {
1826
1891
  font-weight: var(--font_weight--semibold);
1827
1892
  }
1828
- .bds0114Combobox-option.bds0114Combobox---disabled {
1893
+ .bds0115Combobox-option.bds0115Combobox---disabled {
1829
1894
  opacity: 0.4;
1830
1895
  cursor: not-allowed;
1831
1896
  }
@@ -1833,11 +1898,11 @@
1833
1898
 
1834
1899
  /* src/components/interaction/form/FileInput/FileInput.module.css */
1835
1900
  @layer component {
1836
- .bds0114FileInput-formGroup {
1901
+ .bds0115FileInput-formGroup {
1837
1902
  display: flex;
1838
1903
  flex-direction: column;
1839
1904
  }
1840
- .bds0114FileInput-dropZone {
1905
+ .bds0115FileInput-dropZone {
1841
1906
  display: flex;
1842
1907
  flex-direction: column;
1843
1908
  align-items: center;
@@ -1851,40 +1916,40 @@
1851
1916
  text-align: center;
1852
1917
  transition: var(--animation_transition);
1853
1918
  }
1854
- .bds0114FileInput-dropZone:focus-within {
1919
+ .bds0115FileInput-dropZone:focus-within {
1855
1920
  outline: var(--outline_default);
1856
1921
  outline-offset: var(--outline_offset);
1857
1922
  border-color: var(--fileInput_border-color, currentcolor);
1858
1923
  }
1859
- .bds0114FileInput-isDragging {
1924
+ .bds0115FileInput-isDragging {
1860
1925
  border-color: currentcolor;
1861
1926
  background-color: rgb(from currentcolor r g b / 8%);
1862
1927
  }
1863
- .bds0114FileInput-hasError {
1928
+ .bds0115FileInput-hasError {
1864
1929
  border-color: var(--color_error);
1865
1930
  }
1866
- .bds0114FileInput-isDisabled {
1931
+ .bds0115FileInput-isDisabled {
1867
1932
  opacity: 0.5;
1868
1933
  cursor: not-allowed;
1869
1934
  }
1870
- .bds0114FileInput-icon {
1935
+ .bds0115FileInput-icon {
1871
1936
  width: 2rem;
1872
1937
  height: 2rem;
1873
1938
  flex-shrink: 0;
1874
1939
  }
1875
- .bds0114FileInput-prompt {
1940
+ .bds0115FileInput-prompt {
1876
1941
  font-size: var(--font_size--body);
1877
1942
  color: var(--color_on-bg--muted);
1878
1943
  }
1879
- .bds0114FileInput-prompt strong {
1944
+ .bds0115FileInput-prompt strong {
1880
1945
  color: var(--color_interactive);
1881
1946
  font-weight: var(--font_weight--semibold);
1882
1947
  }
1883
- .bds0114FileInput-acceptHint {
1948
+ .bds0115FileInput-acceptHint {
1884
1949
  font-size: var(--font_size--body--s);
1885
1950
  color: var(--color_on-bg--muted);
1886
1951
  }
1887
- .bds0114FileInput-hiddenInput {
1952
+ .bds0115FileInput-hiddenInput {
1888
1953
  position: absolute;
1889
1954
  width: 1px;
1890
1955
  height: 1px;
@@ -1894,7 +1959,7 @@
1894
1959
  border: 0;
1895
1960
  }
1896
1961
  @media (hover: hover) and (pointer: fine) {
1897
- .bds0114FileInput-dropZone:not(.bds0114FileInput-isDisabled):hover {
1962
+ .bds0115FileInput-dropZone:not(.bds0115FileInput-isDisabled):hover {
1898
1963
  border-color: var(--color_interactive);
1899
1964
  background-color: rgb(from var(--color_interactive) r g b / 4%);
1900
1965
  }
@@ -1903,12 +1968,12 @@
1903
1968
 
1904
1969
  /* src/components/interaction/form/FormInput/FormInput.module.css */
1905
1970
  @layer component {
1906
- .bds0114FormInput-formGroup {
1971
+ .bds0115FormInput-formGroup {
1907
1972
  --labelPosition: 0;
1908
1973
  display: flex;
1909
1974
  flex-direction: column;
1910
1975
  }
1911
- .bds0114FormInput-input {
1976
+ .bds0115FormInput-input {
1912
1977
  font-family: var(--font_family--body);
1913
1978
  font-size: var(--font_size--body);
1914
1979
  padding: var(--space_s);
@@ -1918,26 +1983,26 @@
1918
1983
  color: var(--input_color, var(--color_on-bg));
1919
1984
  background-color: var(--input_color_bg, var(--color_bg));
1920
1985
  }
1921
- .bds0114FormInput-input:focus {
1986
+ .bds0115FormInput-input:focus {
1922
1987
  --input_border-color: var(--color_interactive);
1923
1988
  outline: none;
1924
1989
  box-shadow: var(--input_focus-ring, 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%));
1925
1990
  }
1926
- .bds0114FormInput-inputError {
1991
+ .bds0115FormInput-inputError {
1927
1992
  --input_border-color: var(--color_error);
1928
1993
  }
1929
- .bds0114FormInput-inputError:focus {
1994
+ .bds0115FormInput-inputError:focus {
1930
1995
  --input_focus-ring: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
1931
1996
  }
1932
1997
  }
1933
1998
 
1934
1999
  /* src/components/interaction/form/NumberInput/NumberInput.module.css */
1935
2000
  @layer component {
1936
- .bds0114NumberInput-formGroup {
2001
+ .bds0115NumberInput-formGroup {
1937
2002
  display: flex;
1938
2003
  flex-direction: column;
1939
2004
  }
1940
- .bds0114NumberInput-inputRow {
2005
+ .bds0115NumberInput-inputRow {
1941
2006
  display: flex;
1942
2007
  align-items: stretch;
1943
2008
  border: 1px solid currentcolor;
@@ -1945,11 +2010,11 @@
1945
2010
  overflow: hidden;
1946
2011
  transition: var(--animation_transition);
1947
2012
  }
1948
- .bds0114NumberInput-inputRow:focus-within {
2013
+ .bds0115NumberInput-inputRow:focus-within {
1949
2014
  border-color: var(--numberInput_border-color, var(--color_interactive));
1950
2015
  box-shadow: var(--numberInput_focus-ring, 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%));
1951
2016
  }
1952
- .bds0114NumberInput-input {
2017
+ .bds0115NumberInput-input {
1953
2018
  flex: 1;
1954
2019
  border: none;
1955
2020
  outline: none;
@@ -1962,17 +2027,17 @@
1962
2027
  min-width: 0;
1963
2028
  appearance: textfield;
1964
2029
  }
1965
- .bds0114NumberInput-input::-webkit-inner-spin-button,
1966
- .bds0114NumberInput-input::-webkit-outer-spin-button {
2030
+ .bds0115NumberInput-input::-webkit-inner-spin-button,
2031
+ .bds0115NumberInput-input::-webkit-outer-spin-button {
1967
2032
  appearance: none;
1968
2033
  }
1969
- .bds0114NumberInput-inputError {
2034
+ .bds0115NumberInput-inputError {
1970
2035
  --numberInput_border-color: var(--color_error);
1971
2036
  }
1972
- .bds0114NumberInput-inputError:focus-within {
2037
+ .bds0115NumberInput-inputError:focus-within {
1973
2038
  --numberInput_focus-ring: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
1974
2039
  }
1975
- .bds0114NumberInput-stepper {
2040
+ .bds0115NumberInput-stepper {
1976
2041
  all: unset;
1977
2042
  display: flex;
1978
2043
  align-items: center;
@@ -1984,16 +2049,16 @@
1984
2049
  transition: var(--animation_transition);
1985
2050
  flex-shrink: 0;
1986
2051
  }
1987
- .bds0114NumberInput-stepper svg {
2052
+ .bds0115NumberInput-stepper svg {
1988
2053
  width: 1rem;
1989
2054
  height: 1rem;
1990
2055
  }
1991
- .bds0114NumberInput-stepper:disabled {
2056
+ .bds0115NumberInput-stepper:disabled {
1992
2057
  opacity: 0.4;
1993
2058
  cursor: not-allowed;
1994
2059
  }
1995
2060
  @media (hover: hover) and (pointer: fine) {
1996
- .bds0114NumberInput-stepper:not(:disabled):hover {
2061
+ .bds0115NumberInput-stepper:not(:disabled):hover {
1997
2062
  background-color: var(--color_bg--subtle);
1998
2063
  opacity: 0.7;
1999
2064
  }
@@ -2002,29 +2067,29 @@
2002
2067
 
2003
2068
  /* src/components/interaction/form/Radio/Radio.module.css */
2004
2069
  @layer component {
2005
- .bds0114Radio-radioGroup {
2070
+ .bds0115Radio-radioGroup {
2006
2071
  --inputSize: calc(var(--space_s) * 2);
2007
2072
  --labelPosition: calc(var(--inputSize) + var(--space_m));
2008
2073
  display: flex;
2009
2074
  flex-direction: column;
2010
2075
  }
2011
- .bds0114Radio-inputWrapper {
2076
+ .bds0115Radio-inputWrapper {
2012
2077
  display: flex;
2013
2078
  align-items: flex-start;
2014
2079
  gap: var(--space_xs);
2015
2080
  }
2016
- .bds0114Radio-textWrapper {
2081
+ .bds0115Radio-textWrapper {
2017
2082
  display: flex;
2018
2083
  flex-direction: column;
2019
2084
  gap: var(--space_xxxs);
2020
2085
  padding-block-start: var(--space_xxxs);
2021
2086
  }
2022
- .bds0114Radio-description {
2087
+ .bds0115Radio-description {
2023
2088
  font-size: var(--font_size--body--s);
2024
2089
  color: var(--radio_description-color, var(--color_on-bg--subtle));
2025
2090
  line-height: var(--font_line-height--body);
2026
2091
  }
2027
- .bds0114Radio-radio {
2092
+ .bds0115Radio-radio {
2028
2093
  flex-shrink: 0;
2029
2094
  margin-block-start: 0.2em;
2030
2095
  width: var(--inputSize);
@@ -2038,11 +2103,11 @@
2038
2103
  position: relative;
2039
2104
  transition: background-color 0.2s ease, border-color 0.2s ease;
2040
2105
  }
2041
- .bds0114Radio-radio:checked {
2106
+ .bds0115Radio-radio:checked {
2042
2107
  background-color: var(--radio_color-active, var(--color_active));
2043
2108
  border-color: var(--radio_color-active, var(--color_active));
2044
2109
  }
2045
- .bds0114Radio-radio:checked::after {
2110
+ .bds0115Radio-radio:checked::after {
2046
2111
  content: "";
2047
2112
  position: absolute;
2048
2113
  left: 50%;
@@ -2053,15 +2118,15 @@
2053
2118
  border-radius: 50%;
2054
2119
  background-color: var(--radio_color-on-active, var(--color_on-active));
2055
2120
  }
2056
- .bds0114Radio-radio:focus {
2121
+ .bds0115Radio-radio:focus {
2057
2122
  outline: none;
2058
2123
  border-color: var(--color_interactive);
2059
2124
  box-shadow: 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%);
2060
2125
  }
2061
- .bds0114Radio-radioError {
2126
+ .bds0115Radio-radioError {
2062
2127
  border-color: var(--color_error);
2063
2128
  }
2064
- .bds0114Radio-radioError:focus {
2129
+ .bds0115Radio-radioError:focus {
2065
2130
  border-color: var(--color_error);
2066
2131
  box-shadow: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
2067
2132
  }
@@ -2069,16 +2134,16 @@
2069
2134
 
2070
2135
  /* src/components/interaction/form/Select/Select.module.css */
2071
2136
  @layer component {
2072
- .bds0114Select-formGroup {
2137
+ .bds0115Select-formGroup {
2073
2138
  display: flex;
2074
2139
  flex-direction: column;
2075
2140
  }
2076
- .bds0114Select-selectWrapper {
2141
+ .bds0115Select-selectWrapper {
2077
2142
  position: relative;
2078
2143
  display: flex;
2079
2144
  align-items: center;
2080
2145
  }
2081
- .bds0114Select-select {
2146
+ .bds0115Select-select {
2082
2147
  appearance: none;
2083
2148
  width: 100%;
2084
2149
  font-family: var(--font_family--body);
@@ -2092,22 +2157,22 @@
2092
2157
  cursor: pointer;
2093
2158
  transition: var(--animation_transition);
2094
2159
  }
2095
- .bds0114Select-select:focus {
2160
+ .bds0115Select-select:focus {
2096
2161
  --select_border-color: var(--color_interactive);
2097
2162
  outline: none;
2098
2163
  box-shadow: var(--select_focus-ring, 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%));
2099
2164
  }
2100
- .bds0114Select-select:disabled {
2165
+ .bds0115Select-select:disabled {
2101
2166
  opacity: 0.5;
2102
2167
  cursor: not-allowed;
2103
2168
  }
2104
- .bds0114Select-selectError {
2169
+ .bds0115Select-selectError {
2105
2170
  --select_border-color: var(--color_error);
2106
2171
  }
2107
- .bds0114Select-selectError:focus {
2172
+ .bds0115Select-selectError:focus {
2108
2173
  --select_focus-ring: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
2109
2174
  }
2110
- .bds0114Select-chevron {
2175
+ .bds0115Select-chevron {
2111
2176
  position: absolute;
2112
2177
  inset-inline-end: var(--space_s);
2113
2178
  display: flex;
@@ -2115,7 +2180,7 @@
2115
2180
  pointer-events: none;
2116
2181
  color: var(--select_color, var(--color_on-bg));
2117
2182
  }
2118
- .bds0114Select-chevron svg {
2183
+ .bds0115Select-chevron svg {
2119
2184
  width: 1rem;
2120
2185
  height: 1rem;
2121
2186
  }
@@ -2123,22 +2188,22 @@
2123
2188
 
2124
2189
  /* src/components/interaction/form/Slider/Slider.module.css */
2125
2190
  @layer component {
2126
- .bds0114Slider-formGroup {
2191
+ .bds0115Slider-formGroup {
2127
2192
  display: flex;
2128
2193
  flex-direction: column;
2129
2194
  gap: var(--space_xxs);
2130
2195
  }
2131
- .bds0114Slider-labelRow {
2196
+ .bds0115Slider-labelRow {
2132
2197
  display: flex;
2133
2198
  justify-content: space-between;
2134
2199
  align-items: baseline;
2135
2200
  }
2136
- .bds0114Slider-value {
2201
+ .bds0115Slider-value {
2137
2202
  font-size: var(--font_size--body--s);
2138
2203
  font-variant-numeric: tabular-nums;
2139
2204
  color: var(--color_on-bg--subtle);
2140
2205
  }
2141
- .bds0114Slider-slider {
2206
+ .bds0115Slider-slider {
2142
2207
  --slider_fill: 0%;
2143
2208
  --slider_track-height: var(--space_xxs);
2144
2209
  --slider_thumb-size: calc(var(--space_s) * 2);
@@ -2157,16 +2222,16 @@
2157
2222
  cursor: pointer;
2158
2223
  transition: var(--animation_transition);
2159
2224
  }
2160
- .bds0114Slider-slider:focus-visible {
2225
+ .bds0115Slider-slider:focus-visible {
2161
2226
  outline: var(--outline_default);
2162
2227
  outline-offset: var(--outline_offset);
2163
2228
  border-radius: 999px;
2164
2229
  }
2165
- .bds0114Slider-slider:disabled {
2230
+ .bds0115Slider-slider:disabled {
2166
2231
  opacity: 0.4;
2167
2232
  cursor: not-allowed;
2168
2233
  }
2169
- .bds0114Slider-slider::-webkit-slider-thumb {
2234
+ .bds0115Slider-slider::-webkit-slider-thumb {
2170
2235
  appearance: none;
2171
2236
  width: var(--slider_thumb-size);
2172
2237
  height: var(--slider_thumb-size);
@@ -2176,7 +2241,7 @@
2176
2241
  transition: var(--animation_transition);
2177
2242
  cursor: pointer;
2178
2243
  }
2179
- .bds0114Slider-slider::-moz-range-thumb {
2244
+ .bds0115Slider-slider::-moz-range-thumb {
2180
2245
  width: var(--slider_thumb-size);
2181
2246
  height: var(--slider_thumb-size);
2182
2247
  border: none;
@@ -2185,7 +2250,7 @@
2185
2250
  box-shadow: var(--shadow_s);
2186
2251
  cursor: pointer;
2187
2252
  }
2188
- .bds0114Slider-sliderError {
2253
+ .bds0115Slider-sliderError {
2189
2254
  background:
2190
2255
  linear-gradient(
2191
2256
  to right,
@@ -2194,16 +2259,16 @@
2194
2259
  var(--color_bg--subtle) var(--slider_fill),
2195
2260
  var(--color_bg--subtle) 100%);
2196
2261
  }
2197
- .bds0114Slider-sliderError::-webkit-slider-thumb {
2262
+ .bds0115Slider-sliderError::-webkit-slider-thumb {
2198
2263
  background-color: var(--color_error);
2199
2264
  }
2200
- .bds0114Slider-sliderError::-moz-range-thumb {
2265
+ .bds0115Slider-sliderError::-moz-range-thumb {
2201
2266
  background-color: var(--color_error);
2202
2267
  }
2203
2268
  @media (prefers-reduced-motion: reduce) {
2204
- .bds0114Slider-slider,
2205
- .bds0114Slider-slider::-webkit-slider-thumb,
2206
- .bds0114Slider-slider::-moz-range-thumb {
2269
+ .bds0115Slider-slider,
2270
+ .bds0115Slider-slider::-webkit-slider-thumb,
2271
+ .bds0115Slider-slider::-moz-range-thumb {
2207
2272
  transition: none;
2208
2273
  }
2209
2274
  }
@@ -2211,7 +2276,7 @@
2211
2276
 
2212
2277
  /* src/components/interaction/form/Switch/Switch.module.css */
2213
2278
  @layer component {
2214
- .bds0114Switch-switchGroup {
2279
+ .bds0115Switch-switchGroup {
2215
2280
  --switch_thumb-size: 1.25em;
2216
2281
  --switch_track-pad: var(--space_xxxs);
2217
2282
  --switch_track-height: calc(var(--switch_thumb-size) + var(--switch_track-pad) * 2);
@@ -2220,21 +2285,21 @@
2220
2285
  display: flex;
2221
2286
  flex-direction: column;
2222
2287
  }
2223
- .bds0114Switch-switchGroup.bds0114Switch---size_small {
2288
+ .bds0115Switch-switchGroup.bds0115Switch---size_small {
2224
2289
  --switch_thumb-size: 1em;
2225
2290
  }
2226
- .bds0114Switch-switchGroup.bds0114Switch---size_medium {
2291
+ .bds0115Switch-switchGroup.bds0115Switch---size_medium {
2227
2292
  --switch_thumb-size: 1.25em;
2228
2293
  }
2229
- .bds0114Switch-switchGroup.bds0114Switch---size_large {
2294
+ .bds0115Switch-switchGroup.bds0115Switch---size_large {
2230
2295
  --switch_thumb-size: 1.5em;
2231
2296
  }
2232
- .bds0114Switch-inputWrapper {
2297
+ .bds0115Switch-inputWrapper {
2233
2298
  display: flex;
2234
2299
  align-items: center;
2235
2300
  gap: var(--space_xs);
2236
2301
  }
2237
- .bds0114Switch-trackWrapper {
2302
+ .bds0115Switch-trackWrapper {
2238
2303
  position: relative;
2239
2304
  display: inline-flex;
2240
2305
  align-items: center;
@@ -2242,7 +2307,7 @@
2242
2307
  width: var(--switch_track-width);
2243
2308
  height: var(--switch_track-height);
2244
2309
  }
2245
- .bds0114Switch-switch {
2310
+ .bds0115Switch-switch {
2246
2311
  position: absolute;
2247
2312
  inset: 0;
2248
2313
  appearance: none;
@@ -2253,10 +2318,10 @@
2253
2318
  cursor: pointer;
2254
2319
  z-index: 1;
2255
2320
  }
2256
- .bds0114Switch-switch:disabled {
2321
+ .bds0115Switch-switch:disabled {
2257
2322
  cursor: not-allowed;
2258
2323
  }
2259
- .bds0114Switch-track {
2324
+ .bds0115Switch-track {
2260
2325
  display: inline-flex;
2261
2326
  align-items: center;
2262
2327
  width: var(--switch_track-width);
@@ -2269,7 +2334,7 @@
2269
2334
  outline: 1px solid var(--thumb_bg, var(--color_grey));
2270
2335
  outline-offset: var(--outline_offset);
2271
2336
  }
2272
- .bds0114Switch-thumb {
2337
+ .bds0115Switch-thumb {
2273
2338
  display: block;
2274
2339
  width: var(--switch_thumb-size);
2275
2340
  height: var(--switch_thumb-size);
@@ -2279,28 +2344,28 @@
2279
2344
  transition: var(--animation_transition);
2280
2345
  transform: translateX(0);
2281
2346
  }
2282
- .bds0114Switch-switch.bds0114Switch-switchError + .bds0114Switch-track {
2347
+ .bds0115Switch-switch.bds0115Switch-switchError + .bds0115Switch-track {
2283
2348
  outline: 1px solid var(--color_error);
2284
2349
  }
2285
- .bds0114Switch-switch:checked + .bds0114Switch-track {
2350
+ .bds0115Switch-switch:checked + .bds0115Switch-track {
2286
2351
  background-color: var(--track_active, var(--color_active--subtle));
2287
2352
  outline-color: var(--thumb_bg--active, var(--color_active--strong));
2288
2353
  }
2289
- .bds0114Switch-switch:checked + .bds0114Switch-track .bds0114Switch-thumb {
2354
+ .bds0115Switch-switch:checked + .bds0115Switch-track .bds0115Switch-thumb {
2290
2355
  background-color: var(--thumb_bg--active, var(--color_active--strong));
2291
2356
  transform: translateX(var(--switch_thumb-size));
2292
2357
  }
2293
- .bds0114Switch-switch:focus-visible + .bds0114Switch-track {
2358
+ .bds0115Switch-switch:focus-visible + .bds0115Switch-track {
2294
2359
  outline: var(--outline_default);
2295
2360
  outline-offset: var(--outline_offset);
2296
2361
  border-radius: 999px;
2297
2362
  }
2298
- .bds0114Switch-switch:disabled + .bds0114Switch-track {
2363
+ .bds0115Switch-switch:disabled + .bds0115Switch-track {
2299
2364
  opacity: 0.4;
2300
2365
  }
2301
2366
  @media (prefers-reduced-motion: reduce) {
2302
- .bds0114Switch-track,
2303
- .bds0114Switch-thumb {
2367
+ .bds0115Switch-track,
2368
+ .bds0115Switch-thumb {
2304
2369
  transition: none;
2305
2370
  }
2306
2371
  }
@@ -2308,11 +2373,11 @@
2308
2373
 
2309
2374
  /* src/components/interaction/form/Textarea/Textarea.module.css */
2310
2375
  @layer component {
2311
- .bds0114Textarea-formGroup {
2376
+ .bds0115Textarea-formGroup {
2312
2377
  display: flex;
2313
2378
  flex-direction: column;
2314
2379
  }
2315
- .bds0114Textarea-textarea {
2380
+ .bds0115Textarea-textarea {
2316
2381
  font-family: var(--font_family--body);
2317
2382
  font-size: var(--font_size--body);
2318
2383
  line-height: var(--font_line-height--body);
@@ -2325,69 +2390,69 @@
2325
2390
  min-height: calc(var(--space_m) * 5);
2326
2391
  transition: var(--animation_transition);
2327
2392
  }
2328
- .bds0114Textarea-textarea:focus {
2393
+ .bds0115Textarea-textarea:focus {
2329
2394
  --textarea_border-color: var(--color_interactive);
2330
2395
  outline: none;
2331
2396
  box-shadow: var(--textarea_focus-ring, 0 0 0 2px rgb(from var(--color_interactive) r g b / 20%));
2332
2397
  }
2333
- .bds0114Textarea-textarea:disabled {
2398
+ .bds0115Textarea-textarea:disabled {
2334
2399
  opacity: 0.5;
2335
2400
  cursor: not-allowed;
2336
2401
  resize: none;
2337
2402
  }
2338
- .bds0114Textarea-textareaError {
2403
+ .bds0115Textarea-textareaError {
2339
2404
  --textarea_border-color: var(--color_error);
2340
2405
  }
2341
- .bds0114Textarea-textareaError:focus {
2406
+ .bds0115Textarea-textareaError:focus {
2342
2407
  --textarea_focus-ring: 0 0 0 2px rgb(from var(--color_error) r g b / 20%);
2343
2408
  }
2344
2409
  }
2345
2410
 
2346
2411
  /* src/components/layout/ButtonGroup/ButtonGroup.module.css */
2347
2412
  @layer component {
2348
- .bds0114ButtonGroup-buttonGroup {
2413
+ .bds0115ButtonGroup-buttonGroup {
2349
2414
  container-type: inline-size;
2350
2415
  container-name: button-group;
2351
2416
  grid-column: var(--grid_span-100);
2352
2417
  }
2353
- .bds0114ButtonGroup-buttonGroup .bds0114ButtonGroup-container {
2418
+ .bds0115ButtonGroup-buttonGroup .bds0115ButtonGroup-container {
2354
2419
  position: relative;
2355
2420
  display: flex;
2356
2421
  flex-direction: column-reverse;
2357
2422
  gap: var(--space_l);
2358
2423
  align-items: center;
2359
2424
  }
2360
- .bds0114ButtonGroup-buttonGroup.bds0114ButtonGroup---variant_card .bds0114ButtonGroup-container {
2425
+ .bds0115ButtonGroup-buttonGroup.bds0115ButtonGroup---variant_card .bds0115ButtonGroup-container {
2361
2426
  align-items: stretch;
2362
2427
  }
2363
- .bds0114ButtonGroup-buttonGroup.bds0114ButtonGroup---variant_flow .bds0114ButtonGroup-container,
2364
- .bds0114ButtonGroup-buttonGroup.bds0114ButtonGroup---variant_modal .bds0114ButtonGroup-container {
2428
+ .bds0115ButtonGroup-buttonGroup.bds0115ButtonGroup---variant_flow .bds0115ButtonGroup-container,
2429
+ .bds0115ButtonGroup-buttonGroup.bds0115ButtonGroup---variant_modal .bds0115ButtonGroup-container {
2365
2430
  align-items: center;
2366
2431
  }
2367
- .bds0114ButtonGroup-buttonGroup.bds0114ButtonGroup---variant_content .bds0114ButtonGroup-container {
2432
+ .bds0115ButtonGroup-buttonGroup.bds0115ButtonGroup---variant_content .bds0115ButtonGroup-container {
2368
2433
  align-items: flex-start;
2369
2434
  }
2370
2435
  @supports (contain: inline-size) {
2371
2436
  @container button-group (min-width: 30rem) {
2372
- .bds0114ButtonGroup-buttonGroup .bds0114ButtonGroup-container {
2437
+ .bds0115ButtonGroup-buttonGroup .bds0115ButtonGroup-container {
2373
2438
  flex-direction: row;
2374
2439
  justify-content: space-between;
2375
2440
  }
2376
- .bds0114ButtonGroup-buttonGroup.bds0114ButtonGroup---variant_modal .bds0114ButtonGroup-container > :first-child:last-child,
2377
- .bds0114ButtonGroup-buttonGroup.bds0114ButtonGroup---variant_flow .bds0114ButtonGroup-container > :first-child:last-child {
2441
+ .bds0115ButtonGroup-buttonGroup.bds0115ButtonGroup---variant_modal .bds0115ButtonGroup-container > :first-child:last-child,
2442
+ .bds0115ButtonGroup-buttonGroup.bds0115ButtonGroup---variant_flow .bds0115ButtonGroup-container > :first-child:last-child {
2378
2443
  margin-inline-start: auto;
2379
2444
  }
2380
- .bds0114ButtonGroup-buttonGroup.bds0114ButtonGroup---variant_card .bds0114ButtonGroup-container {
2445
+ .bds0115ButtonGroup-buttonGroup.bds0115ButtonGroup---variant_card .bds0115ButtonGroup-container {
2381
2446
  justify-content: center;
2382
2447
  }
2383
- .bds0114ButtonGroup-buttonGroup.bds0114ButtonGroup---variant_modal .bds0114ButtonGroup-container {
2448
+ .bds0115ButtonGroup-buttonGroup.bds0115ButtonGroup---variant_modal .bds0115ButtonGroup-container {
2384
2449
  justify-content: flex-end;
2385
2450
  }
2386
- .bds0114ButtonGroup-buttonGroup.bds0114ButtonGroup---variant_content .bds0114ButtonGroup-container {
2451
+ .bds0115ButtonGroup-buttonGroup.bds0115ButtonGroup---variant_content .bds0115ButtonGroup-container {
2387
2452
  justify-content: flex-start;
2388
2453
  align-items: center;
2389
2454
  }
2390
- .bds0114ButtonGroup-buttonGroup.bds0114ButtonGroup---variant_grid .bds0114ButtonGroup-container {
2455
+ .bds0115ButtonGroup-buttonGroup.bds0115ButtonGroup---variant_grid .bds0115ButtonGroup-container {
2391
2456
  justify-content: center;
2392
2457
  }
2393
2458
  }
@@ -2396,59 +2461,59 @@
2396
2461
 
2397
2462
  /* src/components/layout/Card/Card.module.css */
2398
2463
  @layer component {
2399
- .bds0114Card-card {
2464
+ .bds0115Card-card {
2400
2465
  background-color: var(--card_color, var(--color_bg));
2401
2466
  color: var(--card_on-color, var(--color_on-bg));
2402
2467
  border-radius: var(--border_radius--m);
2403
2468
  transition: all 0.3s ease;
2404
2469
  position: relative;
2405
2470
  }
2406
- .bds0114Card-card.bds0114Card---default {
2471
+ .bds0115Card-card.bds0115Card---default {
2407
2472
  box-shadow: var(--shadow_s);
2408
2473
  }
2409
- .bds0114Card-card.bds0114Card---elevated {
2474
+ .bds0115Card-card.bds0115Card---elevated {
2410
2475
  box-shadow: var(--shadow_m);
2411
2476
  }
2412
- .bds0114Card-card.bds0114Card---outlined {
2477
+ .bds0115Card-card.bds0115Card---outlined {
2413
2478
  border: 1px solid currentcolor;
2414
2479
  box-shadow: var(--shadow_s);
2415
2480
  }
2416
- .bds0114Card-card.bds0114Card---clickable {
2481
+ .bds0115Card-card.bds0115Card---clickable {
2417
2482
  cursor: pointer;
2418
2483
  }
2419
- .bds0114Card-card.bds0114Card---padding-none {
2484
+ .bds0115Card-card.bds0115Card---padding-none {
2420
2485
  padding: 0;
2421
2486
  }
2422
- .bds0114Card-card.bds0114Card---padding-small {
2487
+ .bds0115Card-card.bds0115Card---padding-small {
2423
2488
  padding: var(--space_s);
2424
2489
  }
2425
- .bds0114Card-card.bds0114Card---padding-medium {
2490
+ .bds0115Card-card.bds0115Card---padding-medium {
2426
2491
  padding: var(--space_m);
2427
2492
  }
2428
- .bds0114Card-card.bds0114Card---padding-large {
2493
+ .bds0115Card-card.bds0115Card---padding-large {
2429
2494
  padding: var(--space_l);
2430
2495
  }
2431
- .bds0114Card-card.bds0114Card---text-start {
2496
+ .bds0115Card-card.bds0115Card---text-start {
2432
2497
  text-align: left;
2433
2498
  }
2434
- .bds0114Card-card.bds0114Card---text-center {
2499
+ .bds0115Card-card.bds0115Card---text-center {
2435
2500
  text-align: center;
2436
2501
  }
2437
- .bds0114Card-card.bds0114Card---text-end {
2502
+ .bds0115Card-card.bds0115Card---text-end {
2438
2503
  text-align: right;
2439
2504
  }
2440
2505
  @media (hover: hover) and (pointer: fine) {
2441
- .bds0114Card-card.bds0114Card---clickable:hover {
2506
+ .bds0115Card-card.bds0115Card---clickable:hover {
2442
2507
  transform: translateY(-2px);
2443
2508
  box-shadow: var(--shadow_xl);
2444
2509
  }
2445
- .bds0114Card-card.bds0114Card---default:hover {
2510
+ .bds0115Card-card.bds0115Card---default:hover {
2446
2511
  box-shadow: var(--shadow_m);
2447
2512
  }
2448
- .bds0114Card-card.bds0114Card---elevated:hover {
2513
+ .bds0115Card-card.bds0115Card---elevated:hover {
2449
2514
  box-shadow: var(--shadow_2xl);
2450
2515
  }
2451
- .bds0114Card-card.bds0114Card---outlined:hover {
2516
+ .bds0115Card-card.bds0115Card---outlined:hover {
2452
2517
  box-shadow: var(--shadow_s);
2453
2518
  }
2454
2519
  }
@@ -2456,60 +2521,60 @@
2456
2521
 
2457
2522
  /* src/components/layout/SectionHeader/SectionHeader.module.css */
2458
2523
  @layer component {
2459
- .bds0114SectionHeader-sectionHeader {
2524
+ .bds0115SectionHeader-sectionHeader {
2460
2525
  display: flex;
2461
2526
  flex-direction: column;
2462
2527
  gap: var(--space_m);
2463
2528
  grid-column: var(--grid_span-100);
2464
2529
  }
2465
- .bds0114SectionHeader-title {
2530
+ .bds0115SectionHeader-title {
2466
2531
  color: var(--sectionHeader-title-color, var(--color_on-bg));
2467
2532
  margin: 0;
2468
2533
  font-family: var(--font_family--body);
2469
2534
  }
2470
- .bds0114SectionHeader-subtitle {
2535
+ .bds0115SectionHeader-subtitle {
2471
2536
  color: var(--sectionHeader_subtitle-color, var(--color_grey--strong));
2472
2537
  margin: 0;
2473
2538
  font-family: var(--font_family--body);
2474
2539
  font-weight: var(--font_weight--medium);
2475
2540
  }
2476
- .bds0114SectionHeader-sectionHeader.bds0114SectionHeader---start {
2541
+ .bds0115SectionHeader-sectionHeader.bds0115SectionHeader---start {
2477
2542
  align-items: flex-start;
2478
2543
  text-align: left;
2479
2544
  }
2480
- .bds0114SectionHeader-sectionHeader.bds0114SectionHeader---center {
2545
+ .bds0115SectionHeader-sectionHeader.bds0115SectionHeader---center {
2481
2546
  align-items: center;
2482
2547
  text-align: center;
2483
2548
  }
2484
- .bds0114SectionHeader-sectionHeader.bds0114SectionHeader---end {
2549
+ .bds0115SectionHeader-sectionHeader.bds0115SectionHeader---end {
2485
2550
  align-items: flex-end;
2486
2551
  text-align: right;
2487
2552
  }
2488
- .bds0114SectionHeader-sectionHeader.bds0114SectionHeader---small .bds0114SectionHeader-title {
2553
+ .bds0115SectionHeader-sectionHeader.bds0115SectionHeader---small .bds0115SectionHeader-title {
2489
2554
  font-size: var(--font_size--heading-1);
2490
2555
  line-height: var(--font_line-height--heading);
2491
2556
  font-weight: var(--font_weight--bold);
2492
2557
  }
2493
- .bds0114SectionHeader-sectionHeader.bds0114SectionHeader---small .bds0114SectionHeader-subtitle {
2558
+ .bds0115SectionHeader-sectionHeader.bds0115SectionHeader---small .bds0115SectionHeader-subtitle {
2494
2559
  font-size: var(--font_size--body);
2495
2560
  line-height: 1.4;
2496
2561
  }
2497
- .bds0114SectionHeader-sectionHeader.bds0114SectionHeader---medium .bds0114SectionHeader-title {
2562
+ .bds0115SectionHeader-sectionHeader.bds0115SectionHeader---medium .bds0115SectionHeader-title {
2498
2563
  font-size: var(--font_size--display);
2499
2564
  line-height: var(--font_line-height--display);
2500
2565
  font-weight: var(--font_weight--bold);
2501
2566
  }
2502
- .bds0114SectionHeader-sectionHeader.bds0114SectionHeader---medium .bds0114SectionHeader-subtitle {
2567
+ .bds0115SectionHeader-sectionHeader.bds0115SectionHeader---medium .bds0115SectionHeader-subtitle {
2503
2568
  font-size: var(--font_size--heading-3);
2504
2569
  line-height: 1.3;
2505
2570
  }
2506
- .bds0114SectionHeader-sectionHeader.bds0114SectionHeader---large .bds0114SectionHeader-title {
2571
+ .bds0115SectionHeader-sectionHeader.bds0115SectionHeader---large .bds0115SectionHeader-title {
2507
2572
  font-size: var(--font_size--display);
2508
2573
  line-height: var(--font_line-height--display);
2509
2574
  font-weight: var(--font_weight--bold);
2510
2575
  letter-spacing: var(--font_tracking--tight);
2511
2576
  }
2512
- .bds0114SectionHeader-sectionHeader.bds0114SectionHeader---large .bds0114SectionHeader-subtitle {
2577
+ .bds0115SectionHeader-sectionHeader.bds0115SectionHeader---large .bds0115SectionHeader-subtitle {
2513
2578
  font-size: var(--font_size--heading-2);
2514
2579
  line-height: 1.3;
2515
2580
  font-weight: var(--font_weight--medium);
@@ -2518,7 +2583,7 @@
2518
2583
 
2519
2584
  /* src/components/layout/IconWrapper/IconWrapper.module.css */
2520
2585
  @layer component {
2521
- .bds0114IconWrapper-wrapper {
2586
+ .bds0115IconWrapper-wrapper {
2522
2587
  width: 2em;
2523
2588
  height: 2em;
2524
2589
  font-size: 3em;
@@ -2533,7 +2598,7 @@
2533
2598
  position: relative;
2534
2599
  transition: var(--animation_transition);
2535
2600
  }
2536
- .bds0114IconWrapper-wrapper svg {
2601
+ .bds0115IconWrapper-wrapper svg {
2537
2602
  fill: currentcolor;
2538
2603
  }
2539
2604
  }