@box/blueprint-web 12.81.4 → 12.83.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 (10) hide show
  1. package/dist/lib-esm/combobox-group/combobox-group-combobox.d.ts +3 -1
  2. package/dist/lib-esm/combobox-group/combobox-group-combobox.js +59 -53
  3. package/dist/lib-esm/combobox-group/combobox-group.d.ts +1 -0
  4. package/dist/lib-esm/combobox-group/combobox-group.js +2 -1
  5. package/dist/lib-esm/combobox-group/types.d.ts +7 -3
  6. package/dist/lib-esm/index.css +86 -98
  7. package/dist/lib-esm/select/select.js +24 -17
  8. package/dist/lib-esm/select/select.module.js +1 -1
  9. package/dist/lib-esm/switch/switch.module.js +1 -1
  10. package/package.json +1 -1
package/dist/lib-esm/combobox-group/combobox-group-combobox.d.ts CHANGED
@@ -1,2 +1,4 @@
1
+ import { type OptionValue } from '../combobox';
1
2
  import { type ComboboxGroupComboboxProps } from './types';
2
- export declare const ComboboxGroupCombobox: import("react").ForwardRefExoticComponent<ComboboxGroupComboboxProps<true, true, import("../combobox").OptionValue> & import("react").RefAttributes<HTMLInputElement>>;
3
+ export declare const ComboboxGroupCombobox: import("react").ForwardRefExoticComponent<ComboboxGroupComboboxProps<true, true, OptionValue> & import("react").RefAttributes<HTMLInputElement>>;
4
+ export declare const ComboboxGroupComboboxSingleSelect: import("react").ForwardRefExoticComponent<ComboboxGroupComboboxProps<false, true, OptionValue> & import("react").RefAttributes<HTMLInputElement>>;
package/dist/lib-esm/combobox-group/combobox-group-combobox.js CHANGED
@@ -8,58 +8,64 @@ import { Combobox } from '../combobox/combobox.js';
8
8
  import { useComboboxGroupContext } from './combobox-group-context.js';
9
9
  import styles from './combobox-group.module.js';
10
10
 
11
- const ComboboxGroupCombobox = /*#__PURE__*/forwardRef((props, forwardedRef) => {
12
- const {
13
- position = 'leading',
14
- error = false,
15
- portalElement,
16
- disabled,
17
- ...rest
18
- } = props;
19
- const {
20
- errors,
21
- setError,
22
- inlineErrorId,
23
- isDisabled,
24
- isSelectFocused,
25
- setComboboxFocus,
26
- comboboxId,
27
- setSubcomponentId
28
- } = useComboboxGroupContext();
29
- const borderStyles = position === 'trailing' ? styles.trailing : styles.leading;
30
- const handleFocus = useCallback(() => setComboboxFocus(true), [setComboboxFocus]);
31
- const handleBlur = useCallback(() => setComboboxFocus(false), [setComboboxFocus]);
32
- const selectHasError = !!errors.select;
33
- const comboboxHasError = !!errors.combobox;
34
- const isLeading = position === 'leading';
35
- useEffect(() => {
36
- if (isLeading) {
37
- setSubcomponentId(comboboxId);
38
- }
39
- }, [isLeading, comboboxId, setSubcomponentId]);
40
- useEffect(() => {
41
- setError('combobox', error);
42
- }, [error, setError]);
43
- return jsx(Combobox, {
44
- as: "input",
45
- ...rest,
46
- ref: forwardedRef,
47
- "aria-describedby": comboboxHasError ? inlineErrorId : undefined,
48
- "aria-invalid": comboboxHasError,
49
- className: clsx(borderStyles, styles.comboboxContainer, {
50
- [styles.errorSelect]: selectHasError
51
- }, {
52
- [styles.errorCombobox]: comboboxHasError
53
- }, {
54
- [styles.selectHasFocus]: isSelectFocused
55
- }),
56
- disabled: isDisabled,
57
- error: null,
58
- idForLabel: comboboxId,
59
- onBlur: handleBlur,
60
- onFocus: handleFocus,
61
- portalElement: portalElement
11
+ const createComboboxGroupComponent = () => {
12
+ return /*#__PURE__*/forwardRef((props, forwardedRef) => {
13
+ const {
14
+ position = 'leading',
15
+ error = false,
16
+ portalElement,
17
+ disabled,
18
+ onValueChange,
19
+ ...rest
20
+ } = props;
21
+ const {
22
+ errors,
23
+ setError,
24
+ inlineErrorId,
25
+ isDisabled,
26
+ isSelectFocused,
27
+ setComboboxFocus,
28
+ comboboxId,
29
+ setSubcomponentId
30
+ } = useComboboxGroupContext();
31
+ const borderStyles = position === 'trailing' ? styles.trailing : styles.leading;
32
+ const handleFocus = useCallback(() => setComboboxFocus(true), [setComboboxFocus]);
33
+ const handleBlur = useCallback(() => setComboboxFocus(false), [setComboboxFocus]);
34
+ const selectHasError = !!errors.select;
35
+ const comboboxHasError = !!errors.combobox;
36
+ const isLeading = position === 'leading';
37
+ useEffect(() => {
38
+ if (isLeading) {
39
+ setSubcomponentId(comboboxId);
40
+ }
41
+ }, [isLeading, comboboxId, setSubcomponentId]);
42
+ useEffect(() => {
43
+ setError('combobox', error);
44
+ }, [error, setError]);
45
+ return jsx(Combobox, {
46
+ as: "input",
47
+ ...rest,
48
+ ref: forwardedRef,
49
+ "aria-describedby": comboboxHasError ? inlineErrorId : undefined,
50
+ "aria-invalid": comboboxHasError,
51
+ className: clsx(borderStyles, styles.comboboxContainer, {
52
+ [styles.errorSelect]: selectHasError
53
+ }, {
54
+ [styles.errorCombobox]: comboboxHasError
55
+ }, {
56
+ [styles.selectHasFocus]: isSelectFocused
57
+ }),
58
+ disabled: disabled ?? isDisabled,
59
+ error: null,
60
+ idForLabel: comboboxId,
61
+ onBlur: handleBlur,
62
+ onFocus: handleFocus,
63
+ onValueChange: onValueChange,
64
+ portalElement: portalElement
65
+ });
62
66
  });
63
- });
67
+ };
68
+ const ComboboxGroupCombobox = createComboboxGroupComponent();
69
+ const ComboboxGroupComboboxSingleSelect = createComboboxGroupComponent();
64
70
 
65
- export { ComboboxGroupCombobox };
71
+ export { ComboboxGroupCombobox, ComboboxGroupComboboxSingleSelect };
package/dist/lib-esm/combobox-group/combobox-group.d.ts CHANGED
@@ -2,5 +2,6 @@ import { type ComboboxGroupProps } from './types';
2
2
  export declare const ComboboxGroup: {
3
3
  ({ children, disabled, ...props }: ComboboxGroupProps): import("react/jsx-runtime").JSX.Element;
4
4
  Combobox: import("react").ForwardRefExoticComponent<import("./types").ComboboxGroupComboboxProps<true, true, import("../combobox").OptionValue> & import("react").RefAttributes<HTMLInputElement>>;
5
+ ComboboxSingleSelect: import("react").ForwardRefExoticComponent<import("./types").ComboboxGroupComboboxProps<false, true, import("../combobox").OptionValue> & import("react").RefAttributes<HTMLInputElement>>;
5
6
  Select: import("react").ForwardRefExoticComponent<import("./types").ComboboxGroupSelectProps & import("react").RefAttributes<HTMLButtonElement>>;
6
7
  };
package/dist/lib-esm/combobox-group/combobox-group.js CHANGED
@@ -4,7 +4,7 @@ import { forwardRef } from 'react';
4
4
  import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
5
5
  import { InlineError } from '../primitives/inline-error/inline-error.js';
6
6
  import { useLabelable } from '../util-components/labelable/useLabelable.js';
7
- import { ComboboxGroupCombobox } from './combobox-group-combobox.js';
7
+ import { ComboboxGroupCombobox, ComboboxGroupComboboxSingleSelect } from './combobox-group-combobox.js';
8
8
  import { ComboboxGroupProvider, useComboboxGroupContext } from './combobox-group-context.js';
9
9
  import { ComboboxGroupSelect } from './combobox-group-select.js';
10
10
  import styles from './combobox-group.module.js';
@@ -61,6 +61,7 @@ const ComboboxGroup = ({
61
61
  });
62
62
  };
63
63
  ComboboxGroup.Combobox = ComboboxGroupCombobox;
64
+ ComboboxGroup.ComboboxSingleSelect = ComboboxGroupComboboxSingleSelect;
64
65
  ComboboxGroup.Select = ComboboxGroupSelect;
65
66
 
66
67
  export { ComboboxGroup };
package/dist/lib-esm/combobox-group/types.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { type ComboboxBaseProps, type OptionValue } from '../combobox/types';
1
+ import { type ComboboxBaseProps, type ComboboxValue, type OptionValue } from '../combobox/types';
2
2
  import { type SelectProps } from '../select/types';
3
3
  export interface ComboboxGroupProps {
4
4
  children: React.ReactNode;
@@ -13,9 +13,13 @@ export interface ComboboxGroupSelectProps extends Omit<SelectProps, 'disabled'>
13
13
  label: never;
14
14
  position?: 'leading' | 'trailing';
15
15
  }
16
- export interface ComboboxGroupComboboxProps<Multiple extends boolean = true, FreeInput extends boolean = true, T extends OptionValue = OptionValue> extends ComboboxBaseProps<Multiple, FreeInput, T> {
17
- disabled?: never;
16
+ export interface ComboboxGroupComboboxProps<Multiple extends boolean = true, FreeInput extends boolean = true, T extends OptionValue = OptionValue> extends Omit<ComboboxBaseProps<Multiple, FreeInput, T>, 'defaultValue' | 'value' | 'onValueChange'> {
17
+ disabled?: boolean;
18
18
  error?: boolean;
19
19
  label: never;
20
20
  position?: 'leading' | 'trailing';
21
+ defaultValue?: ComboboxValue<Multiple, FreeInput, T>;
22
+ value?: ComboboxValue<Multiple, FreeInput, T>;
23
+ onValueChange?: (value: ComboboxValue<Multiple, FreeInput, T>) => void;
21
24
  }
25
+ export type ComboboxGroupComboboxSingleSelectProps = ComboboxGroupComboboxProps<false, true, OptionValue>;
package/dist/lib-esm/index.css CHANGED
@@ -3048,7 +3048,7 @@
3048
3048
  --blueprint-select-border-error-left-width:none;
3049
3049
  }
3050
3050
 
3051
- .bp_select_module_container--02e36[data-modern=false]{
3051
+ .bp_select_module_container--a20b7[data-modern=false]{
3052
3052
  --select-gap:var(--space-2);
3053
3053
  --select-label-color:var(--text-text-on-light);
3054
3054
  --select-trigger-btn-gap:var(--space-2);
@@ -3078,28 +3078,28 @@
3078
3078
  --select-trigger-btn-pencil-height:var(--size-4);
3079
3079
  }
3080
3080
 
3081
- .bp_select_module_container--02e36[data-modern=true]{
3081
+ .bp_select_module_container--a20b7[data-modern=true]{
3082
3082
  --select-gap:var(--bp-space-020);
3083
3083
  --select-label-color:var(--bp-text-text-on-light);
3084
3084
  --select-trigger-btn-gap:var(--bp-space-020);
3085
3085
  --select-trigger-btn-height:var(--bp-size-100);
3086
3086
  --select-trigger-btn-color:var(--bp-text-text-on-light);
3087
- --select-trigger-btn-bg-color:var(--bp-surface-dropdown-surface);
3088
- --select-trigger-btn-border-top:var(--blueprint-select-border-top-width, var(--bp-border-01)) solid var(--bp-border-dropdown-border);
3089
- --select-trigger-btn-border-right:var(--blueprint-select-border-right-width, var(--bp-border-01)) solid var(--bp-border-dropdown-border);
3090
- --select-trigger-btn-border-bottom:var(--blueprint-select-border-bottom-width, var(--bp-border-01)) solid var(--bp-border-dropdown-border);
3091
- --select-trigger-btn-border-left:var(--blueprint-select-border-left-width, var(--border-1)) solid var(--bp-border-dropdown-border);
3087
+ --select-trigger-btn-bg-color:var(--bp-surface-select-surface);
3088
+ --select-trigger-btn-border-top:var(--blueprint-select-border-top-width, var(--bp-border-01)) solid var(--bp-border-select-border);
3089
+ --select-trigger-btn-border-right:var(--blueprint-select-border-right-width, var(--bp-border-01)) solid var(--bp-border-select-border);
3090
+ --select-trigger-btn-border-bottom:var(--blueprint-select-border-bottom-width, var(--bp-border-01)) solid var(--bp-border-select-border);
3091
+ --select-trigger-btn-border-left:var(--blueprint-select-border-left-width, var(--border-1)) solid var(--bp-border-select-border);
3092
3092
  --select-trigger-btn-radius:var(--blueprint-select-trigger-radius, var(--bp-radius-06));
3093
3093
  --select-trigger-btn-box-shadow:var(--dropshadow-2);
3094
3094
  --select-trigger-btn-padding-inline:var(--bp-space-030);
3095
- --select-trigger-btn-error-bg-color:var(--bp-surface-dropdown-surface-error);
3096
- --select-trigger-btn-focus-bg-color:var(--bp-surface-dropdown-surface-error-focus);
3097
- --select-trigger-btn-error-border-top:var(--blueprint-select-border-error-top-width, var(--bp-border-02)) solid var(--bp-border-dropdown-border-error);
3098
- --select-trigger-btn-error-border-right:var(--blueprint-select-border-error-right-width, var(--bp-border-02)) solid var(--bp-border-dropdown-border-error);
3099
- --select-trigger-btn-error-border-bottom:var(--blueprint-select-border-error-bottom-width, var(--bp-border-02)) solid var(--bp-border-dropdown-border-error);
3100
- --select-trigger-btn-error-border-left:var(--blueprint-select-border-error-left-width, var(--bp-border-02)) solid var(--bp-border-dropdown-border-error);
3095
+ --select-trigger-btn-error-bg-color:var(--bp-surface-select-surface);
3096
+ --select-trigger-btn-focus-bg-color:var(--bp-surface-select-surface);
3097
+ --select-trigger-btn-error-border-top:var(--blueprint-select-border-error-top-width, var(--bp-border-02)) solid var(--bp-border-select-border-error);
3098
+ --select-trigger-btn-error-border-right:var(--blueprint-select-border-error-right-width, var(--bp-border-02)) solid var(--bp-border-select-border-error);
3099
+ --select-trigger-btn-error-border-bottom:var(--blueprint-select-border-error-bottom-width, var(--bp-border-02)) solid var(--bp-border-select-border-error);
3100
+ --select-trigger-btn-error-border-left:var(--blueprint-select-border-error-left-width, var(--bp-border-02)) solid var(--bp-border-select-border-error);
3101
3101
  --select-trigger-btn-focus-border:var(--bp-border-02) solid var(--bp-outline-focus-on-light);
3102
- --select-trigger-btn-hover-bg-color:var(--bp-surface-dropdown-surface-hover);
3102
+ --select-trigger-btn-hover-bg-color:var(--bp-surface-select-surface);
3103
3103
  --select-trigger-btn-hover-border-color:var(--bp-border-select-border-hover);
3104
3104
  --select-trigger-btn-caret-width:var(--bp-size-030);
3105
3105
  --select-trigger-btn-caret-height:var(--bp-size-030);
@@ -3108,7 +3108,7 @@
3108
3108
  --select-trigger-btn-pencil-height:var(--bp-size-040);
3109
3109
  }
3110
3110
 
3111
- .bp_select_module_container--02e36{
3111
+ .bp_select_module_container--a20b7{
3112
3112
  display:flex;
3113
3113
  flex-direction:column;
3114
3114
  font-family:var(--body-default-font-family);
@@ -3121,10 +3121,10 @@
3121
3121
  text-decoration:var(--body-default-text-decoration);
3122
3122
  text-transform:var(--body-default-text-case);
3123
3123
  }
3124
- .bp_select_module_container--02e36.bp_select_module_disabled--02e36{
3124
+ .bp_select_module_container--a20b7.bp_select_module_disabled--a20b7{
3125
3125
  opacity:60%;
3126
3126
  }
3127
- .bp_select_module_container--02e36 .bp_select_module_label--02e36{
3127
+ .bp_select_module_container--a20b7 .bp_select_module_label--a20b7{
3128
3128
  color:var(--select-label-color);
3129
3129
  flex:0 0 fit-content;
3130
3130
  font-family:var(--body-default-bold-font-family);
@@ -3137,7 +3137,7 @@
3137
3137
  text-decoration:var(--body-default-bold-text-decoration);
3138
3138
  text-transform:var(--body-default-bold-text-case);
3139
3139
  }
3140
- .bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36{
3140
+ .bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7{
3141
3141
  align-items:center;
3142
3142
  background-color:var(--select-trigger-btn-bg-color);
3143
3143
  border-bottom:var(--select-trigger-btn-border-bottom);
@@ -3166,58 +3166,58 @@
3166
3166
  text-transform:var(--body-default-text-case);
3167
3167
  width:100%;
3168
3168
  }
3169
- .bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36 span:first-child{
3169
+ .bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7 span:first-child{
3170
3170
  overflow:hidden;
3171
3171
  text-overflow:ellipsis;
3172
3172
  white-space:nowrap;
3173
3173
  }
3174
- .bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36:disabled{
3174
+ .bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7:disabled{
3175
3175
  cursor:default;
3176
3176
  }
3177
- .bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36.bp_select_module_readonly--02e36:not(:disabled){
3177
+ .bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7.bp_select_module_readonly--a20b7:not(:disabled){
3178
3178
  background-color:var(--gray-02);
3179
3179
  box-shadow:none;
3180
3180
  color:var(--text-text-on-light-secondary);
3181
3181
  cursor:default;
3182
3182
  }
3183
- .bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36:not(.bp_select_module_readonly--02e36):not(:disabled).bp_select_module_error--02e36,.bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36:not(.bp_select_module_readonly--02e36):not(:disabled)[aria-invalid=true]{
3183
+ .bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7:not(.bp_select_module_readonly--a20b7):not(:disabled).bp_select_module_error--a20b7,.bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7:not(.bp_select_module_readonly--a20b7):not(:disabled)[aria-invalid=true]{
3184
3184
  background-color:var(----select-trigger-btn-error-bg-color);
3185
3185
  border-bottom:var(--select-trigger-btn-error-border-bottom);
3186
3186
  border-left:var(--select-trigger-btn-error-border-left);
3187
3187
  border-right:var(--select-trigger-btn-error-border-right);
3188
3188
  border-top:var(--select-trigger-btn-error-border-top);
3189
3189
  }
3190
- .bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36:not(.bp_select_module_readonly--02e36):focus,.bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36:not(.bp_select_module_readonly--02e36):not(:disabled).bp_select_module_error--02e36:focus,.bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36:not(.bp_select_module_readonly--02e36):not(:disabled)[aria-invalid=true]:focus{
3190
+ .bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7:not(.bp_select_module_readonly--a20b7):focus,.bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7:not(.bp_select_module_readonly--a20b7):not(:disabled).bp_select_module_error--a20b7:focus,.bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7:not(.bp_select_module_readonly--a20b7):not(:disabled)[aria-invalid=true]:focus{
3191
3191
  background-color:var(--select-trigger-btn-focus-bg-color);
3192
3192
  border:var(--select-trigger-btn-focus-border);
3193
3193
  }
3194
- .bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36:not(.bp_select_module_readonly--02e36):not(:disabled):not(:focus):not(.bp_select_module_error--02e36):not([aria-invalid]):hover{
3194
+ .bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7:not(.bp_select_module_readonly--a20b7):not(:disabled):not(:focus):not(.bp_select_module_error--a20b7):not([aria-invalid]):hover{
3195
3195
  background-color:var(--select-trigger-btn-hover-bg-color);
3196
3196
  border-color:var(--select-trigger-btn-hover-border-color);
3197
3197
  }
3198
- .bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36 .bp_select_module_iconWrapper--02e36{
3198
+ .bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7 .bp_select_module_iconWrapper--a20b7{
3199
3199
  flex-shrink:0;
3200
3200
  -webkit-user-select:none;
3201
3201
  user-select:none;
3202
3202
  }
3203
- .bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36 .bp_select_module_iconCaret--02e36{
3203
+ .bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7 .bp_select_module_iconCaret--a20b7{
3204
3204
  display:block;
3205
3205
  height:var(--select-trigger-btn-caret-height);
3206
3206
  width:var(--select-trigger-btn-caret-width);
3207
3207
  }
3208
- .bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36 .bp_select_module_iconCaret--02e36 path{
3208
+ .bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7 .bp_select_module_iconCaret--a20b7 path{
3209
3209
  fill:var(--select-trigger-btn-caret-color);
3210
3210
  }
3211
- .bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36 .bp_select_module_iconPencilCrossed--02e36{
3211
+ .bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7 .bp_select_module_iconPencilCrossed--a20b7{
3212
3212
  display:block;
3213
3213
  height:var(--select-trigger-btn-pencil-height);
3214
3214
  width:var(--select-trigger-btn-pencil-width);
3215
3215
  }
3216
- .bp_select_module_container--02e36 .bp_select_module_triggerBtn--02e36[data-state=open] .bp_select_module_icon--02e36{
3216
+ .bp_select_module_container--a20b7 .bp_select_module_triggerBtn--a20b7[data-state=open] .bp_select_module_icon--a20b7{
3217
3217
  transform:rotate(180deg);
3218
3218
  }
3219
3219
 
3220
- .bp_select_module_content--02e36[data-modern=false]{
3220
+ .bp_select_module_content--a20b7[data-modern=false]{
3221
3221
  --select-content-bg-color:var(--surface-menu-surface);
3222
3222
  --select-content-backdrop-filter:none;
3223
3223
  --select-content-border:var(--border-1) solid var(--border-card-border);
@@ -3225,6 +3225,7 @@
3225
3225
  --select-content-viewport-padding-block:var(--space-3);
3226
3226
  --select-content-viewport-padding-inline:var(--space-3);
3227
3227
  --select-content-viewport-option-gap:var(--space-2);
3228
+ --select-content-viewport-option-text-color:var(--bp-text-text-on-light);
3228
3229
  --select-content-viewport-option-border:var(--border-2) solid #0000;
3229
3230
  --select-content-viewport-option-border-radius:var(--space-2);
3230
3231
  --select-content-viewport-option-padding-block:var(--space-2);
@@ -3243,7 +3244,7 @@
3243
3244
  --select-content-viewport-option-separator-margin-block:var(--space-2);
3244
3245
  }
3245
3246
 
3246
- .bp_select_module_content--02e36[data-modern=true]{
3247
+ .bp_select_module_content--a20b7[data-modern=true]{
3247
3248
  --select-content-bg-color:var(--bp-surface-menu-surface-dropdown);
3248
3249
  --select-content-backdrop-filter:blur(16px);
3249
3250
  --select-content-border:var(--bp-border-01) solid var(--bp-border-card-border);
@@ -3251,8 +3252,9 @@
3251
3252
  --select-content-viewport-padding-block:var(--bp-space-030);
3252
3253
  --select-content-viewport-padding-inline:var(--bp-space-030);
3253
3254
  --select-content-viewport-option-gap:var(--bp-space-020);
3255
+ --select-content-viewport-option-text-color:var(--bp-text-text-on-light);
3254
3256
  --select-content-viewport-option-border:var(--bp-border-02) solid #0000;
3255
- --select-content-viewport-option-border-radius:var(--bp-radius-10);
3257
+ --select-content-viewport-option-border-radius:var(--bp-radius-06);
3256
3258
  --select-content-viewport-option-padding-block:var(--bp-space-020);
3257
3259
  --select-content-viewport-option-padding-inline:var(--bp-space-100) var(--bp-space-020);
3258
3260
  --select-content-viewport-option-focus-bg-color:var(--bp-surface-menu-item-surface-hover);
@@ -3269,7 +3271,7 @@
3269
3271
  --select-content-viewport-option-separator-margin-block:var(--bp-space-020);
3270
3272
  }
3271
3273
 
3272
- .bp_select_module_content--02e36{
3274
+ .bp_select_module_content--a20b7{
3273
3275
  backdrop-filter:var(--select-content-backdrop-filter);
3274
3276
  background-color:var(--select-content-bg-color);
3275
3277
  border:var(--select-content-border);
@@ -3289,13 +3291,14 @@
3289
3291
  text-transform:var(--body-default-text-case);
3290
3292
  z-index:380;
3291
3293
  }
3292
- .bp_select_module_content--02e36 .bp_select_module_viewport--02e36{
3294
+ .bp_select_module_content--a20b7 .bp_select_module_viewport--a20b7{
3293
3295
  padding-block:var(--select-content-viewport-padding-block);
3294
3296
  padding-inline:var(--select-content-viewport-padding-inline);
3295
3297
  }
3296
- .bp_select_module_content--02e36 .bp_select_module_viewport--02e36 .bp_select_module_option--02e36{
3298
+ .bp_select_module_content--a20b7 .bp_select_module_viewport--a20b7 .bp_select_module_option--a20b7{
3297
3299
  border:var(--select-content-viewport-option-border);
3298
3300
  border-radius:var(--select-content-viewport-option-border-radius);
3301
+ color:var(--select-content-viewport-option-text-color);
3299
3302
  cursor:pointer;
3300
3303
  display:flex;
3301
3304
  flex-wrap:wrap;
@@ -3308,29 +3311,29 @@
3308
3311
  -webkit-user-select:none;
3309
3312
  user-select:none;
3310
3313
  }
3311
- .bp_select_module_content--02e36 .bp_select_module_viewport--02e36 .bp_select_module_option--02e36[data-disabled]{
3314
+ .bp_select_module_content--a20b7 .bp_select_module_viewport--a20b7 .bp_select_module_option--a20b7[data-disabled]{
3312
3315
  opacity:60%;
3313
3316
  pointer-events:none;
3314
3317
  }
3315
- .bp_select_module_content--02e36 .bp_select_module_viewport--02e36 .bp_select_module_option--02e36[data-highlighted]{
3318
+ .bp_select_module_content--a20b7 .bp_select_module_viewport--a20b7 .bp_select_module_option--a20b7[data-highlighted]{
3316
3319
  background-color:var(--select-content-viewport-option-focus-bg-color);
3317
3320
  border:var(--select-content-viewport-option-focus-border);
3318
3321
  }
3319
- .bp_select_module_content--02e36 .bp_select_module_viewport--02e36 .bp_select_module_option--02e36:active{
3322
+ .bp_select_module_content--a20b7 .bp_select_module_viewport--a20b7 .bp_select_module_option--a20b7:active{
3320
3323
  background-color:var(--select-content-viewport-option-active-bg-color);
3321
3324
  border:var(--select-content-viewport-option-active-border);
3322
3325
  }
3323
- .bp_select_module_content--02e36 .bp_select_module_viewport--02e36 .bp_select_module_option--02e36:hover{
3326
+ .bp_select_module_content--a20b7 .bp_select_module_viewport--a20b7 .bp_select_module_option--a20b7:hover{
3324
3327
  background-color:var(--select-content-viewport-option-hover-bg-color);
3325
3328
  }
3326
- .bp_select_module_content--02e36 .bp_select_module_viewport--02e36 .bp_select_module_option--02e36 span:first-child{
3329
+ .bp_select_module_content--a20b7 .bp_select_module_viewport--a20b7 .bp_select_module_option--a20b7 span:first-child{
3327
3330
  overflow:hidden;
3328
3331
  overflow-wrap:break-word;
3329
3332
  }
3330
- .bp_select_module_content--02e36 .bp_select_module_viewport--02e36 .bp_select_module_option--02e36 .bp_select_module_secondaryText--02e36{
3333
+ .bp_select_module_content--a20b7 .bp_select_module_viewport--a20b7 .bp_select_module_option--a20b7 .bp_select_module_secondaryText--a20b7{
3331
3334
  color:var(--select-content-viewport-option-secondary-text-color);
3332
3335
  }
3333
- .bp_select_module_content--02e36 .bp_select_module_viewport--02e36 .bp_select_module_option--02e36 .bp_select_module_indicator--02e36{
3336
+ .bp_select_module_content--a20b7 .bp_select_module_viewport--a20b7 .bp_select_module_option--a20b7 .bp_select_module_indicator--a20b7{
3334
3337
  align-items:center;
3335
3338
  display:flex;
3336
3339
  height:var(--select-content-viewport-option-indicator-height);
@@ -3339,10 +3342,10 @@
3339
3342
  position:absolute;
3340
3343
  top:0;
3341
3344
  }
3342
- .bp_select_module_content--02e36 .bp_select_module_viewport--02e36 .bp_select_module_option--02e36 .bp_select_module_indicator--02e36 path{
3345
+ .bp_select_module_content--a20b7 .bp_select_module_viewport--a20b7 .bp_select_module_option--a20b7 .bp_select_module_indicator--a20b7 path{
3343
3346
  fill:var(--select-content-viewport-option-indicator-color);
3344
3347
  }
3345
- .bp_select_module_content--02e36 .bp_select_module_viewport--02e36 .bp_select_module_separator--02e36{
3348
+ .bp_select_module_content--a20b7 .bp_select_module_viewport--a20b7 .bp_select_module_separator--a20b7{
3346
3349
  background-color:var(--select-content-viewport-option-separator-bg-color);
3347
3350
  flex-shrink:0;
3348
3351
  height:var(--select-content-viewport-option-separator-height);
@@ -9362,55 +9365,52 @@ div[data-radix-popper-content-wrapper]:has([role=menu]):has([data-state=open]):h
9362
9365
  min-width:var(--split-button-dropdown-min-width);
9363
9366
  }
9364
9367
 
9365
- .bp_switch_module_option--747a4[data-modern=false]{
9366
- --switch-width:var(--size-10);
9368
+ .bp_switch_module_option--f8df5[data-modern=false]{
9367
9369
  --switch-height:var(--size-5);
9368
9370
  --switch-margin-left:var(--space-10);
9369
9371
  --switch-margin-right:var(--space-3);
9370
- --description-margin:calc(var(--switch-margin-right) + var(--switch-width));
9371
- --thumb-width:var(--size-5);
9372
- --thumb-height:var(--size-5);
9373
- --thumb-bg:var(--surface-switch-surface);
9374
- --thumb-border-off:var(--border-1) solid var(--border-switch-border);
9375
- --thumb-border-off-hover:var(--border-1) solid var(--border-switch-border);
9376
- --thumb-border-on:var(--border-1) solid var(--border-switch-border);
9377
- --thumb-border-on-hover:var(--border-1) solid var(--border-switch-border);
9378
- --thumb-radius:var(--size-10);
9379
- --thumb-shadow:var(--dropshadow-3);
9380
9372
  --switch-bg-off:var(--surface-switch-surface-off);
9381
9373
  --switch-bg-off-hover:var(--surface-switch-surface-off);
9382
9374
  --switch-bg-on:var(--surface-switch-surface-on);
9383
9375
  --switch-bg-on-hover:var(--surface-switch-surface-on);
9384
9376
  --switch-radius:var(--size-10);
9377
+ --switch-padding-inline:0;
9378
+ --switch-width:var(--size-10);
9385
9379
  --switch-outline:var(--outline-focus-on-light);
9386
9380
  --switch-disabled-opacity:.5;
9381
+ --description-margin:calc(var(--switch-margin-right) + var(--switch-width));
9382
+ --thumb-width:var(--size-5);
9383
+ --thumb-height:var(--size-5);
9384
+ --thumb-bg:var(--surface-switch-surface);
9385
+ --thumb-border:var(--border-1) solid var(--border-switch-border);
9386
+ --thumb-radius:var(--size-10);
9387
+ --thumb-shadow:var(--dropshadow-3);
9387
9388
  }
9388
9389
 
9389
- .bp_switch_module_option--747a4[data-modern=true]{
9390
- --switch-width:var(--bp-size-110);
9390
+ .bp_switch_module_option--f8df5[data-modern=true]{
9391
9391
  --switch-height:var(--bp-size-060);
9392
9392
  --switch-margin-left:var(--bp-space-100);
9393
9393
  --switch-margin-right:var(--bp-space-030);
9394
- --description-margin:calc(var(--switch-margin-right) + var(--switch-width));
9395
- --thumb-width:var(--bp-size-060);
9396
- --thumb-height:var(--bp-size-060);
9397
- --thumb-bg:var(--bp-surface-switch-surface);
9398
- --thumb-border-off:var(--bp-border-02) solid var(--bp-surface-switch-surface-off);
9399
- --thumb-border-off-hover:var(--bp-border-02) solid var(--bp-surface-switch-surface-off-hover);
9400
- --thumb-border-on:var(--bp-border-02) solid var(--bp-surface-switch-surface-on);
9401
- --thumb-border-on-hover:var(--bp-border-02) solid var(--bp-surface-switch-surface-on-hover);
9402
- --thumb-radius:var(--bp-size-100);
9403
- --thumb-shadow:var(--dropshadow-3);
9404
9394
  --switch-bg-off:var(--bp-surface-switch-surface-off);
9405
9395
  --switch-bg-off-hover:var(--bp-surface-switch-surface-off-hover);
9406
9396
  --switch-bg-on:var(--bp-surface-switch-surface-on);
9407
9397
  --switch-bg-on-hover:var(--bp-surface-switch-surface-on-hover);
9408
9398
  --switch-radius:var(--bp-size-100);
9399
+ --switch-padding-inline:var(--bp-space-005);
9400
+ --switch-base-width:var(--bp-size-110);
9401
+ --switch-width:calc(var(--switch-base-width) - var(--switch-padding-inline)*2);
9409
9402
  --switch-outline:var(--bp-outline-focus-on-light);
9410
9403
  --switch-disabled-opacity:.6;
9404
+ --description-margin:calc(var(--switch-margin-right) + var(--switch-base-width));
9405
+ --thumb-width:var(--bp-size-050);
9406
+ --thumb-height:var(--bp-size-050);
9407
+ --thumb-bg:var(--bp-surface-switch-surface);
9408
+ --thumb-border:none;
9409
+ --thumb-radius:var(--bp-size-100);
9410
+ --thumb-shadow:var(--dropshadow-3);
9411
9411
  }
9412
9412
 
9413
- .bp_switch_module_option--747a4{
9413
+ .bp_switch_module_option--f8df5{
9414
9414
  display:flex;
9415
9415
  flex-direction:column;
9416
9416
  font-family:var(--body-default-font-family);
@@ -9422,31 +9422,31 @@ div[data-radix-popper-content-wrapper]:has([role=menu]):has([data-state=open]):h
9422
9422
  text-decoration:var(--body-default-text-decoration);
9423
9423
  text-transform:var(--body-default-text-case);
9424
9424
  }
9425
- .bp_switch_module_option--747a4 .bp_switch_module_label--747a4{
9425
+ .bp_switch_module_option--f8df5 .bp_switch_module_label--f8df5{
9426
9426
  cursor:pointer;
9427
9427
  display:inline-flex;
9428
9428
  flex-direction:row;
9429
9429
  width:-moz-fit-content;
9430
9430
  width:fit-content;
9431
9431
  }
9432
- .bp_switch_module_option--747a4 .bp_switch_module_label--747a4.bp_switch_module_rightAlign--747a4{
9432
+ .bp_switch_module_option--f8df5 .bp_switch_module_label--f8df5.bp_switch_module_rightAlign--f8df5{
9433
9433
  flex-direction:row-reverse;
9434
9434
  justify-content:space-between;
9435
9435
  width:unset;
9436
9436
  }
9437
- .bp_switch_module_option--747a4 .bp_switch_module_label--747a4:has(.bp_switch_module_switch--747a4:disabled){
9437
+ .bp_switch_module_option--f8df5 .bp_switch_module_label--f8df5:has(.bp_switch_module_switch--f8df5:disabled){
9438
9438
  cursor:default;
9439
9439
  }
9440
- .bp_switch_module_option--747a4 .bp_switch_module_description--747a4{
9440
+ .bp_switch_module_option--f8df5 .bp_switch_module_description--f8df5{
9441
9441
  margin-left:var(--description-margin);
9442
9442
  }
9443
- .bp_switch_module_option--747a4 .bp_switch_module_description--747a4.bp_switch_module_rightAlign--747a4{
9443
+ .bp_switch_module_option--f8df5 .bp_switch_module_description--f8df5.bp_switch_module_rightAlign--f8df5{
9444
9444
  margin-left:unset;
9445
9445
  margin-right:var(--description-margin);
9446
9446
  }
9447
- .bp_switch_module_option--747a4 .bp_switch_module_thumb--747a4{
9447
+ .bp_switch_module_option--f8df5 .bp_switch_module_thumb--f8df5{
9448
9448
  background-color:var(--thumb-bg);
9449
- border:var(--thumb-border-off);
9449
+ border:var(--thumb-border);
9450
9450
  border-radius:var(--thumb-radius);
9451
9451
  box-shadow:var(--thumb-shadow);
9452
9452
  box-sizing:border-box;
@@ -9456,7 +9456,7 @@ div[data-radix-popper-content-wrapper]:has([role=menu]):has([data-state=open]):h
9456
9456
  width:var(--thumb-width);
9457
9457
  will-change:transform;
9458
9458
  }
9459
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4{
9459
+ .bp_switch_module_option--f8df5 .bp_switch_module_switch--f8df5{
9460
9460
  all:unset;
9461
9461
  align-items:center;
9462
9462
  background-color:var(--switch-bg-off);
@@ -9465,51 +9465,39 @@ div[data-radix-popper-content-wrapper]:has([role=menu]):has([data-state=open]):h
9465
9465
  flex-shrink:0;
9466
9466
  height:var(--switch-height);
9467
9467
  margin-right:var(--switch-margin-right);
9468
+ padding-inline:var(--switch-padding-inline);
9468
9469
  position:relative;
9469
9470
  transition:background-color .4s;
9470
9471
  width:var(--switch-width);
9471
9472
  will-change:transition;
9472
9473
  }
9473
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4:disabled{
9474
+ .bp_switch_module_option--f8df5 .bp_switch_module_switch--f8df5:disabled{
9474
9475
  opacity:var(--switch-disabled-opacity);
9475
9476
  }
9476
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4.bp_switch_module_rightAlign--747a4{
9477
+ .bp_switch_module_option--f8df5 .bp_switch_module_switch--f8df5.bp_switch_module_rightAlign--f8df5{
9477
9478
  margin-left:var(--switch-margin-left);
9478
9479
  margin-right:unset;
9479
9480
  }
9480
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4:focus-visible{
9481
+ .bp_switch_module_option--f8df5 .bp_switch_module_switch--f8df5:focus-visible{
9481
9482
  background-color:var(--switch-bg-off-hover);
9482
9483
  box-shadow:0 0 0 var(--border-1, 1px) var(--background-background), 0 0 0 var(--border-3) var(--switch-outline);
9483
9484
  }
9484
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4:focus-visible .bp_switch_module_thumb--747a4{
9485
- border:var(--thumb-border-off-hover);
9486
- }
9487
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4:hover:not(:disabled){
9485
+ .bp_switch_module_option--f8df5 .bp_switch_module_switch--f8df5:hover:not(:disabled){
9488
9486
  background-color:var(--switch-bg-off-hover);
9489
9487
  }
9490
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4:hover:not(:disabled) .bp_switch_module_thumb--747a4{
9491
- border:var(--thumb-border-off-hover);
9492
- }
9493
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4[aria-checked=true]{
9488
+ .bp_switch_module_option--f8df5 .bp_switch_module_switch--f8df5[aria-checked=true]{
9494
9489
  background-color:var(--switch-bg-on);
9495
9490
  }
9496
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4[aria-checked=true] .bp_switch_module_thumb--747a4{
9497
- border:var(--thumb-border-on);
9491
+ .bp_switch_module_option--f8df5 .bp_switch_module_switch--f8df5[aria-checked=true] .bp_switch_module_thumb--f8df5{
9498
9492
  transform:translateX(calc(var(--switch-width) - var(--thumb-width)));
9499
9493
  }
9500
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4[aria-checked=true]:focus-visible{
9494
+ .bp_switch_module_option--f8df5 .bp_switch_module_switch--f8df5[aria-checked=true]:focus-visible{
9501
9495
  background-color:var(--switch-bg-on-hover);
9502
9496
  box-shadow:0 0 0 var(--border-1, 1px) var(--background-background), 0 0 0 var(--border-3) var(--switch-outline);
9503
9497
  }
9504
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4[aria-checked=true]:focus-visible .bp_switch_module_thumb--747a4{
9505
- border:var(--thumb-border-on-hover);
9506
- }
9507
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4[aria-checked=true]:hover:not(:disabled){
9498
+ .bp_switch_module_option--f8df5 .bp_switch_module_switch--f8df5[aria-checked=true]:hover:not(:disabled){
9508
9499
  background-color:var(--switch-bg-on-hover);
9509
9500
  }
9510
- .bp_switch_module_option--747a4 .bp_switch_module_switch--747a4[aria-checked=true]:hover:not(:disabled) .bp_switch_module_thumb--747a4{
9511
- border:var(--thumb-border-on-hover);
9512
- }
9513
9501
 
9514
9502
  .bp_text_button_module_textButton--985ec[data-modern=false]{
9515
9503
  --text-button-text-color:var(--text-cta-link);
package/dist/lib-esm/select/select.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { jsx, jsxs } from 'react/jsx-runtime';
2
2
  import { PencilCrossed, Caret, Checkmark } from '@box/blueprint-web-assets/icons/Fill';
3
- import { CheckmarkCircle } from '@box/blueprint-web-assets/icons/Medium';
4
- import { Size5 } from '@box/blueprint-web-assets/tokens/px-tokens';
3
+ import { ChevronDown } from '@box/blueprint-web-assets/icons/Medium';
4
+ import { bpIconIconOnLight, bpSize030 } from '@box/blueprint-web-assets/tokens/tokens';
5
5
  import * as ScrollArea from '@radix-ui/react-scroll-area';
6
6
  import * as SelectPrimitive from '@radix-ui/react-select';
7
7
  import clsx from 'clsx';
@@ -39,6 +39,9 @@ const Root = /*#__PURE__*/forwardRef((props, forwardedRef) => {
39
39
  ...triggerProps
40
40
  } = props;
41
41
  const selectId = useUniqueId('select-', !id) || id || 'default-select-id';
42
+ const {
43
+ enableModernizedComponents
44
+ } = useBlueprintModernization();
42
45
  const hasError = !!error && !disabled;
43
46
  // Restrict consumers from opening options menu when Root is disabled
44
47
  const isSelectDefaultOpen = defaultOpen && !disabled;
@@ -64,14 +67,24 @@ const Root = /*#__PURE__*/forwardRef((props, forwardedRef) => {
64
67
  const ariaDescribedBy = clsx(triggerProps['aria-describedby'], {
65
68
  [inlineErrorId]: hasError
66
69
  });
67
- const icon = readonly ? jsx(PencilCrossed, {
68
- className: styles.iconPencilCrossed
69
- }) : jsx(Caret, {
70
- className: styles.iconCaret
71
- });
72
- const {
73
- enableModernizedComponents
74
- } = useBlueprintModernization();
70
+ const icon = (() => {
71
+ if (readonly) {
72
+ return jsx(PencilCrossed, {
73
+ className: styles.iconPencilCrossed
74
+ });
75
+ }
76
+ if (enableModernizedComponents) {
77
+ return jsx(ChevronDown, {
78
+ className: styles.iconCaret,
79
+ color: bpIconIconOnLight,
80
+ height: bpSize030,
81
+ width: bpSize030
82
+ });
83
+ }
84
+ return jsx(Caret, {
85
+ className: styles.iconCaret
86
+ });
87
+ })();
75
88
  return jsxs("div", {
76
89
  className: clsx(styles.container, {
77
90
  [styles.disabled]: disabled
@@ -155,9 +168,6 @@ const Option = /*#__PURE__*/forwardRef((props, forwardedRef) => {
155
168
  } = props;
156
169
  const onPointerLeave = useCallback(event => event.preventDefault(), []);
157
170
  const onPointerMove = useCallback(event => event.preventDefault(), []);
158
- const {
159
- enableModernizedComponents
160
- } = useBlueprintModernization();
161
171
  return jsxs(SelectPrimitive.Item, {
162
172
  ...itemProps,
163
173
  ref: forwardedRef,
@@ -171,10 +181,7 @@ const Option = /*#__PURE__*/forwardRef((props, forwardedRef) => {
171
181
  children: secondaryText
172
182
  }), !itemProps.disabled && jsx(SelectPrimitive.ItemIndicator, {
173
183
  className: styles.indicator,
174
- children: enableModernizedComponents ? jsx(CheckmarkCircle, {
175
- height: Size5,
176
- width: Size5
177
- }) : jsx(Checkmark, {})
184
+ children: jsx(Checkmark, {})
178
185
  })]
179
186
  });
180
187
  });
package/dist/lib-esm/select/select.module.js CHANGED
@@ -1,4 +1,4 @@
1
1
  import '../index.css';
2
- var styles = {"container":"bp_select_module_container--02e36","disabled":"bp_select_module_disabled--02e36","label":"bp_select_module_label--02e36","triggerBtn":"bp_select_module_triggerBtn--02e36","readonly":"bp_select_module_readonly--02e36","error":"bp_select_module_error--02e36","iconWrapper":"bp_select_module_iconWrapper--02e36","iconCaret":"bp_select_module_iconCaret--02e36","iconPencilCrossed":"bp_select_module_iconPencilCrossed--02e36","icon":"bp_select_module_icon--02e36","content":"bp_select_module_content--02e36","viewport":"bp_select_module_viewport--02e36","option":"bp_select_module_option--02e36","secondaryText":"bp_select_module_secondaryText--02e36","indicator":"bp_select_module_indicator--02e36","separator":"bp_select_module_separator--02e36"};
2
+ var styles = {"container":"bp_select_module_container--a20b7","disabled":"bp_select_module_disabled--a20b7","label":"bp_select_module_label--a20b7","triggerBtn":"bp_select_module_triggerBtn--a20b7","readonly":"bp_select_module_readonly--a20b7","error":"bp_select_module_error--a20b7","iconWrapper":"bp_select_module_iconWrapper--a20b7","iconCaret":"bp_select_module_iconCaret--a20b7","iconPencilCrossed":"bp_select_module_iconPencilCrossed--a20b7","icon":"bp_select_module_icon--a20b7","content":"bp_select_module_content--a20b7","viewport":"bp_select_module_viewport--a20b7","option":"bp_select_module_option--a20b7","secondaryText":"bp_select_module_secondaryText--a20b7","indicator":"bp_select_module_indicator--a20b7","separator":"bp_select_module_separator--a20b7"};
3
3
 
4
4
  export { styles as default };
package/dist/lib-esm/switch/switch.module.js CHANGED
@@ -1,4 +1,4 @@
1
1
  import '../index.css';
2
- var styles = {"option":"bp_switch_module_option--747a4","label":"bp_switch_module_label--747a4","rightAlign":"bp_switch_module_rightAlign--747a4","switch":"bp_switch_module_switch--747a4","description":"bp_switch_module_description--747a4","thumb":"bp_switch_module_thumb--747a4"};
2
+ var styles = {"option":"bp_switch_module_option--f8df5","label":"bp_switch_module_label--f8df5","rightAlign":"bp_switch_module_rightAlign--f8df5","switch":"bp_switch_module_switch--f8df5","description":"bp_switch_module_description--f8df5","thumb":"bp_switch_module_thumb--f8df5"};
3
3
 
4
4
  export { styles as default };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@box/blueprint-web",
3
- "version": "12.81.4",
3
+ "version": "12.83.0",
4
4
  "type": "module",
5
5
  "license": "SEE LICENSE IN LICENSE",
6
6
  "publishConfig": {