@itwin/itwinui-css 0.47.0 → 0.48.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.
package/css/all.css CHANGED
@@ -1267,30 +1267,38 @@ html.iui-theme-dark{
1267
1267
  width:24px;
1268
1268
  cursor:pointer;
1269
1269
  border-radius:5px;
1270
- background-color:var(--iui-color-swatch-background);
1271
1270
  margin-bottom:4px;
1272
1271
  margin-right:4px;
1273
- box-shadow:inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
1274
- box-shadow:inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
1272
+ position:relative;
1273
+ background-color:var(--iui-color-swatch-background);
1274
+ background-position:0 0, 8px 8px;
1275
+ background-size:16px 16px;
1276
+ background-image:repeating-linear-gradient(45deg, #EEF0F3 25%, transparent 25%, transparent 75%, #EEF0F3 75%, #EEF0F3), repeating-linear-gradient(45deg, #EEF0F3 25%, #C7CCD1 25%, #C7CCD1 75%, #EEF0F3 75%, #EEF0F3);
1277
+ background-image:repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, transparent 25%, transparent 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)), repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, var(--iui-color-background-5) 25%, var(--iui-color-background-5) 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)); }
1275
1278
  @supports (gap: 8px){
1276
1279
  .iui-color-swatch{
1277
1280
  margin-bottom:0;
1278
1281
  margin-right:0; } }
1282
+ .iui-color-swatch::after{
1283
+ content:'';
1284
+ position:absolute;
1285
+ width:inherit;
1286
+ height:inherit;
1287
+ border-radius:inherit;
1288
+ background-color:inherit;
1289
+ box-shadow:inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
1279
1290
  .iui-color-swatch:hover{
1280
- box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
1281
1291
  box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
1282
1292
  .iui-color-swatch:focus-visible{
1283
1293
  outline:2px solid var(--iui-color-foreground-primary);
1284
- outline-offset:0; }
1294
+ outline-offset:1px; }
1285
1295
  @supports not selector(*:focus-visible){
1286
1296
  .iui-color-swatch:focus{
1287
1297
  outline:2px solid var(--iui-color-foreground-primary);
1288
- outline-offset:0; } }
1298
+ outline-offset:1px; } }
1289
1299
  .iui-color-swatch.iui-active{
1290
- box-shadow:0 0 0 2px rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-3)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
1291
1300
  box-shadow:0 0 0 2px rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-3)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
1292
1301
  .iui-color-swatch.iui-active:hover{
1293
- box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), 0 0 0 2px rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-3));
1294
1302
  box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), 0 0 0 2px rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-3)); }
1295
1303
 
1296
1304
  .iui-color-picker-section-label{
@@ -1311,7 +1319,6 @@ html.iui-theme-dark{
1311
1319
  cursor:crosshair;
1312
1320
  width:100%;
1313
1321
  height:209px;
1314
- background-image:linear-gradient(0deg, black, transparent), linear-gradient(90deg, white, var(--iui-color-field-hue));
1315
1322
  background-image:linear-gradient(0deg, black, transparent), linear-gradient(90deg, white, var(--iui-color-field-hue)); }
1316
1323
  .iui-color-field:not(:last-child){
1317
1324
  margin-bottom:6px; }
@@ -1326,12 +1333,10 @@ html.iui-theme-dark{
1326
1333
 
1327
1334
  .iui-opacity-slider .iui-slider-rail{
1328
1335
  height:8px;
1329
- background-image:repeating-linear-gradient(45deg, #EEF0F3 25%, transparent 25%, transparent 75%, #EEF0F3 75%, #EEF0F3), repeating-linear-gradient(45deg, #EEF0F3 25%, #C7CCD1 25%, #C7CCD1 75%, #EEF0F3 75%, #EEF0F3);
1330
1336
  background-position:0 0, 4px 4px;
1331
1337
  background-size:8px 8px;
1332
- background-image:repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, transparent 25%, transparent 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)), repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, var(--iui-color-background-5) 25%, var(--iui-color-background-5) 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3));
1333
- background-position:0 0, 4px 4px;
1334
- background-size:8px 8px; }
1338
+ background-image:repeating-linear-gradient(45deg, #EEF0F3 25%, transparent 25%, transparent 75%, #EEF0F3 75%, #EEF0F3), repeating-linear-gradient(45deg, #EEF0F3 25%, #C7CCD1 25%, #C7CCD1 75%, #EEF0F3 75%, #EEF0F3);
1339
+ background-image:repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, transparent 25%, transparent 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)), repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, var(--iui-color-background-5) 25%, var(--iui-color-background-5) 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)); }
1335
1340
  .iui-opacity-slider .iui-slider-rail::before{
1336
1341
  display:block;
1337
1342
  content:'';
@@ -1351,12 +1356,9 @@ html.iui-theme-dark{
1351
1356
  border-radius:50%;
1352
1357
  transform:translate(-8px, -8px);
1353
1358
  cursor:crosshair;
1354
- box-shadow:white 0 0 0 1px, inset 0 0 0 1px rgba(255, 255, 255, 0.1);
1355
- background-color:var(--iui-color-picker-selected-color);
1356
1359
  box-shadow:rgba(var(--iui-color-foreground-accessory-rgb), var(--iui-opacity-1)) 0 0 0 1px, inset 0 0 0 1px rgba(var(--iui-color-foreground-accessory-rgb), var(--iui-opacity-6));
1357
1360
  background-color:var(--iui-color-picker-selected-color); }
1358
1361
  .iui-color-dot:hover{
1359
- box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
1360
1362
  box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
1361
1363
  .iui-color-dot:focus-visible{
1362
1364
  outline:2px solid var(--iui-color-foreground-primary);
@@ -2534,8 +2536,8 @@ html.iui-theme-dark{
2534
2536
  cursor:not-allowed; }
2535
2537
  .iui-input-container.iui-disabled label{
2536
2538
  cursor:not-allowed; }
2537
- .iui-input-container .iui-checkbox,
2538
- .iui-input-container .iui-radio{
2539
+ .iui-input-container .iui-checkbox-wrapper,
2540
+ .iui-input-container .iui-radio-wrapper{
2539
2541
  min-height:22px; }
2540
2542
  .iui-input-container.iui-inline-label{
2541
2543
  -ms-grid-rows: auto;
@@ -3154,308 +3156,311 @@ html.iui-theme-dark{
3154
3156
  fill:var(--iui-icons-color-actionable-disabled); }
3155
3157
 
3156
3158
  .iui-checkbox{
3159
+ --_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m6.5 12.5-4.5-4.5 1.5-1.5 3 3 6-6 1.5 1.5z" /></svg>');
3160
+ --_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m2.75 6.875h10.5v2.25h-10.5z" /></svg>');
3161
+ --_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg viewBox="0 0 16 16"></svg>');
3162
+ --_iui-checkbox-svg-color:var(--iui-color-foreground-primary);
3163
+ --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
3164
+ --_iui-checkbox-background-color:var(--iui-color-background-1);
3165
+ --_iui-checkbox-mask-image:initial;
3166
+ -webkit-appearance:none;
3167
+ -moz-appearance:none;
3168
+ appearance:none;
3157
3169
  margin:0;
3158
- padding:0;
3159
- border:none;
3160
- vertical-align:baseline;
3161
- display:flex;
3162
- align-items:center;
3163
- font-size:14px;
3164
- width:-webkit-fit-content;
3165
- width:-moz-fit-content;
3166
- width:fit-content;
3167
- -webkit-user-select:none;
3168
- -moz-user-select:none;
3169
- -ms-user-select:none;
3170
- user-select:none;
3170
+ width:16px;
3171
+ height:16px;
3171
3172
  position:relative;
3172
- cursor:pointer;
3173
- color:rgba(0, 0, 0, 0.8);
3174
- color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
3175
- .iui-checkbox > input{
3176
- width:0;
3177
- height:0;
3178
- -webkit-appearance:none;
3179
- -moz-appearance:none;
3180
- appearance:none;
3181
- opacity:0;
3182
- position:absolute; }
3183
- .iui-checkbox.iui-disabled{
3184
- cursor:not-allowed; }
3185
- .iui-checkbox .iui-checkbox-checkmark,
3186
- .iui-checkbox .iui-radio-dot{
3187
- width:16px;
3188
- height:16px;
3173
+ border-radius:3px;
3174
+ background-color:var(--_iui-checkbox-background-color);
3175
+ cursor:pointer; }
3176
+ .iui-checkbox-wrapper{
3189
3177
  margin:0;
3178
+ padding:0;
3179
+ border:none;
3180
+ vertical-align:baseline;
3190
3181
  display:flex;
3191
- flex-shrink:0;
3192
- justify-content:center;
3193
3182
  align-items:center;
3183
+ font-size:14px;
3184
+ width:-webkit-fit-content;
3185
+ width:-moz-fit-content;
3186
+ width:fit-content;
3187
+ -webkit-user-select:none;
3188
+ -moz-user-select:none;
3189
+ -ms-user-select:none;
3190
+ user-select:none;
3194
3191
  position:relative;
3195
- isolation:isolate;
3196
- border-color:rgba(0, 0, 0, 0.4);
3197
- background-color:#FFF;
3198
- border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
3199
- background-color:var(--iui-color-background-1); }
3200
- .iui-checkbox .iui-checkbox-checkmark::after,
3201
- .iui-checkbox .iui-radio-dot::after{
3202
- content:'';
3203
- position:absolute;
3204
- inset:0;
3205
- z-index:-1;
3206
- transition:border-color 0.2s ease-out;
3207
- border-radius:inherit;
3208
- border-style:solid;
3209
- border-width:1px;
3210
- border-color:inherit; }
3211
- .iui-checkbox .iui-checkbox-checkmark svg:not(.iui-radial),
3212
- .iui-checkbox .iui-radio-dot svg:not(.iui-radial){
3213
- width:100%;
3214
- height:100%;
3215
- fill:#008BE1;
3216
- fill:var(--iui-icons-color-primary); }
3217
- .iui-checkbox .iui-checkbox-checkmark svg:not(.iui-radial) > *,
3218
- .iui-checkbox .iui-radio-dot svg:not(.iui-radial) > *{
3219
- opacity:0; }
3220
- @media (prefers-reduced-motion: no-preference){
3221
- .iui-checkbox .iui-checkbox-checkmark svg:not(.iui-radial) > *,
3222
- .iui-checkbox .iui-radio-dot svg:not(.iui-radial) > *{
3223
- transition:opacity 0.2s ease; } }
3224
- .iui-checkbox > .iui-label{
3225
- margin-right:8px;
3226
- display:flex;
3227
- align-items:center; }
3228
- .iui-checkbox > .iui-label svg{
3229
- width:16px;
3230
- height:16px;
3231
- vertical-align:middle;
3232
- fill:rgba(0, 0, 0, 0.8);
3233
- fill:var(--iui-icons-color-actionable); }
3234
- .iui-checkbox .iui-checkbox-checkmark ~ .iui-label,
3235
- .iui-checkbox .iui-radio-dot ~ .iui-label{
3236
- margin-left:8px;
3237
- margin-right:0; }
3238
- .iui-checkbox:hover > input:enabled ~ .iui-checkbox-checkmark,
3239
- .iui-checkbox:hover > input:enabled ~ .iui-radio-dot{
3240
- border-color:rgba(0, 0, 0, 0.8);
3241
- border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
3242
- .iui-checkbox input:checked ~ .iui-checkbox-checkmark,
3243
- .iui-checkbox input:indeterminate ~ .iui-checkbox-checkmark,
3244
- .iui-checkbox input:checked ~ .iui-radio-dot{
3245
- border-color:rgba(0, 0, 0, 0.6);
3246
- border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3)); }
3247
- .iui-checkbox input:checked ~ .iui-checkbox-checkmark .iui-check,
3248
- .iui-checkbox input:indeterminate ~ .iui-checkbox-checkmark .iui-check-partial,
3249
- .iui-checkbox input:checked ~ .iui-radio-dot circle{
3250
- opacity:1; }
3251
- @media (prefers-reduced-motion: no-preference){
3252
- .iui-checkbox input:checked ~ .iui-checkbox-checkmark .iui-check,
3253
- .iui-checkbox input:indeterminate ~ .iui-checkbox-checkmark .iui-check-partial,
3254
- .iui-checkbox input:checked ~ .iui-radio-dot circle{
3255
- transition:opacity 0.2s ease; } }
3256
- .iui-checkbox input:enabled:focus ~ .iui-checkbox-checkmark,
3257
- .iui-checkbox input:enabled:focus ~ .iui-radio-dot{
3258
- outline:2px solid #008BE1;
3192
+ cursor:pointer;
3193
+ color:rgba(0, 0, 0, 0.8);
3194
+ color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
3195
+ gap:8px; }
3196
+ .iui-checkbox-wrapper > * + *{
3197
+ margin-left:8px; }
3198
+ @supports (gap: 8px){
3199
+ .iui-checkbox-wrapper > * + *{
3200
+ margin-left:0; } }
3201
+ .iui-checkbox-wrapper.iui-loading{
3202
+ cursor:wait;
3203
+ color:var(--iui-text-color-muted); }
3204
+ .iui-checkbox-wrapper > .iui-checkbox-label,
3205
+ .iui-checkbox-wrapper > .iui-radio-label{
3206
+ display:flex;
3207
+ align-items:center; }
3208
+ .iui-checkbox-wrapper > .iui-checkbox-label svg,
3209
+ .iui-checkbox-wrapper > .iui-radio-label svg{
3210
+ width:16px;
3211
+ height:16px;
3212
+ vertical-align:middle;
3213
+ fill:currentColor; }
3214
+ .iui-checkbox-wrapper.iui-disabled{
3215
+ cursor:not-allowed;
3216
+ color:var(--iui-text-color-muted); }
3217
+ .iui-checkbox-wrapper.iui-disabled svg{
3218
+ fill:var(--iui-icons-color-actionable-disabled); }
3219
+ .iui-checkbox-wrapper.iui-positive{
3220
+ color:#53A21A;
3221
+ color:var(--iui-color-foreground-positive); }
3222
+ .iui-checkbox-wrapper.iui-warning{
3223
+ color:#F18B12;
3224
+ color:var(--iui-color-foreground-warning); }
3225
+ .iui-checkbox-wrapper.iui-negative{
3226
+ color:#D30A0A;
3227
+ color:var(--iui-color-foreground-negative); }
3228
+ .iui-checkbox::before{
3229
+ content:'';
3230
+ position:absolute;
3231
+ inset:0;
3232
+ transition:border-color 0.2s ease-out;
3233
+ border-radius:inherit;
3234
+ border-style:solid;
3235
+ border-width:1px;
3236
+ border-color:var(--_iui-checkbox-border-color); }
3237
+ .iui-checkbox::after{
3238
+ content:'';
3239
+ position:absolute;
3240
+ inset:0;
3241
+ background-color:var(--_iui-checkbox-svg-color);
3242
+ -webkit-mask:var(--_iui-checkbox-mask-image) no-repeat center;
3243
+ mask:var(--_iui-checkbox-mask-image) no-repeat center; }
3244
+ .iui-checkbox:not(:checked){
3245
+ --_iui-checkbox-mask-image:var(--_iui-checkbox-unchecked-svg); }
3246
+ .iui-checkbox:checked{
3247
+ --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3));
3248
+ --_iui-checkbox-mask-image:var(--_iui-checkbox-checkmark-svg); }
3249
+ .iui-checkbox:indeterminate{
3250
+ --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3));
3251
+ --_iui-checkbox-mask-image:var(--_iui-checkbox-indeterminate-svg); }
3252
+ .iui-checkbox:hover{
3253
+ --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
3254
+ .iui-checkbox:focus-visible{
3259
3255
  outline:2px solid var(--iui-color-foreground-primary);
3260
3256
  outline-offset:-1px; }
3261
- .iui-checkbox input:enabled:focus:not(:focus-visible) ~ .iui-checkbox-checkmark,
3262
- .iui-checkbox input:enabled:focus:not(:focus-visible) ~ .iui-radio-dot{
3263
- outline:none; }
3264
- .iui-checkbox input:disabled ~ .iui-checkbox-checkmark,
3265
- .iui-checkbox input:disabled ~ .iui-radio-dot{
3266
- cursor:not-allowed;
3267
- background-color:#EEF0F3;
3268
- border-color:#EEF0F3;
3269
- background-color:var(--iui-color-background-disabled);
3270
- border-color:var(--iui-color-background-disabled); }
3271
- .iui-checkbox input:disabled ~ .iui-checkbox-checkmark svg,
3272
- .iui-checkbox input:disabled ~ .iui-radio-dot svg{
3273
- fill:rgba(0, 0, 0, 0.2);
3274
- fill:var(--iui-icons-color-actionable-disabled); }
3275
- .iui-checkbox input:disabled ~ .iui-label{
3276
- cursor:not-allowed;
3277
- color:rgba(0, 0, 0, 0.4);
3278
- color:var(--iui-text-color-muted); }
3279
- .iui-checkbox input:disabled ~ .iui-label svg{
3280
- fill:rgba(0, 0, 0, 0.2);
3281
- fill:var(--iui-icons-color-actionable-disabled); }
3282
- .iui-checkbox.iui-positive{
3283
- color:#53A21A;
3284
- color:var(--iui-color-foreground-positive); }
3285
- .iui-checkbox.iui-warning{
3286
- color:#F18B12;
3287
- color:var(--iui-color-foreground-warning); }
3288
- .iui-checkbox.iui-negative{
3289
- color:#D30A0A;
3290
- color:var(--iui-color-foreground-negative); }
3291
- .iui-checkbox .iui-checkbox-checkmark{
3292
- border-radius:3px; }
3257
+ @supports not selector(*:focus-visible){
3258
+ .iui-checkbox:focus{
3259
+ outline:2px solid var(--iui-color-foreground-primary);
3260
+ outline-offset:-1px; } }
3261
+ .iui-checkbox.iui-checkbox-visibility{
3262
+ --_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 2.99051a8.81883 8.81883 0 0 0 -8 4.95062 8.74664 8.74664 0 0 0 8 5.06836 8.63266 8.63266 0 0 0 8-5.06836 8.83631 8.83631 0 0 0 -8-4.95062zm-1.31445 1.86981a1.47663 1.47663 0 1 1 -1.47663 1.47668 1.47665 1.47665 0 0 1 1.47663-1.47668zm1.31445 6.64917a7.17486 7.17486 0 0 1 -6.30475-3.55237 7.4952 7.4952 0 0 1 2.81475-2.6336 3.83956 3.83956 0 1 0 6.98126.00244 7.522 7.522 0 0 1 2.81774 2.63916 7.09785 7.09785 0 0 1 -6.309 3.54437z" /></svg>');
3263
+ --_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 3v7.9a4.01179 4.01179 0 0 0 4-4 6.7509 6.7509 0 0 0 -.2-1.4l.1.1a6.89429 6.89429 0 0 1 2.4 2.4 8.39088 8.39088 0 0 1 -2.3 2.3 6.89412 6.89412 0 0 1 -3.9 1.2c-.03345 0-.06653-.00677-.1-.0072v1.5072a8.90686 8.90686 0 0 0 8-5 8.90686 8.90686 0 0 0 -8-5z" opacity=".33" /><path d="m8 0a1 1 0 0 0 -1 1v2.07135a8.91637 8.91637 0 0 0 -7 4.92865 8.91637 8.91637 0 0 0 7 4.92865v2.07135a1 1 0 0 0 2 0v-14a1 1 0 0 0 -1-1zm-1.5 4.9a1.55426 1.55426 0 0 1 .5.087v2.81451a1.40746 1.40746 0 0 1 -.5.09849 1.538 1.538 0 0 1 -1.5-1.5 1.53794 1.53794 0 0 1 1.5-1.5zm-2.3 5.4a6.97279 6.97279 0 0 1 -2.5-2.3 6.89429 6.89429 0 0 1 2.4-2.4c.1 0 .1-.1.2-.1a3.194 3.194 0 0 0 -.3 1.4 4.0047 4.0047 0 0 0 3 3.857v.65289a6.37491 6.37491 0 0 1 -2.8-1.10989z" /></svg>');
3264
+ --_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m1.70671 12.879 11.17218-11.17219 1.4142 1.4142-11.17218 11.17218zm.99329-1.679 1.1-1.1a5.06317 5.06317 0 0 1 -2-2.1 7.48268 7.48268 0 0 1 6.2-3.5 4.86877 4.86877 0 0 1 1.2.1l1.3-1.3a10.07431 10.07431 0 0 0 -2.5-.3 8.84129 8.84129 0 0 0 -8 5 8.42455 8.42455 0 0 0 2.7 3.2zm10.7-6.4-1.1 1.1a7.08625 7.08625 0 0 1 2 2.1 7.50323 7.50323 0 0 1 -6.2 3.5 8.31665 8.31665 0 0 1 -1.3-.2l-1.3 1.3a8.909 8.909 0 0 0 6.4-.5 9.04344 9.04344 0 0 0 4.1-4.1 9.168 9.168 0 0 0 -2.6-3.2z" /></svg>');
3265
+ --_iui-checkbox-border-color:transparent;
3266
+ --_iui-checkbox-background-color:transparent; }
3267
+ .iui-checkbox.iui-checkbox-visibility:where(:not(:checked):not(:indeterminate)){
3268
+ --_iui-checkbox-svg-color:var(--iui-icons-color-actionable); }
3269
+ .iui-checkbox.iui-checkbox-visibility:where(:hover){
3270
+ --_iui-checkbox-border-color:transparent;
3271
+ --_iui-checkbox-background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6)); }
3272
+ .iui-checkbox:disabled{
3273
+ --_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
3274
+ --_iui-checkbox-border-color:var(--iui-color-background-disabled);
3275
+ --_iui-checkbox-background-color:var(--iui-color-background-disabled);
3276
+ cursor:not-allowed; }
3293
3277
  .iui-checkbox.iui-loading{
3278
+ --_iui-checkbox-border-color:transparent;
3279
+ --_iui-checkbox-background-color:transparent;
3280
+ opacity:0;
3281
+ position:absolute;
3294
3282
  cursor:wait; }
3295
- .iui-checkbox.iui-loading input ~ .iui-checkbox-checkmark{
3296
- border-color:transparent;
3297
- background-color:transparent; }
3298
- .iui-checkbox.iui-loading input:disabled ~ .iui-checkbox-checkmark{
3299
- cursor:wait; }
3300
- .iui-checkbox.iui-loading input:disabled ~ .iui-label{
3301
- cursor:wait; }
3302
- .iui-checkbox-visibility:hover > input:enabled ~ .iui-checkbox-checkmark{
3303
- background-color:rgba(0, 0, 0, 0.1);
3304
- background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6)); }
3305
- .iui-checkbox-visibility input ~ .iui-checkbox-checkmark::after,
3306
- .iui-checkbox-visibility:hover > input:enabled ~ .iui-checkbox-checkmark::after{
3307
- border:none; }
3308
- .iui-checkbox-visibility input ~ .iui-checkbox-checkmark{
3309
- background-color:transparent; }
3310
- .iui-checkbox-visibility input:checked ~ .iui-checkbox-checkmark .iui-uncheck,
3311
- .iui-checkbox-visibility input:indeterminate ~ .iui-checkbox-checkmark .iui-uncheck{
3312
- opacity:0; }
3313
- .iui-checkbox-visibility input ~ .iui-checkbox-checkmark .iui-uncheck{
3314
- opacity:1;
3315
- transition:opacity 0.2s ease;
3316
- fill:rgba(0, 0, 0, 0.8);
3317
- fill:var(--iui-icons-color-actionable); }
3318
- .iui-checkbox-visibility input:disabled ~ .iui-checkbox-checkmark .iui-uncheck{
3319
- fill:rgba(0, 0, 0, 0.2);
3320
- fill:var(--iui-icons-color-actionable-disabled); }
3321
3283
 
3322
3284
  .iui-radio{
3285
+ --_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m6.5 12.5-4.5-4.5 1.5-1.5 3 3 6-6 1.5 1.5z" /></svg>');
3286
+ --_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m2.75 6.875h10.5v2.25h-10.5z" /></svg>');
3287
+ --_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg viewBox="0 0 16 16"></svg>');
3288
+ --_iui-checkbox-svg-color:var(--iui-color-foreground-primary);
3289
+ --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
3290
+ --_iui-checkbox-background-color:var(--iui-color-background-1);
3291
+ --_iui-checkbox-mask-image:initial;
3292
+ -webkit-appearance:none;
3293
+ -moz-appearance:none;
3294
+ appearance:none;
3323
3295
  margin:0;
3324
- padding:0;
3325
- border:none;
3326
- vertical-align:baseline;
3327
- display:flex;
3328
- align-items:center;
3329
- font-size:14px;
3330
- width:-webkit-fit-content;
3331
- width:-moz-fit-content;
3332
- width:fit-content;
3333
- -webkit-user-select:none;
3334
- -moz-user-select:none;
3335
- -ms-user-select:none;
3336
- user-select:none;
3296
+ width:16px;
3297
+ height:16px;
3337
3298
  position:relative;
3299
+ border-radius:3px;
3300
+ background-color:var(--_iui-checkbox-background-color);
3338
3301
  cursor:pointer;
3339
- color:rgba(0, 0, 0, 0.8);
3340
- color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
3341
- .iui-radio > input{
3342
- width:0;
3343
- height:0;
3344
- -webkit-appearance:none;
3345
- -moz-appearance:none;
3346
- appearance:none;
3347
- opacity:0;
3348
- position:absolute; }
3349
- .iui-radio.iui-disabled{
3350
- cursor:not-allowed; }
3351
- .iui-radio .iui-checkbox-checkmark,
3352
- .iui-radio .iui-radio-dot{
3353
- width:16px;
3354
- height:16px;
3302
+ border-radius:50%; }
3303
+ .iui-radio-wrapper{
3355
3304
  margin:0;
3305
+ padding:0;
3306
+ border:none;
3307
+ vertical-align:baseline;
3356
3308
  display:flex;
3357
- flex-shrink:0;
3358
- justify-content:center;
3359
3309
  align-items:center;
3310
+ font-size:14px;
3311
+ width:-webkit-fit-content;
3312
+ width:-moz-fit-content;
3313
+ width:fit-content;
3314
+ -webkit-user-select:none;
3315
+ -moz-user-select:none;
3316
+ -ms-user-select:none;
3317
+ user-select:none;
3360
3318
  position:relative;
3361
- isolation:isolate;
3362
- border-color:rgba(0, 0, 0, 0.4);
3363
- background-color:#FFF;
3364
- border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
3365
- background-color:var(--iui-color-background-1); }
3366
- .iui-radio .iui-checkbox-checkmark::after,
3367
- .iui-radio .iui-radio-dot::after{
3368
- content:'';
3369
- position:absolute;
3370
- inset:0;
3371
- z-index:-1;
3372
- transition:border-color 0.2s ease-out;
3373
- border-radius:inherit;
3374
- border-style:solid;
3375
- border-width:1px;
3376
- border-color:inherit; }
3377
- .iui-radio .iui-checkbox-checkmark svg:not(.iui-radial),
3378
- .iui-radio .iui-radio-dot svg:not(.iui-radial){
3379
- width:100%;
3380
- height:100%;
3381
- fill:#008BE1;
3382
- fill:var(--iui-icons-color-primary); }
3383
- .iui-radio .iui-checkbox-checkmark svg:not(.iui-radial) > *,
3384
- .iui-radio .iui-radio-dot svg:not(.iui-radial) > *{
3385
- opacity:0; }
3386
- @media (prefers-reduced-motion: no-preference){
3387
- .iui-radio .iui-checkbox-checkmark svg:not(.iui-radial) > *,
3388
- .iui-radio .iui-radio-dot svg:not(.iui-radial) > *{
3389
- transition:opacity 0.2s ease; } }
3390
- .iui-radio > .iui-label{
3391
- margin-right:8px;
3319
+ cursor:pointer;
3320
+ color:rgba(0, 0, 0, 0.8);
3321
+ color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
3322
+ gap:8px; }
3323
+ .iui-radio-wrapper > * + *{
3324
+ margin-left:8px; }
3325
+ @supports (gap: 8px){
3326
+ .iui-radio-wrapper > * + *{
3327
+ margin-left:0; } }
3328
+ .iui-radio-wrapper.iui-loading{
3329
+ cursor:wait;
3330
+ color:var(--iui-text-color-muted); }
3331
+ .iui-radio-wrapper > .iui-checkbox-label,
3332
+ .iui-radio-wrapper > .iui-radio-label{
3333
+ display:flex;
3334
+ align-items:center; }
3335
+ .iui-radio-wrapper > .iui-checkbox-label svg,
3336
+ .iui-radio-wrapper > .iui-radio-label svg{
3337
+ width:16px;
3338
+ height:16px;
3339
+ vertical-align:middle;
3340
+ fill:currentColor; }
3341
+ .iui-radio-wrapper.iui-disabled{
3342
+ cursor:not-allowed;
3343
+ color:var(--iui-text-color-muted); }
3344
+ .iui-radio-wrapper.iui-disabled svg{
3345
+ fill:var(--iui-icons-color-actionable-disabled); }
3346
+ .iui-radio-wrapper.iui-positive{
3347
+ color:#53A21A;
3348
+ color:var(--iui-color-foreground-positive); }
3349
+ .iui-radio-wrapper.iui-warning{
3350
+ color:#F18B12;
3351
+ color:var(--iui-color-foreground-warning); }
3352
+ .iui-radio-wrapper.iui-negative{
3353
+ color:#D30A0A;
3354
+ color:var(--iui-color-foreground-negative); }
3355
+ .iui-radio-wrapper{
3356
+ margin:0;
3357
+ padding:0;
3358
+ border:none;
3359
+ vertical-align:baseline;
3392
3360
  display:flex;
3393
- align-items:center; }
3394
- .iui-radio > .iui-label svg{
3395
- width:16px;
3396
- height:16px;
3397
- vertical-align:middle;
3398
- fill:rgba(0, 0, 0, 0.8);
3399
- fill:var(--iui-icons-color-actionable); }
3400
- .iui-radio .iui-checkbox-checkmark ~ .iui-label,
3401
- .iui-radio .iui-radio-dot ~ .iui-label{
3402
- margin-left:8px;
3403
- margin-right:0; }
3404
- .iui-radio:hover > input:enabled ~ .iui-checkbox-checkmark,
3405
- .iui-radio:hover > input:enabled ~ .iui-radio-dot{
3406
- border-color:rgba(0, 0, 0, 0.8);
3407
- border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
3408
- .iui-radio input:checked ~ .iui-checkbox-checkmark,
3409
- .iui-radio input:indeterminate ~ .iui-checkbox-checkmark,
3410
- .iui-radio input:checked ~ .iui-radio-dot{
3411
- border-color:rgba(0, 0, 0, 0.6);
3412
- border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3)); }
3413
- .iui-radio input:checked ~ .iui-checkbox-checkmark .iui-check,
3414
- .iui-radio input:indeterminate ~ .iui-checkbox-checkmark .iui-check-partial,
3415
- .iui-radio input:checked ~ .iui-radio-dot circle{
3416
- opacity:1; }
3417
- @media (prefers-reduced-motion: no-preference){
3418
- .iui-radio input:checked ~ .iui-checkbox-checkmark .iui-check,
3419
- .iui-radio input:indeterminate ~ .iui-checkbox-checkmark .iui-check-partial,
3420
- .iui-radio input:checked ~ .iui-radio-dot circle{
3421
- transition:opacity 0.2s ease; } }
3422
- .iui-radio input:enabled:focus ~ .iui-checkbox-checkmark,
3423
- .iui-radio input:enabled:focus ~ .iui-radio-dot{
3424
- outline:2px solid #008BE1;
3361
+ align-items:center;
3362
+ font-size:14px;
3363
+ width:-webkit-fit-content;
3364
+ width:-moz-fit-content;
3365
+ width:fit-content;
3366
+ -webkit-user-select:none;
3367
+ -moz-user-select:none;
3368
+ -ms-user-select:none;
3369
+ user-select:none;
3370
+ position:relative;
3371
+ cursor:pointer;
3372
+ color:rgba(0, 0, 0, 0.8);
3373
+ color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
3374
+ gap:8px; }
3375
+ .iui-radio-wrapper > * + *{
3376
+ margin-left:8px; }
3377
+ @supports (gap: 8px){
3378
+ .iui-radio-wrapper > * + *{
3379
+ margin-left:0; } }
3380
+ .iui-radio-wrapper.iui-loading{
3381
+ cursor:wait;
3382
+ color:var(--iui-text-color-muted); }
3383
+ .iui-radio-wrapper > .iui-checkbox-label,
3384
+ .iui-radio-wrapper > .iui-radio-label{
3385
+ display:flex;
3386
+ align-items:center; }
3387
+ .iui-radio-wrapper > .iui-checkbox-label svg,
3388
+ .iui-radio-wrapper > .iui-radio-label svg{
3389
+ width:16px;
3390
+ height:16px;
3391
+ vertical-align:middle;
3392
+ fill:currentColor; }
3393
+ .iui-radio-wrapper.iui-disabled{
3394
+ cursor:not-allowed;
3395
+ color:var(--iui-text-color-muted); }
3396
+ .iui-radio-wrapper.iui-disabled svg{
3397
+ fill:var(--iui-icons-color-actionable-disabled); }
3398
+ .iui-radio-wrapper.iui-positive{
3399
+ color:#53A21A;
3400
+ color:var(--iui-color-foreground-positive); }
3401
+ .iui-radio-wrapper.iui-warning{
3402
+ color:#F18B12;
3403
+ color:var(--iui-color-foreground-warning); }
3404
+ .iui-radio-wrapper.iui-negative{
3405
+ color:#D30A0A;
3406
+ color:var(--iui-color-foreground-negative); }
3407
+ .iui-radio::before{
3408
+ content:'';
3409
+ position:absolute;
3410
+ inset:0;
3411
+ transition:border-color 0.2s ease-out;
3412
+ border-radius:inherit;
3413
+ border-style:solid;
3414
+ border-width:1px;
3415
+ border-color:var(--_iui-checkbox-border-color); }
3416
+ .iui-radio::after{
3417
+ content:'';
3418
+ position:absolute;
3419
+ inset:0;
3420
+ background-color:var(--_iui-checkbox-svg-color);
3421
+ -webkit-mask:var(--_iui-checkbox-mask-image) no-repeat center;
3422
+ mask:var(--_iui-checkbox-mask-image) no-repeat center; }
3423
+ .iui-radio:not(:checked){
3424
+ --_iui-checkbox-mask-image:var(--_iui-checkbox-unchecked-svg); }
3425
+ .iui-radio:checked{
3426
+ --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3));
3427
+ --_iui-checkbox-mask-image:var(--_iui-checkbox-checkmark-svg); }
3428
+ .iui-radio:indeterminate{
3429
+ --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3));
3430
+ --_iui-checkbox-mask-image:var(--_iui-checkbox-indeterminate-svg); }
3431
+ .iui-radio:hover{
3432
+ --_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
3433
+ .iui-radio:focus-visible{
3425
3434
  outline:2px solid var(--iui-color-foreground-primary);
3426
3435
  outline-offset:-1px; }
3427
- .iui-radio input:enabled:focus:not(:focus-visible) ~ .iui-checkbox-checkmark,
3428
- .iui-radio input:enabled:focus:not(:focus-visible) ~ .iui-radio-dot{
3429
- outline:none; }
3430
- .iui-radio input:disabled ~ .iui-checkbox-checkmark,
3431
- .iui-radio input:disabled ~ .iui-radio-dot{
3432
- cursor:not-allowed;
3433
- background-color:#EEF0F3;
3434
- border-color:#EEF0F3;
3435
- background-color:var(--iui-color-background-disabled);
3436
- border-color:var(--iui-color-background-disabled); }
3437
- .iui-radio input:disabled ~ .iui-checkbox-checkmark svg,
3438
- .iui-radio input:disabled ~ .iui-radio-dot svg{
3439
- fill:rgba(0, 0, 0, 0.2);
3440
- fill:var(--iui-icons-color-actionable-disabled); }
3441
- .iui-radio input:disabled ~ .iui-label{
3442
- cursor:not-allowed;
3443
- color:rgba(0, 0, 0, 0.4);
3444
- color:var(--iui-text-color-muted); }
3445
- .iui-radio input:disabled ~ .iui-label svg{
3446
- fill:rgba(0, 0, 0, 0.2);
3447
- fill:var(--iui-icons-color-actionable-disabled); }
3448
- .iui-radio.iui-positive{
3449
- color:#53A21A;
3450
- color:var(--iui-color-foreground-positive); }
3451
- .iui-radio.iui-warning{
3452
- color:#F18B12;
3453
- color:var(--iui-color-foreground-warning); }
3454
- .iui-radio.iui-negative{
3455
- color:#D30A0A;
3456
- color:var(--iui-color-foreground-negative); }
3457
- .iui-radio .iui-radio-dot{
3458
- border-radius:50%; }
3436
+ @supports not selector(*:focus-visible){
3437
+ .iui-radio:focus{
3438
+ outline:2px solid var(--iui-color-foreground-primary);
3439
+ outline-offset:-1px; } }
3440
+ .iui-radio.iui-checkbox-visibility{
3441
+ --_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 2.99051a8.81883 8.81883 0 0 0 -8 4.95062 8.74664 8.74664 0 0 0 8 5.06836 8.63266 8.63266 0 0 0 8-5.06836 8.83631 8.83631 0 0 0 -8-4.95062zm-1.31445 1.86981a1.47663 1.47663 0 1 1 -1.47663 1.47668 1.47665 1.47665 0 0 1 1.47663-1.47668zm1.31445 6.64917a7.17486 7.17486 0 0 1 -6.30475-3.55237 7.4952 7.4952 0 0 1 2.81475-2.6336 3.83956 3.83956 0 1 0 6.98126.00244 7.522 7.522 0 0 1 2.81774 2.63916 7.09785 7.09785 0 0 1 -6.309 3.54437z" /></svg>');
3442
+ --_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 3v7.9a4.01179 4.01179 0 0 0 4-4 6.7509 6.7509 0 0 0 -.2-1.4l.1.1a6.89429 6.89429 0 0 1 2.4 2.4 8.39088 8.39088 0 0 1 -2.3 2.3 6.89412 6.89412 0 0 1 -3.9 1.2c-.03345 0-.06653-.00677-.1-.0072v1.5072a8.90686 8.90686 0 0 0 8-5 8.90686 8.90686 0 0 0 -8-5z" opacity=".33" /><path d="m8 0a1 1 0 0 0 -1 1v2.07135a8.91637 8.91637 0 0 0 -7 4.92865 8.91637 8.91637 0 0 0 7 4.92865v2.07135a1 1 0 0 0 2 0v-14a1 1 0 0 0 -1-1zm-1.5 4.9a1.55426 1.55426 0 0 1 .5.087v2.81451a1.40746 1.40746 0 0 1 -.5.09849 1.538 1.538 0 0 1 -1.5-1.5 1.53794 1.53794 0 0 1 1.5-1.5zm-2.3 5.4a6.97279 6.97279 0 0 1 -2.5-2.3 6.89429 6.89429 0 0 1 2.4-2.4c.1 0 .1-.1.2-.1a3.194 3.194 0 0 0 -.3 1.4 4.0047 4.0047 0 0 0 3 3.857v.65289a6.37491 6.37491 0 0 1 -2.8-1.10989z" /></svg>');
3443
+ --_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m1.70671 12.879 11.17218-11.17219 1.4142 1.4142-11.17218 11.17218zm.99329-1.679 1.1-1.1a5.06317 5.06317 0 0 1 -2-2.1 7.48268 7.48268 0 0 1 6.2-3.5 4.86877 4.86877 0 0 1 1.2.1l1.3-1.3a10.07431 10.07431 0 0 0 -2.5-.3 8.84129 8.84129 0 0 0 -8 5 8.42455 8.42455 0 0 0 2.7 3.2zm10.7-6.4-1.1 1.1a7.08625 7.08625 0 0 1 2 2.1 7.50323 7.50323 0 0 1 -6.2 3.5 8.31665 8.31665 0 0 1 -1.3-.2l-1.3 1.3a8.909 8.909 0 0 0 6.4-.5 9.04344 9.04344 0 0 0 4.1-4.1 9.168 9.168 0 0 0 -2.6-3.2z" /></svg>');
3444
+ --_iui-checkbox-border-color:transparent;
3445
+ --_iui-checkbox-background-color:transparent; }
3446
+ .iui-radio.iui-checkbox-visibility:where(:not(:checked):not(:indeterminate)){
3447
+ --_iui-checkbox-svg-color:var(--iui-icons-color-actionable); }
3448
+ .iui-radio.iui-checkbox-visibility:where(:hover){
3449
+ --_iui-checkbox-border-color:transparent;
3450
+ --_iui-checkbox-background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6)); }
3451
+ .iui-radio:disabled{
3452
+ --_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
3453
+ --_iui-checkbox-border-color:var(--iui-color-background-disabled);
3454
+ --_iui-checkbox-background-color:var(--iui-color-background-disabled);
3455
+ cursor:not-allowed; }
3456
+ .iui-radio.iui-loading{
3457
+ --_iui-checkbox-border-color:transparent;
3458
+ --_iui-checkbox-background-color:transparent;
3459
+ opacity:0;
3460
+ position:absolute;
3461
+ cursor:wait; }
3462
+ .iui-radio:checked{
3463
+ --_iui-checkbox-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" ><circle cx="8" cy="8" r="4" /></svg>'); }
3459
3464
 
3460
3465
  .iui-radio-tile-container{
3461
3466
  display:inline-flex;
@@ -6696,7 +6701,8 @@ a.iui-tag{
6696
6701
  .iui-tree-node{
6697
6702
  display:flex;
6698
6703
  cursor:pointer;
6699
- padding:0 8px; }
6704
+ padding:0 8px;
6705
+ align-items:center; }
6700
6706
  .iui-tree-node-checkbox{
6701
6707
  margin-right:8px; }
6702
6708
  .iui-tree-node-content{