@itwin/itwinui-css 1.0.0-dev.8 → 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/CHANGELOG.md +39 -969
  2. package/README.md +50 -29
  3. package/css/alert.css +1 -387
  4. package/css/all.css +1 -9049
  5. package/css/anchor.css +1 -64
  6. package/css/avatar.css +1 -222
  7. package/css/backdrop.css +1 -22
  8. package/css/badge.css +1 -25
  9. package/css/blockquote.css +1 -22
  10. package/css/breadcrumbs.css +1 -372
  11. package/css/button.css +1 -381
  12. package/css/carousel.css +1 -121
  13. package/css/checkbox.css +1 -150
  14. package/css/code.css +1 -81
  15. package/css/color-picker.css +1 -203
  16. package/css/date-picker.css +1 -399
  17. package/css/dialog.css +1 -159
  18. package/css/expandable-block.css +1 -171
  19. package/css/fieldset.css +1 -27
  20. package/css/file-upload.css +1 -78
  21. package/css/footer.css +1 -91
  22. package/css/global.css +1 -59
  23. package/css/header.css +1 -432
  24. package/css/information-panel.css +1 -189
  25. package/css/input.css +1 -166
  26. package/css/keyboard.css +1 -27
  27. package/css/location-marker.css +1 -114
  28. package/css/menu.css +1 -171
  29. package/css/non-ideal-state.css +1 -61
  30. package/css/progress-indicator.css +1 -299
  31. package/css/radio-tile.css +1 -187
  32. package/css/radio.css +1 -157
  33. package/css/select.css +1 -235
  34. package/css/side-navigation.css +1 -198
  35. package/css/skip-to-content.css +1 -61
  36. package/css/slider.css +1 -258
  37. package/css/stepper.css +1 -137
  38. package/css/surface.css +1 -14
  39. package/css/table.css +1 -705
  40. package/css/tabs.css +1 -321
  41. package/css/tag.css +1 -140
  42. package/css/text.css +1 -115
  43. package/css/tile.css +1 -488
  44. package/css/time-picker.css +1 -128
  45. package/css/toast.css +1 -284
  46. package/css/toggle-switch.css +1 -212
  47. package/css/tooltip.css +1 -48
  48. package/css/tree.css +1 -124
  49. package/css/utils.css +1 -679
  50. package/css/workflow-diagram.css +1 -63
  51. package/package.json +8 -4
package/css/table.css CHANGED
@@ -2,708 +2,4 @@
2
2
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
3
3
  * See LICENSE.md in the project root for license terms and full copyright notice.
4
4
  *--------------------------------------------------------------------------------------------*/
5
- @charset "UTF-8";
6
- .iui-table{
7
- margin:0;
8
- padding:0;
9
- border:none;
10
- vertical-align:baseline;
11
- display:flex;
12
- flex-direction:column;
13
- isolation:isolate;
14
- --_iui-table-header-size:calc(var(--iui-size-s) * 5);
15
- --_iui-table-row-size:calc(var(--iui-size-s) * 5 + 2px);
16
- }
17
- .iui-table .iui-table-cell-end-icon,
18
- .iui-table .iui-table-cell-start-icon{
19
- flex-shrink:0;
20
- display:flex;
21
- align-items:center;
22
- justify-content:center;
23
- }
24
- .iui-table .iui-table-cell-end-icon svg:not(.iui-radial),
25
- .iui-table .iui-table-cell-start-icon svg:not(.iui-radial){
26
- display:flex;
27
- flex-shrink:0;
28
- width:var(--iui-size-m);
29
- height:var(--iui-size-m);
30
- }
31
- .iui-table .iui-table-cell-start-icon{
32
- margin-right:var(--iui-size-xs);
33
- }
34
- .iui-table .iui-table-cell-end-icon{
35
- width:var(--iui-size-l);
36
- height:var(--iui-size-l);
37
- margin-right:var(--iui-size-s);
38
- margin-left:auto;
39
- }
40
- .iui-table[data-iui-size=condensed]{
41
- --_iui-table-header-size:calc(var(--iui-size-s) * 4);
42
- --_iui-table-row-size:calc(var(--iui-size-s) * 4 + 2px);
43
- }
44
- .iui-table[data-iui-size=extra-condensed]{
45
- --_iui-table-header-size:calc(var(--iui-size-s) * 3);
46
- --_iui-table-row-size:calc(var(--iui-size-s) * 3 + 2px);
47
- }
48
- .iui-table[data-iui-size=extra-condensed] .iui-table-header .iui-table-cell{
49
- padding-block:calc(var(--iui-size-s) * 0.25);
50
- }
51
- .iui-table .iui-table-header .iui-table-cell,
52
- .iui-table .iui-table-paginator{
53
- min-height:var(--_iui-table-header-size);
54
- }
55
- .iui-table .iui-table-cell{
56
- min-height:var(--_iui-table-row-size);
57
- }
58
-
59
- .iui-table-header-wrapper{
60
- overflow:hidden;
61
- display:flex;
62
- flex-shrink:0;
63
- border-top-left-radius:var(--iui-border-radius-1);
64
- border-top-right-radius:var(--iui-border-radius-1);
65
- }
66
- @supports not (overflow: overlay){
67
- .iui-table-header-wrapper{
68
- overflow-y:scroll;
69
- }
70
- }
71
-
72
- .iui-table-header{
73
- display:flex;
74
- -webkit-user-select:none;
75
- -moz-user-select:none;
76
- -ms-user-select:none;
77
- user-select:none;
78
- min-width:100%;
79
- flex-shrink:0;
80
- }
81
- .iui-table-header .iui-table-cell{
82
- background-color:var(--iui-color-background-3);
83
- }
84
- .iui-table-header .iui-table-cell:not(.iui-slot){
85
- -moz-column-gap:var(--iui-size-2xs);
86
- column-gap:var(--iui-size-2xs);
87
- padding-block:calc(var(--iui-size-s) * 0.5);
88
- }
89
- .iui-table-header .iui-table-cell:not(.iui-slot):focus-visible{
90
- outline:1px solid var(--iui-color-foreground-primary);
91
- outline-offset:-1px;
92
- }
93
- @supports not selector(*:focus-visible){
94
- .iui-table-header .iui-table-cell:not(.iui-slot):focus{
95
- outline:1px solid var(--iui-color-foreground-primary);
96
- outline-offset:-1px;
97
- }
98
- }
99
- .iui-table-header .iui-table-cell:not(.iui-slot).iui-actionable{
100
- cursor:pointer;
101
- }
102
- .iui-table-header .iui-table-cell:not(.iui-slot).iui-grabbing{
103
- cursor:-webkit-grabbing;
104
- cursor:grabbing;
105
- }
106
- .iui-table-header .iui-table-cell:not(.iui-slot) .iui-table-filter-button:not([data-iui-active=true]){
107
- opacity:0;
108
- }
109
- .iui-table-header .iui-table-cell:not(.iui-slot) > .iui-table-resizer{
110
- height:100%;
111
- width:var(--iui-size-m);
112
- position:absolute;
113
- top:0;
114
- right:0;
115
- transform:translateX(50%);
116
- touch-action:none;
117
- cursor:ew-resize;
118
- z-index:1;
119
- opacity:0;
120
- }
121
- .iui-table-header .iui-table-cell:not(.iui-slot) > .iui-table-resizer > .iui-table-resizer-bar{
122
- height:100%;
123
- width:var(--iui-size-3xs);
124
- margin:0 auto;
125
- transition:background-color var(--iui-duration-1) ease-out, width var(--iui-duration-1) ease-out;
126
- background-color:var(--iui-color-background-border);
127
- }
128
- .iui-table-header .iui-table-cell:not(.iui-slot) > .iui-table-resizer:hover > .iui-table-resizer-bar{
129
- width:var(--iui-size-2xs);
130
- background-color:var(--iui-color-foreground-primary);
131
- }
132
- .iui-table-header .iui-table-cell:not(.iui-slot):hover > .iui-table-resizer{
133
- opacity:1;
134
- }
135
- .iui-table-header .iui-table-cell:not(.iui-slot):hover, .iui-table-header .iui-table-cell:not(.iui-slot):focus, .iui-table-header .iui-table-cell:not(.iui-slot):focus-within{
136
- background-color:var(--iui-color-background-4);
137
- }
138
- .iui-table-header .iui-table-cell:not(.iui-slot):hover .iui-table-sort,
139
- .iui-table-header .iui-table-cell:not(.iui-slot):hover .iui-table-filter-button, .iui-table-header .iui-table-cell:not(.iui-slot):focus .iui-table-sort,
140
- .iui-table-header .iui-table-cell:not(.iui-slot):focus .iui-table-filter-button, .iui-table-header .iui-table-cell:not(.iui-slot):focus-within .iui-table-sort,
141
- .iui-table-header .iui-table-cell:not(.iui-slot):focus-within .iui-table-filter-button{
142
- opacity:1;
143
- }
144
- .iui-table-header .iui-table-reorder-bar{
145
- position:absolute;
146
- height:100%;
147
- width:var(--iui-size-3xs);
148
- }
149
- .iui-table-header .iui-table-reorder-column-right > .iui-table-reorder-bar{
150
- right:0;
151
- }
152
- .iui-table-header .iui-table-reorder-column-left > .iui-table-reorder-bar{
153
- left:0;
154
- }
155
- .iui-table-header .iui-table-reorder-column-left > .iui-table-reorder-bar,
156
- .iui-table-header .iui-table-reorder-column-right > .iui-table-reorder-bar{
157
- background-color:var(--iui-color-foreground-primary);
158
- }
159
- .iui-table-header .iui-table-sort{
160
- opacity:0;
161
- fill:var(--iui-color-foreground-4);
162
- }
163
- .iui-table-header .iui-sorted{
164
- background-color:var(--iui-color-background-4);
165
- }
166
- .iui-table-header .iui-sorted .iui-table-sort{
167
- opacity:1;
168
- fill:var(--iui-color-foreground-2);
169
- }
170
-
171
- .iui-table-row{
172
- min-width:100%;
173
- display:flex;
174
- }
175
- .iui-table-row:last-of-type{
176
- border-radius:inherit;
177
- }
178
- .iui-table-header .iui-table-row{
179
- flex-grow:1;
180
- }
181
-
182
- .iui-table-body .iui-table-row .iui-table-cell{
183
- border-top:solid 1px transparent;
184
- border-bottom:solid 1px transparent;
185
- border-bottom-color:var(--iui-color-background-border);
186
- background-color:var(--iui-color-background-1);
187
- transition:border var(--iui-duration-1) ease-out;
188
- }
189
- .iui-table-body .iui-table-row > .iui-slot > .iui-table-more-options{
190
- opacity:0;
191
- }
192
- .iui-table-body .iui-table-row:where(:hover, :focus-within) > .iui-slot > .iui-table-more-options{
193
- opacity:1;
194
- }
195
- .iui-table-body .iui-table-row:where(:hover:not(.iui-loading):not([aria-disabled="true"])) .iui-table-cell{
196
- background-color:var(--iui-color-background-transparent-hover);
197
- }
198
- @media (prefers-reduced-motion: no-preference){
199
- .iui-table-body .iui-table-row .iui-table-row-expander > .iui-button-icon{
200
- transition:transform var(--iui-duration-1) ease-out;
201
- }
202
- }
203
- .iui-table-body .iui-table-row.iui-table-row-expanded{
204
- overflow:hidden;
205
- }
206
- .iui-table-body .iui-table-row.iui-table-row-expanded .iui-table-cell{
207
- border-left-color:var(--iui-color-background-4);
208
- border-right-color:var(--iui-color-background-4);
209
- border-bottom-color:transparent;
210
- }
211
- .iui-table-body .iui-table-row.iui-table-row-expanded .iui-table-row-expander > .iui-button-icon{
212
- transform:rotate(90deg);
213
- }
214
- .iui-table-body .iui-table-row.iui-table-row-expanded + .iui-table-expanded-content{
215
- border-left-color:var(--iui-color-background-4);
216
- border-right-color:var(--iui-color-background-4);
217
- }
218
- .iui-table-body .iui-table-row.iui-table-expanded-content{
219
- overflow:hidden;
220
- border-left:1px solid transparent;
221
- border-right:1px solid transparent;
222
- border-bottom:1px solid var(--iui-color-background-border);
223
- }
224
- .iui-table-body .iui-table-row.iui-table-expanded-content.iui-enter{
225
- opacity:0;
226
- }
227
- .iui-table-body .iui-table-row.iui-table-expanded-content.iui-enter-active{
228
- opacity:1;
229
- }
230
- @media (prefers-reduced-motion: no-preference){
231
- .iui-table-body .iui-table-row.iui-table-expanded-content.iui-enter-active{
232
- transition:opacity var(--iui-duration-1) ease-out, width var(--iui-duration-1) ease-out, height var(--iui-duration-1) ease-out;
233
- }
234
- }
235
- .iui-table-body .iui-table-row.iui-table-expanded-content.iui-exit{
236
- opacity:1;
237
- }
238
- .iui-table-body .iui-table-row.iui-table-expanded-content.iui-exit-active{
239
- opacity:0;
240
- }
241
- @media (prefers-reduced-motion: no-preference){
242
- .iui-table-body .iui-table-row.iui-table-expanded-content.iui-exit-active{
243
- transition:opacity var(--iui-duration-1) ease-out, width var(--iui-duration-1) ease-out, height var(--iui-duration-1) ease-out;
244
- }
245
- }
246
- .iui-table-body .iui-table-row:not([aria-selected=true]) + [aria-selected=true] .iui-table-cell, .iui-table-body .iui-table-row[aria-selected=true]:first-child .iui-table-cell{
247
- border-bottom-color:transparent;
248
- }
249
- .iui-table-body .iui-table-row[aria-selected=true] .iui-table-cell{
250
- border-color:var(--iui-color-foreground-primary);
251
- background-color:var(--iui-color-background-subtle-primary);
252
- }
253
- .iui-table-body .iui-table-row[aria-selected=true] + [aria-selected=true] .iui-table-cell{
254
- border-bottom-color:transparent;
255
- border-top-color:hsl(var(--iui-color-foreground-primary-hsl)/var(--iui-opacity-4));
256
- }
257
- .iui-table-body .iui-table-row[aria-selected=true]:last-child .iui-table-cell{
258
- border-bottom-color:var(--iui-color-foreground-primary);
259
- }
260
- .iui-table-body .iui-table-row[aria-selected=true] + :not([aria-selected=true]) .iui-table-cell,
261
- .iui-table-body .iui-table-row[aria-selected=true] + .iui-table-expanded-content + .iui-table-row:not([aria-selected=true]) .iui-table-cell{
262
- border-top-color:var(--iui-color-foreground-primary);
263
- }
264
- .iui-table-body .iui-table-row[aria-selected=true] + .iui-table-expanded-content{
265
- border-color:transparent var(--iui-color-foreground-primary);
266
- }
267
- .iui-table-body .iui-table-row[aria-selected=true] + .iui-table-expanded-content:last-child{
268
- border-bottom-color:var(--iui-color-foreground-primary);
269
- }
270
- .iui-table-body .iui-table-row.iui-new{
271
- font-weight:var(--iui-font-weight-semibold);
272
- }
273
- .iui-table-body .iui-table-row.iui-new > .iui-main-column::before{
274
- content:"•";
275
- position:absolute;
276
- left:0;
277
- font-size:var(--iui-font-size-4);
278
- color:var(--iui-color-foreground-positive);
279
- }
280
- .iui-table-body .iui-table-row.iui-loading,
281
- .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true], .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true]{
282
- color:var(--iui-color-foreground-4);
283
- }
284
- .iui-table-body .iui-table-row.iui-loading img,
285
- .iui-table-body .iui-table-row.iui-loading svg:not(.iui-radial),
286
- .iui-table-body .iui-table-row.iui-loading .iui-avatar,
287
- .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true] img,
288
- .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true] svg:not(.iui-radial),
289
- .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true] .iui-avatar, .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true] img,
290
- .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true] svg:not(.iui-radial),
291
- .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true] .iui-avatar{
292
- filter:grayscale(100%);
293
- }
294
- .iui-table-body .iui-table-row.iui-loading{
295
- font-style:italic;
296
- }
297
- .iui-table-body .iui-table-row.iui-loading,
298
- .iui-table-body .iui-table-row.iui-loading .iui-checkbox{
299
- cursor:progress;
300
- }
301
- .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true], .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true]{
302
- cursor:not-allowed;
303
- }
304
- .iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell:first-of-type,
305
- .iui-table-body .iui-table-row[data-iui-status=positive] + .iui-table-expanded-content{
306
- box-shadow:inset var(--iui-size-3xs) 0 0 0 var(--iui-color-foreground-positive);
307
- }
308
- .iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell:first-of-type::-moz-selection, .iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell:first-of-type *::-moz-selection, .iui-table-body .iui-table-row[data-iui-status=positive] + .iui-table-expanded-content::-moz-selection, .iui-table-body .iui-table-row[data-iui-status=positive] + .iui-table-expanded-content *::-moz-selection{
309
- background-color:hsl(var(--iui-color-foreground-positive-hsl)/var(--iui-opacity-5));
310
- }
311
- .iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell:first-of-type::selection,
312
- .iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell:first-of-type *::selection,
313
- .iui-table-body .iui-table-row[data-iui-status=positive] + .iui-table-expanded-content::selection,
314
- .iui-table-body .iui-table-row[data-iui-status=positive] + .iui-table-expanded-content *::selection{
315
- background-color:hsl(var(--iui-color-foreground-positive-hsl)/var(--iui-opacity-5));
316
- }
317
- .iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell-end-icon svg{
318
- fill:var(--iui-color-foreground-positive);
319
- }
320
- .iui-table-body .iui-table-row[data-iui-status=warning] .iui-table-cell:first-of-type,
321
- .iui-table-body .iui-table-row[data-iui-status=warning] + .iui-table-expanded-content{
322
- box-shadow:inset var(--iui-size-3xs) 0 0 0 var(--iui-color-foreground-warning);
323
- }
324
- .iui-table-body .iui-table-row[data-iui-status=warning] .iui-table-cell:first-of-type::-moz-selection, .iui-table-body .iui-table-row[data-iui-status=warning] .iui-table-cell:first-of-type *::-moz-selection, .iui-table-body .iui-table-row[data-iui-status=warning] + .iui-table-expanded-content::-moz-selection, .iui-table-body .iui-table-row[data-iui-status=warning] + .iui-table-expanded-content *::-moz-selection{
325
- background-color:hsl(var(--iui-color-foreground-warning-hsl)/var(--iui-opacity-5));
326
- }
327
- .iui-table-body .iui-table-row[data-iui-status=warning] .iui-table-cell:first-of-type::selection,
328
- .iui-table-body .iui-table-row[data-iui-status=warning] .iui-table-cell:first-of-type *::selection,
329
- .iui-table-body .iui-table-row[data-iui-status=warning] + .iui-table-expanded-content::selection,
330
- .iui-table-body .iui-table-row[data-iui-status=warning] + .iui-table-expanded-content *::selection{
331
- background-color:hsl(var(--iui-color-foreground-warning-hsl)/var(--iui-opacity-5));
332
- }
333
- .iui-table-body .iui-table-row[data-iui-status=warning] .iui-table-cell-end-icon svg{
334
- fill:var(--iui-color-foreground-warning);
335
- }
336
- .iui-table-body .iui-table-row[data-iui-status=negative] .iui-table-cell:first-of-type,
337
- .iui-table-body .iui-table-row[data-iui-status=negative] + .iui-table-expanded-content{
338
- box-shadow:inset var(--iui-size-3xs) 0 0 0 var(--iui-color-foreground-negative);
339
- }
340
- .iui-table-body .iui-table-row[data-iui-status=negative] .iui-table-cell:first-of-type::-moz-selection, .iui-table-body .iui-table-row[data-iui-status=negative] .iui-table-cell:first-of-type *::-moz-selection, .iui-table-body .iui-table-row[data-iui-status=negative] + .iui-table-expanded-content::-moz-selection, .iui-table-body .iui-table-row[data-iui-status=negative] + .iui-table-expanded-content *::-moz-selection{
341
- background-color:hsl(var(--iui-color-foreground-negative-hsl)/var(--iui-opacity-5));
342
- }
343
- .iui-table-body .iui-table-row[data-iui-status=negative] .iui-table-cell:first-of-type::selection,
344
- .iui-table-body .iui-table-row[data-iui-status=negative] .iui-table-cell:first-of-type *::selection,
345
- .iui-table-body .iui-table-row[data-iui-status=negative] + .iui-table-expanded-content::selection,
346
- .iui-table-body .iui-table-row[data-iui-status=negative] + .iui-table-expanded-content *::selection{
347
- background-color:hsl(var(--iui-color-foreground-negative-hsl)/var(--iui-opacity-5));
348
- }
349
- .iui-table-body .iui-table-row[data-iui-status=negative] .iui-table-cell-end-icon svg{
350
- fill:var(--iui-color-foreground-negative);
351
- }
352
-
353
- .iui-table-header-actions-container{
354
- display:flex;
355
- flex-grow:1;
356
- align-items:center;
357
- flex-wrap:wrap;
358
- justify-content:flex-end;
359
- margin-right:var(--iui-size-s);
360
- }
361
- .iui-table-header-actions-container .iui-table-cell-end-icon{
362
- width:28px;
363
- height:28px;
364
- margin-right:initial;
365
- margin-left:auto;
366
- }
367
-
368
- .iui-table-body{
369
- overflow-y:scroll;
370
- overflow:overlay;
371
- display:flex;
372
- flex-direction:column;
373
- flex-grow:1;
374
- align-items:flex-start;
375
- background-color:var(--iui-color-background-1);
376
- }
377
- .iui-table-body.iui-scroll-snapping{
378
- -ms-scroll-snap-type:y mandatory;
379
- scroll-snap-type:y mandatory;
380
- }
381
- .iui-table-body.iui-scroll-snapping .iui-table-row{
382
- scroll-snap-align:start none;
383
- }
384
- .iui-table-body:last-child{
385
- border-bottom-left-radius:var(--iui-border-radius-1);
386
- border-bottom-right-radius:var(--iui-border-radius-1);
387
- }
388
- .iui-table-body.iui-zebra-striping .iui-table-row:nth-child(even):not([aria-selected=true]) .iui-table-cell::before{
389
- content:"";
390
- position:absolute;
391
- inset:0;
392
- background-color:hsl(var(--iui-color-foreground-1-hsl)/0.02);
393
- }
394
- .iui-table-body > .iui-table-empty{
395
- text-align:center;
396
- padding:var(--iui-size-xl);
397
- display:flex;
398
- flex-direction:column;
399
- justify-content:center;
400
- align-items:center;
401
- flex-grow:1;
402
- align-self:center;
403
- color:var(--iui-color-foreground-4);
404
- background-color:var(--iui-color-background-1);
405
- }
406
-
407
- .iui-table-cell{
408
- align-items:center;
409
- display:flex;
410
- flex-grow:1;
411
- min-width:var(--iui-size-2xl);
412
- padding-left:var(--iui-size-m);
413
- flex-basis:var(--iui-size-2xl);
414
- position:relative;
415
- word-break:break-word;
416
- }
417
- .iui-table-cell:first-of-type{
418
- border-left:solid 1px transparent;
419
- border-bottom-left-radius:inherit;
420
- }
421
- .iui-table-cell:last-of-type{
422
- border-right:solid 1px transparent;
423
- }
424
- .iui-table-cell.iui-slot{
425
- width:calc(var(--iui-size-l) * 2);
426
- padding:0;
427
- flex-grow:0;
428
- min-width:0;
429
- display:flex;
430
- justify-content:center;
431
- align-items:center;
432
- flex-basis:calc(var(--iui-size-l) * 2);
433
- }
434
- .iui-table-cell.iui-table-cell-sticky{
435
- position:-webkit-sticky;
436
- position:sticky;
437
- z-index:1;
438
- left:var(--iui-table-sticky-left, initial);
439
- right:var(--iui-table-sticky-right, initial);
440
- }
441
- .iui-table-cell:not(.iui-slot):last-child{
442
- padding-right:var(--iui-size-m);
443
- }
444
- .iui-table-cell[data-iui-status=positive]::-moz-selection, .iui-table-cell[data-iui-status=positive] *::-moz-selection{
445
- background-color:hsl(var(--iui-color-foreground-positive-hsl)/var(--iui-opacity-5));
446
- }
447
- .iui-table-cell[data-iui-status=positive]::selection,
448
- .iui-table-cell[data-iui-status=positive] *::selection{
449
- background-color:hsl(var(--iui-color-foreground-positive-hsl)/var(--iui-opacity-5));
450
- }
451
- .iui-table-cell[data-iui-status=positive]::before{
452
- content:"";
453
- position:absolute;
454
- inset:0;
455
- background-color:hsl(var(--iui-color-foreground-positive-hsl)/var(--iui-opacity-6));
456
- }
457
- .iui-table-cell[data-iui-status=warning]::-moz-selection, .iui-table-cell[data-iui-status=warning] *::-moz-selection{
458
- background-color:hsl(var(--iui-color-foreground-warning-hsl)/var(--iui-opacity-5));
459
- }
460
- .iui-table-cell[data-iui-status=warning]::selection,
461
- .iui-table-cell[data-iui-status=warning] *::selection{
462
- background-color:hsl(var(--iui-color-foreground-warning-hsl)/var(--iui-opacity-5));
463
- }
464
- .iui-table-cell[data-iui-status=warning]::before{
465
- content:"";
466
- position:absolute;
467
- inset:0;
468
- background-color:hsl(var(--iui-color-foreground-warning-hsl)/var(--iui-opacity-6));
469
- }
470
- .iui-table-cell[data-iui-status=negative]::-moz-selection, .iui-table-cell[data-iui-status=negative] *::-moz-selection{
471
- background-color:hsl(var(--iui-color-foreground-negative-hsl)/var(--iui-opacity-5));
472
- }
473
- .iui-table-cell[data-iui-status=negative]::selection,
474
- .iui-table-cell[data-iui-status=negative] *::selection{
475
- background-color:hsl(var(--iui-color-foreground-negative-hsl)/var(--iui-opacity-5));
476
- }
477
- .iui-table-cell[data-iui-status=negative]::before{
478
- content:"";
479
- position:absolute;
480
- inset:0;
481
- background-color:hsl(var(--iui-color-foreground-negative-hsl)/var(--iui-opacity-6));
482
- }
483
- .iui-table-cell[contenteditable]{
484
- outline-offset:-1px;
485
- }
486
- .iui-table-cell[contenteditable]:focus, .iui-table-cell[contenteditable]:hover{
487
- outline:1px solid var(--iui-color-foreground-primary);
488
- }
489
- .iui-table-cell[contenteditable]:focus{
490
- background-color:var(--iui-color-background-1);
491
- }
492
-
493
- .iui-table-cell-shadow-left{
494
- position:absolute;
495
- top:-1px;
496
- bottom:-1px;
497
- width:var(--iui-size-l);
498
- pointer-events:none;
499
- left:0;
500
- transform:translate(-100%);
501
- box-shadow:inset -10px 0 5px -10px var(--iui-shadow-color);
502
- }
503
- .iui-table-header .iui-table-cell-shadow-left{
504
- top:0;
505
- bottom:0;
506
- }
507
-
508
- .iui-table-cell-shadow-right{
509
- position:absolute;
510
- top:-1px;
511
- bottom:-1px;
512
- width:var(--iui-size-l);
513
- pointer-events:none;
514
- right:0;
515
- transform:translate(100%);
516
- box-shadow:inset 10px 0 5px -10px var(--iui-shadow-color);
517
- }
518
- .iui-table-header .iui-table-cell-shadow-right{
519
- top:0;
520
- bottom:0;
521
- }
522
-
523
- .iui-table-paginator{
524
- margin:0;
525
- padding:0;
526
- border:none;
527
- vertical-align:baseline;
528
- display:flex;
529
- justify-content:space-between;
530
- align-items:center;
531
- padding:0 var(--iui-size-m);
532
- -webkit-user-select:none;
533
- -moz-user-select:none;
534
- -ms-user-select:none;
535
- user-select:none;
536
- background-color:var(--iui-color-background-3);
537
- border-bottom-left-radius:var(--iui-border-radius-1);
538
- border-bottom-right-radius:var(--iui-border-radius-1);
539
- }
540
- .iui-table-paginator > .iui-left,
541
- .iui-table-paginator > .iui-center,
542
- .iui-table-paginator > .iui-right{
543
- display:flex;
544
- align-items:center;
545
- position:relative;
546
- flex:1;
547
- min-width:0;
548
- }
549
- .iui-table-paginator > .iui-center{
550
- justify-content:center;
551
- flex:2 1;
552
- color:var(--iui-color-foreground-2);
553
- }
554
- .iui-table-paginator > .iui-right{
555
- justify-content:flex-end;
556
- }
557
-
558
- .iui-table-paginator-page-size-label{
559
- color:var(--iui-color-foreground-4);
560
- white-space:nowrap;
561
- overflow:hidden;
562
- text-overflow:ellipsis;
563
- }
564
-
565
- .iui-table-paginator-ellipsis{
566
- display:flex;
567
- justify-content:center;
568
- align-items:center;
569
- padding-inline:var(--iui-size-xs);
570
- color:var(--iui-color-foreground-4);
571
- }
572
- .iui-table-paginator-ellipsis-small{
573
- padding-inline:var(--iui-size-2xs);
574
- }
575
-
576
- .iui-table-paginator-pages-group{
577
- display:inline-flex;
578
- align-items:center;
579
- margin:0 var(--iui-size-xs);
580
- }
581
-
582
- .iui-table-paginator-page-button{
583
- margin:0;
584
- padding:0;
585
- border:none;
586
- vertical-align:baseline;
587
- font-family:inherit;
588
- display:inline-flex;
589
- flex-shrink:0;
590
- align-items:center;
591
- vertical-align:middle;
592
- justify-content:center;
593
- position:relative;
594
- border-radius:var(--iui-border-radius-1);
595
- line-height:var(--iui-size-l);
596
- font-size:var(--iui-font-size-1);
597
- font-weight:var(--iui-font-weight-normal);
598
- -webkit-user-select:none;
599
- -moz-user-select:none;
600
- -ms-user-select:none;
601
- user-select:none;
602
- cursor:pointer;
603
- white-space:nowrap;
604
- border:1px solid var(--_iui-button-border-color);
605
- background:var(--_iui-button-background-color);
606
- color:var(--_iui-button-text-color);
607
- gap:var(--_iui-button-gap);
608
- min-height:var(--_iui-button-min-height);
609
- min-width:var(--_iui-button-min-height);
610
- padding-block:var(--_iui-button-padding-block);
611
- padding-inline:var(--_iui-button-padding-inline);
612
- transition:background-color var(--iui-duration-1) ease-out, border-color var(--iui-duration-1) ease-out;
613
- -webkit-tap-highlight-color:transparent;
614
- text-decoration:none;
615
- --_iui-button-gap:var(--iui-size-xs);
616
- --_iui-button-padding-block:var(--iui-size-2xs);
617
- --_iui-button-padding-inline:var(--iui-size-m);
618
- --_iui-button-min-height:var(--iui-component-height);
619
- --_iui-button-text-color:var(--iui-color-foreground-2);
620
- --_iui-button-background-color:transparent;
621
- --_iui-button-border-color:transparent;
622
- --_iui-button-gap:var(--iui-size-xs);
623
- --_iui-button-padding-block:var(--iui-size-2xs);
624
- --_iui-button-padding-inline:var(--iui-size-m);
625
- --_iui-button-min-height:var(--iui-component-height);
626
- --_iui-button-padding-inline:var(--iui-size-xs);
627
- }
628
- .iui-table-paginator-page-button:focus-visible{
629
- outline:1px solid var(--iui-color-foreground-primary);
630
- outline-offset:-1px;
631
- }
632
- @supports not selector(*:focus-visible){
633
- .iui-table-paginator-page-button:focus{
634
- outline:1px solid var(--iui-color-foreground-primary);
635
- outline-offset:-1px;
636
- }
637
- }
638
- .iui-table-paginator-page-button:where(:hover, :active){
639
- --_iui-button-text-color:var(--iui-color-foreground-1);
640
- --_iui-button-background-color:var(--iui-color-background-transparent-hover);
641
- }
642
- .iui-table-paginator-page-button:where(:focus){
643
- outline-offset:-1px;
644
- outline-width:1px;
645
- }
646
- .iui-table-paginator-page-button:where([disabled], :disabled, [aria-disabled="true"]){
647
- --_iui-button-text-color:var(--iui-color-foreground-5);
648
- --_iui-button-background-color:transparent;
649
- --_iui-button-border-color:transparent;
650
- }
651
- .iui-table-paginator-page-button-small{
652
- --_iui-button-gap:var(--iui-size-2xs);
653
- --_iui-button-padding-block:0;
654
- --_iui-button-padding-inline:var(--iui-size-xs);
655
- --_iui-button-min-height:var(--iui-component-height-small);
656
- }
657
- .iui-table-paginator-page-button[data-iui-active=true]{
658
- --_iui-button-active-stripe-inset:initial;
659
- --_iui-button-active-stripe-color:var(--iui-color-foreground-primary);
660
- --_iui-button-text-color:var(--iui-color-foreground-primary);
661
- --_iui-button-background-color:var(--iui-color-background-subtle-primary);
662
- --_iui-button-background-color:hsl(var(--iui-color-foreground-primary-hsl) / var(--iui-opacity-6));
663
- --_iui-button-active-stripe-inset:calc(100% - var(--iui-size-2xs)) var(--iui-size-3xs) var(--iui-size-3xs);
664
- }
665
- .iui-table-paginator-page-button[data-iui-active=true]::after{
666
- content:"";
667
- position:absolute;
668
- inset:var(--_iui-button-active-stripe-inset);
669
- background-color:var(--_iui-button-active-stripe-color);
670
- }
671
- .iui-table-paginator-page-button[data-iui-active=true][disabled], .iui-table-paginator-page-button[data-iui-active=true]:disabled, .iui-table-paginator-page-button[data-iui-active=true][aria-disabled=true]{
672
- --_iui-button-active-stripe-color:var(--iui-color-foreground-5);
673
- --_iui-button-text-color:var(--iui-color-foreground-5);
674
- }
675
-
676
- .iui-table-column-filter{
677
- --iui-surface-background-color:var(--iui-color-background-1);
678
- --iui-surface-border-radius:var(--iui-border-radius-1);
679
- --iui-surface-elevation:var(--iui-shadow-1);
680
- background-color:var(--iui-surface-background-color);
681
- border-radius:var(--iui-surface-border-radius);
682
- box-shadow:var(--iui-surface-elevation);
683
- color:var(--iui-color-foreground-2);
684
- padding:var(--iui-size-s) var(--iui-size-s);
685
- display:inline-flex;
686
- flex-direction:column;
687
- align-items:flex-end;
688
- }
689
- @media (forced-colors: active){
690
- .iui-table-column-filter{
691
- border:1px solid transparent;
692
- }
693
- }
694
- .iui-table-column-filter > .iui-input-container:not(.iui-inline-label){
695
- width:100%;
696
- }
697
- .iui-table-column-filter > .iui-input-container,
698
- .iui-table-column-filter > .iui-input{
699
- margin-bottom:var(--iui-size-s);
700
- }
701
- .iui-table-column-filter > .iui-button-bar{
702
- display:flex;
703
- width:100%;
704
- align-content:center;
705
- gap:var(--iui-size-xs);
706
- }
707
- .iui-table-column-filter > .iui-button-bar > .iui-button:first-of-type{
708
- margin-left:auto;
709
- }
5
+ .iui-table{vertical-align:baseline;isolation:isolate;--_iui-table-header-size:calc(var(--iui-size-s)*5);--_iui-table-row-size:calc(var(--iui-size-s)*5 + 2px);border:none;flex-direction:column;margin:0;padding:0;display:flex}.iui-table .iui-table-cell-end-icon,.iui-table .iui-table-cell-start-icon{fill:var(--_iui-table-cell-icon-fill);flex-shrink:0;justify-content:center;align-items:center;display:flex}.iui-table .iui-table-cell-end-icon svg:not(.iui-radial),.iui-table .iui-table-cell-start-icon svg:not(.iui-radial){width:var(--iui-size-m);height:var(--iui-size-m);flex-shrink:0;display:flex}.iui-table .iui-table-cell-start-icon{margin-right:var(--iui-size-xs)}.iui-table .iui-table-cell-end-icon{width:var(--iui-size-l);height:var(--iui-size-l);margin-right:var(--iui-size-s);margin-left:auto}.iui-table[data-iui-size=condensed]{--_iui-table-header-size:calc(var(--iui-size-s)*4);--_iui-table-row-size:calc(var(--iui-size-s)*4 + 2px)}.iui-table[data-iui-size=extra-condensed]{--_iui-table-header-size:calc(var(--iui-size-s)*3);--_iui-table-row-size:calc(var(--iui-size-s)*3 + 2px)}.iui-table[data-iui-size=extra-condensed] .iui-table-header .iui-table-cell{padding-block:calc(var(--iui-size-s)*.25)}.iui-table .iui-table-header,.iui-table .iui-table-paginator{min-height:var(--_iui-table-header-size)}.iui-table .iui-table-body .iui-table-cell{min-height:var(--_iui-table-row-size)}.iui-table-header-wrapper{border-top-left-radius:var(--iui-border-radius-1);border-top-right-radius:var(--iui-border-radius-1);flex-shrink:0;display:flex;overflow:hidden}@supports not (overflow: overlay){.iui-table-header-wrapper{overflow-y:scroll}}.iui-table-header{-webkit-user-select:none;user-select:none;min-width:100%;font-weight:var(--iui-font-weight-semibold);border-bottom:1px solid var(--iui-color-border);flex-shrink:0;display:flex}.iui-table-header .iui-table-cell{background-color:var(--iui-color-background)}.iui-table-header .iui-table-cell:not(.iui-slot){column-gap:var(--iui-size-2xs);padding-block:calc(var(--iui-size-s)*.5)}.iui-table-header .iui-table-cell:not(.iui-slot):focus-visible{outline:1px solid var(--iui-color-border-accent);outline-offset:-1px}@supports not selector(*:focus-visible){.iui-table-header .iui-table-cell:not(.iui-slot):focus{outline:1px solid var(--iui-color-border-accent);outline-offset:-1px}}.iui-table-header .iui-table-cell:not(.iui-slot).iui-actionable{cursor:pointer}.iui-table-header .iui-table-cell:not(.iui-slot).iui-grabbing{cursor:grabbing}.iui-table-header .iui-table-cell:not(.iui-slot) .iui-table-filter-button:not([data-iui-active=true]){opacity:0}.iui-table-header .iui-table-cell:not(.iui-slot)>.iui-table-resizer{height:100%;width:var(--iui-size-m);touch-action:none;cursor:ew-resize;z-index:1;opacity:0;position:absolute;top:0;right:0;transform:translate(50%)}.iui-table-header .iui-table-cell:not(.iui-slot)>.iui-table-resizer>.iui-table-resizer-bar{height:100%;width:var(--iui-size-3xs);transition:background-color var(--iui-duration-1)ease-out,width var(--iui-duration-1)ease-out;background-color:var(--iui-color-border);margin:0 auto}.iui-table-header .iui-table-cell:not(.iui-slot)>.iui-table-resizer:hover>.iui-table-resizer-bar{width:var(--iui-size-2xs);background-color:var(--iui-color-border-accent)}.iui-table-header .iui-table-cell:not(.iui-slot):hover>.iui-table-resizer{opacity:1}.iui-table-header .iui-table-cell:not(.iui-slot):hover,.iui-table-header .iui-table-cell:not(.iui-slot):focus,.iui-table-header .iui-table-cell:not(.iui-slot):focus-within{background-color:var(--iui-color-background-hover)}.iui-table-header .iui-table-cell:not(.iui-slot):hover .iui-table-sort,.iui-table-header .iui-table-cell:not(.iui-slot):hover .iui-table-filter-button,.iui-table-header .iui-table-cell:not(.iui-slot):focus .iui-table-sort,.iui-table-header .iui-table-cell:not(.iui-slot):focus .iui-table-filter-button,.iui-table-header .iui-table-cell:not(.iui-slot):focus-within .iui-table-sort,.iui-table-header .iui-table-cell:not(.iui-slot):focus-within .iui-table-filter-button{opacity:1}.iui-table-header .iui-table-reorder-bar{height:100%;width:var(--iui-size-3xs);position:absolute}.iui-table-header .iui-table-reorder-column-right>.iui-table-reorder-bar{right:0}.iui-table-header .iui-table-reorder-column-left>.iui-table-reorder-bar{left:0}.iui-table-header .iui-table-reorder-column-left>.iui-table-reorder-bar,.iui-table-header .iui-table-reorder-column-right>.iui-table-reorder-bar{background-color:var(--iui-color-border-accent)}.iui-table-header .iui-table-sort{opacity:0;fill:var(--iui-color-icon-muted)}.iui-table-header .iui-sorted{background-color:var(--iui-color-background-hover)}.iui-table-header .iui-sorted .iui-table-sort{opacity:1;fill:var(--iui-color-icon)}.iui-table-row{--_iui-table-cell-icon-fill:var(--iui-color-icon-muted);min-width:100%;display:flex}.iui-table-row:last-of-type{border-radius:inherit}.iui-table-header .iui-table-row{flex-grow:1}.iui-table-body .iui-table-row .iui-table-cell{border-top:1px solid #0000;border-bottom:1px solid #0000;border-bottom-color:var(--iui-color-border);background-color:var(--iui-color-background);transition:border var(--iui-duration-1)ease-out}.iui-table-body .iui-table-row>.iui-slot>.iui-table-more-options{opacity:0}.iui-table-body .iui-table-row:where(:hover,:focus-within)>.iui-slot>.iui-table-more-options{opacity:1}.iui-table-body .iui-table-row:where(:hover:not(.iui-loading):not([aria-disabled=true])) .iui-table-cell{background-color:var(--iui-color-background-hover)}@media (prefers-reduced-motion:no-preference){.iui-table-body .iui-table-row .iui-table-row-expander>.iui-button-icon{transition:transform var(--iui-duration-1)ease-out}}.iui-table-body .iui-table-row.iui-table-row-expanded{overflow:hidden}.iui-table-body .iui-table-row.iui-table-row-expanded .iui-table-cell{border-left-color:var(--iui-color-border);border-right-color:var(--iui-color-border);border-bottom-color:#0000}.iui-table-body .iui-table-row.iui-table-row-expanded .iui-table-row-expander>.iui-button-icon{transform:rotate(90deg)}.iui-table-body .iui-table-row.iui-table-row-expanded+.iui-table-expanded-content{border-left-color:var(--iui-color-border);border-right-color:var(--iui-color-border)}.iui-table-body .iui-table-row.iui-table-expanded-content{border-left:1px solid #0000;border-right:1px solid #0000;border-bottom:1px solid var(--iui-color-border);overflow:hidden}.iui-table-body .iui-table-row.iui-table-expanded-content.iui-enter{opacity:0}.iui-table-body .iui-table-row.iui-table-expanded-content.iui-enter-active{opacity:1}@media (prefers-reduced-motion:no-preference){.iui-table-body .iui-table-row.iui-table-expanded-content.iui-enter-active{transition:opacity var(--iui-duration-1)ease-out,width var(--iui-duration-1)ease-out,height var(--iui-duration-1)ease-out}}.iui-table-body .iui-table-row.iui-table-expanded-content.iui-exit{opacity:1}.iui-table-body .iui-table-row.iui-table-expanded-content.iui-exit-active{opacity:0}@media (prefers-reduced-motion:no-preference){.iui-table-body .iui-table-row.iui-table-expanded-content.iui-exit-active{transition:opacity var(--iui-duration-1)ease-out,width var(--iui-duration-1)ease-out,height var(--iui-duration-1)ease-out}}.iui-table-body .iui-table-row:not([aria-selected=true])+[aria-selected=true] .iui-table-cell,.iui-table-body .iui-table-row[aria-selected=true]:first-child .iui-table-cell{border-bottom-color:#0000}.iui-table-body .iui-table-row[aria-selected=true] .iui-table-cell{border-color:var(--iui-color-border-accent);background-color:var(--iui-color-background-accent-muted)}.iui-table-body .iui-table-row[aria-selected=true]+[aria-selected=true] .iui-table-cell{border-bottom-color:#0000;border-top-color:hsl(var(--iui-color-accent-hsl)/var(--iui-opacity-4))}.iui-table-body .iui-table-row[aria-selected=true]:last-child .iui-table-cell{border-bottom-color:var(--iui-color-border-accent)}.iui-table-body .iui-table-row[aria-selected=true]+:not([aria-selected=true]) .iui-table-cell,.iui-table-body .iui-table-row[aria-selected=true]+.iui-table-expanded-content+.iui-table-row:not([aria-selected=true]) .iui-table-cell{border-top-color:var(--iui-color-border-accent)}.iui-table-body .iui-table-row[aria-selected=true]+.iui-table-expanded-content{border-color:transparent var(--iui-color-border-accent)}.iui-table-body .iui-table-row[aria-selected=true]+.iui-table-expanded-content:last-child{border-bottom-color:var(--iui-color-border-accent)}.iui-table-body .iui-table-row.iui-new{font-weight:var(--iui-font-weight-semibold)}.iui-table-body .iui-table-row.iui-new>.iui-main-column:before{content:"•";font-size:var(--iui-font-size-4);color:var(--iui-color-icon-positive);position:absolute;left:0}.iui-table-body .iui-table-row.iui-loading,.iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true],.iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true]{--_iui-table-cell-icon-fill:var(--iui-color-icon-muted);--_iui-table-cell-image-filter:grayscale(100%);color:var(--iui-color-text-disabled)}.iui-table-body .iui-table-row.iui-loading img,.iui-table-body .iui-table-row.iui-loading svg:not(.iui-radial),.iui-table-body .iui-table-row.iui-loading .iui-avatar,.iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true] img,.iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true] svg:not(.iui-radial),.iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true] .iui-avatar,.iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true] img,.iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true] svg:not(.iui-radial),.iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true] .iui-avatar{filter:var(--_iui-table-cell-image-filter)}.iui-table-body .iui-table-row.iui-loading{font-style:italic}.iui-table-body .iui-table-row.iui-loading,.iui-table-body .iui-table-row.iui-loading .iui-checkbox{cursor:progress}.iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true],.iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true]{cursor:not-allowed}.iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell:first-of-type,.iui-table-body .iui-table-row[data-iui-status=positive]+.iui-table-expanded-content{box-shadow:inset var(--iui-size-2xs)0 0 0 var(--iui-color-border-positive)}.iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell:first-of-type::selection,.iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell:first-of-type ::selection,.iui-table-body .iui-table-row[data-iui-status=positive]+.iui-table-expanded-content::selection,.iui-table-body .iui-table-row[data-iui-status=positive]+.iui-table-expanded-content ::selection{background-color:hsl(var(--iui-color-positive-hsl)/var(--iui-opacity-5))}.iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell-end-icon{--_iui-table-cell-icon-fill:var(--iui-color-icon-positive)}.iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell[aria-disabled=true] .iui-table-cell-end-icon{--_iui-table-cell-image-filter:none}.iui-table-body .iui-table-row[data-iui-status=warning] .iui-table-cell:first-of-type,.iui-table-body .iui-table-row[data-iui-status=warning]+.iui-table-expanded-content{box-shadow:inset var(--iui-size-2xs)0 0 0 var(--iui-color-border-warning)}.iui-table-body .iui-table-row[data-iui-status=warning] .iui-table-cell:first-of-type::selection,.iui-table-body .iui-table-row[data-iui-status=warning] .iui-table-cell:first-of-type ::selection,.iui-table-body .iui-table-row[data-iui-status=warning]+.iui-table-expanded-content::selection,.iui-table-body .iui-table-row[data-iui-status=warning]+.iui-table-expanded-content ::selection{background-color:hsl(var(--iui-color-warning-hsl)/var(--iui-opacity-5))}.iui-table-body .iui-table-row[data-iui-status=warning] .iui-table-cell-end-icon{--_iui-table-cell-icon-fill:var(--iui-color-icon-warning)}.iui-table-body .iui-table-row[data-iui-status=warning] .iui-table-cell[aria-disabled=true] .iui-table-cell-end-icon{--_iui-table-cell-image-filter:none}.iui-table-body .iui-table-row[data-iui-status=negative] .iui-table-cell:first-of-type,.iui-table-body .iui-table-row[data-iui-status=negative]+.iui-table-expanded-content{box-shadow:inset var(--iui-size-2xs)0 0 0 var(--iui-color-border-negative)}.iui-table-body .iui-table-row[data-iui-status=negative] .iui-table-cell:first-of-type::selection,.iui-table-body .iui-table-row[data-iui-status=negative] .iui-table-cell:first-of-type ::selection,.iui-table-body .iui-table-row[data-iui-status=negative]+.iui-table-expanded-content::selection,.iui-table-body .iui-table-row[data-iui-status=negative]+.iui-table-expanded-content ::selection{background-color:hsl(var(--iui-color-negative-hsl)/var(--iui-opacity-5))}.iui-table-body .iui-table-row[data-iui-status=negative] .iui-table-cell-end-icon{--_iui-table-cell-icon-fill:var(--iui-color-icon-negative)}.iui-table-body .iui-table-row[data-iui-status=negative] .iui-table-cell[aria-disabled=true] .iui-table-cell-end-icon{--_iui-table-cell-image-filter:none}.iui-table-header-actions-container{margin-right:var(--iui-size-s);flex-wrap:wrap;flex-grow:1;justify-content:flex-end;align-items:center;display:flex}.iui-table-header-actions-container .iui-table-cell-end-icon{width:28px;height:28px;margin-right:initial;margin-left:auto}.iui-table-body{overflow-y:scroll;overflow:overlay;background-color:var(--iui-color-background);flex-direction:column;flex-grow:1;align-items:flex-start;display:flex}.iui-table-body.iui-scroll-snapping{scroll-snap-type:y mandatory}.iui-table-body.iui-scroll-snapping .iui-table-row{scroll-snap-align:start none}.iui-table-body:last-child{border-bottom-left-radius:var(--iui-border-radius-1);border-bottom-right-radius:var(--iui-border-radius-1)}.iui-table-body.iui-zebra-striping .iui-table-row:nth-child(2n):not([aria-selected=true]) .iui-table-cell{background-color:var(--iui-color-background-zebra)}.iui-table-body.iui-zebra-striping .iui-table-row:nth-child(2n):not([aria-selected=true]):hover .iui-table-cell{background-color:var(--iui-color-background-hover)}.iui-table-body>.iui-table-empty{text-align:center;padding:var(--iui-size-xl);color:var(--iui-color-text-muted);background-color:var(--iui-color-background);flex-direction:column;flex-grow:1;justify-content:center;align-self:center;align-items:center;display:flex}.iui-table-cell{min-width:var(--iui-size-2xl);padding-left:var(--iui-size-m);flex-grow:1;flex-basis:var(--iui-size-2xl);word-break:break-word;align-items:center;display:flex;position:relative}.iui-table-cell:first-of-type{border-bottom-left-radius:inherit;border-left:1px solid #0000}.iui-table-cell:last-of-type{border-right:1px solid #0000}.iui-table-cell.iui-slot{width:calc(var(--iui-size-l)*2);min-width:0;flex-grow:0;flex-basis:calc(var(--iui-size-l)*2);justify-content:center;align-items:center;padding:0;display:flex}.iui-table-cell.iui-table-cell-sticky{z-index:1;left:var(--iui-table-sticky-left,initial);right:var(--iui-table-sticky-right,initial);position:sticky}.iui-table-cell:not(.iui-slot):last-child{padding-right:var(--iui-size-m)}.iui-table-cell[data-iui-status=positive]::selection,.iui-table-cell[data-iui-status=positive] ::selection{background-color:hsl(var(--iui-color-positive-hsl)/var(--iui-opacity-5))}.iui-table-cell[data-iui-status=positive]:before{content:"";background-color:hsl(var(--iui-color-positive-hsl)/var(--iui-opacity-6));position:absolute;top:0;bottom:0;left:0;right:0}.iui-table-cell[data-iui-status=warning]::selection,.iui-table-cell[data-iui-status=warning] ::selection{background-color:hsl(var(--iui-color-warning-hsl)/var(--iui-opacity-5))}.iui-table-cell[data-iui-status=warning]:before{content:"";background-color:hsl(var(--iui-color-warning-hsl)/var(--iui-opacity-6));position:absolute;top:0;bottom:0;left:0;right:0}.iui-table-cell[data-iui-status=negative]::selection,.iui-table-cell[data-iui-status=negative] ::selection{background-color:hsl(var(--iui-color-negative-hsl)/var(--iui-opacity-5))}.iui-table-cell[data-iui-status=negative]:before{content:"";background-color:hsl(var(--iui-color-negative-hsl)/var(--iui-opacity-6));position:absolute;top:0;bottom:0;left:0;right:0}.iui-table-cell[contenteditable]{outline-offset:-1px}.iui-table-cell[contenteditable]:hover{outline:1px solid var(--iui-color-border-accent)}.iui-table-cell[contenteditable]:focus{background-color:var(--iui-color-background);outline:1px solid var(--iui-color-text-accent)}.iui-table-cell-shadow-left{width:var(--iui-size-l);pointer-events:none;box-shadow:inset -10px 0 5px -10px var(--iui-shadow-color);position:absolute;top:-1px;bottom:-1px;left:0;transform:translate(-100%)}.iui-table-header .iui-table-cell-shadow-left{top:0;bottom:0}.iui-table-cell-shadow-right{width:var(--iui-size-l);pointer-events:none;box-shadow:inset 10px 0 5px -10px var(--iui-shadow-color);position:absolute;top:-1px;bottom:-1px;right:0;transform:translate(100%)}.iui-table-header .iui-table-cell-shadow-right{top:0;bottom:0}.iui-table-paginator{vertical-align:baseline;padding:0;padding:0 var(--iui-size-m);-webkit-user-select:none;user-select:none;background-color:var(--iui-color-background);border-bottom-left-radius:var(--iui-border-radius-1);border-bottom-right-radius:var(--iui-border-radius-1);border:none;border-top:1px solid var(--iui-color-border);justify-content:space-between;align-items:center;margin:0;display:flex}.iui-table-paginator>.iui-left,.iui-table-paginator>.iui-center,.iui-table-paginator>.iui-right{min-width:0;flex:1;align-items:center;display:flex;position:relative}.iui-table-paginator>.iui-center{color:var(--iui-color-text);flex:2;justify-content:center}.iui-table-paginator>.iui-right{justify-content:flex-end}.iui-table-paginator-page-size-label{color:var(--iui-color-text-muted);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.iui-table-paginator-ellipsis{padding-inline:var(--iui-size-xs);justify-content:center;align-items:center;display:flex}.iui-table-paginator-ellipsis-small{padding-inline:var(--iui-size-2xs)}.iui-table-paginator-pages-group{margin:0 var(--iui-size-xs);align-items:center;display:inline-flex}.iui-table-paginator-page-button{vertical-align:baseline;vertical-align:middle;border-radius:var(--iui-border-radius-1);font-family:inherit;line-height:1.2;font-size:var(--iui-font-size-1);font-weight:var(--iui-font-weight-normal);-webkit-user-select:none;user-select:none;cursor:pointer;white-space:nowrap;border:none;border:1px solid var(--_iui-button-border-color);background:var(--_iui-button-background-color);color:var(--_iui-button-text-color);justify-content:center;align-items:center;gap:var(--_iui-button-gap);min-height:var(--_iui-button-min-height);min-width:var(--_iui-button-min-height);padding:0;padding-block:var(--_iui-button-padding-block);padding-inline:var(--_iui-button-padding-inline);transition:background-color var(--iui-duration-1)ease-out,border-color var(--iui-duration-1)ease-out;-webkit-tap-highlight-color:transparent;--_iui-button-gap:var(--iui-size-xs);--_iui-button-padding-block:var(--iui-size-2xs);--_iui-button-padding-inline:var(--iui-size-m);--_iui-button-min-height:var(--iui-component-height);--_iui-button-text-color:var(--iui-color-text);--_iui-button-background-color:transparent;--_iui-button-border-color:transparent;--_iui-button-icon-fill:var(--iui-color-icon);--_iui-button-gap:var(--iui-size-xs);--_iui-button-padding-block:var(--iui-size-2xs);--_iui-button-padding-inline:var(--iui-size-m);--_iui-button-min-height:var(--iui-component-height);--_iui-button-padding-inline:var(--iui-size-xs);flex-shrink:0;margin:0;text-decoration:none;display:inline-flex;position:relative}.iui-table-paginator-page-button:focus-visible{outline:1px solid var(--iui-color-border-accent);outline-offset:-1px}@supports not selector(*:focus-visible){.iui-table-paginator-page-button:focus{outline:1px solid var(--iui-color-border-accent);outline-offset:-1px}}.iui-table-paginator-page-button:where(:hover,:active){--_iui-button-text-color:var(--iui-color-text-hover);--_iui-button-background-color:var(--iui-color-background-transparent-hover);--_iui-button-icon-fill:var(--iui-color-icon-hover)}.iui-table-paginator-page-button:where(:focus){outline-offset:-1px;outline-width:1px}.iui-table-paginator-page-button:where([disabled],:disabled,[aria-disabled=true]){--_iui-button-text-color:var(--iui-color-text-disabled);--_iui-button-background-color:transparent;--_iui-button-border-color:transparent;--_iui-button-icon-fill:var(--iui-color-icon-disabled)}.iui-table-paginator-page-button-small{--_iui-button-gap:var(--iui-size-2xs);--_iui-button-padding-block:0;--_iui-button-padding-inline:var(--iui-size-xs);--_iui-button-min-height:var(--iui-component-height-small)}.iui-table-paginator-page-button[data-iui-active=true]{--_iui-button-active-stripe-inset:initial;--_iui-button-active-stripe-background:var(--iui-color-border-accent);--_iui-button-text-color:var(--iui-color-text-accent);--_iui-button-icon-fill:var(--iui-color-text-accent);--_iui-button-background-color:var(--iui-color-background-accent-muted);--_iui-button-background-color:hsl(var(--iui-color-accent-hsl)/var(--iui-opacity-6));--_iui-button-active-stripe-inset:calc(100% - var(--iui-size-2xs))var(--iui-size-3xs)var(--iui-size-3xs)}.iui-table-paginator-page-button[data-iui-active=true]:after{content:"";inset:var(--_iui-button-active-stripe-inset);background:var(--_iui-button-active-stripe-background);position:absolute}.iui-table-paginator-page-button[data-iui-active=true][disabled],.iui-table-paginator-page-button[data-iui-active=true]:disabled,.iui-table-paginator-page-button[data-iui-active=true][aria-disabled=true]{--_iui-button-active-stripe-background:var(--iui-color-icon-disabled);--_iui-button-text-color:var(--iui-color-text-disabled);--_iui-button-icon-fill:var(--iui-color-icon-disabled)}.iui-table-column-filter{--iui-surface-background-color:var(--iui-color-background);--iui-surface-border-color:var(--iui-color-border-subtle);--iui-surface-border-radius:var(--iui-border-radius-1);--iui-surface-elevation:var(--iui-shadow-1);background-color:var(--iui-surface-background-color);border:1px solid var(--iui-surface-border-color);border-radius:var(--iui-surface-border-radius);box-shadow:var(--iui-surface-elevation);color:var(--iui-color-text);padding:var(--iui-size-s)var(--iui-size-s);flex-direction:column;align-items:flex-end;display:inline-flex}.iui-table-column-filter>.iui-input-container:not(.iui-inline-label){width:100%}.iui-table-column-filter>.iui-input-container,.iui-table-column-filter>.iui-input{margin-bottom:var(--iui-size-s)}.iui-table-column-filter>.iui-button-bar{width:100%;align-content:center;gap:var(--iui-size-xs);display:flex}.iui-table-column-filter>.iui-button-bar>.iui-button:first-of-type{margin-left:auto}