@box/blueprint-web 12.48.0 → 12.49.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.
|
@@ -2,6 +2,8 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
|
2
2
|
import { SelectItemCheck, SelectItem, ComboboxItem, useComboboxStore, useSelectStore, PopoverAnchor, Combobox as Combobox$1, ComboboxCancel, SelectList, ComboboxPopover } from '@ariakit/react';
|
|
3
3
|
import { SelectRenderer } from '@ariakit/react-core/select/select-renderer';
|
|
4
4
|
import { Checkmark, XMark } from '@box/blueprint-web-assets/icons/Fill';
|
|
5
|
+
import { CheckmarkCircle } from '@box/blueprint-web-assets/icons/Medium';
|
|
6
|
+
import { bpSize050 } from '@box/blueprint-web-assets/tokens/tokens';
|
|
5
7
|
import clsx from 'clsx';
|
|
6
8
|
import React__default, { forwardRef, useMemo, useRef, useCallback, useEffect } from 'react';
|
|
7
9
|
import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
|
|
@@ -449,6 +451,9 @@ const RootInner = ({
|
|
|
449
451
|
};
|
|
450
452
|
const Root = /*#__PURE__*/forwardRef(RootInner);
|
|
451
453
|
const Indicator = /*#__PURE__*/forwardRef((_, ref) => {
|
|
454
|
+
const {
|
|
455
|
+
enableModernizedComponents
|
|
456
|
+
} = useBlueprintModernization();
|
|
452
457
|
return jsx(SelectItemCheck, {
|
|
453
458
|
ref: ref,
|
|
454
459
|
className: styles.indicator,
|
|
@@ -457,7 +462,11 @@ const Indicator = /*#__PURE__*/forwardRef((_, ref) => {
|
|
|
457
462
|
width: 'none',
|
|
458
463
|
height: 'none'
|
|
459
464
|
},
|
|
460
|
-
children: jsx(
|
|
465
|
+
children: enableModernizedComponents ? jsx(CheckmarkCircle, {
|
|
466
|
+
className: styles.indicatorIcon,
|
|
467
|
+
height: bpSize050,
|
|
468
|
+
width: bpSize050
|
|
469
|
+
}) : jsx(Checkmark, {
|
|
461
470
|
className: styles.indicatorIcon
|
|
462
471
|
})
|
|
463
472
|
});
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import '../index.css';
|
|
2
|
-
var styles = {"container":"bp_combobox_module_container--
|
|
2
|
+
var styles = {"container":"bp_combobox_module_container--2cc49","popover":"bp_combobox_module_popover--2cc49","disabled":"bp_combobox_module_disabled--2cc49","label":"bp_combobox_module_label--2cc49","hiddenLabel":"bp_combobox_module_hiddenLabel--2cc49","comboboxContainer":"bp_combobox_module_comboboxContainer--2cc49","withComboboxButtons":"bp_combobox_module_withComboboxButtons--2cc49","error":"bp_combobox_module_error--2cc49","textInputWrapper":"bp_combobox_module_textInputWrapper--2cc49","textInput":"bp_combobox_module_textInput--2cc49","errorIcon":"bp_combobox_module_errorIcon--2cc49","comboboxButtons":"bp_combobox_module_comboboxButtons--2cc49","withChips":"bp_combobox_module_withChips--2cc49","inlineError":"bp_combobox_module_inlineError--2cc49","option":"bp_combobox_module_option--2cc49","indicator":"bp_combobox_module_indicator--2cc49","indicatorIcon":"bp_combobox_module_indicatorIcon--2cc49","optionWithIndicator":"bp_combobox_module_optionWithIndicator--2cc49","loadingIndicator":"bp_combobox_module_loadingIndicator--2cc49","noResultOption":"bp_combobox_module_noResultOption--2cc49"};
|
|
3
3
|
|
|
4
4
|
export { styles as default };
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
2
|
import clsx from 'clsx';
|
|
3
3
|
import { forwardRef } from 'react';
|
|
4
|
+
import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
|
|
4
5
|
import { InlineError } from '../primitives/inline-error/inline-error.js';
|
|
5
6
|
import { useLabelable } from '../util-components/labelable/useLabelable.js';
|
|
6
7
|
import { ComboboxGroupCombobox } from './combobox-group-combobox.js';
|
|
@@ -21,6 +22,9 @@ const Root = /*#__PURE__*/forwardRef(({
|
|
|
21
22
|
isDisabled,
|
|
22
23
|
subcomponentId
|
|
23
24
|
} = useComboboxGroupContext();
|
|
25
|
+
const {
|
|
26
|
+
enableModernizedComponents
|
|
27
|
+
} = useBlueprintModernization();
|
|
24
28
|
const selectHasError = !!errors.select;
|
|
25
29
|
const comboboxHasError = !!errors.combobox;
|
|
26
30
|
const Label = useLabelable(label, subcomponentId);
|
|
@@ -30,6 +34,7 @@ const Root = /*#__PURE__*/forwardRef(({
|
|
|
30
34
|
className: clsx(styles.container, {
|
|
31
35
|
[styles.disabled]: isDisabled
|
|
32
36
|
}),
|
|
37
|
+
"data-modern": enableModernizedComponents,
|
|
33
38
|
children: [jsx(Label, {
|
|
34
39
|
className: styles.label,
|
|
35
40
|
hideLabel: hideLabel
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import '../index.css';
|
|
2
|
-
var styles = {"container":"bp_combobox_group_module_container--
|
|
2
|
+
var styles = {"container":"bp_combobox_group_module_container--71411","trailing":"bp_combobox_group_module_trailing--71411","leading":"bp_combobox_group_module_leading--71411","comboboxGroupcontainer":"bp_combobox_group_module_comboboxGroupcontainer--71411","disabled":"bp_combobox_group_module_disabled--71411","label":"bp_combobox_group_module_label--71411","errorCombobox":"bp_combobox_group_module_errorCombobox--71411","errorSelect":"bp_combobox_group_module_errorSelect--71411","selectHasFocus":"bp_combobox_group_module_selectHasFocus--71411","comboboxHasFocus":"bp_combobox_group_module_comboboxHasFocus--71411"};
|
|
3
3
|
|
|
4
4
|
export { styles as default };
|
package/dist/lib-esm/index.css
CHANGED
|
@@ -2213,7 +2213,7 @@
|
|
|
2213
2213
|
margin-block-start:var(--text-area-container-row-gap);
|
|
2214
2214
|
}
|
|
2215
2215
|
|
|
2216
|
-
.bp_combobox_module_container--
|
|
2216
|
+
.bp_combobox_module_container--2cc49[data-modern=false]{
|
|
2217
2217
|
--max-lines:3;
|
|
2218
2218
|
--input-height:var(--space-5);
|
|
2219
2219
|
--chip-height:var(--space-7);
|
|
@@ -2268,7 +2268,7 @@
|
|
|
2268
2268
|
--combobox-button-spacing:var(--space-2);
|
|
2269
2269
|
}
|
|
2270
2270
|
|
|
2271
|
-
.bp_combobox_module_container--
|
|
2271
|
+
.bp_combobox_module_container--2cc49[data-modern=true]{
|
|
2272
2272
|
--max-lines:3;
|
|
2273
2273
|
--bp-innershadow-01:var(--innershadow-1);
|
|
2274
2274
|
--bp-input-height:var(--bp-space-050);
|
|
@@ -2329,7 +2329,7 @@
|
|
|
2329
2329
|
--combobox-button-spacing:var(--bp-space-020);
|
|
2330
2330
|
}
|
|
2331
2331
|
|
|
2332
|
-
.bp_combobox_module_popover--
|
|
2332
|
+
.bp_combobox_module_popover--2cc49[data-modern=false]{
|
|
2333
2333
|
--option-height:2.25rem;
|
|
2334
2334
|
--dropdown-max-height:12.5rem;
|
|
2335
2335
|
--combobox-popover-max-height:min(
|
|
@@ -2359,9 +2359,10 @@
|
|
|
2359
2359
|
--combobox-option-with-indicator-padding-inline:var(--space-10) var(--space-2);
|
|
2360
2360
|
--combobox-loading-indicator-position:unset;
|
|
2361
2361
|
--combobox-no-result-option-color:var(--text-text-on-light);
|
|
2362
|
+
--combobox-popover-backdrop-filter:;
|
|
2362
2363
|
}
|
|
2363
2364
|
|
|
2364
|
-
.bp_combobox_module_popover--
|
|
2365
|
+
.bp_combobox_module_popover--2cc49[data-modern=true]{
|
|
2365
2366
|
--option-height:2.25rem;
|
|
2366
2367
|
--dropdown-max-height:12.5rem;
|
|
2367
2368
|
--bp-dropshadow-03:var(--dropshadow-3);
|
|
@@ -2369,7 +2370,7 @@
|
|
|
2369
2370
|
var(--popover-available-height, var(--option-height)),
|
|
2370
2371
|
var(--dropdown-max-height)
|
|
2371
2372
|
);
|
|
2372
|
-
--combobox-popover-background-color:var(--bp-surface-menu-surface);
|
|
2373
|
+
--combobox-popover-background-color:var(--bp-surface-menu-surface-dropdown);
|
|
2373
2374
|
--combobox-popover-border:var(--bp-border-01) solid var(--bp-border-menu-border);
|
|
2374
2375
|
--combobox-popover-border-radius:var(--bp-radius-10);
|
|
2375
2376
|
--combobox-popover-padding-block:var(--bp-space-030);
|
|
@@ -2392,9 +2393,10 @@
|
|
|
2392
2393
|
--combobox-option-with-indicator-padding-inline:var(--bp-space-100) var(--bp-space-020);
|
|
2393
2394
|
--combobox-loading-indicator-position:unset;
|
|
2394
2395
|
--combobox-no-result-option-color:var(--bp-text-text-on-light);
|
|
2396
|
+
--combobox-popover-backdrop-filter:blur(16px);
|
|
2395
2397
|
}
|
|
2396
2398
|
|
|
2397
|
-
.bp_combobox_module_container--
|
|
2399
|
+
.bp_combobox_module_container--2cc49{
|
|
2398
2400
|
display:flex;
|
|
2399
2401
|
flex-direction:column;
|
|
2400
2402
|
font-family:var(--body-default-font-family);
|
|
@@ -2406,10 +2408,10 @@
|
|
|
2406
2408
|
text-decoration:var(--body-default-text-decoration);
|
|
2407
2409
|
text-transform:var(--body-default-text-case);
|
|
2408
2410
|
}
|
|
2409
|
-
.bp_combobox_module_container--
|
|
2411
|
+
.bp_combobox_module_container--2cc49.bp_combobox_module_disabled--2cc49{
|
|
2410
2412
|
opacity:60%;
|
|
2411
2413
|
}
|
|
2412
|
-
.bp_combobox_module_container--
|
|
2414
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_label--2cc49{
|
|
2413
2415
|
color:var(--combobox-label-color);
|
|
2414
2416
|
flex:0 0 fit-content;
|
|
2415
2417
|
font-family:var(--body-default-bold-font-family);
|
|
@@ -2422,10 +2424,10 @@
|
|
|
2422
2424
|
text-decoration:var(--body-default-bold-text-decoration);
|
|
2423
2425
|
text-transform:var(--body-default-bold-text-case);
|
|
2424
2426
|
}
|
|
2425
|
-
.bp_combobox_module_container--
|
|
2427
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_label--2cc49:not(.bp_combobox_module_hiddenLabel--2cc49){
|
|
2426
2428
|
margin-block-end:var(--combobox-label-margin-block-end);
|
|
2427
2429
|
}
|
|
2428
|
-
.bp_combobox_module_container--
|
|
2430
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_comboboxContainer--2cc49{
|
|
2429
2431
|
background-color:var(--combobox-container-background-color);
|
|
2430
2432
|
border-bottom:var(--combobox-container-border-bottom-width) solid var(--combobox-container-border-color);
|
|
2431
2433
|
border-left:var(--combobox-container-border-left-width) solid var(--combobox-container-border-color);
|
|
@@ -2442,15 +2444,15 @@
|
|
|
2442
2444
|
padding-inline:var(--combobox-container-padding-inline);
|
|
2443
2445
|
position:relative;
|
|
2444
2446
|
}
|
|
2445
|
-
.bp_combobox_module_container--
|
|
2447
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_comboboxContainer--2cc49.bp_combobox_module_withComboboxButtons--2cc49{
|
|
2446
2448
|
padding-inline-end:var(--combobox-container-padding-inline-end-with-buttons);
|
|
2447
2449
|
}
|
|
2448
|
-
.bp_combobox_module_container--
|
|
2450
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_comboboxContainer--2cc49:not(:disabled):has(input:focus){
|
|
2449
2451
|
background-color:var(--combobox-container-focus-background-color);
|
|
2450
2452
|
border:var(--combobox-container-focus-border);
|
|
2451
2453
|
padding-block:var(--combobox-container-focus-padding-block);
|
|
2452
2454
|
}
|
|
2453
|
-
.bp_combobox_module_container--
|
|
2455
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_comboboxContainer--2cc49:not(:disabled).bp_combobox_module_error--2cc49,.bp_combobox_module_container--2cc49 .bp_combobox_module_comboboxContainer--2cc49:not(:disabled):has([aria-invalid=true]){
|
|
2454
2456
|
background-color:var(--combobox-container-error-background-color);
|
|
2455
2457
|
border-bottom:var(--combobox-container-error-border-bottom-width) solid var(--combobox-container-error-border-color);
|
|
2456
2458
|
border-left:var(--combobox-container-error-border-left-width) solid var(--combobox-container-error-border-color);
|
|
@@ -2458,13 +2460,13 @@
|
|
|
2458
2460
|
border-top:var(--combobox-container-error-border-top-width) solid var(--combobox-container-error-border-color);
|
|
2459
2461
|
padding-block:var(--combobox-container-error-padding-block);
|
|
2460
2462
|
}
|
|
2461
|
-
.bp_combobox_module_container--
|
|
2463
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_comboboxContainer--2cc49 .bp_combobox_module_textInputWrapper--2cc49{
|
|
2462
2464
|
align-items:center;
|
|
2463
2465
|
display:flex;
|
|
2464
2466
|
flex:content;
|
|
2465
2467
|
gap:var(--combobox-text-input-wrapper-gap);
|
|
2466
2468
|
}
|
|
2467
|
-
.bp_combobox_module_container--
|
|
2469
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_comboboxContainer--2cc49 .bp_combobox_module_textInputWrapper--2cc49 .bp_combobox_module_textInput--2cc49{
|
|
2468
2470
|
background-color:var(--combobox-text-input-background-color);
|
|
2469
2471
|
border:none;
|
|
2470
2472
|
color:var(--combobox-text-input-color);
|
|
@@ -2481,31 +2483,32 @@
|
|
|
2481
2483
|
text-transform:var(--body-default-text-case);
|
|
2482
2484
|
width:100%;
|
|
2483
2485
|
}
|
|
2484
|
-
.bp_combobox_module_container--
|
|
2486
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_comboboxContainer--2cc49 .bp_combobox_module_textInputWrapper--2cc49 .bp_combobox_module_errorIcon--2cc49 path{
|
|
2485
2487
|
fill:var(--combobox-error-icon-fill);
|
|
2486
2488
|
}
|
|
2487
|
-
.bp_combobox_module_container--
|
|
2489
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_comboboxContainer--2cc49 .bp_combobox_module_textInputWrapper--2cc49 .bp_combobox_module_comboboxButtons--2cc49{
|
|
2488
2490
|
align-items:center;
|
|
2489
2491
|
display:flex;
|
|
2490
2492
|
position:absolute;
|
|
2491
2493
|
right:var(--combobox-button-spacing);
|
|
2492
2494
|
top:var(--combobox-button-spacing);
|
|
2493
2495
|
}
|
|
2494
|
-
.bp_combobox_module_container--
|
|
2496
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_comboboxContainer--2cc49.bp_combobox_module_withChips--2cc49{
|
|
2495
2497
|
max-height:var(--combobox-container-with-chips-max-height);
|
|
2496
2498
|
padding-block:var(--combobox-container-with-chips-padding-block);
|
|
2497
2499
|
}
|
|
2498
|
-
.bp_combobox_module_container--
|
|
2500
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_comboboxContainer--2cc49.bp_combobox_module_withChips--2cc49:not(:disabled).bp_combobox_module_error--2cc49{
|
|
2499
2501
|
padding-block:var(--combobox-container-with-chips-error-padding-block);
|
|
2500
2502
|
}
|
|
2501
|
-
.bp_combobox_module_container--
|
|
2503
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_comboboxContainer--2cc49.bp_combobox_module_withChips--2cc49:not(:disabled):has(input:focus){
|
|
2502
2504
|
padding-block:var(--combobox-container-with-chips-focus-padding-block);
|
|
2503
2505
|
}
|
|
2504
|
-
.bp_combobox_module_container--
|
|
2506
|
+
.bp_combobox_module_container--2cc49 .bp_combobox_module_inlineError--2cc49{
|
|
2505
2507
|
margin-block-start:var(--combobox-inline-error-margin-block-start);
|
|
2506
2508
|
}
|
|
2507
2509
|
|
|
2508
|
-
.bp_combobox_module_popover--
|
|
2510
|
+
.bp_combobox_module_popover--2cc49{
|
|
2511
|
+
backdrop-filter:var(--combobox-popover-backdrop-filter);
|
|
2509
2512
|
background-color:var(--combobox-popover-background-color);
|
|
2510
2513
|
border:var(--combobox-popover-border);
|
|
2511
2514
|
border-radius:var(--combobox-popover-border-radius);
|
|
@@ -2524,7 +2527,7 @@
|
|
|
2524
2527
|
text-transform:var(--body-default-text-case);
|
|
2525
2528
|
z-index:var(--z-index-popover);
|
|
2526
2529
|
}
|
|
2527
|
-
.bp_combobox_module_popover--
|
|
2530
|
+
.bp_combobox_module_popover--2cc49 .bp_combobox_module_option--2cc49{
|
|
2528
2531
|
border:var(--combobox-option-border);
|
|
2529
2532
|
border-radius:var(--combobox-option-border-radius);
|
|
2530
2533
|
box-sizing:border-box;
|
|
@@ -2538,21 +2541,21 @@
|
|
|
2538
2541
|
user-select:none;
|
|
2539
2542
|
width:100%;
|
|
2540
2543
|
}
|
|
2541
|
-
.bp_combobox_module_popover--
|
|
2544
|
+
.bp_combobox_module_popover--2cc49 .bp_combobox_module_option--2cc49[aria-disabled]{
|
|
2542
2545
|
opacity:var(--combobox-option-disabled-opacity);
|
|
2543
2546
|
}
|
|
2544
|
-
.bp_combobox_module_popover--
|
|
2547
|
+
.bp_combobox_module_popover--2cc49 .bp_combobox_module_option--2cc49[data-active-item]:not([aria-disabled]){
|
|
2545
2548
|
background-color:var(--combobox-option-active-background-color);
|
|
2546
2549
|
border:var(--combobox-option-active-border);
|
|
2547
2550
|
}
|
|
2548
|
-
.bp_combobox_module_popover--
|
|
2551
|
+
.bp_combobox_module_popover--2cc49 .bp_combobox_module_option--2cc49:active{
|
|
2549
2552
|
background-color:var(--combobox-option-hover-background-color);
|
|
2550
2553
|
border:var(--combobox-option-border);
|
|
2551
2554
|
}
|
|
2552
|
-
.bp_combobox_module_popover--
|
|
2555
|
+
.bp_combobox_module_popover--2cc49 .bp_combobox_module_option--2cc49:hover{
|
|
2553
2556
|
background-color:var(--combobox-option-hover-background-color);
|
|
2554
2557
|
}
|
|
2555
|
-
.bp_combobox_module_popover--
|
|
2558
|
+
.bp_combobox_module_popover--2cc49 .bp_combobox_module_option--2cc49 .bp_combobox_module_indicator--2cc49{
|
|
2556
2559
|
align-items:center;
|
|
2557
2560
|
display:flex;
|
|
2558
2561
|
height:var(--combobox-option-indicator-height);
|
|
@@ -2561,41 +2564,75 @@
|
|
|
2561
2564
|
position:absolute;
|
|
2562
2565
|
top:var(--combobox-option-indicator-top);
|
|
2563
2566
|
}
|
|
2564
|
-
.bp_combobox_module_popover--
|
|
2567
|
+
.bp_combobox_module_popover--2cc49 .bp_combobox_module_option--2cc49 .bp_combobox_module_indicator--2cc49 .bp_combobox_module_indicatorIcon--2cc49 path{
|
|
2565
2568
|
fill:var(--combobox-option-indicator-icon-fill);
|
|
2566
2569
|
}
|
|
2567
|
-
.bp_combobox_module_popover--
|
|
2570
|
+
.bp_combobox_module_popover--2cc49 .bp_combobox_module_optionWithIndicator--2cc49{
|
|
2568
2571
|
padding-inline:var(--combobox-option-with-indicator-padding-inline);
|
|
2569
2572
|
}
|
|
2570
|
-
.bp_combobox_module_popover--
|
|
2573
|
+
.bp_combobox_module_popover--2cc49 .bp_combobox_module_loadingIndicator--2cc49{
|
|
2571
2574
|
position:var(--combobox-loading-indicator-position);
|
|
2572
2575
|
}
|
|
2573
|
-
.bp_combobox_module_popover--
|
|
2576
|
+
.bp_combobox_module_popover--2cc49 .bp_combobox_module_noResultOption--2cc49{
|
|
2574
2577
|
color:var(--combobox-no-result-option-color);
|
|
2575
2578
|
-webkit-user-select:none;
|
|
2576
2579
|
user-select:none;
|
|
2577
2580
|
}
|
|
2578
2581
|
|
|
2579
|
-
.bp_combobox_group_module_container--
|
|
2582
|
+
.bp_combobox_group_module_container--71411[data-modern=false]{
|
|
2583
|
+
--combobox-group-container-gap:var(--space-2);
|
|
2584
|
+
--combobox-group-container-max-width:358px;
|
|
2585
|
+
--combobox-group-disabled-opacity:60%;
|
|
2586
|
+
--combobox-group-label-color:var(--text-text-on-light);
|
|
2587
|
+
}
|
|
2588
|
+
.bp_combobox_group_module_container--71411[data-modern=false] .bp_combobox_group_module_trailing--71411{
|
|
2589
|
+
--blueprint-combobox-input-radius:0 var(--radius-2) var(--radius-2) 0;
|
|
2590
|
+
--blueprint-select-trigger-radius:0 var(--radius-2) var(--radius-2) 0;
|
|
2591
|
+
--blueprint-combobox-border-left-width:none;
|
|
2592
|
+
--blueprint-select-border-left-width:none;
|
|
2593
|
+
}
|
|
2594
|
+
.bp_combobox_group_module_container--71411[data-modern=false] .bp_combobox_group_module_leading--71411{
|
|
2595
|
+
--blueprint-combobox-input-radius:var(--radius-2) 0 0 var(--radius-2);
|
|
2596
|
+
--blueprint-select-trigger-radius:var(--radius-2) 0 0 var(--radius-2);
|
|
2597
|
+
}
|
|
2598
|
+
|
|
2599
|
+
.bp_combobox_group_module_container--71411[data-modern=true]{
|
|
2600
|
+
--combobox-group-container-gap:var(--bp-space-020);
|
|
2601
|
+
--combobox-group-container-max-width:358px;
|
|
2602
|
+
--combobox-group-disabled-opacity:60%;
|
|
2603
|
+
--combobox-group-label-color:var(--bp-text-text-on-light);
|
|
2604
|
+
}
|
|
2605
|
+
.bp_combobox_group_module_container--71411[data-modern=true] .bp_combobox_group_module_trailing--71411{
|
|
2606
|
+
--blueprint-combobox-input-radius:0 var(--bp-radius-06) var(--bp-radius-06) 0;
|
|
2607
|
+
--blueprint-select-trigger-radius:0 var(--bp-radius-06) var(--bp-radius-06) 0;
|
|
2608
|
+
--blueprint-combobox-border-left-width:none;
|
|
2609
|
+
--blueprint-select-border-left-width:none;
|
|
2610
|
+
}
|
|
2611
|
+
.bp_combobox_group_module_container--71411[data-modern=true] .bp_combobox_group_module_leading--71411{
|
|
2612
|
+
--blueprint-combobox-input-radius:var(--bp-radius-06) 0 0 var(--bp-radius-06);
|
|
2613
|
+
--blueprint-select-trigger-radius:var(--bp-radius-06) 0 0 var(--bp-radius-06);
|
|
2614
|
+
}
|
|
2615
|
+
|
|
2616
|
+
.bp_combobox_group_module_container--71411{
|
|
2580
2617
|
align-items:flex-start;
|
|
2581
2618
|
display:flex;
|
|
2582
2619
|
flex-direction:column;
|
|
2583
|
-
gap:var(--
|
|
2584
|
-
max-width:
|
|
2620
|
+
gap:var(--combobox-group-container-gap);
|
|
2621
|
+
max-width:var(--combobox-group-container-max-width);
|
|
2585
2622
|
}
|
|
2586
2623
|
|
|
2587
|
-
.bp_combobox_group_module_comboboxGroupcontainer--
|
|
2624
|
+
.bp_combobox_group_module_comboboxGroupcontainer--71411{
|
|
2588
2625
|
display:flex;
|
|
2589
2626
|
flex-direction:row;
|
|
2590
2627
|
}
|
|
2591
2628
|
|
|
2592
|
-
.bp_combobox_group_module_disabled--
|
|
2593
|
-
opacity:
|
|
2629
|
+
.bp_combobox_group_module_disabled--71411{
|
|
2630
|
+
opacity:var(--combobox-group-disabled-opacity);
|
|
2594
2631
|
pointer-events:none;
|
|
2595
2632
|
}
|
|
2596
2633
|
|
|
2597
|
-
.bp_combobox_group_module_label--
|
|
2598
|
-
color:var(--
|
|
2634
|
+
.bp_combobox_group_module_label--71411{
|
|
2635
|
+
color:var(--combobox-group-label-color);
|
|
2599
2636
|
flex:0 0 fit-content;
|
|
2600
2637
|
font-family:var(--body-default-bold-font-family);
|
|
2601
2638
|
font-size:var(--body-default-bold-font-size);
|
|
@@ -2608,55 +2645,43 @@
|
|
|
2608
2645
|
text-transform:var(--body-default-bold-text-case);
|
|
2609
2646
|
}
|
|
2610
2647
|
|
|
2611
|
-
.
|
|
2612
|
-
--blueprint-combobox-input-radius:0 var(--radius-2) var(--radius-2) 0;
|
|
2613
|
-
--blueprint-select-trigger-radius:0 var(--radius-2) var(--radius-2) 0;
|
|
2614
|
-
--blueprint-combobox-border-left-width:none;
|
|
2615
|
-
--blueprint-select-border-left-width:none;
|
|
2616
|
-
}
|
|
2617
|
-
|
|
2618
|
-
.bp_combobox_group_module_leading--4fa0a{
|
|
2619
|
-
--blueprint-combobox-input-radius:var(--radius-2) 0 0 var(--radius-2);
|
|
2620
|
-
--blueprint-select-trigger-radius:var(--radius-2) 0 0 var(--radius-2);
|
|
2621
|
-
}
|
|
2622
|
-
|
|
2623
|
-
.bp_combobox_group_module_errorCombobox--4fa0a.bp_combobox_group_module_leading--4fa0a{
|
|
2648
|
+
.bp_combobox_group_module_errorCombobox--71411.bp_combobox_group_module_leading--71411{
|
|
2624
2649
|
--blueprint-select-border-right-width:none;
|
|
2625
2650
|
}
|
|
2626
2651
|
|
|
2627
|
-
.bp_combobox_group_module_errorSelect--
|
|
2652
|
+
.bp_combobox_group_module_errorSelect--71411.bp_combobox_group_module_leading--71411{
|
|
2628
2653
|
--blueprint-combobox-border-right-width:none;
|
|
2629
2654
|
}
|
|
2630
2655
|
|
|
2631
|
-
.bp_combobox_group_module_errorCombobox--
|
|
2656
|
+
.bp_combobox_group_module_errorCombobox--71411.bp_combobox_group_module_errorSelect--71411.bp_combobox_group_module_trailing--71411{
|
|
2632
2657
|
--blueprint-select-border-error-left-width:none;
|
|
2633
2658
|
}
|
|
2634
2659
|
|
|
2635
|
-
.bp_combobox_group_module_errorCombobox--
|
|
2660
|
+
.bp_combobox_group_module_errorCombobox--71411.bp_combobox_group_module_errorSelect--71411.bp_combobox_group_module_leading--71411{
|
|
2636
2661
|
--blueprint-select-border-error-right-width:none;
|
|
2637
2662
|
}
|
|
2638
2663
|
|
|
2639
|
-
.bp_combobox_group_module_selectHasFocus--
|
|
2664
|
+
.bp_combobox_group_module_selectHasFocus--71411.bp_combobox_group_module_leading--71411{
|
|
2640
2665
|
--blueprint-combobox-border-right-width:none;
|
|
2641
2666
|
}
|
|
2642
2667
|
|
|
2643
|
-
.bp_combobox_group_module_selectHasFocus--
|
|
2668
|
+
.bp_combobox_group_module_selectHasFocus--71411.bp_combobox_group_module_errorCombobox--71411.bp_combobox_group_module_leading--71411{
|
|
2644
2669
|
--blueprint-combobox-border-error-right-width:none;
|
|
2645
2670
|
}
|
|
2646
2671
|
|
|
2647
|
-
.bp_combobox_group_module_selectHasFocus--
|
|
2672
|
+
.bp_combobox_group_module_selectHasFocus--71411.bp_combobox_group_module_errorCombobox--71411.bp_combobox_group_module_trailing--71411{
|
|
2648
2673
|
--blueprint-combobox-border-error-left-width:none;
|
|
2649
2674
|
}
|
|
2650
2675
|
|
|
2651
|
-
.bp_combobox_group_module_comboboxHasFocus--
|
|
2676
|
+
.bp_combobox_group_module_comboboxHasFocus--71411.bp_combobox_group_module_leading--71411{
|
|
2652
2677
|
--blueprint-select-border-right-width:none;
|
|
2653
2678
|
}
|
|
2654
2679
|
|
|
2655
|
-
.bp_combobox_group_module_comboboxHasFocus--
|
|
2680
|
+
.bp_combobox_group_module_comboboxHasFocus--71411.bp_combobox_group_module_errorSelect--71411.bp_combobox_group_module_leading--71411{
|
|
2656
2681
|
--blueprint-select-border-error-right-width:none;
|
|
2657
2682
|
}
|
|
2658
2683
|
|
|
2659
|
-
.bp_combobox_group_module_comboboxHasFocus--
|
|
2684
|
+
.bp_combobox_group_module_comboboxHasFocus--71411.bp_combobox_group_module_errorSelect--71411.bp_combobox_group_module_trailing--71411{
|
|
2660
2685
|
--blueprint-select-border-error-left-width:none;
|
|
2661
2686
|
}
|
|
2662
2687
|
|