@box/blueprint-web 12.78.2 → 12.78.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/lib-esm/index.css
CHANGED
|
@@ -6980,7 +6980,7 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
|
|
|
6980
6980
|
.bp_base_text_input_module_textInputContainerOuter--c286c .bp_base_text_input_module_inlineError--c286c,.bp_base_text_input_module_textInputContainerOuter--c286c .bp_base_text_input_module_subtext--c286c{
|
|
6981
6981
|
margin-block-start:var(--text-input-inline-error-subtext-block-margin);
|
|
6982
6982
|
}
|
|
6983
|
-
.bp_chip_module_chip--
|
|
6983
|
+
.bp_chip_module_chip--81fcb[data-modern=false]{
|
|
6984
6984
|
--chip-gap:var(--space-2);
|
|
6985
6985
|
--chip-height:var(--size-8);
|
|
6986
6986
|
--chip-radius:var(--radius-half);
|
|
@@ -6992,6 +6992,8 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
|
|
|
6992
6992
|
--chip-status-padding:var(--space-2);
|
|
6993
6993
|
--chip-status-background-default:var(--gray-10);
|
|
6994
6994
|
--chip-status-radius:var(--radius-half);
|
|
6995
|
+
--chip-text-color:var(--text-text-on-light);
|
|
6996
|
+
--chip-text-color-disabled:var(--text-text-on-light-disabled);
|
|
6995
6997
|
--chip-button-background:var(--surface-chip-button-surface);
|
|
6996
6998
|
--chip-button-background-hover:var(--surface-chip-button-surface-hover);
|
|
6997
6999
|
--chip-button-status-text-color:var(--text-text-on-dark);
|
|
@@ -7018,7 +7020,7 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
|
|
|
7018
7020
|
--chip-multi-select-focus-border-selected:var(--border-1) solid var(--gray-white);
|
|
7019
7021
|
}
|
|
7020
7022
|
|
|
7021
|
-
.bp_chip_module_chip--
|
|
7023
|
+
.bp_chip_module_chip--81fcb[data-modern=true]{
|
|
7022
7024
|
--chip-gap:var(--bp-space-020);
|
|
7023
7025
|
--chip-height:var(--bp-size-080);
|
|
7024
7026
|
--chip-radius:var(--bp-radius-16);
|
|
@@ -7030,6 +7032,8 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
|
|
|
7030
7032
|
--chip-status-padding:var(--bp-space-020);
|
|
7031
7033
|
--chip-status-background-default:var(--bp-surface-status-surface-gray);
|
|
7032
7034
|
--chip-status-radius:var(--bp-radius-16);
|
|
7035
|
+
--chip-text-color:var(--bp-text-text-on-light);
|
|
7036
|
+
--chip-text-color-disabled:var(--bp-text-text-on-light-disabled);
|
|
7033
7037
|
--chip-button-background:var(--bp-surface-chip-button-surface);
|
|
7034
7038
|
--chip-button-background-hover:var(--bp-surface-chip-button-surface-hover);
|
|
7035
7039
|
--chip-button-status-text-color:var(--bp-text-text-on-dark);
|
|
@@ -7038,7 +7042,7 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
|
|
|
7038
7042
|
--chip-button-outline-width:var(--bp-border-02);
|
|
7039
7043
|
--chip-button-outline-color:var(--bp-outline-focus-on-light);
|
|
7040
7044
|
--chip-single-select-background:var(--bp-surface-filter-chip-surface-single);
|
|
7041
|
-
--chip-single-select-background-hover:var(
|
|
7045
|
+
--chip-single-select-background-hover:var(--bp-surface-filter-chip-surface-single-hover);
|
|
7042
7046
|
--chip-single-select-background-selected:var(--bp-surface-filter-chip-surface-single-on);
|
|
7043
7047
|
--chip-single-select-background-selected-hover:var(--bp-surface-filter-chip-surface-single-on-hover);
|
|
7044
7048
|
--chip-single-select-text-color-selected:var(--bp-text-text-on-dark);
|
|
@@ -7056,10 +7060,11 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
|
|
|
7056
7060
|
--chip-multi-select-focus-border-selected:var(--bp-border-01) solid var(--bp-gray-white);
|
|
7057
7061
|
}
|
|
7058
7062
|
|
|
7059
|
-
.bp_chip_module_chip--
|
|
7063
|
+
.bp_chip_module_chip--81fcb{
|
|
7060
7064
|
align-items:center;
|
|
7061
7065
|
border:none;
|
|
7062
7066
|
border-radius:var(--chip-radius);
|
|
7067
|
+
color:var(--chip-text-color);
|
|
7063
7068
|
cursor:pointer;
|
|
7064
7069
|
display:flex;
|
|
7065
7070
|
font-family:var(--body-default-bold-font-family);
|
|
@@ -7074,26 +7079,27 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
|
|
|
7074
7079
|
text-decoration:var(--body-default-bold-text-decoration);
|
|
7075
7080
|
text-transform:var(--body-default-bold-text-case);
|
|
7076
7081
|
}
|
|
7077
|
-
.bp_chip_module_chip--
|
|
7082
|
+
.bp_chip_module_chip--81fcb .bp_chip_module_labelText--81fcb:first-child{
|
|
7078
7083
|
margin-inline-start:var(--chip-label-inline-padding);
|
|
7079
7084
|
}
|
|
7080
|
-
.bp_chip_module_chip--
|
|
7085
|
+
.bp_chip_module_chip--81fcb .bp_chip_module_labelText--81fcb:last-child{
|
|
7081
7086
|
margin-inline-end:var(--chip-label-inline-padding);
|
|
7082
7087
|
}
|
|
7083
|
-
.bp_chip_module_chip--
|
|
7088
|
+
.bp_chip_module_chip--81fcb .bp_chip_module_chipStatus--81fcb:first-child,.bp_chip_module_chip--81fcb svg:first-child{
|
|
7084
7089
|
margin-inline-start:var(--chip-item-inline-padding);
|
|
7085
7090
|
}
|
|
7086
|
-
.bp_chip_module_chip--
|
|
7091
|
+
.bp_chip_module_chip--81fcb .bp_chip_module_chipStatus--81fcb:last-child,.bp_chip_module_chip--81fcb svg:last-child{
|
|
7087
7092
|
margin-inline-end:var(--chip-item-inline-padding);
|
|
7088
7093
|
}
|
|
7089
|
-
.bp_chip_module_chip--
|
|
7094
|
+
.bp_chip_module_chip--81fcb:disabled{
|
|
7095
|
+
color:var(--chip-text-color-disabled);
|
|
7090
7096
|
cursor:default;
|
|
7091
7097
|
pointer-events:none;
|
|
7092
7098
|
}
|
|
7093
|
-
.bp_chip_module_chip--
|
|
7099
|
+
.bp_chip_module_chip--81fcb:disabled svg{
|
|
7094
7100
|
opacity:.4;
|
|
7095
7101
|
}
|
|
7096
|
-
.bp_chip_module_chip--
|
|
7102
|
+
.bp_chip_module_chip--81fcb .bp_chip_module_chipStatus--81fcb{
|
|
7097
7103
|
align-items:center;
|
|
7098
7104
|
background-color:var(--chip-status-background-default);
|
|
7099
7105
|
border-radius:var(--chip-status-radius);
|
|
@@ -7113,10 +7119,10 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
|
|
|
7113
7119
|
text-decoration:var(--label-bold-text-decoration);
|
|
7114
7120
|
text-transform:var(--label-bold-text-case);
|
|
7115
7121
|
}
|
|
7116
|
-
.bp_chip_module_chip--
|
|
7122
|
+
.bp_chip_module_chip--81fcb .bp_chip_module_labelText--81fcb{
|
|
7117
7123
|
white-space:nowrap;
|
|
7118
7124
|
}
|
|
7119
|
-
.bp_chip_module_chip--
|
|
7125
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_chipButton--81fcb{
|
|
7120
7126
|
background-color:var(--chip-button-background);
|
|
7121
7127
|
font-family:var(--body-default-font-family);
|
|
7122
7128
|
font-size:var(--body-default-font-size);
|
|
@@ -7127,50 +7133,50 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
|
|
|
7127
7133
|
text-decoration:var(--body-default-text-decoration);
|
|
7128
7134
|
text-transform:var(--body-default-text-case);
|
|
7129
7135
|
}
|
|
7130
|
-
.bp_chip_module_chip--
|
|
7136
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_chipButton--81fcb:focus-visible{
|
|
7131
7137
|
box-shadow:0 0 0 var(--chip-button-outline-width) var(--chip-button-outline-width);
|
|
7132
7138
|
outline:none;
|
|
7133
7139
|
overflow:visible;
|
|
7134
7140
|
}
|
|
7135
|
-
.bp_chip_module_chip--
|
|
7141
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_chipButton--81fcb .bp_chip_module_chipStatus--81fcb{
|
|
7136
7142
|
background-color:var(--chip-button-status-background);
|
|
7137
7143
|
color:var(--chip-button-status-text-color);
|
|
7138
7144
|
}
|
|
7139
|
-
.bp_chip_module_chip--
|
|
7145
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_chipButton--81fcb:focus-visible,.bp_chip_module_chip--81fcb.bp_chip_module_chipButton--81fcb[data-active-item]{
|
|
7140
7146
|
box-shadow:var(--chip-button-focus-box-shadow);
|
|
7141
7147
|
outline:none;
|
|
7142
7148
|
}
|
|
7143
|
-
.bp_chip_module_chip--
|
|
7149
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_chipButton--81fcb:disabled{
|
|
7144
7150
|
pointer-events:none;
|
|
7145
7151
|
}
|
|
7146
|
-
.bp_chip_module_chip--
|
|
7152
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_chipButton--81fcb:disabled .bp_chip_module_chipStatus--81fcb,.bp_chip_module_chip--81fcb.bp_chip_module_chipButton--81fcb:disabled svg{
|
|
7147
7153
|
opacity:.4;
|
|
7148
7154
|
}
|
|
7149
|
-
.bp_chip_module_chip--
|
|
7155
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_chipButton--81fcb:hover:enabled{
|
|
7150
7156
|
background-color:var(--chip-button-background-hover);
|
|
7151
7157
|
}
|
|
7152
|
-
.bp_chip_module_chip--
|
|
7158
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_singleSelectChip--81fcb{
|
|
7153
7159
|
background-color:var(--chip-single-select-background);
|
|
7154
7160
|
}
|
|
7155
|
-
.bp_chip_module_chip--
|
|
7161
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_singleSelectChip--81fcb[data-state=on]{
|
|
7156
7162
|
background-color:var(--chip-single-select-background-selected);
|
|
7157
7163
|
color:var(--chip-single-select-text-color-selected);
|
|
7158
7164
|
}
|
|
7159
|
-
.bp_chip_module_chip--
|
|
7165
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_singleSelectChip--81fcb[data-state=on]:hover{
|
|
7160
7166
|
background-color:var(--chip-single-select-background-selected-hover);
|
|
7161
7167
|
}
|
|
7162
|
-
.bp_chip_module_chip--
|
|
7168
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_singleSelectChip--81fcb[data-state=on] .bp_chip_module_chipStatus--81fcb{
|
|
7163
7169
|
color:var(--chip-single-select-status-text-color-selected);
|
|
7164
7170
|
}
|
|
7165
|
-
.bp_chip_module_chip--
|
|
7171
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_singleSelectChip--81fcb:focus-visible,.bp_chip_module_chip--81fcb.bp_chip_module_singleSelectChip--81fcb[data-active-item]{
|
|
7166
7172
|
box-shadow:0 0 0 var(--border-2) var(--outline-focus-on-light);
|
|
7167
7173
|
outline:var(--border-1) solid var(--gray-white);
|
|
7168
7174
|
outline-offset:calc(var(--border-1)*-1);
|
|
7169
7175
|
}
|
|
7170
|
-
.bp_chip_module_chip--
|
|
7176
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_singleSelectChip--81fcb:hover:not([data-state=on]){
|
|
7171
7177
|
background-color:var(--chip-single-select-background-hover);
|
|
7172
7178
|
}
|
|
7173
|
-
.bp_chip_module_chip--
|
|
7179
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_multiSelectChip--81fcb{
|
|
7174
7180
|
background-color:var(--chip-multi-select-background);
|
|
7175
7181
|
font-family:var(--body-default-font-family);
|
|
7176
7182
|
font-size:var(--body-default-font-size);
|
|
@@ -7181,10 +7187,10 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
|
|
|
7181
7187
|
text-decoration:var(--body-default-text-decoration);
|
|
7182
7188
|
text-transform:var(--body-default-text-case);
|
|
7183
7189
|
}
|
|
7184
|
-
.bp_chip_module_chip--
|
|
7190
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_multiSelectChip--81fcb path{
|
|
7185
7191
|
fill:var(--chip-multi-select-icon-color);
|
|
7186
7192
|
}
|
|
7187
|
-
.bp_chip_module_chip--
|
|
7193
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_multiSelectChip--81fcb[data-state=on]{
|
|
7188
7194
|
background-color:var(--chip-multi-select-background-selected);
|
|
7189
7195
|
border:var(--chip-multi-select-border-selected);
|
|
7190
7196
|
color:var(--chip-multi-select-text-color-selected);
|
|
@@ -7197,31 +7203,31 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
|
|
|
7197
7203
|
text-decoration:var(--body-default-bold-text-decoration);
|
|
7198
7204
|
text-transform:var(--body-default-bold-text-case);
|
|
7199
7205
|
}
|
|
7200
|
-
.bp_chip_module_chip--
|
|
7206
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_multiSelectChip--81fcb[data-state=on] path{
|
|
7201
7207
|
fill:var(--chip-multi-select-text-color-selected);
|
|
7202
7208
|
}
|
|
7203
|
-
.bp_chip_module_chip--
|
|
7209
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_multiSelectChip--81fcb[data-state=on]:hover{
|
|
7204
7210
|
background-color:var(--chip-multi-select-background-selected-hover);
|
|
7205
7211
|
}
|
|
7206
|
-
.bp_chip_module_chip--
|
|
7212
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_multiSelectChip--81fcb[data-state=on]:focus-visible,.bp_chip_module_chip--81fcb.bp_chip_module_multiSelectChip--81fcb[data-state=on][data-active-item]{
|
|
7207
7213
|
border:var(--chip-multi-select-focus-border-selected);
|
|
7208
7214
|
box-shadow:0 0 0 var(--border-2) var(--outline-focus-on-light);
|
|
7209
7215
|
outline:var(--border-1) solid var(--chip-multi-select-border-color-selected);
|
|
7210
7216
|
outline-offset:calc(var(--border-2)*-1);
|
|
7211
7217
|
}
|
|
7212
|
-
.bp_chip_module_chip--
|
|
7218
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_multiSelectChip--81fcb[data-state=on] .bp_chip_module_chipStatus--81fcb{
|
|
7213
7219
|
background-color:var(--chip-multi-select-status-background-selected);
|
|
7214
7220
|
color:var(--chip-multi-select-status-text-color-selected);
|
|
7215
7221
|
}
|
|
7216
|
-
.bp_chip_module_chip--
|
|
7222
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_multiSelectChip--81fcb:focus-visible:not([data-state=on]),.bp_chip_module_chip--81fcb.bp_chip_module_multiSelectChip--81fcb[data-active-item]:not([data-state=on]){
|
|
7217
7223
|
box-shadow:0 0 0 var(--border-2) var(--outline-focus-on-light);
|
|
7218
7224
|
outline:var(--border-1) solid var(--gray-white);
|
|
7219
7225
|
outline-offset:calc(var(--border-1)*-1);
|
|
7220
7226
|
}
|
|
7221
|
-
.bp_chip_module_chip--
|
|
7227
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_multiSelectChip--81fcb:hover:not([data-state=on]){
|
|
7222
7228
|
background-color:var(--chip-multi-select-background-hover);
|
|
7223
7229
|
}
|
|
7224
|
-
.bp_chip_module_chip--
|
|
7230
|
+
.bp_chip_module_chip--81fcb.bp_chip_module_multiSelectChip--81fcb span::before{
|
|
7225
7231
|
content:attr(data-text);
|
|
7226
7232
|
display:block;
|
|
7227
7233
|
font-family:var(--body-default-bold-font-family);
|
|
@@ -7237,30 +7243,30 @@ table.bp_inline_table_module_inlineTable--f6f94[data-modern=true] td:last-child,
|
|
|
7237
7243
|
visibility:hidden;
|
|
7238
7244
|
}
|
|
7239
7245
|
|
|
7240
|
-
.bp_chip_module_chipsGroup--
|
|
7246
|
+
.bp_chip_module_chipsGroup--81fcb[data-modern=false]{
|
|
7241
7247
|
--chips-group-gap:var(--space-2);
|
|
7242
7248
|
--chips-group-small-screen-padding:var(--space-5);
|
|
7243
7249
|
}
|
|
7244
7250
|
|
|
7245
|
-
.bp_chip_module_chipsGroup--
|
|
7251
|
+
.bp_chip_module_chipsGroup--81fcb[data-modern=true]{
|
|
7246
7252
|
--chips-group-gap:var(--bp-space-020);
|
|
7247
7253
|
--chips-group-small-screen-padding:var(--bp-space-050);
|
|
7248
7254
|
}
|
|
7249
7255
|
|
|
7250
|
-
.bp_chip_module_chipsGroup--
|
|
7256
|
+
.bp_chip_module_chipsGroup--81fcb{
|
|
7251
7257
|
display:flex;
|
|
7252
7258
|
flex-wrap:wrap;
|
|
7253
7259
|
gap:var(--chips-group-gap);
|
|
7254
7260
|
}
|
|
7255
7261
|
@media (max-width: 767px){
|
|
7256
|
-
.bp_chip_module_chipsGroup--
|
|
7262
|
+
.bp_chip_module_chipsGroup--81fcb{
|
|
7257
7263
|
-ms-overflow-style:none;
|
|
7258
7264
|
flex-wrap:nowrap;
|
|
7259
7265
|
overflow-x:scroll;
|
|
7260
7266
|
padding:var(--chips-group-small-screen-padding);
|
|
7261
7267
|
scrollbar-width:none;
|
|
7262
7268
|
}
|
|
7263
|
-
.bp_chip_module_chipsGroup--
|
|
7269
|
+
.bp_chip_module_chipsGroup--81fcb::-webkit-scrollbar{
|
|
7264
7270
|
display:none;
|
|
7265
7271
|
}
|
|
7266
7272
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import '../../index.css';
|
|
2
|
-
var styles = {"chip":"bp_chip_module_chip--
|
|
2
|
+
var styles = {"chip":"bp_chip_module_chip--81fcb","labelText":"bp_chip_module_labelText--81fcb","chipStatus":"bp_chip_module_chipStatus--81fcb","chipButton":"bp_chip_module_chipButton--81fcb","singleSelectChip":"bp_chip_module_singleSelectChip--81fcb","multiSelectChip":"bp_chip_module_multiSelectChip--81fcb","chipsGroup":"bp_chip_module_chipsGroup--81fcb"};
|
|
3
3
|
|
|
4
4
|
export { styles as default };
|