@eturnity/eturnity_reusable_components 9.31.2 → 9.31.4-EPDM-20023.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eturnity/eturnity_reusable_components",
-  "version": "9.31.2",
+  "version": "9.31.4-EPDM-20023.4",
   "files": [
     "dist",
     "src"

package/src/assets/svgIcons/renusol.svg

@@ -0,0 +1,7 @@
+<svg width="10" height="16" viewBox="0 0 10 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g transform="translate(-3.96923,16.95769) scale(0.003846,-0.003846)" fill="#263238" stroke="none">
+        <path d="M1805 4190 c-198 -120 -373 -228 -390 -238 -16 -11 -73 -45 -125 -77 -52 -32 -100 -62 -106 -67 -8 -6 7 -26 49 -66 33 -31 80 -75 103 -97 46 -44 265 -251 330 -312 240 -225 348 -327 399 -375 33 -31 83 -79 111 -105 28 -26 111 -104 184 -173 166 -156 213 -200 221 -200 3 0 25 13 50 29 24 15 210 131 413 256 203 125 394 243 425 262 31 20 67 42 80 50 l24 15 -54 50 c-30 28 -119 112 -199 187 -157 149 -252 238 -315 296 -22 20 -76 72 -120 114 -44 42 -145 137 -224 211 -79 74 -189 178 -245 231 -204 193 -238 224 -244 226 -4 2 -169 -96 -367 -217z"/>
+        <path d="M3435 2916 c-99 -63 -315 -197 -480 -299 l-300 -185 0 -1091 c0 -600 1 -1091 2 -1091 3 0 453 274 659 401 82 50 163 99 179 109 17 9 54 32 83 49 l52 33 0 1094 c0 602 -3 1094 -7 1093 -5 0 -89 -51 -188 -113z"/>
+        <path d="M1690 899 c-179 -110 -400 -246 -492 -302 -92 -55 -166 -102 -165 -103 3 -4 174 -32 232 -39 28 -4 59 -9 70 -12 11 -3 31 -7 45 -8 25 -3 89 -12 125 -19 11 -2 52 -9 90 -15 39 -6 86 -13 105 -16 68 -11 155 -24 195 -30 22 -3 51 -8 65 -10 14 -3 39 -7 55 -9 17 -3 44 -7 60 -10 17 -3 48 -7 70 -11 23 -3 50 -7 60 -9 11 -2 56 -9 100 -16 44 -7 87 -14 97 -15 9 -2 38 -6 65 -10 26 -4 56 -9 65 -11 15 -5 16 24 15 378 l-2 382 -35 7 c-19 4 -55 10 -80 13 -43 5 -64 9 -140 22 -19 4 -44 8 -55 9 -22 3 -163 24 -198 30 -15 3 -127 -61 -347 -196z"/>
+    </g>
+</svg>

package/src/components/inputs/select/index.vue

@@ -1055,10 +1055,16 @@
           this.handleSetDropdownOffet()
           this.refreshOptionLength()
           if (!this.isFixedDropdownPosition) this.calculateSelectTopPosition()
+          // Teleported menus live in <body>, so they aren't clipped by a
+          // scrollable ancestor (e.g. the filter modal). Close on outside
+          // scroll to avoid the menu floating free of its trigger.
+          if (this.shouldUseTeleport)
+            document.addEventListener('scroll', this.handleScrollClose, true)
           // Deferred dropdown slot content mounts after initial open in some hosts.
           this.$nextTick(() => this.refreshOptionLength())
         } else {
           this.$emit('on-dropdown-close')
+          document.removeEventListener('scroll', this.handleScrollClose, true)
           this.dropdownPosition.left = null
           this.optionLengthCount = 0
           if (this.animationFrameId) {
@@ -1139,6 +1145,7 @@
         this.clickOutside,
         CLICK_OUTSIDE_CAPTURE
       )
+      document.removeEventListener('scroll', this.handleScrollClose, true)
     },
     methods: {
       getDropdownTopScrollYOffset() {
@@ -1162,6 +1169,14 @@
         this.clearSearch()
         this.isDropdownOpen = false
       },
+      handleScrollClose(e) {
+        // Ignore scrolling within the menu itself (e.g. a long option list);
+        // only close when a surrounding container scrolls. The menu is
+        // teleported to <body>, so check the teleported dropdown element.
+        const menuEl = this.$refs.dropdown?.$el
+        if (menuEl && (menuEl === e.target || menuEl.contains(e.target))) return
+        this.closeDropdown()
+      },
       clearSearch() {
         this.textSearch = ''
         this.searchChange('')

package/src/components/navigationSideMenu/index.vue

@@ -292,6 +292,7 @@
           v-if="!isCollapsed"
           data-id="footer_documents_button"
           data-qa-id="footer_documents_button"
+          :is-disabled="footerButtonDisabled"
           :text="footerButtonText"
           @click="onFooterButtonClick()"
         />
@@ -299,6 +300,7 @@
           v-else
           data-id="footer_documents_button"
           data-qa-id="footer_documents_button"
+          :is-disabled="footerButtonDisabled"
           @click="onFooterButtonClick()"
         >
           <IconComponent color="white" name="documents" size="16px" />
@@ -560,15 +562,19 @@
     font-weight: 400;
   `
 
-  const FooterButtonWrapper = styled.div`
+  const FooterButtonWrapperAttrs = { isDisabled: Boolean }
+  const FooterButtonWrapper = styled('div', FooterButtonWrapperAttrs)`
     display: flex;
     align-items: center;
     justify-content: center;
     width: 30px;
     height: 30px;
     border-radius: 4px;
-    cursor: pointer;
-    background-color: ${(p) => p.theme.semanticColors.purple[500]};
+    cursor: ${(p) => (p.isDisabled ? 'not-allowed' : 'pointer')};
+    background-color: ${(p) =>
+      p.isDisabled
+        ? p.theme.colors.disabled
+        : p.theme.semanticColors.purple[500]};
   `
 
   const ChevronCellAttrs = { isWrapperHovered: Boolean }
@@ -872,6 +878,10 @@
         type: String,
         default: '',
       },
+      footerButtonDisabled: {
+        type: Boolean,
+        default: false,
+      },
     },
     emits: [
       'item-click',