@eturnity/eturnity_reusable_components 9.31.2 → 9.31.4
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/package.json
CHANGED
|
@@ -1055,10 +1055,16 @@
|
|
|
1055
1055
|
this.handleSetDropdownOffet()
|
|
1056
1056
|
this.refreshOptionLength()
|
|
1057
1057
|
if (!this.isFixedDropdownPosition) this.calculateSelectTopPosition()
|
|
1058
|
+
// Teleported menus live in <body>, so they aren't clipped by a
|
|
1059
|
+
// scrollable ancestor (e.g. the filter modal). Close on outside
|
|
1060
|
+
// scroll to avoid the menu floating free of its trigger.
|
|
1061
|
+
if (this.shouldUseTeleport)
|
|
1062
|
+
document.addEventListener('scroll', this.handleScrollClose, true)
|
|
1058
1063
|
// Deferred dropdown slot content mounts after initial open in some hosts.
|
|
1059
1064
|
this.$nextTick(() => this.refreshOptionLength())
|
|
1060
1065
|
} else {
|
|
1061
1066
|
this.$emit('on-dropdown-close')
|
|
1067
|
+
document.removeEventListener('scroll', this.handleScrollClose, true)
|
|
1062
1068
|
this.dropdownPosition.left = null
|
|
1063
1069
|
this.optionLengthCount = 0
|
|
1064
1070
|
if (this.animationFrameId) {
|
|
@@ -1139,6 +1145,7 @@
|
|
|
1139
1145
|
this.clickOutside,
|
|
1140
1146
|
CLICK_OUTSIDE_CAPTURE
|
|
1141
1147
|
)
|
|
1148
|
+
document.removeEventListener('scroll', this.handleScrollClose, true)
|
|
1142
1149
|
},
|
|
1143
1150
|
methods: {
|
|
1144
1151
|
getDropdownTopScrollYOffset() {
|
|
@@ -1162,6 +1169,14 @@
|
|
|
1162
1169
|
this.clearSearch()
|
|
1163
1170
|
this.isDropdownOpen = false
|
|
1164
1171
|
},
|
|
1172
|
+
handleScrollClose(e) {
|
|
1173
|
+
// Ignore scrolling within the menu itself (e.g. a long option list);
|
|
1174
|
+
// only close when a surrounding container scrolls. The menu is
|
|
1175
|
+
// teleported to <body>, so check the teleported dropdown element.
|
|
1176
|
+
const menuEl = this.$refs.dropdown?.$el
|
|
1177
|
+
if (menuEl && (menuEl === e.target || menuEl.contains(e.target))) return
|
|
1178
|
+
this.closeDropdown()
|
|
1179
|
+
},
|
|
1165
1180
|
clearSearch() {
|
|
1166
1181
|
this.textSearch = ''
|
|
1167
1182
|
this.searchChange('')
|
|
@@ -292,6 +292,7 @@
|
|
|
292
292
|
v-if="!isCollapsed"
|
|
293
293
|
data-id="footer_documents_button"
|
|
294
294
|
data-qa-id="footer_documents_button"
|
|
295
|
+
:is-disabled="footerButtonDisabled"
|
|
295
296
|
:text="footerButtonText"
|
|
296
297
|
@click="onFooterButtonClick()"
|
|
297
298
|
/>
|
|
@@ -299,6 +300,7 @@
|
|
|
299
300
|
v-else
|
|
300
301
|
data-id="footer_documents_button"
|
|
301
302
|
data-qa-id="footer_documents_button"
|
|
303
|
+
:is-disabled="footerButtonDisabled"
|
|
302
304
|
@click="onFooterButtonClick()"
|
|
303
305
|
>
|
|
304
306
|
<IconComponent color="white" name="documents" size="16px" />
|
|
@@ -560,15 +562,19 @@
|
|
|
560
562
|
font-weight: 400;
|
|
561
563
|
`
|
|
562
564
|
|
|
563
|
-
const
|
|
565
|
+
const FooterButtonWrapperAttrs = { isDisabled: Boolean }
|
|
566
|
+
const FooterButtonWrapper = styled('div', FooterButtonWrapperAttrs)`
|
|
564
567
|
display: flex;
|
|
565
568
|
align-items: center;
|
|
566
569
|
justify-content: center;
|
|
567
570
|
width: 30px;
|
|
568
571
|
height: 30px;
|
|
569
572
|
border-radius: 4px;
|
|
570
|
-
cursor: pointer;
|
|
571
|
-
background-color: ${(p) =>
|
|
573
|
+
cursor: ${(p) => (p.isDisabled ? 'not-allowed' : 'pointer')};
|
|
574
|
+
background-color: ${(p) =>
|
|
575
|
+
p.isDisabled
|
|
576
|
+
? p.theme.colors.disabled
|
|
577
|
+
: p.theme.semanticColors.purple[500]};
|
|
572
578
|
`
|
|
573
579
|
|
|
574
580
|
const ChevronCellAttrs = { isWrapperHovered: Boolean }
|
|
@@ -872,6 +878,10 @@
|
|
|
872
878
|
type: String,
|
|
873
879
|
default: '',
|
|
874
880
|
},
|
|
881
|
+
footerButtonDisabled: {
|
|
882
|
+
type: Boolean,
|
|
883
|
+
default: false,
|
|
884
|
+
},
|
|
875
885
|
},
|
|
876
886
|
emits: [
|
|
877
887
|
'item-click',
|