@geotab/zenith 3.13.0-beta.1 → 3.13.1-beta.1

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 (40) hide show
  1. package/README.md +3 -1
  2. package/dist/commonHelpers/hooks/usePillSize.js +2 -2
  3. package/dist/commonStyles/popupMixin.less +2 -2
  4. package/dist/controlledPopup/controlledPopup.d.ts +4 -1
  5. package/dist/controlledPopup/controlledPopup.js +2 -2
  6. package/dist/filters/components/filtersContainer.js +64 -7
  7. package/dist/filters/components/filtersSearch.d.ts +7 -2
  8. package/dist/filters/components/filtersSearch.js +36 -72
  9. package/dist/filters/components/filtersSearchList.js +18 -35
  10. package/dist/filters/filters.d.ts +2 -0
  11. package/dist/filters/filters.js +66 -180
  12. package/dist/filters/filtersHelper.js +1 -1
  13. package/dist/groupsFilterRaw/groupsFilterRaw.js +7 -1
  14. package/dist/index.css +193 -113
  15. package/dist/inputAdornments/inputAdornments.d.ts +2 -1
  16. package/dist/inputAdornments/inputAdornments.js +2 -2
  17. package/dist/searchInputRaw/searchInputRaw.js +6 -2
  18. package/dist/searchInputRaw/types.d.ts +4 -0
  19. package/dist/utils/localization/translations/en.json +1 -0
  20. package/dist/utils/positioningUtils/calculatePosition.js +3 -1
  21. package/dist/utils/positioningUtils/normalizeVertically.js +1 -1
  22. package/esm/commonHelpers/hooks/usePillSize.js +2 -2
  23. package/esm/controlledPopup/controlledPopup.d.ts +4 -1
  24. package/esm/controlledPopup/controlledPopup.js +2 -2
  25. package/esm/filters/components/filtersContainer.js +65 -8
  26. package/esm/filters/components/filtersSearch.d.ts +7 -2
  27. package/esm/filters/components/filtersSearch.js +36 -49
  28. package/esm/filters/components/filtersSearchList.js +18 -35
  29. package/esm/filters/filters.d.ts +2 -0
  30. package/esm/filters/filters.js +67 -181
  31. package/esm/filters/filtersHelper.js +1 -1
  32. package/esm/groupsFilterRaw/groupsFilterRaw.js +7 -1
  33. package/esm/inputAdornments/inputAdornments.d.ts +2 -1
  34. package/esm/inputAdornments/inputAdornments.js +2 -2
  35. package/esm/searchInputRaw/searchInputRaw.js +6 -2
  36. package/esm/searchInputRaw/types.d.ts +4 -0
  37. package/esm/utils/localization/translations/en.json +1 -0
  38. package/esm/utils/positioningUtils/calculatePosition.js +3 -1
  39. package/esm/utils/positioningUtils/normalizeVertically.js +1 -1
  40. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -2675,7 +2675,7 @@ html:lang(ar) .zen-button--mobile {
2675
2675
  box-sizing: border-box;
2676
2676
  position: absolute;
2677
2677
  z-index: 11000;
2678
- overflow-block: auto;
2678
+ overflow-y: auto;
2679
2679
  outline: none;
2680
2680
  }
2681
2681
  .zen-absolute * {
@@ -3813,8 +3813,7 @@ html:lang(ar) .zen-card__secondary {
3813
3813
  overflow: hidden;
3814
3814
  }
3815
3815
  .zen-card__content--overflow-scroll {
3816
- overflow-inline: hidden;
3817
- overflow-block: auto;
3816
+ overflow: hidden auto;
3818
3817
  }
3819
3818
  .zen-card__header-right {
3820
3819
  margin-inline-start: auto;
@@ -4691,10 +4690,10 @@ html:lang(ar) .zen-mobile-sheet__title {
4691
4690
  }
4692
4691
  .zen-mobile-sheet__content {
4693
4692
  flex: 1 1 auto;
4694
- overflow-block: auto;
4693
+ overflow-y: auto;
4695
4694
  }
4696
4695
  .zen-mobile-sheet--mobile-android {
4697
- overflow-block: hidden;
4696
+ overflow-y: hidden;
4698
4697
  position: fixed;
4699
4698
  }
4700
4699
  .zen-mobile-sheet__footer {
@@ -4862,7 +4861,7 @@ html:lang(ar) .zen-data-feed {
4862
4861
  padding-block: 0.5625rem;
4863
4862
  }
4864
4863
  .zen-data-feed--scrollable {
4865
- overflow-block: auto;
4864
+ overflow-y: auto;
4866
4865
  }
4867
4866
  .zen-data-feed--empty .zen-data-feed__feed {
4868
4867
  display: none;
@@ -6517,18 +6516,18 @@ html:lang(ar) .zen-table__detail-panel--header-details {
6517
6516
  max-width: 100%;
6518
6517
  min-width: 0;
6519
6518
  transform: translateX(100%);
6520
- overflow-block: hidden;
6519
+ overflow-y: hidden;
6521
6520
  will-change: opacity, transform;
6522
6521
  transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1), transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
6523
6522
  }
6524
6523
  .zen-table__detail-panel--shown {
6525
6524
  opacity: 1;
6526
6525
  transform: translateX(0);
6527
- overflow-block: auto;
6526
+ overflow-y: auto;
6528
6527
  }
6529
6528
  }
6530
6529
  .zen-table__detail-panel-content {
6531
- overflow-block: auto;
6530
+ overflow-y: auto;
6532
6531
  flex: 1;
6533
6532
  padding: 0.75rem;
6534
6533
  }
@@ -6774,7 +6773,7 @@ html:lang(ar) .zen-summary-tile {
6774
6773
  .zen-summary-tile__content {
6775
6774
  max-height: 2rem;
6776
6775
  min-height: 2rem;
6777
- overflow-block: hidden;
6776
+ overflow-y: hidden;
6778
6777
  width: 100%;
6779
6778
  }
6780
6779
  .zen-summary-tile__title-text {
@@ -8298,7 +8297,7 @@ html:lang(ar) .zen-checkbox-list-with-action__counter {
8298
8297
  text-transform: none;
8299
8298
  text-decoration: none;
8300
8299
  height: 100%;
8301
- overflow-block: auto;
8300
+ overflow-y: auto;
8302
8301
  max-height: 15.3125rem;
8303
8302
  }
8304
8303
  html:lang(ar) .zen-dropdown-list__elements {
@@ -9402,11 +9401,13 @@ html:lang(ar) .zen-text-input {
9402
9401
  line-height: 1rem;
9403
9402
  text-transform: none;
9404
9403
  text-decoration: none;
9405
- font-size: 16px !important;
9406
9404
  }
9407
9405
  html:lang(ar) .zen-text-input.zen-text-input--mobile {
9408
9406
  font-family: "Noto Sans Arabic", Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
9409
9407
  }
9408
+ .zen-text-input.zen-text-input--mobile input {
9409
+ font-size: 16px;
9410
+ }
9410
9411
  .zen-input-adornments-border {
9411
9412
  box-sizing: border-box;
9412
9413
  border: 0;
@@ -9534,7 +9535,6 @@ html:lang(ar) .zen-text-input.zen-text-input--mobile {
9534
9535
  display: grid;
9535
9536
  gap: 0.5rem;
9536
9537
  align-items: center;
9537
- font-size: 1.0625rem;
9538
9538
  }
9539
9539
  .zen-input-adornments.zen-input-adornments--mobile.zen-input-adornments--has-start,
9540
9540
  .zen-input-adornments.zen-input-adornments--mobile.zen-input-adornments--has-end {
@@ -10020,7 +10020,7 @@ html:lang(ar) .zen-pill-box__label {
10020
10020
  box-sizing: border-box;
10021
10021
  }
10022
10022
  .zen-modal-content--hidden-overflow.zen-modal-content--hidden-overflow {
10023
- overflow-block: hidden;
10023
+ overflow-y: hidden;
10024
10024
  }
10025
10025
  .zen-modal-content__header {
10026
10026
  display: flex;
@@ -10373,7 +10373,7 @@ html:lang(ar) .zen-status-pill__container {
10373
10373
  flex-direction: column;
10374
10374
  padding: 0.75rem 0.5rem;
10375
10375
  gap: 1rem;
10376
- overflow-block: auto;
10376
+ overflow-y: auto;
10377
10377
  max-height: 480px;
10378
10378
  }
10379
10379
  .zen-status-pill-popup__container--small {
@@ -10471,7 +10471,7 @@ html:lang(ar) .zen-status-pill-popup__header-text {
10471
10471
  text-transform: none;
10472
10472
  text-decoration: none;
10473
10473
  color: var(--text-secondary);
10474
- overflow-block: auto;
10474
+ overflow-y: auto;
10475
10475
  }
10476
10476
  html:lang(ar) .zen-status-pill-popup__description {
10477
10477
  font-family: "Noto Sans Arabic", Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
@@ -10510,7 +10510,7 @@ html:lang(ar) .zen-status-pill-popup__description {
10510
10510
  .zen-status-pill-popup--mobile .zen-mobile-sheet__content {
10511
10511
  padding: 1rem;
10512
10512
  max-height: 90vb;
10513
- overflow-block: auto;
10513
+ overflow-y: auto;
10514
10514
  }
10515
10515
  .zen-status-pill-popup__mobile-title {
10516
10516
  font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
@@ -11132,7 +11132,7 @@ html:lang(ar) .zen-chart__x-axis {
11132
11132
  .zen-chart--legend-right .zen-chart__legend {
11133
11133
  flex: 0 0 100%;
11134
11134
  padding-inline-start: 0;
11135
- overflow-block: visible;
11135
+ overflow-y: visible;
11136
11136
  }
11137
11137
  }
11138
11138
  .zen-pie-legend {
@@ -11923,7 +11923,7 @@ html:lang(ar) .zen-columns-filter__item {
11923
11923
  .zen-date-input-popup {
11924
11924
  width: 17.5rem;
11925
11925
  min-width: 17.5rem;
11926
- overflow-inline: hidden;
11926
+ overflow-x: hidden;
11927
11927
  }
11928
11928
  .zen-date-input-popup__button-clear {
11929
11929
  margin-block: 0.5rem 0.25rem;
@@ -12239,7 +12239,7 @@ html:lang(ar) .zen-date-input-inner__control-block {
12239
12239
  .zen-date-range-popup {
12240
12240
  width: 17.5rem;
12241
12241
  min-width: 17.5rem;
12242
- overflow-inline: hidden;
12242
+ overflow-x: hidden;
12243
12243
  }
12244
12244
  .zen-date-range-popup__button-clear {
12245
12245
  margin-block: 0.5rem 0.25rem;
@@ -12720,10 +12720,10 @@ html:lang(ar) .zen-radio__wrapper--mobile .zen-radio__label {
12720
12720
  border-radius: var(--border-radius-default);
12721
12721
  }
12722
12722
  .zen-popup-body.zen-popup-body {
12723
- overflow-block: auto;
12723
+ overflow-y: auto;
12724
12724
  }
12725
12725
  .zen-popup-body.zen-popup-body--hidden {
12726
- overflow-block: hidden;
12726
+ overflow-y: hidden;
12727
12727
  }
12728
12728
  .zen-alerts {
12729
12729
  position: fixed;
@@ -13130,17 +13130,50 @@ html:lang(ar) .zen-file-upload__file-name {
13130
13130
  }
13131
13131
  }
13132
13132
  .zen-filters {
13133
- max-width: 40rem;
13133
+ display: flex;
13134
+ align-items: center;
13135
+ gap: 0.5rem;
13136
+ width: 100%;
13134
13137
  box-sizing: border-box;
13135
13138
  }
13136
13139
  .zen-filters * {
13137
13140
  box-sizing: border-box;
13138
13141
  }
13142
+ .zen-filters .zen-filters-search {
13143
+ flex-grow: 0;
13144
+ flex-shrink: 0;
13145
+ margin: 0;
13146
+ width: 11.25rem;
13147
+ }
13148
+ .zen-filters--mobile {
13149
+ flex-wrap: nowrap;
13150
+ overflow: auto hidden;
13151
+ scrollbar-width: none;
13152
+ -ms-overflow-style: none;
13153
+ }
13154
+ .zen-filters--mobile::-webkit-scrollbar {
13155
+ display: none;
13156
+ }
13157
+ .zen-filters--mobile .zen-filters__main-row--mobile {
13158
+ flex-shrink: 0;
13159
+ }
13160
+ .zen-filters--mobile .zen-filters-container {
13161
+ flex-shrink: 0;
13162
+ flex-grow: 0;
13163
+ flex-wrap: nowrap;
13164
+ width: auto;
13165
+ min-width: unset;
13166
+ }
13167
+ .zen-filters--mobile .zen-filters-container__mobile-scroll-wrapper {
13168
+ overflow: visible;
13169
+ width: auto;
13170
+ flex-shrink: 0;
13171
+ }
13139
13172
  .zen-filters__main-row {
13140
13173
  display: flex;
13141
13174
  align-items: center;
13142
13175
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.15);
13143
- border-radius: var(--border-radius-default);
13176
+ border-radius: 999px;
13144
13177
  border: var(--border-width-default) solid var(--borders-general);
13145
13178
  background-color: var(--backgrounds-main);
13146
13179
  }
@@ -13150,12 +13183,15 @@ html:lang(ar) .zen-file-upload__file-name {
13150
13183
  .zen-filters__main-row:hover .zen-search-input__input {
13151
13184
  background-color: var(--backgrounds-content-0);
13152
13185
  }
13153
- .zen-filters__main-row--mobile {
13154
- margin: 0.5rem;
13155
- }
13156
13186
  .zen-filters__main-row--initial {
13157
13187
  view-transition-name: expand-panel;
13158
13188
  }
13189
+ .zen-filters__main-row--mobile {
13190
+ width: auto;
13191
+ }
13192
+ .zen-filters__main-row--mobile .zen-filters-search {
13193
+ width: auto;
13194
+ }
13159
13195
  .zen-filters__select-trigger {
13160
13196
  width: auto;
13161
13197
  flex-shrink: 0;
@@ -13202,39 +13238,53 @@ html:lang(ar) .zen-file-upload__file-name {
13202
13238
  }
13203
13239
  .zen-filters__search .zen-search-input__input {
13204
13240
  border: none;
13205
- padding-inline: 0 0.0625rem;
13206
- border-end-start-radius: 0;
13207
- border-start-start-radius: 0;
13241
+ border-radius: 999px;
13242
+ display: flex;
13243
+ }
13244
+ .zen-filters__search-with-pills {
13245
+ border-radius: 999px;
13208
13246
  }
13209
- .zen-filters-popup.zen-filters-popup:not(.zen-filters-popup--mobile) {
13247
+ .zen-filters-popup.zen-filters-popup {
13210
13248
  box-sizing: border-box;
13211
- width: 40rem;
13212
- max-width: 40rem;
13249
+ border-radius: 0.5rem;
13250
+ overflow: hidden;
13251
+ display: flex;
13252
+ flex-direction: column;
13253
+ width: 28.125rem;
13254
+ max-width: 100%;
13213
13255
  view-transition-name: expand-panel;
13256
+ padding: 0;
13214
13257
  }
13215
- .zen-filters-popup.zen-filters-popup:not(.zen-filters-popup--mobile) * {
13258
+ .zen-filters-popup.zen-filters-popup * {
13216
13259
  box-sizing: border-box;
13217
13260
  }
13218
13261
  .zen-filters-popup__first-row {
13219
13262
  display: flex;
13220
- justify-content: space-between;
13221
13263
  align-items: center;
13222
- gap: 0.5rem;
13223
- padding: 0;
13264
+ border-block-end: var(--border-width-default) solid var(--borders-general);
13265
+ }
13266
+ .zen-filters-popup__first-row .zen-filters-search {
13267
+ flex-grow: 1;
13268
+ margin: 0;
13269
+ width: 100%;
13224
13270
  }
13225
- .zen-filters-popup__first-row--mobile {
13226
- padding: 0.5rem 1rem;
13271
+ .zen-filters-popup__first-row .zen-search-input__close-button--visible {
13272
+ visibility: visible;
13227
13273
  }
13228
13274
  .zen-filters-popup__second-row {
13229
- border-block-start: var(--border-width-default) solid var(--borders-general);
13230
- padding: 1rem 0;
13231
- }
13232
- .zen-filters-popup__second-row--mobile {
13233
13275
  border-block-start: none;
13234
13276
  padding: 0;
13277
+ display: flex;
13278
+ flex-direction: column;
13279
+ flex: 1;
13280
+ min-height: 0;
13281
+ overflow-y: hidden;
13235
13282
  }
13236
13283
  .zen-filters-popup__content {
13237
13284
  display: flex;
13285
+ flex: 1;
13286
+ min-height: 0;
13287
+ overflow: hidden;
13238
13288
  }
13239
13289
  .zen-filters-popup__content .zen-filters-popup__left-panel {
13240
13290
  display: flex;
@@ -13250,36 +13300,55 @@ html:lang(ar) .zen-file-upload__file-name {
13250
13300
  }
13251
13301
  .zen-filters-popup__content .zen-filters-popup__right-panel {
13252
13302
  flex-grow: 1;
13253
- height: 100%;
13254
- max-width: calc(100% - 7.6875rem);
13255
- }
13256
- .zen-filters-popup.zen-filters-popup--mobile {
13257
- width: 100%;
13258
- max-width: 100%;
13259
- view-transition-name: expand-panel;
13260
- }
13261
- .zen-filters-popup.zen-filters-popup--mobile .zen-filters-popup__right-panel {
13303
+ display: flex;
13304
+ flex-direction: column;
13305
+ min-height: 0;
13262
13306
  max-width: 100%;
13263
13307
  }
13264
13308
  .zen-filters-container {
13265
13309
  display: flex;
13266
13310
  flex-flow: row wrap;
13311
+ flex-grow: 1;
13312
+ min-width: 0;
13267
13313
  gap: 0.25rem;
13268
- margin-block-start: 0.5rem;
13314
+ margin-block-start: 0;
13269
13315
  padding: 0.5rem 0;
13270
13316
  }
13271
- .zen-filters-container__removal-chip .zen-chip__icon {
13272
- border: 1px solid var(--action-primary--active);
13273
- border-radius: 50%;
13317
+ .zen-filters-container .zen-chip--default {
13318
+ background-color: var(--backgrounds-main);
13319
+ color: var(--text-secondary);
13320
+ fill: var(--text-secondary);
13321
+ }
13322
+ .zen-filters-container .zen-chip--default:hover {
13323
+ background-color: var(--backgrounds-content-1);
13324
+ }
13325
+ .zen-filters-container .zen-chip--active {
13326
+ background-color: var(--accents-general--main);
13327
+ color: var(--action-primary--active);
13328
+ fill: var(--action-primary--active);
13329
+ border-color: var(--action-primary--active);
13330
+ }
13331
+ .zen-filters-container .zen-chip--active:hover {
13332
+ border-color: var(--action-primary--active);
13333
+ }
13334
+ .zen-filters-container .zen-chip--accent {
13335
+ background-color: var(--action-primary--active);
13336
+ color: var(--accents-general--main);
13337
+ fill: var(--accents-general--main);
13338
+ border-color: var(--action-primary--active);
13274
13339
  }
13275
- .zen-filters-container__removal-chip.zen-chip--accent .zen-chip__icon {
13276
- border: 1px solid var(--accents-general--main);
13340
+ .zen-filters-container__save-chip.zen-chip--active {
13341
+ border-color: var(--borders-general);
13277
13342
  }
13278
13343
  .zen-filters-container.zen-filters-container--mobile {
13279
13344
  padding: 0;
13280
13345
  }
13346
+ .zen-filters-container.zen-filters-container--mobile .zen-chip {
13347
+ height: 40px;
13348
+ padding-block: 0.75rem;
13349
+ padding-inline: 0.5rem;
13350
+ }
13281
13351
  .zen-filters-container__mobile-scroll-wrapper {
13282
- margin-inline-start: 0.5rem;
13283
13352
  padding: 0.125rem;
13284
13353
  display: flex;
13285
13354
  flex-flow: row nowrap;
@@ -13298,9 +13367,6 @@ html:lang(ar) .zen-file-upload__file-name {
13298
13367
  .zen-filters-container__mobile-scroll-wrapper > * {
13299
13368
  flex-shrink: 0;
13300
13369
  }
13301
- .zen-filters-container__mobile-scroll-wrapper:last-child {
13302
- margin-inline-end: 0.5rem;
13303
- }
13304
13370
  .zen-filters-container.zen-filters__container--no-search {
13305
13371
  margin-block-start: 0;
13306
13372
  padding: 0;
@@ -13359,8 +13425,7 @@ html:lang(ar) .zen-file-upload__file-name {
13359
13425
  height: 3rem;
13360
13426
  }
13361
13427
  .zen-groups-filter-menu__groups-box {
13362
- overflow-block: auto;
13363
- overflow-inline: hidden;
13428
+ overflow: hidden auto;
13364
13429
  max-height: 16.25rem;
13365
13430
  }
13366
13431
  .zen-groups-filter-menu__groups-list--no-space,
@@ -13701,7 +13766,7 @@ html:lang(ar) .zen-groups-filter .zen-groups-filter__input::placeholder {
13701
13766
  }
13702
13767
  .zen-groups-filter__popup.zen-groups-filter__popup {
13703
13768
  z-index: 11001;
13704
- overflow-block: hidden;
13769
+ overflow-y: hidden;
13705
13770
  }
13706
13771
  .zen-groups-filter__popup.zen-groups-filter__popup.zen-groups-filter__popup--inactive {
13707
13772
  z-index: 10999;
@@ -14517,19 +14582,19 @@ html:lang(ar) .zen-list-item__secondary {
14517
14582
  justify-content: center;
14518
14583
  }
14519
14584
  .zen-filters-search-list {
14520
- max-height: 21.5625rem;
14521
- min-height: 21.25rem;
14585
+ flex: 1;
14586
+ min-height: 0;
14587
+ overflow-y: auto;
14522
14588
  }
14523
14589
  .zen-filters-search-list--mobile {
14524
14590
  padding: 1rem 0;
14525
- overflow-block: auto;
14526
14591
  }
14527
14592
  .zen-filters-search-list__header {
14528
14593
  display: flex;
14529
14594
  align-items: center;
14530
14595
  justify-content: space-between;
14531
- margin-block: 0 0.5rem;
14532
- margin-inline: 0.5rem;
14596
+ margin-block: 1rem;
14597
+ margin-inline: 1rem;
14533
14598
  }
14534
14599
  .zen-filters-search-list__header-title {
14535
14600
  font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
@@ -14545,9 +14610,10 @@ html:lang(ar) .zen-list-item__secondary {
14545
14610
  html:lang(ar) .zen-filters-search-list__header-title {
14546
14611
  font-family: "Noto Sans Arabic", Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
14547
14612
  }
14548
- .zen-filters-search-list__data {
14549
- padding: 1px;
14550
- max-height: 18.5rem;
14613
+ .zen-filters-search-list__header-actions {
14614
+ display: flex;
14615
+ align-items: center;
14616
+ gap: 0.25rem;
14551
14617
  }
14552
14618
  .zen-filters-search-list .zen-filters-search-list__header--drive .zen-filters-search-list__header-title {
14553
14619
  font-family: "Roboto Mono", "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
@@ -14699,10 +14765,6 @@ html:lang(ar) .zen-search-item-data__identifier {
14699
14765
  line-height: 1rem;
14700
14766
  text-transform: none;
14701
14767
  text-decoration: none;
14702
- overflow: hidden;
14703
- text-overflow: ellipsis;
14704
- white-space: nowrap;
14705
- overflow-wrap: normal;
14706
14768
  color: var(--text-primary);
14707
14769
  flex: 1 1 auto;
14708
14770
  align-content: center;
@@ -15031,8 +15093,7 @@ html:lang(ar) .zen-page-header--mobile .zen-page-header__page-name {
15031
15093
  }
15032
15094
  .zen-tabs__scrollable {
15033
15095
  display: flex;
15034
- overflow-inline: auto;
15035
- overflow-block: hidden;
15096
+ overflow: auto hidden;
15036
15097
  scrollbar-width: none;
15037
15098
  -ms-overflow-style: none;
15038
15099
  padding: 0.0625rem;
@@ -15399,8 +15460,7 @@ html:lang(ar) .zen-tab-item.zen-tab-item--mobile .zen-tab-item__content-text {
15399
15460
  }
15400
15461
  .zen-filters-toolbar__scrollable {
15401
15462
  display: flex;
15402
- overflow-inline: auto;
15403
- overflow-block: hidden;
15463
+ overflow: auto hidden;
15404
15464
  height: 100%;
15405
15465
  scrollbar-width: none;
15406
15466
  -ms-overflow-style: none;
@@ -15579,7 +15639,7 @@ html:lang(ar) .zen-filters-toolbar__action-quantity {
15579
15639
  }
15580
15640
  .zen-side-panel-parent--open {
15581
15641
  max-height: 100vb;
15582
- overflow-block: hidden;
15642
+ overflow-y: hidden;
15583
15643
  }
15584
15644
  .zen-filters-bar-dropdown {
15585
15645
  box-sizing: border-box;
@@ -16208,27 +16268,55 @@ html:lang(ar) .zen-filters-saved-popup__content.zen-filters-saved-popup__content
16208
16268
  flex-grow: 1;
16209
16269
  margin: 0 0.75rem;
16210
16270
  }
16271
+ .zen-filters-search__search-input {
16272
+ flex: 1;
16273
+ min-width: 0;
16274
+ }
16211
16275
  .zen-filters-search__selected {
16212
16276
  display: flex;
16213
16277
  gap: 0.5rem;
16214
16278
  flex-wrap: nowrap;
16215
16279
  align-items: center;
16216
- margin-inline-start: 0.5rem;
16217
- overflow: hidden;
16280
+ margin-inline-end: 0.5rem;
16281
+ flex-shrink: 0;
16218
16282
  }
16219
16283
  .zen-filters-search__selected-item {
16220
16284
  max-width: 11.3125rem;
16221
16285
  }
16222
16286
  .zen-filters-search__selected-item--more {
16223
16287
  flex-shrink: 0;
16288
+ min-width: 1.375rem;
16289
+ justify-content: center;
16224
16290
  }
16225
- .zen-filters-search.zen-filters-popup__search-with-pills.zen-filters-search--mobile {
16291
+ .zen-filters-search.zen-filters-popup__search-with-pills {
16226
16292
  margin: 0;
16227
16293
  padding: 0 0.75rem;
16228
- border: var(--border-width-default) solid var(--borders-general);
16229
- border-radius: var(--border-radius-default);
16230
16294
  }
16231
- .zen-filters-search.zen-filters-popup__search-with-pills.zen-filters-search--mobile .zen-filters-search__selected {
16295
+ .zen-filters-search.zen-filters-popup__search-with-pills .zen-filters-search__selected {
16296
+ flex-shrink: 0;
16297
+ }
16298
+ .zen-filters-search--mobile {
16299
+ margin: 0;
16300
+ }
16301
+ .zen-filters-search__mobile-trigger {
16302
+ display: flex;
16303
+ align-items: center;
16304
+ justify-content: center;
16305
+ background: none;
16306
+ border: none;
16307
+ cursor: pointer;
16308
+ padding: 0 0.5rem;
16309
+ width: 2.5rem;
16310
+ height: 2.5rem;
16311
+ color: inherit;
16312
+ fill: currentcolor;
16313
+ flex-shrink: 0;
16314
+ }
16315
+ .zen-filters-search__mobile-trigger:focus-visible {
16316
+ outline: var(--border-width-default) solid var(--borders-form-field--active);
16317
+ border-radius: 999px;
16318
+ }
16319
+ .zen-filters-search__mobile-trigger-icon {
16232
16320
  flex-shrink: 0;
16233
16321
  }
16234
16322
  .zen-side-panel-filters {
@@ -16315,8 +16403,7 @@ html:lang(ar) .zen-side-panel-filters__title--mobile {
16315
16403
  fill: var(--text-primary);
16316
16404
  }
16317
16405
  .zen-side-panel-filters__content {
16318
- overflow-inline: hidden;
16319
- overflow-block: auto;
16406
+ overflow: hidden auto;
16320
16407
  flex: 1 1 auto;
16321
16408
  }
16322
16409
  .zen-side-panel-filters__item {
@@ -16412,7 +16499,7 @@ html:lang(ar) .zen-side-panel-filters__item-label--mobile {
16412
16499
  display: flex;
16413
16500
  flex-direction: column;
16414
16501
  height: 100%;
16415
- overflow-block: hidden;
16502
+ overflow-y: hidden;
16416
16503
  }
16417
16504
  .zen-side-panel-filters.zen-side-panel-filters {
16418
16505
  min-width: 22.5rem;
@@ -16426,16 +16513,12 @@ html:lang(ar) .zen-side-panel-filters__item-label--mobile {
16426
16513
  }
16427
16514
  }
16428
16515
  .zen-filters-select-compact {
16429
- padding: 0.25rem 1rem;
16516
+ padding-block: 1rem 0.25rem;
16517
+ padding-inline: 1rem;
16430
16518
  width: 100%;
16431
- overflow-inline: auto;
16432
- -ms-overflow-style: none;
16433
- /* IE and Edge */
16434
- scrollbar-width: none;
16435
- /* Firefox */
16436
- }
16437
- .zen-filters-select-compact::-webkit-scrollbar {
16438
- display: none;
16519
+ box-sizing: border-box;
16520
+ overflow-x: auto;
16521
+ flex-shrink: 0;
16439
16522
  }
16440
16523
  .zen-filters-select-compact__list {
16441
16524
  display: flex;
@@ -16746,8 +16829,7 @@ html:lang(ar) .zen-side-panel-filters-bar__title {
16746
16829
  }
16747
16830
  .zen-side-panel-filters-bar__content {
16748
16831
  padding-block-start: 0.5rem;
16749
- overflow-inline: hidden;
16750
- overflow-block: auto;
16832
+ overflow: hidden auto;
16751
16833
  flex: 1 1 auto;
16752
16834
  }
16753
16835
  .zen-side-panel-filters-bar__apply-button--desktop {
@@ -16777,7 +16859,7 @@ html:lang(ar) .zen-side-panel-filters-bar__title {
16777
16859
  display: flex;
16778
16860
  flex-direction: column;
16779
16861
  height: 100%;
16780
- overflow-block: hidden;
16862
+ overflow-y: hidden;
16781
16863
  }
16782
16864
  .zen-side-panel-filters-bar.zen-side-panel-filters-bar {
16783
16865
  min-width: 20rem;
@@ -17478,7 +17560,7 @@ html:lang(ar) .zen-mobile-filter-control__counter {
17478
17560
  padding-block-start: 0;
17479
17561
  }
17480
17562
  .zen-layout.zen-layout--no-scroll .zen-layout__content {
17481
- overflow-block: auto;
17563
+ overflow-y: auto;
17482
17564
  }
17483
17565
  .zen-card-deck {
17484
17566
  box-sizing: border-box;
@@ -17561,7 +17643,7 @@ html:lang(ar) .zen-mobile-filter-control__counter {
17561
17643
  }
17562
17644
  .zen-page-header-component__actions--mobile-portal {
17563
17645
  position: fixed;
17564
- inset-block-end: 1rem;
17646
+ inset-block-end: 4rem;
17565
17647
  inset-inline-start: 50%;
17566
17648
  transform: translateX(-50%);
17567
17649
  border-radius: 8px;
@@ -17710,8 +17792,7 @@ html:lang(ar) .zen-mini-tabs {
17710
17792
  }
17711
17793
  .zen-nav__content {
17712
17794
  flex: 1 1 auto;
17713
- overflow-block: auto;
17714
- overflow-inline: hidden;
17795
+ overflow: hidden auto;
17715
17796
  position: relative;
17716
17797
  }
17717
17798
  .zen-nav__content--has-scrollbar {
@@ -17770,7 +17851,7 @@ html:lang(ar) .zen-mini-tabs {
17770
17851
  .zen-nav--mobile {
17771
17852
  padding-block: var(--nav-top-bottom-mobile-padding);
17772
17853
  padding-inline: var(--nav-left-right-padding);
17773
- overflow-block: auto;
17854
+ overflow-y: auto;
17774
17855
  gap: 0.5rem;
17775
17856
  }
17776
17857
  .zen-nav--mobile .zen-nav__content {
@@ -17784,11 +17865,11 @@ html:lang(ar) .zen-mini-tabs {
17784
17865
  padding-block: 0.375rem;
17785
17866
  }
17786
17867
  .zen-nav--mobile-edit {
17787
- overflow-block: hidden;
17868
+ overflow-y: hidden;
17788
17869
  }
17789
17870
  .zen-nav--mobile-edit .zen-nav__content {
17790
17871
  flex: 1 1 auto;
17791
- overflow-block: auto;
17872
+ overflow-y: auto;
17792
17873
  }
17793
17874
  .zen-nav--collapsed {
17794
17875
  padding-inline: var(--nav-left-right-collapsed-padding);
@@ -18701,8 +18782,7 @@ html:lang(ar) .zen-pill {
18701
18782
  }
18702
18783
  .zen-page-layout {
18703
18784
  box-sizing: border-box;
18704
- overflow-inline: hidden;
18705
- overflow-block: auto;
18785
+ overflow: hidden auto;
18706
18786
  z-index: 1000;
18707
18787
  margin: 0;
18708
18788
  touch-action: manipulation;
@@ -19179,7 +19259,7 @@ html:lang(ar) .zen-tab-bar-content {
19179
19259
  padding: 0.75rem;
19180
19260
  background-color: var(--backgrounds-content-1);
19181
19261
  width: 100%;
19182
- overflow-inline: hidden;
19262
+ overflow-x: hidden;
19183
19263
  }
19184
19264
  .zen-toolbar * {
19185
19265
  box-sizing: border-box;
@@ -26,8 +26,9 @@ export interface IInputAdornments {
26
26
  ariaControls?: string;
27
27
  ariaHaspopup?: boolean | "dialog" | "menu" | "grid" | "true" | "false" | "listbox" | "tree";
28
28
  ariaExpanded?: boolean | "true" | "false";
29
+ autocomplete?: string;
29
30
  }
30
31
  export declare const InputAdornments: {
31
- ({ id, value, className, disabled, isError, maxLength, onChange, onKeyDown, onFocus, startAdornment, endAdornment, placeholder, inputType, autoFocus, name, onBlur, ref, ariaLabel, ariaDescribedby, role, ariaAutocomplete, ariaControls, ariaHaspopup, ariaExpanded }: IInputAdornments): import("react/jsx-runtime").JSX.Element;
32
+ ({ id, value, className, disabled, isError, maxLength, onChange, onKeyDown, onFocus, startAdornment, endAdornment, placeholder, inputType, autoFocus, name, onBlur, ref, ariaLabel, ariaDescribedby, role, ariaAutocomplete, ariaControls, ariaHaspopup, ariaExpanded, autocomplete }: IInputAdornments): import("react/jsx-runtime").JSX.Element;
32
33
  displayName: string;
33
34
  };