@box/blueprint-web 18.5.0 → 18.5.2
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/components.css +83 -81
- package/dist/lib-esm/index.css +83 -81
- package/dist/lib-esm/page/page-context.d.ts +2 -0
- package/dist/lib-esm/page/page-context.js +2 -0
- package/dist/lib-esm/page/page-side-panel.js +19 -3
- package/dist/lib-esm/primitives/chips/filter-chip/filter-trigger-chip.js +8 -1
- package/dist/lib-esm/select/select.js +8 -14
- package/dist/lib-esm/select/select.module.js +1 -1
- package/package.json +3 -4
|
@@ -5039,13 +5039,13 @@
|
|
|
5039
5039
|
border-right-color:var(--bp-border-combobox-border-hover);
|
|
5040
5040
|
transition-timing-function:var(--bp-curve-small-on);
|
|
5041
5041
|
}
|
|
5042
|
-
.bp_select_module_ellipsis--
|
|
5042
|
+
.bp_select_module_ellipsis--69358{
|
|
5043
5043
|
overflow:hidden;
|
|
5044
5044
|
text-overflow:ellipsis;
|
|
5045
5045
|
white-space:nowrap;
|
|
5046
5046
|
}
|
|
5047
5047
|
|
|
5048
|
-
.bp_select_module_container--
|
|
5048
|
+
.bp_select_module_container--69358{
|
|
5049
5049
|
--select-gap:var(--bp-space-020);
|
|
5050
5050
|
--select-label-color:var(--bp-text-text-on-light);
|
|
5051
5051
|
--select-trigger-btn-gap:var(--bp-space-020);
|
|
@@ -5083,7 +5083,7 @@
|
|
|
5083
5083
|
letter-spacing:var(--bp-font-letter-spacing-01);
|
|
5084
5084
|
line-height:var(--bp-font-line-height-04);
|
|
5085
5085
|
}
|
|
5086
|
-
:where(body.is-inter-font) .bp_select_module_container--
|
|
5086
|
+
:where(body.is-inter-font) .bp_select_module_container--69358{
|
|
5087
5087
|
font-family:"Inter Variable", -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
5088
5088
|
font-size:.875rem;
|
|
5089
5089
|
font-style:normal;
|
|
@@ -5094,17 +5094,17 @@
|
|
|
5094
5094
|
text-transform:none;
|
|
5095
5095
|
}
|
|
5096
5096
|
|
|
5097
|
-
.bp_select_module_container--
|
|
5097
|
+
.bp_select_module_container--69358{
|
|
5098
5098
|
--select-trigger-btn-padding-compensation:calc(var(--select-trigger-btn-thick-border-width) - var(--select-trigger-btn-border-width));
|
|
5099
5099
|
--select-trigger-btn-thick-padding-inline:calc(var(--select-trigger-btn-padding-inline) - var(--blueprint-select-padding-compensation-left, var(--select-trigger-btn-padding-compensation))) calc(var(--select-trigger-btn-padding-inline) - var(--blueprint-select-padding-compensation-right, var(--select-trigger-btn-padding-compensation)));
|
|
5100
5100
|
display:flex;
|
|
5101
5101
|
flex-direction:column;
|
|
5102
5102
|
gap:var(--select-gap);
|
|
5103
5103
|
}
|
|
5104
|
-
.bp_select_module_container--
|
|
5104
|
+
.bp_select_module_container--69358.bp_select_module_disabled--69358{
|
|
5105
5105
|
opacity:var(--disabled-opacity);
|
|
5106
5106
|
}
|
|
5107
|
-
.bp_select_module_container--
|
|
5107
|
+
.bp_select_module_container--69358 .bp_select_module_label--69358{
|
|
5108
5108
|
font-family:var(--bp-font-font-family), -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
5109
5109
|
font-size:var(--bp-font-size-05);
|
|
5110
5110
|
font-style:normal;
|
|
@@ -5112,7 +5112,7 @@
|
|
|
5112
5112
|
letter-spacing:var(--bp-font-letter-spacing-01);
|
|
5113
5113
|
line-height:var(--bp-font-line-height-04);
|
|
5114
5114
|
}
|
|
5115
|
-
:where(body.is-inter-font) .bp_select_module_container--
|
|
5115
|
+
:where(body.is-inter-font) .bp_select_module_container--69358 .bp_select_module_label--69358{
|
|
5116
5116
|
font-family:"Inter Variable", -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
5117
5117
|
font-size:.875rem;
|
|
5118
5118
|
font-style:normal;
|
|
@@ -5123,12 +5123,12 @@
|
|
|
5123
5123
|
text-transform:none;
|
|
5124
5124
|
}
|
|
5125
5125
|
|
|
5126
|
-
.bp_select_module_container--
|
|
5126
|
+
.bp_select_module_container--69358 .bp_select_module_label--69358{
|
|
5127
5127
|
color:var(--select-label-color);
|
|
5128
5128
|
flex:0 0 fit-content;
|
|
5129
5129
|
overflow-wrap:break-word;
|
|
5130
5130
|
}
|
|
5131
|
-
.bp_select_module_container--
|
|
5131
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358{
|
|
5132
5132
|
font-family:var(--bp-font-font-family), -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
5133
5133
|
font-size:var(--bp-font-size-05);
|
|
5134
5134
|
font-style:normal;
|
|
@@ -5136,7 +5136,7 @@
|
|
|
5136
5136
|
letter-spacing:var(--bp-font-letter-spacing-01);
|
|
5137
5137
|
line-height:var(--bp-font-line-height-04);
|
|
5138
5138
|
}
|
|
5139
|
-
:where(body.is-inter-font) .bp_select_module_container--
|
|
5139
|
+
:where(body.is-inter-font) .bp_select_module_container--69358 .bp_select_module_triggerBtn--69358{
|
|
5140
5140
|
font-family:"Inter Variable", -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
5141
5141
|
font-size:.875rem;
|
|
5142
5142
|
font-style:normal;
|
|
@@ -5147,7 +5147,7 @@
|
|
|
5147
5147
|
text-transform:none;
|
|
5148
5148
|
}
|
|
5149
5149
|
|
|
5150
|
-
.bp_select_module_container--
|
|
5150
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358{
|
|
5151
5151
|
align-items:center;
|
|
5152
5152
|
background-color:var(--select-trigger-btn-bg-color);
|
|
5153
5153
|
border-bottom:var(--select-trigger-btn-border-bottom);
|
|
@@ -5168,7 +5168,7 @@
|
|
|
5168
5168
|
text-align:start;
|
|
5169
5169
|
width:100%;
|
|
5170
5170
|
}
|
|
5171
|
-
.bp_select_module_container--
|
|
5171
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 .bp_select_module_triggerValue--69358{
|
|
5172
5172
|
align-items:center;
|
|
5173
5173
|
display:flex;
|
|
5174
5174
|
gap:var(--select-trigger-btn-gap);
|
|
@@ -5177,7 +5177,7 @@
|
|
|
5177
5177
|
text-overflow:ellipsis;
|
|
5178
5178
|
white-space:nowrap;
|
|
5179
5179
|
}
|
|
5180
|
-
.bp_select_module_container--
|
|
5180
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 .bp_select_module_triggerLeftElement--69358{
|
|
5181
5181
|
align-items:center;
|
|
5182
5182
|
display:flex;
|
|
5183
5183
|
flex-shrink:0;
|
|
@@ -5185,21 +5185,21 @@
|
|
|
5185
5185
|
justify-content:center;
|
|
5186
5186
|
width:var(--select-trigger-left-element-size);
|
|
5187
5187
|
}
|
|
5188
|
-
.bp_select_module_container--
|
|
5188
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 span{
|
|
5189
5189
|
overflow:hidden;
|
|
5190
5190
|
text-overflow:ellipsis;
|
|
5191
5191
|
white-space:nowrap;
|
|
5192
5192
|
}
|
|
5193
|
-
.bp_select_module_container--
|
|
5193
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:disabled{
|
|
5194
5194
|
cursor:default;
|
|
5195
5195
|
}
|
|
5196
|
-
.bp_select_module_container--
|
|
5196
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358.bp_select_module_readonly--69358:not(:disabled){
|
|
5197
5197
|
background-color:var(--gray-02);
|
|
5198
5198
|
box-shadow:none;
|
|
5199
5199
|
color:var(--text-text-on-light-secondary);
|
|
5200
5200
|
cursor:default;
|
|
5201
5201
|
}
|
|
5202
|
-
.bp_select_module_container--
|
|
5202
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled).bp_select_module_error--69358, .bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled)[aria-invalid=true]{
|
|
5203
5203
|
background-color:var(--select-trigger-btn-error-bg-color);
|
|
5204
5204
|
border-bottom:var(--select-trigger-btn-error-border-bottom);
|
|
5205
5205
|
border-left:var(--select-trigger-btn-error-border-left);
|
|
@@ -5207,52 +5207,52 @@
|
|
|
5207
5207
|
border-top:var(--select-trigger-btn-error-border-top);
|
|
5208
5208
|
padding-inline:var(--select-trigger-btn-thick-padding-inline);
|
|
5209
5209
|
}
|
|
5210
|
-
.bp_select_module_container--
|
|
5210
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358):focus,.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled).bp_select_module_error--69358:focus,.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled)[aria-invalid=true]:focus{
|
|
5211
5211
|
background-color:var(--select-trigger-btn-focus-bg-color);
|
|
5212
5212
|
border:var(--select-trigger-btn-focus-border);
|
|
5213
5213
|
padding-inline:var(--select-trigger-btn-thick-padding-inline);
|
|
5214
5214
|
}
|
|
5215
|
-
.bp_select_module_container--
|
|
5215
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled, :focus, .bp_select_module_error--69358, [aria-invalid=true]):hover{
|
|
5216
5216
|
background-color:var(--select-trigger-btn-hover-bg-color);
|
|
5217
5217
|
border-color:var(--select-trigger-btn-hover-border-color);
|
|
5218
5218
|
}
|
|
5219
|
-
.bp_select_module_container--
|
|
5219
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 .bp_select_module_iconWrapper--69358{
|
|
5220
5220
|
flex-shrink:0;
|
|
5221
5221
|
-webkit-user-select:none;
|
|
5222
5222
|
user-select:none;
|
|
5223
5223
|
}
|
|
5224
|
-
.bp_select_module_container--
|
|
5224
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 .bp_select_module_iconCaret--69358{
|
|
5225
5225
|
display:block;
|
|
5226
5226
|
height:var(--select-trigger-btn-caret-height);
|
|
5227
5227
|
width:var(--select-trigger-btn-caret-width);
|
|
5228
5228
|
}
|
|
5229
|
-
.bp_select_module_container--
|
|
5229
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 .bp_select_module_iconCaret--69358 path{
|
|
5230
5230
|
fill:var(--select-trigger-btn-caret-color);
|
|
5231
5231
|
}
|
|
5232
|
-
.bp_select_module_container--
|
|
5232
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 .bp_select_module_iconPencilCrossed--69358{
|
|
5233
5233
|
display:block;
|
|
5234
5234
|
height:var(--select-trigger-btn-pencil-height);
|
|
5235
5235
|
width:var(--select-trigger-btn-pencil-width);
|
|
5236
5236
|
}
|
|
5237
5237
|
|
|
5238
|
-
.bp_select_module_container--
|
|
5238
|
+
.bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled){
|
|
5239
5239
|
transition-duration:var(--bp-duration-short);
|
|
5240
5240
|
transition-property:border-color, background-color;
|
|
5241
5241
|
transition-timing-function:var(--bp-curve-small-off);
|
|
5242
5242
|
}
|
|
5243
|
-
.bp_select_module_container--
|
|
5243
|
+
.bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled).bp_select_module_error--69358, .bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled):focus, .bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled):hover, .bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled)[aria-invalid=true]{
|
|
5244
5244
|
transition-timing-function:var(--bp-curve-small-on);
|
|
5245
5245
|
}
|
|
5246
|
-
.bp_select_module_container--
|
|
5246
|
+
.bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled) .bp_select_module_iconCaret--69358{
|
|
5247
5247
|
transition-duration:var(--bp-duration-short);
|
|
5248
5248
|
transition-property:transform;
|
|
5249
5249
|
transition-timing-function:var(--bp-curve-extra-small-on);
|
|
5250
5250
|
}
|
|
5251
|
-
.bp_select_module_container--
|
|
5251
|
+
.bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled)[data-bp-exiting=true] .bp_select_module_iconCaret--69358, .bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled)[data-state=closed]:hover .bp_select_module_iconCaret--69358{
|
|
5252
5252
|
transform:translateY(var(--bp-size-005));
|
|
5253
5253
|
}
|
|
5254
5254
|
|
|
5255
|
-
.bp_select_module_content--
|
|
5255
|
+
.bp_select_module_content--69358{
|
|
5256
5256
|
--select-content-bg-color:var(--bp-surface-menu-surface-dropdown);
|
|
5257
5257
|
--select-content-backdrop-filter:blur(16px);
|
|
5258
5258
|
--select-content-border:var(--bp-border-01) solid var(--bp-border-card-border);
|
|
@@ -5283,7 +5283,7 @@
|
|
|
5283
5283
|
letter-spacing:var(--bp-font-letter-spacing-01);
|
|
5284
5284
|
line-height:var(--bp-font-line-height-04);
|
|
5285
5285
|
}
|
|
5286
|
-
:where(body.is-inter-font) .bp_select_module_content--
|
|
5286
|
+
:where(body.is-inter-font) .bp_select_module_content--69358{
|
|
5287
5287
|
font-family:"Inter Variable", -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
5288
5288
|
font-size:.875rem;
|
|
5289
5289
|
font-style:normal;
|
|
@@ -5294,7 +5294,7 @@
|
|
|
5294
5294
|
text-transform:none;
|
|
5295
5295
|
}
|
|
5296
5296
|
|
|
5297
|
-
.bp_select_module_content--
|
|
5297
|
+
.bp_select_module_content--69358{
|
|
5298
5298
|
backdrop-filter:var(--select-content-backdrop-filter);
|
|
5299
5299
|
background-color:var(--select-content-bg-color);
|
|
5300
5300
|
border:var(--select-content-border);
|
|
@@ -5306,11 +5306,14 @@
|
|
|
5306
5306
|
overflow:hidden auto;
|
|
5307
5307
|
z-index:var(--z-index-popover);
|
|
5308
5308
|
}
|
|
5309
|
-
.bp_select_module_content--
|
|
5309
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358{
|
|
5310
|
+
box-sizing:border-box;
|
|
5311
|
+
min-width:100%;
|
|
5310
5312
|
padding-block:var(--select-content-viewport-padding-block);
|
|
5311
5313
|
padding-inline:var(--select-content-viewport-padding-inline);
|
|
5314
|
+
width:fit-content;
|
|
5312
5315
|
}
|
|
5313
|
-
.bp_select_module_content--
|
|
5316
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358{
|
|
5314
5317
|
align-items:center;
|
|
5315
5318
|
border:var(--select-content-viewport-option-border);
|
|
5316
5319
|
border-radius:var(--select-content-viewport-option-border-radius);
|
|
@@ -5326,27 +5329,27 @@
|
|
|
5326
5329
|
-webkit-user-select:none;
|
|
5327
5330
|
user-select:none;
|
|
5328
5331
|
}
|
|
5329
|
-
.bp_select_module_content--
|
|
5332
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358[data-disabled]{
|
|
5330
5333
|
opacity:var(--disabled-opacity);
|
|
5331
5334
|
pointer-events:none;
|
|
5332
5335
|
}
|
|
5333
|
-
.bp_select_module_content--
|
|
5336
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358:focus-visible{
|
|
5334
5337
|
background-color:var(--select-content-viewport-option-focus-bg-color);
|
|
5335
5338
|
border:var(--select-content-viewport-option-focus-border);
|
|
5336
5339
|
}
|
|
5337
|
-
.bp_select_module_content--
|
|
5340
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358:hover{
|
|
5338
5341
|
background-color:var(--select-content-viewport-option-hover-bg-color);
|
|
5339
5342
|
}
|
|
5340
|
-
.bp_select_module_content--
|
|
5343
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358:active{
|
|
5341
5344
|
background-color:var(--select-content-viewport-option-active-bg-color);
|
|
5342
5345
|
}
|
|
5343
|
-
.bp_select_module_content--
|
|
5346
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_secondaryText--69358{
|
|
5344
5347
|
color:var(--select-content-viewport-option-secondary-text-color);
|
|
5345
5348
|
min-width:0;
|
|
5346
5349
|
overflow-wrap:break-word;
|
|
5347
5350
|
white-space:normal;
|
|
5348
5351
|
}
|
|
5349
|
-
.bp_select_module_content--
|
|
5352
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_textWrapper--69358{
|
|
5350
5353
|
align-items:center;
|
|
5351
5354
|
display:flex;
|
|
5352
5355
|
flex:1;
|
|
@@ -5355,24 +5358,24 @@
|
|
|
5355
5358
|
min-width:0;
|
|
5356
5359
|
overflow:hidden;
|
|
5357
5360
|
}
|
|
5358
|
-
.bp_select_module_content--
|
|
5361
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_textWrapper--69358 span:first-child{
|
|
5359
5362
|
overflow:hidden;
|
|
5360
5363
|
overflow-wrap:break-word;
|
|
5361
5364
|
}
|
|
5362
|
-
.bp_select_module_content--
|
|
5365
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_textWrapper--69358.bp_select_module_ellipsis--69358 span:first-child{
|
|
5363
5366
|
overflow-wrap:normal;
|
|
5364
5367
|
text-overflow:ellipsis;
|
|
5365
5368
|
white-space:nowrap;
|
|
5366
5369
|
width:100%;
|
|
5367
5370
|
}
|
|
5368
|
-
.bp_select_module_content--
|
|
5371
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_textWrapper--69358.bp_select_module_ellipsis--69358 .bp_select_module_secondaryText--69358{
|
|
5369
5372
|
-webkit-box-orient:vertical;
|
|
5370
5373
|
-webkit-line-clamp:2;
|
|
5371
5374
|
display:-webkit-box;
|
|
5372
5375
|
overflow:hidden;
|
|
5373
5376
|
width:100%;
|
|
5374
5377
|
}
|
|
5375
|
-
.bp_select_module_content--
|
|
5378
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_leftElement--69358{
|
|
5376
5379
|
align-items:center;
|
|
5377
5380
|
display:flex;
|
|
5378
5381
|
flex-shrink:0;
|
|
@@ -5380,14 +5383,14 @@
|
|
|
5380
5383
|
justify-content:center;
|
|
5381
5384
|
width:var(--select-content-viewport-option-left-element-size);
|
|
5382
5385
|
}
|
|
5383
|
-
.bp_select_module_content--
|
|
5386
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358.bp_select_module_hasLeftElement--69358 .bp_select_module_textWrapper--69358{
|
|
5384
5387
|
align-items:flex-start;
|
|
5385
5388
|
flex-direction:column;
|
|
5386
5389
|
}
|
|
5387
|
-
.bp_select_module_content--
|
|
5390
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358.bp_select_module_hasLeftElement--69358 .bp_select_module_textWrapper--69358 .bp_select_module_secondaryText--69358{
|
|
5388
5391
|
width:100%;
|
|
5389
5392
|
}
|
|
5390
|
-
.bp_select_module_content--
|
|
5393
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_indicator--69358{
|
|
5391
5394
|
align-items:center;
|
|
5392
5395
|
display:flex;
|
|
5393
5396
|
height:100%;
|
|
@@ -5396,70 +5399,69 @@
|
|
|
5396
5399
|
position:absolute;
|
|
5397
5400
|
top:0;
|
|
5398
5401
|
}
|
|
5399
|
-
.bp_select_module_content--
|
|
5402
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_indicator--69358 path{
|
|
5400
5403
|
fill:var(--select-content-viewport-option-indicator-color);
|
|
5401
5404
|
}
|
|
5402
|
-
.bp_select_module_content--
|
|
5405
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_separator--69358{
|
|
5403
5406
|
background-color:var(--select-content-viewport-option-separator-bg-color);
|
|
5404
5407
|
flex-shrink:0;
|
|
5405
5408
|
height:var(--select-content-viewport-option-separator-height);
|
|
5406
5409
|
margin-block:var(--select-content-viewport-option-separator-margin-block);
|
|
5407
5410
|
}
|
|
5408
|
-
.bp_select_module_content--
|
|
5411
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358.bp_select_module_withTruncatedText--69358{
|
|
5409
5412
|
box-sizing:border-box;
|
|
5410
|
-
display:block !important;
|
|
5411
5413
|
max-width:100%;
|
|
5412
|
-
min-width:0
|
|
5414
|
+
min-width:0;
|
|
5413
5415
|
width:100%;
|
|
5414
5416
|
}
|
|
5415
5417
|
|
|
5416
|
-
.bp_select_module_content--
|
|
5418
|
+
.bp_select_module_content--69358[data-bp-animated=true]{
|
|
5417
5419
|
transform-origin:var(--radix-select-content-transform-origin);
|
|
5418
5420
|
}
|
|
5419
|
-
.bp_select_module_content--
|
|
5421
|
+
.bp_select_module_content--69358[data-bp-animated=true] .bp_select_module_viewport--69358 .bp_select_module_option--69358{
|
|
5420
5422
|
transition-duration:var(--bp-duration-short);
|
|
5421
5423
|
transition-property:background-color;
|
|
5422
5424
|
transition-timing-function:var(--bp-curve-small-off);
|
|
5423
5425
|
}
|
|
5424
|
-
.bp_select_module_content--
|
|
5426
|
+
.bp_select_module_content--69358[data-bp-animated=true] .bp_select_module_viewport--69358 .bp_select_module_option--69358:active,.bp_select_module_content--69358[data-bp-animated=true] .bp_select_module_viewport--69358 .bp_select_module_option--69358:focus-visible,.bp_select_module_content--69358[data-bp-animated=true] .bp_select_module_viewport--69358 .bp_select_module_option--69358:hover{
|
|
5425
5427
|
transition-timing-function:var(--bp-curve-small-on);
|
|
5426
5428
|
}
|
|
5427
|
-
.bp_select_module_content--
|
|
5429
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-state=open]:not([data-bp-exiting=true]){
|
|
5428
5430
|
animation-duration:var(--bp-duration-medium);
|
|
5429
5431
|
animation-timing-function:var(--bp-curve-medium-on);
|
|
5430
5432
|
}
|
|
5431
|
-
.bp_select_module_content--
|
|
5432
|
-
animation-name:bp_select_module_bpSelectMediumTopSlideEnter--
|
|
5433
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-state=open]:not([data-bp-exiting=true])[data-side=top]{
|
|
5434
|
+
animation-name:bp_select_module_bpSelectMediumTopSlideEnter--69358, bp_select_module_bpSelectFadeIn--69358;
|
|
5433
5435
|
}
|
|
5434
|
-
.bp_select_module_content--
|
|
5435
|
-
animation-name:bp_select_module_bpSelectMediumBottomSlideEnter--
|
|
5436
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-state=open]:not([data-bp-exiting=true])[data-side=bottom]{
|
|
5437
|
+
animation-name:bp_select_module_bpSelectMediumBottomSlideEnter--69358, bp_select_module_bpSelectFadeIn--69358;
|
|
5436
5438
|
}
|
|
5437
|
-
.bp_select_module_content--
|
|
5438
|
-
animation-name:bp_select_module_bpSelectMediumLeftSlideEnter--
|
|
5439
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-state=open]:not([data-bp-exiting=true])[data-side=left]{
|
|
5440
|
+
animation-name:bp_select_module_bpSelectMediumLeftSlideEnter--69358, bp_select_module_bpSelectFadeIn--69358;
|
|
5439
5441
|
}
|
|
5440
|
-
.bp_select_module_content--
|
|
5441
|
-
animation-name:bp_select_module_bpSelectMediumRightSlideEnter--
|
|
5442
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-state=open]:not([data-bp-exiting=true])[data-side=right]{
|
|
5443
|
+
animation-name:bp_select_module_bpSelectMediumRightSlideEnter--69358, bp_select_module_bpSelectFadeIn--69358;
|
|
5442
5444
|
}
|
|
5443
|
-
.bp_select_module_content--
|
|
5445
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-bp-exiting=true]{
|
|
5444
5446
|
animation-duration:var(--bp-duration-short);
|
|
5445
5447
|
animation-fill-mode:forwards;
|
|
5446
5448
|
animation-timing-function:var(--bp-curve-medium-off);
|
|
5447
5449
|
pointer-events:none;
|
|
5448
5450
|
}
|
|
5449
|
-
.bp_select_module_content--
|
|
5450
|
-
animation-name:bp_select_module_bpSelectMediumTopSlideExit--
|
|
5451
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-bp-exiting=true][data-side=top]{
|
|
5452
|
+
animation-name:bp_select_module_bpSelectMediumTopSlideExit--69358, bp_select_module_bpSelectFadeOut--69358;
|
|
5451
5453
|
}
|
|
5452
|
-
.bp_select_module_content--
|
|
5453
|
-
animation-name:bp_select_module_bpSelectMediumBottomSlideExit--
|
|
5454
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-bp-exiting=true][data-side=bottom]{
|
|
5455
|
+
animation-name:bp_select_module_bpSelectMediumBottomSlideExit--69358, bp_select_module_bpSelectFadeOut--69358;
|
|
5454
5456
|
}
|
|
5455
|
-
.bp_select_module_content--
|
|
5456
|
-
animation-name:bp_select_module_bpSelectMediumLeftSlideExit--
|
|
5457
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-bp-exiting=true][data-side=left]{
|
|
5458
|
+
animation-name:bp_select_module_bpSelectMediumLeftSlideExit--69358, bp_select_module_bpSelectFadeOut--69358;
|
|
5457
5459
|
}
|
|
5458
|
-
.bp_select_module_content--
|
|
5459
|
-
animation-name:bp_select_module_bpSelectMediumRightSlideExit--
|
|
5460
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-bp-exiting=true][data-side=right]{
|
|
5461
|
+
animation-name:bp_select_module_bpSelectMediumRightSlideExit--69358, bp_select_module_bpSelectFadeOut--69358;
|
|
5460
5462
|
}
|
|
5461
5463
|
|
|
5462
|
-
@keyframes bp_select_module_bpSelectFadeIn--
|
|
5464
|
+
@keyframes bp_select_module_bpSelectFadeIn--69358{
|
|
5463
5465
|
from{
|
|
5464
5466
|
opacity:var(--bp-opacity-hidden);
|
|
5465
5467
|
}
|
|
@@ -5467,7 +5469,7 @@
|
|
|
5467
5469
|
opacity:var(--bp-opacity-visible);
|
|
5468
5470
|
}
|
|
5469
5471
|
}
|
|
5470
|
-
@keyframes bp_select_module_bpSelectFadeOut--
|
|
5472
|
+
@keyframes bp_select_module_bpSelectFadeOut--69358{
|
|
5471
5473
|
from{
|
|
5472
5474
|
opacity:var(--bp-opacity-visible);
|
|
5473
5475
|
}
|
|
@@ -5475,7 +5477,7 @@
|
|
|
5475
5477
|
opacity:var(--bp-opacity-hidden);
|
|
5476
5478
|
}
|
|
5477
5479
|
}
|
|
5478
|
-
@keyframes bp_select_module_bpSelectMediumTopSlideEnter--
|
|
5480
|
+
@keyframes bp_select_module_bpSelectMediumTopSlideEnter--69358{
|
|
5479
5481
|
from{
|
|
5480
5482
|
transform:translateY(var(--bp-space-020));
|
|
5481
5483
|
}
|
|
@@ -5483,7 +5485,7 @@
|
|
|
5483
5485
|
transform:translateY(0);
|
|
5484
5486
|
}
|
|
5485
5487
|
}
|
|
5486
|
-
@keyframes bp_select_module_bpSelectMediumTopSlideExit--
|
|
5488
|
+
@keyframes bp_select_module_bpSelectMediumTopSlideExit--69358{
|
|
5487
5489
|
from{
|
|
5488
5490
|
transform:translateY(0);
|
|
5489
5491
|
}
|
|
@@ -5491,7 +5493,7 @@
|
|
|
5491
5493
|
transform:translateY(var(--bp-space-020));
|
|
5492
5494
|
}
|
|
5493
5495
|
}
|
|
5494
|
-
@keyframes bp_select_module_bpSelectMediumBottomSlideEnter--
|
|
5496
|
+
@keyframes bp_select_module_bpSelectMediumBottomSlideEnter--69358{
|
|
5495
5497
|
from{
|
|
5496
5498
|
transform:translateY(calc(var(--bp-space-020)*-1));
|
|
5497
5499
|
}
|
|
@@ -5499,7 +5501,7 @@
|
|
|
5499
5501
|
transform:translateY(0);
|
|
5500
5502
|
}
|
|
5501
5503
|
}
|
|
5502
|
-
@keyframes bp_select_module_bpSelectMediumBottomSlideExit--
|
|
5504
|
+
@keyframes bp_select_module_bpSelectMediumBottomSlideExit--69358{
|
|
5503
5505
|
from{
|
|
5504
5506
|
transform:translateY(0);
|
|
5505
5507
|
}
|
|
@@ -5507,7 +5509,7 @@
|
|
|
5507
5509
|
transform:translateY(calc(var(--bp-space-020)*-1));
|
|
5508
5510
|
}
|
|
5509
5511
|
}
|
|
5510
|
-
@keyframes bp_select_module_bpSelectMediumLeftSlideEnter--
|
|
5512
|
+
@keyframes bp_select_module_bpSelectMediumLeftSlideEnter--69358{
|
|
5511
5513
|
from{
|
|
5512
5514
|
transform:translateX(var(--bp-space-020));
|
|
5513
5515
|
}
|
|
@@ -5515,7 +5517,7 @@
|
|
|
5515
5517
|
transform:translateX(0);
|
|
5516
5518
|
}
|
|
5517
5519
|
}
|
|
5518
|
-
@keyframes bp_select_module_bpSelectMediumLeftSlideExit--
|
|
5520
|
+
@keyframes bp_select_module_bpSelectMediumLeftSlideExit--69358{
|
|
5519
5521
|
from{
|
|
5520
5522
|
transform:translateX(0);
|
|
5521
5523
|
}
|
|
@@ -5523,7 +5525,7 @@
|
|
|
5523
5525
|
transform:translateX(var(--bp-space-020));
|
|
5524
5526
|
}
|
|
5525
5527
|
}
|
|
5526
|
-
@keyframes bp_select_module_bpSelectMediumRightSlideEnter--
|
|
5528
|
+
@keyframes bp_select_module_bpSelectMediumRightSlideEnter--69358{
|
|
5527
5529
|
from{
|
|
5528
5530
|
transform:translateX(calc(var(--bp-space-020)*-1));
|
|
5529
5531
|
}
|
|
@@ -5531,7 +5533,7 @@
|
|
|
5531
5533
|
transform:translateX(0);
|
|
5532
5534
|
}
|
|
5533
5535
|
}
|
|
5534
|
-
@keyframes bp_select_module_bpSelectMediumRightSlideExit--
|
|
5536
|
+
@keyframes bp_select_module_bpSelectMediumRightSlideExit--69358{
|
|
5535
5537
|
from{
|
|
5536
5538
|
transform:translateX(0);
|
|
5537
5539
|
}
|
package/dist/lib-esm/index.css
CHANGED
|
@@ -5039,13 +5039,13 @@
|
|
|
5039
5039
|
border-right-color:var(--bp-border-combobox-border-hover);
|
|
5040
5040
|
transition-timing-function:var(--bp-curve-small-on);
|
|
5041
5041
|
}
|
|
5042
|
-
.bp_select_module_ellipsis--
|
|
5042
|
+
.bp_select_module_ellipsis--69358{
|
|
5043
5043
|
overflow:hidden;
|
|
5044
5044
|
text-overflow:ellipsis;
|
|
5045
5045
|
white-space:nowrap;
|
|
5046
5046
|
}
|
|
5047
5047
|
|
|
5048
|
-
.bp_select_module_container--
|
|
5048
|
+
.bp_select_module_container--69358{
|
|
5049
5049
|
--select-gap:var(--bp-space-020);
|
|
5050
5050
|
--select-label-color:var(--bp-text-text-on-light);
|
|
5051
5051
|
--select-trigger-btn-gap:var(--bp-space-020);
|
|
@@ -5083,7 +5083,7 @@
|
|
|
5083
5083
|
letter-spacing:var(--bp-font-letter-spacing-01);
|
|
5084
5084
|
line-height:var(--bp-font-line-height-04);
|
|
5085
5085
|
}
|
|
5086
|
-
:where(body.is-inter-font) .bp_select_module_container--
|
|
5086
|
+
:where(body.is-inter-font) .bp_select_module_container--69358{
|
|
5087
5087
|
font-family:"Inter Variable", -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
5088
5088
|
font-size:.875rem;
|
|
5089
5089
|
font-style:normal;
|
|
@@ -5094,17 +5094,17 @@
|
|
|
5094
5094
|
text-transform:none;
|
|
5095
5095
|
}
|
|
5096
5096
|
|
|
5097
|
-
.bp_select_module_container--
|
|
5097
|
+
.bp_select_module_container--69358{
|
|
5098
5098
|
--select-trigger-btn-padding-compensation:calc(var(--select-trigger-btn-thick-border-width) - var(--select-trigger-btn-border-width));
|
|
5099
5099
|
--select-trigger-btn-thick-padding-inline:calc(var(--select-trigger-btn-padding-inline) - var(--blueprint-select-padding-compensation-left, var(--select-trigger-btn-padding-compensation))) calc(var(--select-trigger-btn-padding-inline) - var(--blueprint-select-padding-compensation-right, var(--select-trigger-btn-padding-compensation)));
|
|
5100
5100
|
display:flex;
|
|
5101
5101
|
flex-direction:column;
|
|
5102
5102
|
gap:var(--select-gap);
|
|
5103
5103
|
}
|
|
5104
|
-
.bp_select_module_container--
|
|
5104
|
+
.bp_select_module_container--69358.bp_select_module_disabled--69358{
|
|
5105
5105
|
opacity:var(--disabled-opacity);
|
|
5106
5106
|
}
|
|
5107
|
-
.bp_select_module_container--
|
|
5107
|
+
.bp_select_module_container--69358 .bp_select_module_label--69358{
|
|
5108
5108
|
font-family:var(--bp-font-font-family), -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
5109
5109
|
font-size:var(--bp-font-size-05);
|
|
5110
5110
|
font-style:normal;
|
|
@@ -5112,7 +5112,7 @@
|
|
|
5112
5112
|
letter-spacing:var(--bp-font-letter-spacing-01);
|
|
5113
5113
|
line-height:var(--bp-font-line-height-04);
|
|
5114
5114
|
}
|
|
5115
|
-
:where(body.is-inter-font) .bp_select_module_container--
|
|
5115
|
+
:where(body.is-inter-font) .bp_select_module_container--69358 .bp_select_module_label--69358{
|
|
5116
5116
|
font-family:"Inter Variable", -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
5117
5117
|
font-size:.875rem;
|
|
5118
5118
|
font-style:normal;
|
|
@@ -5123,12 +5123,12 @@
|
|
|
5123
5123
|
text-transform:none;
|
|
5124
5124
|
}
|
|
5125
5125
|
|
|
5126
|
-
.bp_select_module_container--
|
|
5126
|
+
.bp_select_module_container--69358 .bp_select_module_label--69358{
|
|
5127
5127
|
color:var(--select-label-color);
|
|
5128
5128
|
flex:0 0 fit-content;
|
|
5129
5129
|
overflow-wrap:break-word;
|
|
5130
5130
|
}
|
|
5131
|
-
.bp_select_module_container--
|
|
5131
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358{
|
|
5132
5132
|
font-family:var(--bp-font-font-family), -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
5133
5133
|
font-size:var(--bp-font-size-05);
|
|
5134
5134
|
font-style:normal;
|
|
@@ -5136,7 +5136,7 @@
|
|
|
5136
5136
|
letter-spacing:var(--bp-font-letter-spacing-01);
|
|
5137
5137
|
line-height:var(--bp-font-line-height-04);
|
|
5138
5138
|
}
|
|
5139
|
-
:where(body.is-inter-font) .bp_select_module_container--
|
|
5139
|
+
:where(body.is-inter-font) .bp_select_module_container--69358 .bp_select_module_triggerBtn--69358{
|
|
5140
5140
|
font-family:"Inter Variable", -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
5141
5141
|
font-size:.875rem;
|
|
5142
5142
|
font-style:normal;
|
|
@@ -5147,7 +5147,7 @@
|
|
|
5147
5147
|
text-transform:none;
|
|
5148
5148
|
}
|
|
5149
5149
|
|
|
5150
|
-
.bp_select_module_container--
|
|
5150
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358{
|
|
5151
5151
|
align-items:center;
|
|
5152
5152
|
background-color:var(--select-trigger-btn-bg-color);
|
|
5153
5153
|
border-bottom:var(--select-trigger-btn-border-bottom);
|
|
@@ -5168,7 +5168,7 @@
|
|
|
5168
5168
|
text-align:start;
|
|
5169
5169
|
width:100%;
|
|
5170
5170
|
}
|
|
5171
|
-
.bp_select_module_container--
|
|
5171
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 .bp_select_module_triggerValue--69358{
|
|
5172
5172
|
align-items:center;
|
|
5173
5173
|
display:flex;
|
|
5174
5174
|
gap:var(--select-trigger-btn-gap);
|
|
@@ -5177,7 +5177,7 @@
|
|
|
5177
5177
|
text-overflow:ellipsis;
|
|
5178
5178
|
white-space:nowrap;
|
|
5179
5179
|
}
|
|
5180
|
-
.bp_select_module_container--
|
|
5180
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 .bp_select_module_triggerLeftElement--69358{
|
|
5181
5181
|
align-items:center;
|
|
5182
5182
|
display:flex;
|
|
5183
5183
|
flex-shrink:0;
|
|
@@ -5185,21 +5185,21 @@
|
|
|
5185
5185
|
justify-content:center;
|
|
5186
5186
|
width:var(--select-trigger-left-element-size);
|
|
5187
5187
|
}
|
|
5188
|
-
.bp_select_module_container--
|
|
5188
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 span{
|
|
5189
5189
|
overflow:hidden;
|
|
5190
5190
|
text-overflow:ellipsis;
|
|
5191
5191
|
white-space:nowrap;
|
|
5192
5192
|
}
|
|
5193
|
-
.bp_select_module_container--
|
|
5193
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:disabled{
|
|
5194
5194
|
cursor:default;
|
|
5195
5195
|
}
|
|
5196
|
-
.bp_select_module_container--
|
|
5196
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358.bp_select_module_readonly--69358:not(:disabled){
|
|
5197
5197
|
background-color:var(--gray-02);
|
|
5198
5198
|
box-shadow:none;
|
|
5199
5199
|
color:var(--text-text-on-light-secondary);
|
|
5200
5200
|
cursor:default;
|
|
5201
5201
|
}
|
|
5202
|
-
.bp_select_module_container--
|
|
5202
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled).bp_select_module_error--69358, .bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled)[aria-invalid=true]{
|
|
5203
5203
|
background-color:var(--select-trigger-btn-error-bg-color);
|
|
5204
5204
|
border-bottom:var(--select-trigger-btn-error-border-bottom);
|
|
5205
5205
|
border-left:var(--select-trigger-btn-error-border-left);
|
|
@@ -5207,52 +5207,52 @@
|
|
|
5207
5207
|
border-top:var(--select-trigger-btn-error-border-top);
|
|
5208
5208
|
padding-inline:var(--select-trigger-btn-thick-padding-inline);
|
|
5209
5209
|
}
|
|
5210
|
-
.bp_select_module_container--
|
|
5210
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358):focus,.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled).bp_select_module_error--69358:focus,.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled)[aria-invalid=true]:focus{
|
|
5211
5211
|
background-color:var(--select-trigger-btn-focus-bg-color);
|
|
5212
5212
|
border:var(--select-trigger-btn-focus-border);
|
|
5213
5213
|
padding-inline:var(--select-trigger-btn-thick-padding-inline);
|
|
5214
5214
|
}
|
|
5215
|
-
.bp_select_module_container--
|
|
5215
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled, :focus, .bp_select_module_error--69358, [aria-invalid=true]):hover{
|
|
5216
5216
|
background-color:var(--select-trigger-btn-hover-bg-color);
|
|
5217
5217
|
border-color:var(--select-trigger-btn-hover-border-color);
|
|
5218
5218
|
}
|
|
5219
|
-
.bp_select_module_container--
|
|
5219
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 .bp_select_module_iconWrapper--69358{
|
|
5220
5220
|
flex-shrink:0;
|
|
5221
5221
|
-webkit-user-select:none;
|
|
5222
5222
|
user-select:none;
|
|
5223
5223
|
}
|
|
5224
|
-
.bp_select_module_container--
|
|
5224
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 .bp_select_module_iconCaret--69358{
|
|
5225
5225
|
display:block;
|
|
5226
5226
|
height:var(--select-trigger-btn-caret-height);
|
|
5227
5227
|
width:var(--select-trigger-btn-caret-width);
|
|
5228
5228
|
}
|
|
5229
|
-
.bp_select_module_container--
|
|
5229
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 .bp_select_module_iconCaret--69358 path{
|
|
5230
5230
|
fill:var(--select-trigger-btn-caret-color);
|
|
5231
5231
|
}
|
|
5232
|
-
.bp_select_module_container--
|
|
5232
|
+
.bp_select_module_container--69358 .bp_select_module_triggerBtn--69358 .bp_select_module_iconPencilCrossed--69358{
|
|
5233
5233
|
display:block;
|
|
5234
5234
|
height:var(--select-trigger-btn-pencil-height);
|
|
5235
5235
|
width:var(--select-trigger-btn-pencil-width);
|
|
5236
5236
|
}
|
|
5237
5237
|
|
|
5238
|
-
.bp_select_module_container--
|
|
5238
|
+
.bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled){
|
|
5239
5239
|
transition-duration:var(--bp-duration-short);
|
|
5240
5240
|
transition-property:border-color, background-color;
|
|
5241
5241
|
transition-timing-function:var(--bp-curve-small-off);
|
|
5242
5242
|
}
|
|
5243
|
-
.bp_select_module_container--
|
|
5243
|
+
.bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled).bp_select_module_error--69358, .bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled):focus, .bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled):hover, .bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled)[aria-invalid=true]{
|
|
5244
5244
|
transition-timing-function:var(--bp-curve-small-on);
|
|
5245
5245
|
}
|
|
5246
|
-
.bp_select_module_container--
|
|
5246
|
+
.bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled) .bp_select_module_iconCaret--69358{
|
|
5247
5247
|
transition-duration:var(--bp-duration-short);
|
|
5248
5248
|
transition-property:transform;
|
|
5249
5249
|
transition-timing-function:var(--bp-curve-extra-small-on);
|
|
5250
5250
|
}
|
|
5251
|
-
.bp_select_module_container--
|
|
5251
|
+
.bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled)[data-bp-exiting=true] .bp_select_module_iconCaret--69358, .bp_select_module_container--69358[data-bp-animated=true] .bp_select_module_triggerBtn--69358:not(.bp_select_module_readonly--69358, :disabled)[data-state=closed]:hover .bp_select_module_iconCaret--69358{
|
|
5252
5252
|
transform:translateY(var(--bp-size-005));
|
|
5253
5253
|
}
|
|
5254
5254
|
|
|
5255
|
-
.bp_select_module_content--
|
|
5255
|
+
.bp_select_module_content--69358{
|
|
5256
5256
|
--select-content-bg-color:var(--bp-surface-menu-surface-dropdown);
|
|
5257
5257
|
--select-content-backdrop-filter:blur(16px);
|
|
5258
5258
|
--select-content-border:var(--bp-border-01) solid var(--bp-border-card-border);
|
|
@@ -5283,7 +5283,7 @@
|
|
|
5283
5283
|
letter-spacing:var(--bp-font-letter-spacing-01);
|
|
5284
5284
|
line-height:var(--bp-font-line-height-04);
|
|
5285
5285
|
}
|
|
5286
|
-
:where(body.is-inter-font) .bp_select_module_content--
|
|
5286
|
+
:where(body.is-inter-font) .bp_select_module_content--69358{
|
|
5287
5287
|
font-family:"Inter Variable", -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
5288
5288
|
font-size:.875rem;
|
|
5289
5289
|
font-style:normal;
|
|
@@ -5294,7 +5294,7 @@
|
|
|
5294
5294
|
text-transform:none;
|
|
5295
5295
|
}
|
|
5296
5296
|
|
|
5297
|
-
.bp_select_module_content--
|
|
5297
|
+
.bp_select_module_content--69358{
|
|
5298
5298
|
backdrop-filter:var(--select-content-backdrop-filter);
|
|
5299
5299
|
background-color:var(--select-content-bg-color);
|
|
5300
5300
|
border:var(--select-content-border);
|
|
@@ -5306,11 +5306,14 @@
|
|
|
5306
5306
|
overflow:hidden auto;
|
|
5307
5307
|
z-index:var(--z-index-popover);
|
|
5308
5308
|
}
|
|
5309
|
-
.bp_select_module_content--
|
|
5309
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358{
|
|
5310
|
+
box-sizing:border-box;
|
|
5311
|
+
min-width:100%;
|
|
5310
5312
|
padding-block:var(--select-content-viewport-padding-block);
|
|
5311
5313
|
padding-inline:var(--select-content-viewport-padding-inline);
|
|
5314
|
+
width:fit-content;
|
|
5312
5315
|
}
|
|
5313
|
-
.bp_select_module_content--
|
|
5316
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358{
|
|
5314
5317
|
align-items:center;
|
|
5315
5318
|
border:var(--select-content-viewport-option-border);
|
|
5316
5319
|
border-radius:var(--select-content-viewport-option-border-radius);
|
|
@@ -5326,27 +5329,27 @@
|
|
|
5326
5329
|
-webkit-user-select:none;
|
|
5327
5330
|
user-select:none;
|
|
5328
5331
|
}
|
|
5329
|
-
.bp_select_module_content--
|
|
5332
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358[data-disabled]{
|
|
5330
5333
|
opacity:var(--disabled-opacity);
|
|
5331
5334
|
pointer-events:none;
|
|
5332
5335
|
}
|
|
5333
|
-
.bp_select_module_content--
|
|
5336
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358:focus-visible{
|
|
5334
5337
|
background-color:var(--select-content-viewport-option-focus-bg-color);
|
|
5335
5338
|
border:var(--select-content-viewport-option-focus-border);
|
|
5336
5339
|
}
|
|
5337
|
-
.bp_select_module_content--
|
|
5340
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358:hover{
|
|
5338
5341
|
background-color:var(--select-content-viewport-option-hover-bg-color);
|
|
5339
5342
|
}
|
|
5340
|
-
.bp_select_module_content--
|
|
5343
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358:active{
|
|
5341
5344
|
background-color:var(--select-content-viewport-option-active-bg-color);
|
|
5342
5345
|
}
|
|
5343
|
-
.bp_select_module_content--
|
|
5346
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_secondaryText--69358{
|
|
5344
5347
|
color:var(--select-content-viewport-option-secondary-text-color);
|
|
5345
5348
|
min-width:0;
|
|
5346
5349
|
overflow-wrap:break-word;
|
|
5347
5350
|
white-space:normal;
|
|
5348
5351
|
}
|
|
5349
|
-
.bp_select_module_content--
|
|
5352
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_textWrapper--69358{
|
|
5350
5353
|
align-items:center;
|
|
5351
5354
|
display:flex;
|
|
5352
5355
|
flex:1;
|
|
@@ -5355,24 +5358,24 @@
|
|
|
5355
5358
|
min-width:0;
|
|
5356
5359
|
overflow:hidden;
|
|
5357
5360
|
}
|
|
5358
|
-
.bp_select_module_content--
|
|
5361
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_textWrapper--69358 span:first-child{
|
|
5359
5362
|
overflow:hidden;
|
|
5360
5363
|
overflow-wrap:break-word;
|
|
5361
5364
|
}
|
|
5362
|
-
.bp_select_module_content--
|
|
5365
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_textWrapper--69358.bp_select_module_ellipsis--69358 span:first-child{
|
|
5363
5366
|
overflow-wrap:normal;
|
|
5364
5367
|
text-overflow:ellipsis;
|
|
5365
5368
|
white-space:nowrap;
|
|
5366
5369
|
width:100%;
|
|
5367
5370
|
}
|
|
5368
|
-
.bp_select_module_content--
|
|
5371
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_textWrapper--69358.bp_select_module_ellipsis--69358 .bp_select_module_secondaryText--69358{
|
|
5369
5372
|
-webkit-box-orient:vertical;
|
|
5370
5373
|
-webkit-line-clamp:2;
|
|
5371
5374
|
display:-webkit-box;
|
|
5372
5375
|
overflow:hidden;
|
|
5373
5376
|
width:100%;
|
|
5374
5377
|
}
|
|
5375
|
-
.bp_select_module_content--
|
|
5378
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_leftElement--69358{
|
|
5376
5379
|
align-items:center;
|
|
5377
5380
|
display:flex;
|
|
5378
5381
|
flex-shrink:0;
|
|
@@ -5380,14 +5383,14 @@
|
|
|
5380
5383
|
justify-content:center;
|
|
5381
5384
|
width:var(--select-content-viewport-option-left-element-size);
|
|
5382
5385
|
}
|
|
5383
|
-
.bp_select_module_content--
|
|
5386
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358.bp_select_module_hasLeftElement--69358 .bp_select_module_textWrapper--69358{
|
|
5384
5387
|
align-items:flex-start;
|
|
5385
5388
|
flex-direction:column;
|
|
5386
5389
|
}
|
|
5387
|
-
.bp_select_module_content--
|
|
5390
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358.bp_select_module_hasLeftElement--69358 .bp_select_module_textWrapper--69358 .bp_select_module_secondaryText--69358{
|
|
5388
5391
|
width:100%;
|
|
5389
5392
|
}
|
|
5390
|
-
.bp_select_module_content--
|
|
5393
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_indicator--69358{
|
|
5391
5394
|
align-items:center;
|
|
5392
5395
|
display:flex;
|
|
5393
5396
|
height:100%;
|
|
@@ -5396,70 +5399,69 @@
|
|
|
5396
5399
|
position:absolute;
|
|
5397
5400
|
top:0;
|
|
5398
5401
|
}
|
|
5399
|
-
.bp_select_module_content--
|
|
5402
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_option--69358 .bp_select_module_indicator--69358 path{
|
|
5400
5403
|
fill:var(--select-content-viewport-option-indicator-color);
|
|
5401
5404
|
}
|
|
5402
|
-
.bp_select_module_content--
|
|
5405
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358 .bp_select_module_separator--69358{
|
|
5403
5406
|
background-color:var(--select-content-viewport-option-separator-bg-color);
|
|
5404
5407
|
flex-shrink:0;
|
|
5405
5408
|
height:var(--select-content-viewport-option-separator-height);
|
|
5406
5409
|
margin-block:var(--select-content-viewport-option-separator-margin-block);
|
|
5407
5410
|
}
|
|
5408
|
-
.bp_select_module_content--
|
|
5411
|
+
.bp_select_module_content--69358 .bp_select_module_viewport--69358.bp_select_module_withTruncatedText--69358{
|
|
5409
5412
|
box-sizing:border-box;
|
|
5410
|
-
display:block !important;
|
|
5411
5413
|
max-width:100%;
|
|
5412
|
-
min-width:0
|
|
5414
|
+
min-width:0;
|
|
5413
5415
|
width:100%;
|
|
5414
5416
|
}
|
|
5415
5417
|
|
|
5416
|
-
.bp_select_module_content--
|
|
5418
|
+
.bp_select_module_content--69358[data-bp-animated=true]{
|
|
5417
5419
|
transform-origin:var(--radix-select-content-transform-origin);
|
|
5418
5420
|
}
|
|
5419
|
-
.bp_select_module_content--
|
|
5421
|
+
.bp_select_module_content--69358[data-bp-animated=true] .bp_select_module_viewport--69358 .bp_select_module_option--69358{
|
|
5420
5422
|
transition-duration:var(--bp-duration-short);
|
|
5421
5423
|
transition-property:background-color;
|
|
5422
5424
|
transition-timing-function:var(--bp-curve-small-off);
|
|
5423
5425
|
}
|
|
5424
|
-
.bp_select_module_content--
|
|
5426
|
+
.bp_select_module_content--69358[data-bp-animated=true] .bp_select_module_viewport--69358 .bp_select_module_option--69358:active,.bp_select_module_content--69358[data-bp-animated=true] .bp_select_module_viewport--69358 .bp_select_module_option--69358:focus-visible,.bp_select_module_content--69358[data-bp-animated=true] .bp_select_module_viewport--69358 .bp_select_module_option--69358:hover{
|
|
5425
5427
|
transition-timing-function:var(--bp-curve-small-on);
|
|
5426
5428
|
}
|
|
5427
|
-
.bp_select_module_content--
|
|
5429
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-state=open]:not([data-bp-exiting=true]){
|
|
5428
5430
|
animation-duration:var(--bp-duration-medium);
|
|
5429
5431
|
animation-timing-function:var(--bp-curve-medium-on);
|
|
5430
5432
|
}
|
|
5431
|
-
.bp_select_module_content--
|
|
5432
|
-
animation-name:bp_select_module_bpSelectMediumTopSlideEnter--
|
|
5433
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-state=open]:not([data-bp-exiting=true])[data-side=top]{
|
|
5434
|
+
animation-name:bp_select_module_bpSelectMediumTopSlideEnter--69358, bp_select_module_bpSelectFadeIn--69358;
|
|
5433
5435
|
}
|
|
5434
|
-
.bp_select_module_content--
|
|
5435
|
-
animation-name:bp_select_module_bpSelectMediumBottomSlideEnter--
|
|
5436
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-state=open]:not([data-bp-exiting=true])[data-side=bottom]{
|
|
5437
|
+
animation-name:bp_select_module_bpSelectMediumBottomSlideEnter--69358, bp_select_module_bpSelectFadeIn--69358;
|
|
5436
5438
|
}
|
|
5437
|
-
.bp_select_module_content--
|
|
5438
|
-
animation-name:bp_select_module_bpSelectMediumLeftSlideEnter--
|
|
5439
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-state=open]:not([data-bp-exiting=true])[data-side=left]{
|
|
5440
|
+
animation-name:bp_select_module_bpSelectMediumLeftSlideEnter--69358, bp_select_module_bpSelectFadeIn--69358;
|
|
5439
5441
|
}
|
|
5440
|
-
.bp_select_module_content--
|
|
5441
|
-
animation-name:bp_select_module_bpSelectMediumRightSlideEnter--
|
|
5442
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-state=open]:not([data-bp-exiting=true])[data-side=right]{
|
|
5443
|
+
animation-name:bp_select_module_bpSelectMediumRightSlideEnter--69358, bp_select_module_bpSelectFadeIn--69358;
|
|
5442
5444
|
}
|
|
5443
|
-
.bp_select_module_content--
|
|
5445
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-bp-exiting=true]{
|
|
5444
5446
|
animation-duration:var(--bp-duration-short);
|
|
5445
5447
|
animation-fill-mode:forwards;
|
|
5446
5448
|
animation-timing-function:var(--bp-curve-medium-off);
|
|
5447
5449
|
pointer-events:none;
|
|
5448
5450
|
}
|
|
5449
|
-
.bp_select_module_content--
|
|
5450
|
-
animation-name:bp_select_module_bpSelectMediumTopSlideExit--
|
|
5451
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-bp-exiting=true][data-side=top]{
|
|
5452
|
+
animation-name:bp_select_module_bpSelectMediumTopSlideExit--69358, bp_select_module_bpSelectFadeOut--69358;
|
|
5451
5453
|
}
|
|
5452
|
-
.bp_select_module_content--
|
|
5453
|
-
animation-name:bp_select_module_bpSelectMediumBottomSlideExit--
|
|
5454
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-bp-exiting=true][data-side=bottom]{
|
|
5455
|
+
animation-name:bp_select_module_bpSelectMediumBottomSlideExit--69358, bp_select_module_bpSelectFadeOut--69358;
|
|
5454
5456
|
}
|
|
5455
|
-
.bp_select_module_content--
|
|
5456
|
-
animation-name:bp_select_module_bpSelectMediumLeftSlideExit--
|
|
5457
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-bp-exiting=true][data-side=left]{
|
|
5458
|
+
animation-name:bp_select_module_bpSelectMediumLeftSlideExit--69358, bp_select_module_bpSelectFadeOut--69358;
|
|
5457
5459
|
}
|
|
5458
|
-
.bp_select_module_content--
|
|
5459
|
-
animation-name:bp_select_module_bpSelectMediumRightSlideExit--
|
|
5460
|
+
.bp_select_module_content--69358[data-bp-animated=true][data-bp-exiting=true][data-side=right]{
|
|
5461
|
+
animation-name:bp_select_module_bpSelectMediumRightSlideExit--69358, bp_select_module_bpSelectFadeOut--69358;
|
|
5460
5462
|
}
|
|
5461
5463
|
|
|
5462
|
-
@keyframes bp_select_module_bpSelectFadeIn--
|
|
5464
|
+
@keyframes bp_select_module_bpSelectFadeIn--69358{
|
|
5463
5465
|
from{
|
|
5464
5466
|
opacity:var(--bp-opacity-hidden);
|
|
5465
5467
|
}
|
|
@@ -5467,7 +5469,7 @@
|
|
|
5467
5469
|
opacity:var(--bp-opacity-visible);
|
|
5468
5470
|
}
|
|
5469
5471
|
}
|
|
5470
|
-
@keyframes bp_select_module_bpSelectFadeOut--
|
|
5472
|
+
@keyframes bp_select_module_bpSelectFadeOut--69358{
|
|
5471
5473
|
from{
|
|
5472
5474
|
opacity:var(--bp-opacity-visible);
|
|
5473
5475
|
}
|
|
@@ -5475,7 +5477,7 @@
|
|
|
5475
5477
|
opacity:var(--bp-opacity-hidden);
|
|
5476
5478
|
}
|
|
5477
5479
|
}
|
|
5478
|
-
@keyframes bp_select_module_bpSelectMediumTopSlideEnter--
|
|
5480
|
+
@keyframes bp_select_module_bpSelectMediumTopSlideEnter--69358{
|
|
5479
5481
|
from{
|
|
5480
5482
|
transform:translateY(var(--bp-space-020));
|
|
5481
5483
|
}
|
|
@@ -5483,7 +5485,7 @@
|
|
|
5483
5485
|
transform:translateY(0);
|
|
5484
5486
|
}
|
|
5485
5487
|
}
|
|
5486
|
-
@keyframes bp_select_module_bpSelectMediumTopSlideExit--
|
|
5488
|
+
@keyframes bp_select_module_bpSelectMediumTopSlideExit--69358{
|
|
5487
5489
|
from{
|
|
5488
5490
|
transform:translateY(0);
|
|
5489
5491
|
}
|
|
@@ -5491,7 +5493,7 @@
|
|
|
5491
5493
|
transform:translateY(var(--bp-space-020));
|
|
5492
5494
|
}
|
|
5493
5495
|
}
|
|
5494
|
-
@keyframes bp_select_module_bpSelectMediumBottomSlideEnter--
|
|
5496
|
+
@keyframes bp_select_module_bpSelectMediumBottomSlideEnter--69358{
|
|
5495
5497
|
from{
|
|
5496
5498
|
transform:translateY(calc(var(--bp-space-020)*-1));
|
|
5497
5499
|
}
|
|
@@ -5499,7 +5501,7 @@
|
|
|
5499
5501
|
transform:translateY(0);
|
|
5500
5502
|
}
|
|
5501
5503
|
}
|
|
5502
|
-
@keyframes bp_select_module_bpSelectMediumBottomSlideExit--
|
|
5504
|
+
@keyframes bp_select_module_bpSelectMediumBottomSlideExit--69358{
|
|
5503
5505
|
from{
|
|
5504
5506
|
transform:translateY(0);
|
|
5505
5507
|
}
|
|
@@ -5507,7 +5509,7 @@
|
|
|
5507
5509
|
transform:translateY(calc(var(--bp-space-020)*-1));
|
|
5508
5510
|
}
|
|
5509
5511
|
}
|
|
5510
|
-
@keyframes bp_select_module_bpSelectMediumLeftSlideEnter--
|
|
5512
|
+
@keyframes bp_select_module_bpSelectMediumLeftSlideEnter--69358{
|
|
5511
5513
|
from{
|
|
5512
5514
|
transform:translateX(var(--bp-space-020));
|
|
5513
5515
|
}
|
|
@@ -5515,7 +5517,7 @@
|
|
|
5515
5517
|
transform:translateX(0);
|
|
5516
5518
|
}
|
|
5517
5519
|
}
|
|
5518
|
-
@keyframes bp_select_module_bpSelectMediumLeftSlideExit--
|
|
5520
|
+
@keyframes bp_select_module_bpSelectMediumLeftSlideExit--69358{
|
|
5519
5521
|
from{
|
|
5520
5522
|
transform:translateX(0);
|
|
5521
5523
|
}
|
|
@@ -5523,7 +5525,7 @@
|
|
|
5523
5525
|
transform:translateX(var(--bp-space-020));
|
|
5524
5526
|
}
|
|
5525
5527
|
}
|
|
5526
|
-
@keyframes bp_select_module_bpSelectMediumRightSlideEnter--
|
|
5528
|
+
@keyframes bp_select_module_bpSelectMediumRightSlideEnter--69358{
|
|
5527
5529
|
from{
|
|
5528
5530
|
transform:translateX(calc(var(--bp-space-020)*-1));
|
|
5529
5531
|
}
|
|
@@ -5531,7 +5533,7 @@
|
|
|
5531
5533
|
transform:translateX(0);
|
|
5532
5534
|
}
|
|
5533
5535
|
}
|
|
5534
|
-
@keyframes bp_select_module_bpSelectMediumRightSlideExit--
|
|
5536
|
+
@keyframes bp_select_module_bpSelectMediumRightSlideExit--69358{
|
|
5535
5537
|
from{
|
|
5536
5538
|
transform:translateX(0);
|
|
5537
5539
|
}
|
|
@@ -21,6 +21,7 @@ export interface PageFastContextValuesType extends PagePortalRefs {
|
|
|
21
21
|
mainSectionSidebarVisible: boolean;
|
|
22
22
|
sidePanelExpanded: boolean;
|
|
23
23
|
sidePanelExpandedUserControlled: boolean;
|
|
24
|
+
sidePanelId?: string;
|
|
24
25
|
}
|
|
25
26
|
export declare const PageProvider: ({ children }: {
|
|
26
27
|
children: React.ReactNode;
|
|
@@ -37,6 +38,7 @@ export declare const useMainSectionSidebar: () => {
|
|
|
37
38
|
};
|
|
38
39
|
export declare const useSidePanel: () => {
|
|
39
40
|
sidePanelExpanded: boolean;
|
|
41
|
+
sidePanelId: string | undefined;
|
|
40
42
|
setSidePanelExpanded: (expanded: boolean) => void;
|
|
41
43
|
toggleSidePanelExpanded: () => void;
|
|
42
44
|
};
|
|
@@ -67,6 +67,7 @@ const useMainSectionSidebar = () => {
|
|
|
67
67
|
};
|
|
68
68
|
const useSidePanel = () => {
|
|
69
69
|
const [sidePanelExpanded, setPageStore] = usePageStore(store => store.sidePanelExpanded);
|
|
70
|
+
const [sidePanelId] = usePageStore(store => store.sidePanelId);
|
|
70
71
|
const breakpoint = useBreakpoint();
|
|
71
72
|
const setSidePanelExpanded = expanded => {
|
|
72
73
|
setPageStore({
|
|
@@ -86,6 +87,7 @@ const useSidePanel = () => {
|
|
|
86
87
|
};
|
|
87
88
|
return {
|
|
88
89
|
sidePanelExpanded,
|
|
90
|
+
sidePanelId,
|
|
89
91
|
setSidePanelExpanded,
|
|
90
92
|
toggleSidePanelExpanded
|
|
91
93
|
};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { FocusTrapRegion } from '@ariakit/react';
|
|
3
3
|
import clsx from 'clsx';
|
|
4
|
-
import { forwardRef, useEffect } from 'react';
|
|
4
|
+
import { forwardRef, useEffect, useId } from 'react';
|
|
5
5
|
import { useBreakpoint, Breakpoint } from '../utils/useBreakpoint.js';
|
|
6
|
-
import { usePageStore, usePageStoreRef } from './page-context.js';
|
|
6
|
+
import { usePageStore, usePageStoreRef, usePageStoreSetterSafe } from './page-context.js';
|
|
7
7
|
import styles from './page.module.js';
|
|
8
8
|
|
|
9
9
|
const useSidePanelBreakpointSync = () => {
|
|
@@ -36,24 +36,40 @@ const useSidePanelBreakpointSync = () => {
|
|
|
36
36
|
}
|
|
37
37
|
}, [breakpoint, defaultSidePanelExpanded, setPageStore, sidePanelExpandedUserControlled]);
|
|
38
38
|
};
|
|
39
|
+
const useSidePanelId = idProp => {
|
|
40
|
+
const generatedId = useId();
|
|
41
|
+
const id = idProp || `bp-page-side-panel-${generatedId}`;
|
|
42
|
+
const setPageStore = usePageStoreSetterSafe();
|
|
43
|
+
useEffect(() => {
|
|
44
|
+
setPageStore?.({
|
|
45
|
+
sidePanelId: id
|
|
46
|
+
});
|
|
47
|
+
return () => setPageStore?.({
|
|
48
|
+
sidePanelId: undefined
|
|
49
|
+
});
|
|
50
|
+
}, [id, setPageStore]);
|
|
51
|
+
return id;
|
|
52
|
+
};
|
|
39
53
|
const PageSidePanel = /*#__PURE__*/forwardRef(({
|
|
40
54
|
className,
|
|
41
55
|
children,
|
|
56
|
+
id: idProp,
|
|
42
57
|
...rest
|
|
43
58
|
}, forwardedRef) => {
|
|
44
59
|
useSidePanelBreakpointSync();
|
|
45
60
|
const [sidePanelExpanded] = usePageStore(store => store.sidePanelExpanded);
|
|
46
61
|
const setRef = usePageStoreRef('pageSidePanelRef', forwardedRef);
|
|
62
|
+
const id = useSidePanelId(idProp);
|
|
47
63
|
const breakpoint = useBreakpoint();
|
|
48
64
|
const isFullScreen = breakpoint < Breakpoint.Large && sidePanelExpanded;
|
|
49
65
|
return jsx(FocusTrapRegion, {
|
|
50
66
|
...rest,
|
|
51
67
|
ref: setRef,
|
|
52
|
-
"aria-expanded": sidePanelExpanded,
|
|
53
68
|
className: clsx(styles.sidePanel, className, {
|
|
54
69
|
[styles.expanded]: sidePanelExpanded
|
|
55
70
|
}),
|
|
56
71
|
enabled: isFullScreen,
|
|
72
|
+
id: id,
|
|
57
73
|
children: children
|
|
58
74
|
});
|
|
59
75
|
});
|
|
@@ -21,9 +21,16 @@ const FilterTriggerChip = /*#__PURE__*/forwardRef((props, forwardedRef) => {
|
|
|
21
21
|
type
|
|
22
22
|
} = useContext(FilterChipGroupContext);
|
|
23
23
|
const chipClassName = type === 'multiple' ? styles.multiSelectChip : styles.singleSelectChip;
|
|
24
|
-
|
|
24
|
+
// A host can turn the chip into another widget (e.g. an Ariakit Select trigger passes role="combobox"),
|
|
25
|
+
// in which case toggle state attributes are not allowed. The keys must be present to override Radix defaults.
|
|
26
|
+
const isToggleButton = !rest.role || rest.role === 'button';
|
|
27
|
+
const selectionStateAttrs = isToggleButton ? {
|
|
25
28
|
'data-state': selected ? 'on' : 'off',
|
|
26
29
|
'aria-pressed': Boolean(selected)
|
|
30
|
+
} : {
|
|
31
|
+
'data-state': selected ? 'on' : 'off',
|
|
32
|
+
'aria-pressed': undefined,
|
|
33
|
+
'aria-checked': undefined
|
|
27
34
|
};
|
|
28
35
|
return jsx(Chip, {
|
|
29
36
|
...rest,
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
2
|
import { PencilCrossed, ChevronDown, Checkmark } from '@box/blueprint-web-assets/icons/Medium';
|
|
3
3
|
import { bpSize030, bpIconIconOnLight } from '@box/blueprint-web-assets/tokens/tokens';
|
|
4
|
-
import * as ScrollArea from '@radix-ui/react-scroll-area';
|
|
5
4
|
import * as SelectPrimitive from '@radix-ui/react-select';
|
|
6
5
|
import clsx from 'clsx';
|
|
7
6
|
import { forwardRef, useEffect, useCallback, useLayoutEffect } from 'react';
|
|
@@ -244,19 +243,14 @@ const Content = /*#__PURE__*/forwardRef((props, forwardedRef) => {
|
|
|
244
243
|
}),
|
|
245
244
|
position: "popper",
|
|
246
245
|
sideOffset: 8,
|
|
247
|
-
children: jsx(
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
[styles.withTruncatedText]: truncateText
|
|
256
|
-
}),
|
|
257
|
-
children: children
|
|
258
|
-
})
|
|
259
|
-
})
|
|
246
|
+
children: jsx(SelectPrimitive.Viewport, {
|
|
247
|
+
className: clsx(styles.viewport, {
|
|
248
|
+
[styles.withTruncatedText]: truncateText
|
|
249
|
+
}),
|
|
250
|
+
style: {
|
|
251
|
+
flex: 'none'
|
|
252
|
+
},
|
|
253
|
+
children: children
|
|
260
254
|
})
|
|
261
255
|
})
|
|
262
256
|
});
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import '../index.css';
|
|
2
|
-
var styles = {"ellipsis":"bp_select_module_ellipsis--
|
|
2
|
+
var styles = {"ellipsis":"bp_select_module_ellipsis--69358","container":"bp_select_module_container--69358","disabled":"bp_select_module_disabled--69358","label":"bp_select_module_label--69358","triggerBtn":"bp_select_module_triggerBtn--69358","triggerValue":"bp_select_module_triggerValue--69358","triggerLeftElement":"bp_select_module_triggerLeftElement--69358","readonly":"bp_select_module_readonly--69358","error":"bp_select_module_error--69358","iconWrapper":"bp_select_module_iconWrapper--69358","iconCaret":"bp_select_module_iconCaret--69358","iconPencilCrossed":"bp_select_module_iconPencilCrossed--69358","content":"bp_select_module_content--69358","viewport":"bp_select_module_viewport--69358","option":"bp_select_module_option--69358","secondaryText":"bp_select_module_secondaryText--69358","textWrapper":"bp_select_module_textWrapper--69358","leftElement":"bp_select_module_leftElement--69358","hasLeftElement":"bp_select_module_hasLeftElement--69358","indicator":"bp_select_module_indicator--69358","separator":"bp_select_module_separator--69358","withTruncatedText":"bp_select_module_withTruncatedText--69358"};
|
|
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": "18.5.
|
|
3
|
+
"version": "18.5.2",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"publishConfig": {
|
|
@@ -55,7 +55,7 @@
|
|
|
55
55
|
"dependencies": {
|
|
56
56
|
"@ariakit/react": "0.4.21",
|
|
57
57
|
"@ariakit/react-core": "0.4.21",
|
|
58
|
-
"@box/blueprint-web-assets": "^5.12.
|
|
58
|
+
"@box/blueprint-web-assets": "^5.12.6",
|
|
59
59
|
"@internationalized/date": "^3.12.0",
|
|
60
60
|
"@radix-ui/react-accordion": "1.1.2",
|
|
61
61
|
"@radix-ui/react-checkbox": "1.0.4",
|
|
@@ -66,7 +66,6 @@
|
|
|
66
66
|
"@radix-ui/react-focus-scope": "1.0.4",
|
|
67
67
|
"@radix-ui/react-popover": "1.0.7",
|
|
68
68
|
"@radix-ui/react-radio-group": "1.1.3",
|
|
69
|
-
"@radix-ui/react-scroll-area": "1.0.5",
|
|
70
69
|
"@radix-ui/react-select": "2.0.0",
|
|
71
70
|
"@radix-ui/react-slider": "1.1.2",
|
|
72
71
|
"@radix-ui/react-switch": "1.0.3",
|
|
@@ -86,7 +85,7 @@
|
|
|
86
85
|
"devDependencies": {
|
|
87
86
|
"@box/box-test-client": "^3.2.7",
|
|
88
87
|
"@box/playwright-utils": "^2.8.5",
|
|
89
|
-
"@box/storybook-utils": "^1.4.
|
|
88
|
+
"@box/storybook-utils": "^1.4.18",
|
|
90
89
|
"@figma/code-connect": "1.4.4",
|
|
91
90
|
"@playwright/test": "1.46.1",
|
|
92
91
|
"@types/js-yaml": "^4.0.9",
|