@eturnity/eturnity_reusable_components 6.28.0-EPDM-7478.4 → 6.28.0-EPDM-7066.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eturnity/eturnity_reusable_components",
-  "version": "6.28.0-EPDM-7478.4",
+  "version": "6.28.0-EPDM-7066.0",
   "private": false,
   "scripts": {
     "dev": "vue-cli-service serve",
@@ -59,4 +59,4 @@
   "author": "Aaron Enser",
   "license": "ISC",
   "homepage": "https://bitbucket.org/eturnitydevs/eturnity_reusable_components#readme"
-}
+}

package/src/assets/svgIcons/upload_image_tool.svg

@@ -1,4 +1,4 @@
-<svg fill="none" height="20" viewbox="12 12 16 16" width="16" xmlns="http://www.w3.org/2000/svg">
+<svg fill="none" height="16" viewbox="12 12 16 16" width="16" xmlns="http://www.w3.org/2000/svg">
 <path d="M13 13H27V14.5556H13V13Z" fill="#B2B9C5"></path>
 <path d="M13 21.5556H27V23.1111H13V21.5556Z" fill="#B2B9C5"></path>
 <path d="M13 13H14.5556V22.3333H13V13Z" fill="#B2B9C5"></path>

package/src/components/icon/index.vue

@@ -27,9 +27,7 @@ import styled from 'vue-styled-components'
 
 const wrapperAttrs = { isDisabled: Boolean, size: String, cursor: String }
 const Wrapper = styled('div', wrapperAttrs)`
-  display: flex;
-  align-content: center;
-  justify-content: center;
+  display: inline-block;
   width: ${(props) => props.size};
   height: ${(props) => props.size};
   min-width: ${(props) => props.size};

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

@@ -100,6 +100,7 @@
             :selectedValue="selectedValue"
             @option-selected="optionSelected"
             @option-hovered="optionHovered"
+            @mouseleave="optionLeave"
           >
             <slot name="dropdown"></slot>
           </selectDropdown>
@@ -314,6 +315,10 @@ export default {
       required: false,
       default: false
     },
+    dropdownAutoClose: {
+      required: false,
+      default: true
+    },
     alignItems: {
       required: false,
       default: 'horizontal'
@@ -443,6 +448,11 @@ export default {
         this.blur()
       }
     },
+    optionLeave() {
+      if(this.dropdownAutoClose) {
+        this.isDropdownOpen = false
+      }
+    },
     searchChange(value) {
       this.textSearch = value
       this.$emit('search-change', value)

package/src/components/pagination/index.vue

@@ -1,137 +0,0 @@
-<template>
-    <!-- Check, if pages more than 1 -->
-    <paginationWrapper v-if="paginationParams.pages > 1">
-        <!-- Back button -->
-        <paginationLink
-          v-if="paginationParams.previous"
-          @click="fetchPage(paginationParams.previous)"
-        >
-        <arrowIconContainer>
-            <icon name="arrow_left" color="#1a237e" size="12px"/>
-        </arrowIconContainer>
-          <arrowText>{{ $gettext('back') }}</arrowText>
-        </paginationLink>
-  
-        <!-- First page -->
-        <paginationLink
-          v-if="currentPage > 2 && paginationParams.pages > 3"
-          @click="fetchPage(1)"
-          >1</paginationLink
-        >
-  
-        <!-- Back tree dots -->
-        <span v-if="currentPage > 3 && paginationParams.pages > 4">...</span>
-  
-        <!-- Current block -->
-        <paginationLink
-          v-for="number in paginationNumbers()"
-          :key="number"
-          :class="[currentPage === number ? 'active' : '']"
-          @click="fetchPage(number)"
-          >{{ number }}</paginationLink
-        >
-  
-        <!-- Forward tree dots -->
-        <span
-          v-if="
-            paginationParams.pages - currentPage > 2 && paginationParams.pages > 4
-          "
-          >...</span
-        >
-  
-        <!-- End page -->
-        <paginationLink
-          v-if="
-            paginationParams.pages - currentPage > 1 && paginationParams.pages > 3
-          "
-          @click="fetchPage(paginationParams.pages)"
-          >{{ paginationParams.pages }}</paginationLink
-        >
-  
-        <!-- Forward button -->
-        <paginationLink
-          v-if="paginationParams.next"
-          @click="fetchPage(paginationParams.next)"
-        >
-          <arrowText>{{ $gettext('forward') }}</arrowText>
-          <arrowIconContainer>
-            <icon name="arrow_right" color="#1a237e" size="12px" />
-        </arrowIconContainer>
-        </paginationLink>
-    </paginationWrapper>
-  </template>
-  
-  <script>
-import styled from "vue-styled-components"
-  import icon from "../icon"
-  const paginationWrapper=styled.nav`
-    color: #1a237e;
-    font-size: 13px;
-    display: -webkit-box;
-    display: -ms-flexbox;
-    display: flex;
-    -ms-flex-wrap: wrap;
-    flex-wrap: wrap;
-    -webkit-box-pack: end;
-    -ms-flex-pack: end;
-    justify-content: flex-end;
-    -webkit-box-align: center;
-    -ms-flex-align: center;
-    align-items: center;
-    margin-bottom: 2px;
-    margin-top: 10px;
-`
- const paginationLink=styled.div`
-    display: flex;
-    padding: 0px 5px;
-    margin: 0 2px;
-    text-align: center;
-    border-radius: 3px;
-    white-space: nowrap;
-    cursor: pointer;
-
-    &.active{
-        color: #fff;
-        background-color: #5c67ac;
-        padding: 7px 12px;
-        border-radius: 4px;
-    }
-    `
-    const arrowText=styled.div``
-    const arrowIconContainer=styled.div`
-    margin:0 10px;
-    display:flex;
-    align-items: center;
-    `
-  export default {
-    name: 'pagination-component',
-    components:{
-        paginationWrapper,
-        paginationLink,
-        icon,
-        arrowText,
-        arrowIconContainer
-    },
-    props: ["fetchPage","currentPage","paginationParams"],
-    methods: {
-      getNewProjects(num) {
-        this.$emit('on-pagination-change', num)
-      },
-      paginationNumbers() {
-        const prev = this.paginationParams.previous
-        const next = this.paginationParams.next
-        const n = prev + 1 || next - 1
-        if (this.paginationParams.pages === 2) {
-          return prev ? [n - 1, n] : [n, n + 1]
-        } else {
-          return prev
-            ? next
-              ? [n - 1, n, n + 1]
-              : [n - 2, n - 1, n]
-            : [n, n + 1, n + 2]
-        }
-      }
-    }
-  }
-  </script>
-