@box/blueprint-web 12.90.0 → 12.91.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.
@@ -1,4 +1,4 @@
1
1
  import '../index.css';
2
- var styles = {"container":"bp_combobox_module_container--42313","label":"bp_combobox_module_label--42313","textInput":"bp_combobox_module_textInput--42313","popover":"bp_combobox_module_popover--42313","disabled":"bp_combobox_module_disabled--42313","hiddenLabel":"bp_combobox_module_hiddenLabel--42313","comboboxContainer":"bp_combobox_module_comboboxContainer--42313","withComboboxButtons":"bp_combobox_module_withComboboxButtons--42313","error":"bp_combobox_module_error--42313","textInputWrapper":"bp_combobox_module_textInputWrapper--42313","errorIcon":"bp_combobox_module_errorIcon--42313","comboboxButtons":"bp_combobox_module_comboboxButtons--42313","withChips":"bp_combobox_module_withChips--42313","inlineError":"bp_combobox_module_inlineError--42313","option":"bp_combobox_module_option--42313","indicator":"bp_combobox_module_indicator--42313","indicatorIcon":"bp_combobox_module_indicatorIcon--42313","optionWithIndicator":"bp_combobox_module_optionWithIndicator--42313","loadingIndicator":"bp_combobox_module_loadingIndicator--42313","noResultOption":"bp_combobox_module_noResultOption--42313"};
2
+ var styles = {"container":"bp_combobox_module_container--80c88","label":"bp_combobox_module_label--80c88","textInput":"bp_combobox_module_textInput--80c88","popover":"bp_combobox_module_popover--80c88","disabled":"bp_combobox_module_disabled--80c88","hiddenLabel":"bp_combobox_module_hiddenLabel--80c88","comboboxContainer":"bp_combobox_module_comboboxContainer--80c88","withComboboxButtons":"bp_combobox_module_withComboboxButtons--80c88","error":"bp_combobox_module_error--80c88","textInputWrapper":"bp_combobox_module_textInputWrapper--80c88","errorIcon":"bp_combobox_module_errorIcon--80c88","comboboxButtons":"bp_combobox_module_comboboxButtons--80c88","withChips":"bp_combobox_module_withChips--80c88","inlineError":"bp_combobox_module_inlineError--80c88","option":"bp_combobox_module_option--80c88","indicator":"bp_combobox_module_indicator--80c88","indicatorIcon":"bp_combobox_module_indicatorIcon--80c88","optionWithIndicator":"bp_combobox_module_optionWithIndicator--80c88","loadingIndicator":"bp_combobox_module_loadingIndicator--80c88","noResultOption":"bp_combobox_module_noResultOption--80c88"};
3
3
 
4
4
  export { styles as default };
@@ -1,5 +1,6 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
2
  import clsx from 'clsx';
3
+ import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
3
4
  import styles from './ghost.module.js';
4
5
 
5
6
  /**
@@ -20,18 +21,24 @@ const Ghost = ({
20
21
  borderRadius,
21
22
  style = {},
22
23
  ...rest
23
- }) => jsx("span", {
24
- className: clsx(className, styles.ghost, {
25
- [styles[variant]]: !!variant
26
- }),
27
- style: {
28
- height,
29
- width,
30
- borderRadius,
31
- ...style
32
- },
33
- ...rest
34
- });
24
+ }) => {
25
+ const {
26
+ enableModernizedComponents
27
+ } = useBlueprintModernization();
28
+ return jsx("span", {
29
+ className: clsx(className, styles.ghost, {
30
+ [styles[variant]]: !!variant
31
+ }),
32
+ "data-modern": enableModernizedComponents,
33
+ style: {
34
+ height,
35
+ width,
36
+ borderRadius,
37
+ ...style
38
+ },
39
+ ...rest
40
+ });
41
+ };
35
42
  Ghost.displayName = 'Ghost';
36
43
 
37
44
  export { Ghost };
@@ -1,4 +1,4 @@
1
1
  import '../index.css';
2
- var styles = {"ghost":"bp_ghost_module_ghost--a5a05","ghost-keyframes":"bp_ghost_module_ghost-keyframes--a5a05","circle":"bp_ghost_module_circle--a5a05","pill":"bp_ghost_module_pill--a5a05","rectangle":"bp_ghost_module_rectangle--a5a05"};
2
+ var styles = {"ghost":"bp_ghost_module_ghost--d6cc7","ghost-keyframes":"bp_ghost_module_ghost-keyframes--d6cc7","circle":"bp_ghost_module_circle--d6cc7","pill":"bp_ghost_module_pill--d6cc7","rectangle":"bp_ghost_module_rectangle--d6cc7"};
3
3
 
4
4
  export { styles as default };
@@ -1,34 +1,52 @@
1
- .bp_ghost_module_ghost--a5a05{
2
- animation:bp_ghost_module_ghost-keyframes--a5a05 1.2s ease-in-out infinite;
3
- background-color:var(--surface-surface-hover);
4
- border-radius:var(--radius-1);
1
+ .bp_ghost_module_ghost--d6cc7[data-modern=false]{
2
+ --ghost-background-color:var(--surface-surface-hover);
3
+ --ghost-background-color-secondary:var(--surface-surface-secondary);
4
+ --ghost-border-radius:var(--radius-1);
5
+ --ghost-border-radius-half:var(--radius-half);
6
+ --ghost-space-5:var(--space-5);
7
+ --ghost-space-6:var(--space-6);
8
+ }
9
+
10
+ .bp_ghost_module_ghost--d6cc7[data-modern=true]{
11
+ --ghost-background-color:var(--bp-surface-ghost-surface);
12
+ --ghost-background-color-secondary:var(--bp-surface-ghost-surface-secondary);
13
+ --ghost-border-radius:var(--bp-radius-02);
14
+ --ghost-border-radius-half:var(--bp-radius-16);
15
+ --ghost-space-5:var(--bp-space-050);
16
+ --ghost-space-6:var(--bp-space-060);
17
+ }
18
+
19
+ .bp_ghost_module_ghost--d6cc7{
20
+ animation:bp_ghost_module_ghost-keyframes--d6cc7 1.2s ease-in-out infinite;
21
+ background-color:var(--ghost-background-color);
22
+ border-radius:var(--ghost-border-radius);
5
23
  display:inline-block;
6
24
  }
7
- .bp_ghost_module_ghost--a5a05.bp_ghost_module_circle--a5a05{
25
+ .bp_ghost_module_ghost--d6cc7.bp_ghost_module_circle--d6cc7{
8
26
  border-radius:50%;
9
- min-height:var(--space-6);
10
- min-width:var(--space-6);
27
+ min-height:var(--ghost-space-6);
28
+ min-width:var(--ghost-space-6);
11
29
  }
12
- .bp_ghost_module_ghost--a5a05.bp_ghost_module_pill--a5a05{
13
- border-radius:var(--radius-half);
14
- height:var(--space-5);
30
+ .bp_ghost_module_ghost--d6cc7.bp_ghost_module_pill--d6cc7{
31
+ border-radius:var(--ghost-border-radius-half);
32
+ height:var(--ghost-space-5);
15
33
  width:100%;
16
34
  }
17
- .bp_ghost_module_ghost--a5a05.bp_ghost_module_rectangle--a5a05{
18
- border-radius:var(--radius-1);
19
- height:var(--space-5);
35
+ .bp_ghost_module_ghost--d6cc7.bp_ghost_module_rectangle--d6cc7{
36
+ border-radius:var(--ghost-border-radius);
37
+ height:var(--ghost-space-5);
20
38
  width:100%;
21
39
  }
22
40
 
23
- @keyframes bp_ghost_module_ghost-keyframes--a5a05{
41
+ @keyframes bp_ghost_module_ghost-keyframes--d6cc7{
24
42
  0%{
25
- background-color:var(--surface-surface-hover);
43
+ background-color:var(--ghost-background-color);
26
44
  }
27
45
  50%{
28
- background-color:var(--surface-surface-secondary);
46
+ background-color:var(--ghost-background-color-secondary);
29
47
  }
30
48
  100%{
31
- background-color:var(--surface-surface-hover);
49
+ background-color:var(--ghost-background-color);
32
50
  }
33
51
  }
34
52
  .bp_base_inline_notice_module_noticeWrapper--1c117[data-modern=false]{
@@ -2936,7 +2954,7 @@
2936
2954
  margin-block-start:var(--text-area-container-row-gap);
2937
2955
  }
2938
2956
 
2939
- .bp_combobox_module_container--42313[data-modern=false]{
2957
+ .bp_combobox_module_container--80c88[data-modern=false]{
2940
2958
  --max-lines:3;
2941
2959
  --input-height:var(--space-5);
2942
2960
  --chip-height:var(--space-7);
@@ -2999,7 +3017,7 @@
2999
3017
  text-decoration:var(--body-default-text-decoration);
3000
3018
  text-transform:var(--body-default-text-case);
3001
3019
  }
3002
- .bp_combobox_module_container--42313[data-modern=false] .bp_combobox_module_label--42313{
3020
+ .bp_combobox_module_container--80c88[data-modern=false] .bp_combobox_module_label--80c88{
3003
3021
  font-family:var(--body-default-bold-font-family);
3004
3022
  font-size:var(--body-default-bold-font-size);
3005
3023
  font-weight:var(--body-default-bold-font-weight);
@@ -3009,7 +3027,7 @@
3009
3027
  text-decoration:var(--body-default-bold-text-decoration);
3010
3028
  text-transform:var(--body-default-bold-text-case);
3011
3029
  }
3012
- .bp_combobox_module_container--42313[data-modern=false] .bp_combobox_module_textInput--42313{
3030
+ .bp_combobox_module_container--80c88[data-modern=false] .bp_combobox_module_textInput--80c88{
3013
3031
  font-family:var(--body-default-font-family);
3014
3032
  font-size:var(--body-default-font-size);
3015
3033
  font-weight:var(--body-default-font-weight);
@@ -3020,7 +3038,7 @@
3020
3038
  text-transform:var(--body-default-text-case);
3021
3039
  }
3022
3040
 
3023
- .bp_combobox_module_container--42313[data-modern=true]{
3041
+ .bp_combobox_module_container--80c88[data-modern=true]{
3024
3042
  --max-lines:3;
3025
3043
  --bp-innershadow-01:var(--innershadow-1);
3026
3044
  --bp-input-height:var(--bp-space-050);
@@ -3082,17 +3100,17 @@
3082
3100
  --combobox-button-spacing:var(--bp-space-020);
3083
3101
  font-weight:var(--bp-font-weight-regular);
3084
3102
  }
3085
- .bp_combobox_module_container--42313[data-modern=true],.bp_combobox_module_container--42313[data-modern=true] .bp_combobox_module_label--42313{
3103
+ .bp_combobox_module_container--80c88[data-modern=true],.bp_combobox_module_container--80c88[data-modern=true] .bp_combobox_module_label--80c88{
3086
3104
  font-family:var(--bp-font-font-family);
3087
3105
  font-size:var(--bp-font-size-05);
3088
3106
  font-style:normal;
3089
3107
  letter-spacing:var(--bp-font-letter-spacing-01);
3090
3108
  line-height:var(--bp-font-line-height-04);
3091
3109
  }
3092
- .bp_combobox_module_container--42313[data-modern=true] .bp_combobox_module_label--42313{
3110
+ .bp_combobox_module_container--80c88[data-modern=true] .bp_combobox_module_label--80c88{
3093
3111
  font-weight:var(--bp-font-weight-bold);
3094
3112
  }
3095
- .bp_combobox_module_container--42313[data-modern=true] .bp_combobox_module_textInput--42313{
3113
+ .bp_combobox_module_container--80c88[data-modern=true] .bp_combobox_module_textInput--80c88{
3096
3114
  font-family:var(--bp-font-font-family);
3097
3115
  font-size:var(--bp-font-size-05);
3098
3116
  font-style:normal;
@@ -3101,7 +3119,7 @@
3101
3119
  line-height:var(--bp-font-line-height-04);
3102
3120
  }
3103
3121
 
3104
- .bp_combobox_module_popover--42313[data-modern=false]{
3122
+ .bp_combobox_module_popover--80c88[data-modern=false]{
3105
3123
  --option-height:2.25rem;
3106
3124
  --dropdown-max-height:12.5rem;
3107
3125
  --combobox-popover-max-height:min(
@@ -3118,7 +3136,7 @@
3118
3136
  --combobox-option-border-radius:var(--radius-3);
3119
3137
  --combobox-option-padding-block:var(--space-2);
3120
3138
  --combobox-option-padding-inline:var(--space-2);
3121
- --combobox-option-disabled-opacity:tokens.$disabled-opacity;
3139
+ --combobox-option-disabled-opacity:60%;
3122
3140
  --combobox-option-active-background-color:var(--surface-menu-surface-focus);
3123
3141
  --combobox-option-active-border:var(--border-2) solid var(--outline-focus-on-light);
3124
3142
  --combobox-option-active-padding-block:var(--space-2);
@@ -3143,7 +3161,7 @@
3143
3161
  text-transform:var(--body-default-text-case);
3144
3162
  }
3145
3163
 
3146
- .bp_combobox_module_popover--42313[data-modern=true]{
3164
+ .bp_combobox_module_popover--80c88[data-modern=true]{
3147
3165
  --option-height:2.25rem;
3148
3166
  --dropdown-max-height:12.5rem;
3149
3167
  --bp-dropshadow-03:var(--dropshadow-3);
@@ -3184,22 +3202,22 @@
3184
3202
  line-height:var(--bp-font-line-height-04);
3185
3203
  }
3186
3204
 
3187
- .bp_combobox_module_container--42313{
3205
+ .bp_combobox_module_container--80c88{
3188
3206
  display:flex;
3189
3207
  flex-direction:column;
3190
3208
  }
3191
- .bp_combobox_module_container--42313.bp_combobox_module_disabled--42313{
3209
+ .bp_combobox_module_container--80c88.bp_combobox_module_disabled--80c88{
3192
3210
  opacity:60%;
3193
3211
  }
3194
- .bp_combobox_module_container--42313 .bp_combobox_module_label--42313{
3212
+ .bp_combobox_module_container--80c88 .bp_combobox_module_label--80c88{
3195
3213
  color:var(--combobox-label-color);
3196
3214
  flex:0 0 fit-content;
3197
3215
  overflow-wrap:break-word;
3198
3216
  }
3199
- .bp_combobox_module_container--42313 .bp_combobox_module_label--42313:not(.bp_combobox_module_hiddenLabel--42313){
3217
+ .bp_combobox_module_container--80c88 .bp_combobox_module_label--80c88:not(.bp_combobox_module_hiddenLabel--80c88){
3200
3218
  margin-block-end:var(--combobox-label-margin-block-end);
3201
3219
  }
3202
- .bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313{
3220
+ .bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88{
3203
3221
  background-color:var(--combobox-container-background-color);
3204
3222
  border-bottom:var(--combobox-container-border-bottom-width) solid var(--combobox-container-border-color);
3205
3223
  border-left:var(--combobox-container-border-left-width) solid var(--combobox-container-border-color);
@@ -3216,15 +3234,15 @@
3216
3234
  padding-inline:var(--combobox-container-padding-inline);
3217
3235
  position:relative;
3218
3236
  }
3219
- .bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313.bp_combobox_module_withComboboxButtons--42313{
3237
+ .bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88.bp_combobox_module_withComboboxButtons--80c88{
3220
3238
  padding-inline-end:var(--combobox-container-padding-inline-end-with-buttons);
3221
3239
  }
3222
- .bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313:not(:disabled):has(input:focus){
3240
+ .bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88:not(:disabled):has(input:focus){
3223
3241
  background-color:var(--combobox-container-focus-background-color);
3224
3242
  border:var(--combobox-container-focus-border);
3225
3243
  padding-block:var(--combobox-container-focus-padding-block);
3226
3244
  }
3227
- .bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313:not(:disabled).bp_combobox_module_error--42313,.bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313:not(:disabled):has([aria-invalid=true]){
3245
+ .bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88:not(:disabled).bp_combobox_module_error--80c88,.bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88:not(:disabled):has([aria-invalid=true]){
3228
3246
  background-color:var(--combobox-container-error-background-color);
3229
3247
  border-bottom:var(--combobox-container-error-border-bottom-width) solid var(--combobox-container-error-border-color);
3230
3248
  border-left:var(--combobox-container-error-border-left-width) solid var(--combobox-container-error-border-color);
@@ -3232,19 +3250,19 @@
3232
3250
  border-top:var(--combobox-container-error-border-top-width) solid var(--combobox-container-error-border-color);
3233
3251
  padding-block:var(--combobox-container-error-padding-block);
3234
3252
  }
3235
- .bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313:not(:disabled):not(:has(input:focus)):has(input:hover):not(.bp_combobox_module_error--42313):not(:has([aria-invalid=true])){
3253
+ .bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88:not(:disabled):not(:has(input:focus)):has(input:hover):not(.bp_combobox_module_error--80c88):not(:has([aria-invalid=true])){
3236
3254
  border-bottom:var(--combobox-container-border-bottom-width) solid var(--combobox-container-border-color-hover);
3237
3255
  border-left:var(--combobox-container-border-left-width) solid var(--combobox-container-border-color-hover);
3238
3256
  border-right:var(--combobox-container-border-right-width) solid var(--combobox-container-border-color-hover);
3239
3257
  border-top:var(--combobox-container-border-top-width) solid var(--combobox-container-border-color-hover);
3240
3258
  }
3241
- .bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313 .bp_combobox_module_textInputWrapper--42313{
3259
+ .bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88 .bp_combobox_module_textInputWrapper--80c88{
3242
3260
  align-items:center;
3243
3261
  display:flex;
3244
3262
  flex:content;
3245
3263
  gap:var(--combobox-text-input-wrapper-gap);
3246
3264
  }
3247
- .bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313 .bp_combobox_module_textInputWrapper--42313 .bp_combobox_module_textInput--42313{
3265
+ .bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88 .bp_combobox_module_textInputWrapper--80c88 .bp_combobox_module_textInput--80c88{
3248
3266
  background-color:var(--combobox-text-input-background-color);
3249
3267
  border:none;
3250
3268
  color:var(--combobox-text-input-color);
@@ -3253,31 +3271,31 @@
3253
3271
  padding:0;
3254
3272
  width:100%;
3255
3273
  }
3256
- .bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313 .bp_combobox_module_textInputWrapper--42313 .bp_combobox_module_errorIcon--42313 path{
3274
+ .bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88 .bp_combobox_module_textInputWrapper--80c88 .bp_combobox_module_errorIcon--80c88 path{
3257
3275
  fill:var(--combobox-error-icon-fill);
3258
3276
  }
3259
- .bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313 .bp_combobox_module_textInputWrapper--42313 .bp_combobox_module_comboboxButtons--42313{
3277
+ .bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88 .bp_combobox_module_textInputWrapper--80c88 .bp_combobox_module_comboboxButtons--80c88{
3260
3278
  align-items:center;
3261
3279
  display:flex;
3262
3280
  position:absolute;
3263
3281
  right:var(--combobox-button-spacing);
3264
3282
  top:var(--combobox-button-spacing);
3265
3283
  }
3266
- .bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313.bp_combobox_module_withChips--42313{
3284
+ .bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88.bp_combobox_module_withChips--80c88{
3267
3285
  max-height:var(--combobox-container-with-chips-max-height);
3268
3286
  padding-block:var(--combobox-container-with-chips-padding-block);
3269
3287
  }
3270
- .bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313.bp_combobox_module_withChips--42313:not(:disabled).bp_combobox_module_error--42313{
3288
+ .bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88.bp_combobox_module_withChips--80c88:not(:disabled).bp_combobox_module_error--80c88{
3271
3289
  padding-block:var(--combobox-container-with-chips-error-padding-block);
3272
3290
  }
3273
- .bp_combobox_module_container--42313 .bp_combobox_module_comboboxContainer--42313.bp_combobox_module_withChips--42313:not(:disabled):has(input:focus){
3291
+ .bp_combobox_module_container--80c88 .bp_combobox_module_comboboxContainer--80c88.bp_combobox_module_withChips--80c88:not(:disabled):has(input:focus){
3274
3292
  padding-block:var(--combobox-container-with-chips-focus-padding-block);
3275
3293
  }
3276
- .bp_combobox_module_container--42313 .bp_combobox_module_inlineError--42313{
3294
+ .bp_combobox_module_container--80c88 .bp_combobox_module_inlineError--80c88{
3277
3295
  margin-block-start:var(--combobox-inline-error-margin-block-start);
3278
3296
  }
3279
3297
 
3280
- .bp_combobox_module_popover--42313{
3298
+ .bp_combobox_module_popover--80c88{
3281
3299
  backdrop-filter:var(--combobox-popover-backdrop-filter);
3282
3300
  background-color:var(--combobox-popover-background-color);
3283
3301
  border:var(--combobox-popover-border);
@@ -3289,7 +3307,7 @@
3289
3307
  padding-inline:var(--combobox-popover-padding-inline);
3290
3308
  z-index:var(--z-index-popover);
3291
3309
  }
3292
- .bp_combobox_module_popover--42313 .bp_combobox_module_option--42313{
3310
+ .bp_combobox_module_popover--80c88 .bp_combobox_module_option--80c88{
3293
3311
  border:var(--combobox-option-border);
3294
3312
  border-radius:var(--combobox-option-border-radius);
3295
3313
  box-sizing:border-box;
@@ -3304,21 +3322,21 @@
3304
3322
  user-select:none;
3305
3323
  width:100%;
3306
3324
  }
3307
- .bp_combobox_module_popover--42313 .bp_combobox_module_option--42313[aria-disabled]{
3325
+ .bp_combobox_module_popover--80c88 .bp_combobox_module_option--80c88[aria-disabled]{
3308
3326
  opacity:var(--combobox-option-disabled-opacity);
3309
3327
  }
3310
- .bp_combobox_module_popover--42313 .bp_combobox_module_option--42313[data-active-item]:not([aria-disabled]){
3328
+ .bp_combobox_module_popover--80c88 .bp_combobox_module_option--80c88[data-active-item]:not([aria-disabled]){
3311
3329
  background-color:var(--combobox-option-active-background-color);
3312
3330
  border:var(--combobox-option-active-border);
3313
3331
  }
3314
- .bp_combobox_module_popover--42313 .bp_combobox_module_option--42313:active{
3332
+ .bp_combobox_module_popover--80c88 .bp_combobox_module_option--80c88:active{
3315
3333
  background-color:var(--combobox-option-hover-background-color);
3316
3334
  border:var(--combobox-option-border);
3317
3335
  }
3318
- .bp_combobox_module_popover--42313 .bp_combobox_module_option--42313:hover{
3336
+ .bp_combobox_module_popover--80c88 .bp_combobox_module_option--80c88:hover{
3319
3337
  background-color:var(--combobox-option-hover-background-color);
3320
3338
  }
3321
- .bp_combobox_module_popover--42313 .bp_combobox_module_option--42313 .bp_combobox_module_indicator--42313{
3339
+ .bp_combobox_module_popover--80c88 .bp_combobox_module_option--80c88 .bp_combobox_module_indicator--80c88{
3322
3340
  align-items:center;
3323
3341
  display:flex;
3324
3342
  height:var(--combobox-option-indicator-height);
@@ -3327,16 +3345,16 @@
3327
3345
  position:absolute;
3328
3346
  top:var(--combobox-option-indicator-top);
3329
3347
  }
3330
- .bp_combobox_module_popover--42313 .bp_combobox_module_option--42313 .bp_combobox_module_indicator--42313 .bp_combobox_module_indicatorIcon--42313 path{
3348
+ .bp_combobox_module_popover--80c88 .bp_combobox_module_option--80c88 .bp_combobox_module_indicator--80c88 .bp_combobox_module_indicatorIcon--80c88 path{
3331
3349
  fill:var(--combobox-option-indicator-icon-fill);
3332
3350
  }
3333
- .bp_combobox_module_popover--42313 .bp_combobox_module_optionWithIndicator--42313{
3351
+ .bp_combobox_module_popover--80c88 .bp_combobox_module_optionWithIndicator--80c88{
3334
3352
  padding-inline:var(--combobox-option-with-indicator-padding-inline);
3335
3353
  }
3336
- .bp_combobox_module_popover--42313 .bp_combobox_module_loadingIndicator--42313{
3354
+ .bp_combobox_module_popover--80c88 .bp_combobox_module_loadingIndicator--80c88{
3337
3355
  position:var(--combobox-loading-indicator-position);
3338
3356
  }
3339
- .bp_combobox_module_popover--42313 .bp_combobox_module_noResultOption--42313{
3357
+ .bp_combobox_module_popover--80c88 .bp_combobox_module_noResultOption--80c88{
3340
3358
  color:var(--combobox-no-result-option-color);
3341
3359
  -webkit-user-select:none;
3342
3360
  user-select:none;
@@ -10,6 +10,7 @@ export declare const SplitButton: import("react").ForwardRefExoticComponent<(Omi
10
10
  onOpenChange?(pressed: boolean): void;
11
11
  disabled?: boolean;
12
12
  container?: import("../primitives/dropdown-menu").DropdownMenuContentProps["container"];
13
+ splitTriggerResinTarget?: string;
13
14
  } & Required<Pick<import("./types").Loading, keyof import("./types").Loading>> & Omit<import("./types").Loading, keyof import("./types").Loading>, "ref"> | Omit<Omit<import("../button").ButtonProps, "children"> & {
14
15
  children: React.ReactNode;
15
16
  label: string;
@@ -22,4 +23,5 @@ export declare const SplitButton: import("react").ForwardRefExoticComponent<(Omi
22
23
  onOpenChange?(pressed: boolean): void;
23
24
  disabled?: boolean;
24
25
  container?: import("../primitives/dropdown-menu").DropdownMenuContentProps["container"];
26
+ splitTriggerResinTarget?: string;
25
27
  } & Partial<Record<keyof import("./types").Loading, never>> & Omit<import("./types").Loading, keyof import("./types").Loading>, "ref">) & import("react").RefAttributes<HTMLButtonElement>>;
@@ -36,6 +36,7 @@ const SplitButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
36
36
  defaultOpen = false,
37
37
  size = 'large',
38
38
  variant = 'primary',
39
+ splitTriggerResinTarget,
39
40
  ...rest
40
41
  } = props;
41
42
  const [leftButtonSize, setLeftButtonSize] = useState(undefined);
@@ -105,6 +106,7 @@ const SplitButton = /*#__PURE__*/forwardRef((props, forwardedRef) => {
105
106
  children: jsx(SplitTriggerButton, {
106
107
  ref: onRightButtonMountCallback,
107
108
  ariaLabel: dropdownTriggerAriaLabel,
109
+ "data-resin-target": splitTriggerResinTarget,
108
110
  disabled: !!disabled,
109
111
  isInvisible: loading,
110
112
  isOpened: open,
@@ -39,5 +39,7 @@ export type BasicSplitButtonProps = Omit<ButtonProps, 'children'> & {
39
39
  /** Specify a container element to portal the content into. */
40
40
  /** @default document.body */
41
41
  container?: DropdownMenuContentProps['container'];
42
+ /** The resin target for the split trigger button. */
43
+ splitTriggerResinTarget?: string;
42
44
  };
43
45
  export type SplitButtonProps = BasicSplitButtonProps & RequireAllOrNone<Loading, keyof Loading>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@box/blueprint-web",
3
- "version": "12.90.0",
3
+ "version": "12.91.0",
4
4
  "type": "module",
5
5
  "license": "SEE LICENSE IN LICENSE",
6
6
  "publishConfig": {