@eturnity/eturnity_reusable_components 7.22.2 → 7.22.4-qa-09.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eturnity/eturnity_reusable_components",
-  "version": "7.22.2",
+  "version": "7.22.4-qa-09.0",
   "private": false,
   "scripts": {
     "dev": "vue-cli-service serve",
@@ -23,6 +23,7 @@
   },
   "devDependencies": {
     "@babel/core": "7.12.16",
+    "@babel/eslint-parser": "7.12.16",
     "@vue/cli-plugin-babel": "5.0.8",
     "@vue/cli-plugin-eslint": "5.0.8",
     "@vue/cli-service": "5.0.8",

package/src/assets/svgIcons/anchor.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg height="800px" width="800px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+	 viewBox="0 0 204.851 204.851" xml:space="preserve">
+<g>
+	<g>
+		<g>
+			<path fill="white" d="M139.518,128.595l16.834,16.336c0,0-20.644,29.877-42.725,30.473
+				c0.479,0,0.117-84.092,0.039-104.472c14.694-4.797,25.402-18.182,25.402-34.117c0-20.009-16.697-36.218-37.273-36.218
+				c-20.615,0-37.312,16.209-37.312,36.208c0,15.671,10.376,28.929,24.748,33.961l0.098,104.277
+				c-26.643-1.837-42.061-27.474-42.061-27.474l17.997-17.41L0,120.505l9.887,63.301l17.362-16.795
+				c15.036,12.105,32.017,37.244,72.876,37.244c51.332-1.309,63.184-28.939,76.344-39.804l18.993,18.514l9.389-63.907
+				L139.518,128.595z M82.558,36.208c0-10.298,8.608-18.661,19.218-18.661s19.257,8.363,19.257,18.661
+				c0,10.327-8.647,18.681-19.257,18.681S82.558,46.535,82.558,36.208z"/>
+		</g>
+	</g>
+</g>
+</svg>

package/src/assets/svgIcons/flatten_roof.svg

@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="16"
+   height="8"
+   viewBox="0 0 16 8"
+   version="1.1"
+   id="svg5"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <g
+     transform="translate(-55.350933,-93.588073)">
+    <path
+       fill="#000000"
+       d="m 61.719348,100.39494 1.004406,0.0185 -0.0013,-2.679323 0.88345,-4.27e-4 c -0.0051,-0.01381 -0.01401,2.69128 -0.01401,2.69128 l 1.05348,-0.0159 -1.582401,1.44453 z m -6.368415,-0.817395 7.856738,-5.989472 7.616581,6.321372 -1.240034,1.266145 -6.409573,-5.185912 -6.581971,5.125212 z"
+       id="path874"
+       />
+  </g>
+</svg>

package/src/assets/svgIcons/split.svg

@@ -1,94 +1,12 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-
 <svg
-   version="1.1"
-   id="svg438"
    width="838"
    height="833"
    viewBox="0 0 838 833"
-   sodipodi:docname="split.svg"
-   inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <defs
-     id="defs442">
-    <linearGradient
-       id="linearGradient7383"
-       inkscape:swatch="solid">
-      <stop
-         style="stop-color:#ffffff;stop-opacity:1;"
-         offset="0"
-         id="stop7381" />
-    </linearGradient>
-    <linearGradient
-       id="linearGradient6933"
-       inkscape:swatch="solid">
-      <stop
-         style="stop-color:#000000;stop-opacity:1;"
-         offset="0"
-         id="stop6931" />
-    </linearGradient>
-  </defs>
-  <sodipodi:namedview
-     id="namedview440"
-     pagecolor="#ffffff"
-     bordercolor="#666666"
-     borderopacity="1.0"
-     inkscape:pageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     showgrid="false"
-     inkscape:zoom="0.95078031"
-     inkscape:cx="466.45896"
-     inkscape:cy="549.02273"
-     inkscape:window-width="1920"
-     inkscape:window-height="1007"
-     inkscape:window-x="0"
-     inkscape:window-y="0"
-     inkscape:window-maximized="1"
-     inkscape:current-layer="g444" />
-  <g
-     inkscape:groupmode="layer"
-     inkscape:label="Image"
-     id="g444">
-    <circle
-       id="path5141"
-       style="fill:none;stroke:#fffeff;stroke-opacity:1"
-       cx="0.66903824"
-       cy="263.65976"
-       r="0.52949077" />
-    <circle
-       id="path5143"
-       style="fill:none;stroke:#fffeff;stroke-opacity:1"
-       cx="0.66903824"
-       cy="263.65976"
-       r="0.52949077" />
-    <g
-       id="path5184"
-       style="stroke:#fffeff;stroke-opacity:1;fill:none">
-      <path
-         style="color:#000000;fill:none;stroke-width:154.42;-inkscape-stroke:none;stroke:#fffeff;stroke-opacity:1"
-         d="m -156.35359,113.32885 348.76355,221.92361 744.6236,-498.85799"
-         id="path6861" />
-      <path
-         style="color:#000000;fill:none;-inkscape-stroke:none;stroke:#fffeff;stroke-opacity:1"
-         d="M 894.06055,-227.75 191.32227,243.04492 -114.9043,48.1875 -197.80273,178.46875 193.49609,427.45898 980.00781,-99.460937 Z"
-         id="path6863" />
-    </g>
-    <g
-       id="path5186"
-       style="stroke:#fffeff;stroke-opacity:1;fill:none">
-      <path
-         style="color:#000000;fill:none;stroke-width:166.34;-inkscape-stroke:none;stroke:#fffeff;stroke-opacity:1"
-         d="M 816.06617,905.68984 357.97591,628.01443 1035.7943,176.14788"
-         id="path6855" />
-      <path
-         style="color:#000000;fill:none;-inkscape-stroke:none;stroke:#fffeff;stroke-opacity:1"
-         d="M 989.66016,106.94531 203.03125,631.34961 772.95312,976.81445 859.17773,834.56641 512.91992,624.67773 1081.9277,245.34961 Z"
-         id="path6857" />
-    </g>
-  </g>
+   >
+
+    <path
+       fill="#B2B9C5"
+       d="m -5.0875843,441.73292 3.3936693,-93.74987 847.237645,-2.85667 -3.71049,95.94711 z m 333.6519143,232.4369 -98.27777,-105.35245 43.34233,-0.60608 c 23.83828,-0.33335 56.95483,-0.67085 73.59233,-0.75 l 30.25,-0.14392 L 376,413.05958 374.48738,213.61969 301.67731,213.3632 228.86724,213.10671 326.58798,107.77384 C 380.33439,49.84076 424.5019,2.3657611 424.73801,2.2738411 425.25724,2.0716911 628.96623,212.59506 628.96623,213.35636 c 0,0.29424 -41.55385,0.25035 -81.97885,0.25035 h -73.5 L 475,413.0466 l 1.47122,154.25779 72.81196,0.25649 72.81196,0.25649 -91.89971,99.5 -103.35334,112.2049 z"
+      />
 </svg>

package/src/components/icon/index.vue

@@ -1,9 +1,13 @@
 <template>
-  <wrapper>
-    <icon-image>
+  <wrapper :disabled="disabled" :size="size" :cursor="cursor">
+    <icon-image
+      :color="color"
+      :background-color="backgroundColor"
+      :hovered-color="hoveredColor"
+    >
       <i v-html="icon.html" />
     </icon-image>
-    <striked-line v-if="isStriked"></striked-line>
+    <striked-line v-if="isStriked" :color="color"></striked-line>
   </wrapper>
 </template>
 
@@ -48,27 +52,31 @@ const props = defineProps({
   isStriked: {
     required: false,
     default: false
+  },
+  backgroundColor: {
+    required: false,
+    default: null
   }
 })
 
-const Wrapper = styled('div')`
+const Wrapper = styled('div', {
+  size: String,
+  disabled: Boolean,
+  cursor: String
+})`
   display: flex;
   position: relative;
   align-content: center;
   justify-content: center;
-  width: ${props.size};
-  height: ${props.size};
-  min-width: ${props.size};
-  min-height: ${props.size};
-  cursor: ${props.disabled ? 'not-allowed' : props.cursor};
+  width: ${(props) => props.size};
+  height: ${(props) => props.size};
+  min-width: ${(props) => props.size};
+  min-height: ${(props) => props.size};
+  cursor: ${(props) => (props.disabled ? 'not-allowed' : props.cursor)};
   line-height: 0;
 `
-const strikedAttrs = {
-  isDisabled: Boolean,
-  color: String,
-  hoveredColor: String
-}
-const StrikedLine = styled.div`
+
+const StrikedLine = styled('div', { color: String })`
   display: flex;
   position: absolute;
   bottom: 0;
@@ -77,29 +85,33 @@ const StrikedLine = styled.div`
   justify-content: center;
   width: 143%;
   height: 8%;
-  background-color: ${({ theme }) => theme.colors[props.color] || props.color};
+  background-color: ${({ theme, color }) => theme.colors[color] || color};
   min-height: 0;
   line-height: 0;
   transform-origin: 0% 100%;
   transform: rotate(-45deg);
 `
-const IconImage = styled.div`
+const IconImage = styled('div', {
+  color: String,
+  backgroundColor: String,
+  hoveredColor: String
+})`
   width: 100%;
   svg {
     width: 100%;
     height: 100%;
-    background-color: ${(props) => props.backgroundColor};
-    padding: ${(props) => props.backgroundColor ? '3px' : '0'};
+    background-color: ${(props) =>
+      props.backgroundColor ? props.backgroundColor : 'transparent'};
+    padding: ${(props) => (props.backgroundColor ? '3px' : '0')};
   }
   svg path {
-    ${({ theme }) =>
-      props.color && `fill: ${theme.colors[props.color] || props.color};`}
+    ${({ theme, color }) => color && `fill: ${theme.colors[color] || color};`}
   }
   &:hover > svg path {
     ${props.hoveredColor && `fill: ${props.hoveredColor};`}
   }
   &:hover + div {
-    background-color: ${props.hoveredColor};
+    background-color: ${(props) => props.hoveredColor};
   }
 `
 

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

@@ -3,7 +3,11 @@
     <container
       :checkColor="checkColor"
       :size="size"
+<<<<<<< HEAD
+      :hasLabel="hasLabel"
+=======
       :hasLabel="label && !!label.length"
+>>>>>>> master
       :backgroundColor="backgroundColor"
       :isChecked="isChecked"
       :isDisabled="isDisabled"
@@ -18,7 +22,11 @@
       <check-wrapper :hasLabel="hasLabel">
         <span class="checkmark"></span>
       </check-wrapper>
+<<<<<<< HEAD
+      <label-text v-if="hasLabel">{{ label }}</label-text>
+=======
       <label-text v-if="label && !!label.length">{{ label }}</label-text>
+>>>>>>> master
     </container>
   </component-wrapper>
 </template>
@@ -197,6 +205,11 @@ export default {
       return !!this.label.length
     }
   },
+  computed: {
+    hasLabel() {
+      return !!this.label.length
+    }
+  },
   methods: {
     onChangeHandler(value) {
       if (this.isDisabled) {

package/src/components/tableDropdown/index.vue

@@ -40,12 +40,16 @@
             "
             @click.stop="onSelectedTemplateClick(item.row)"
           >
+<<<<<<< HEAD
+            <img :src="fileIcon" alt="icon" width="12" height="16" />
+=======
             <!-- <img :src="fileIcon" alt="icon" width="12" height="16" /> -->
             <icon
               name="template_icon_not_clickable"
               :color="theme.colors.brightBlue"
               size="14px"
             />
+>>>>>>> master
             <div>{{ item.value }}</div>
           </template-link>
           <no-template v-if="item.type && item.type === 'no-template'">
@@ -183,8 +187,11 @@ import InputText from '../inputs/inputText'
 import CollapseArrowIcon from '../../assets/icons/collapse_arrow_icon.svg'
 import SubpositionMarkerIcon from '../../assets/icons/subposition_marker.svg'
 import fileIconPng from '../../assets/icons/file_icon.png'
+<<<<<<< HEAD
+=======
 import Icon from '../icon'
 import theme from '@/assets/theme.js'
+>>>>>>> master
 
 const rowAttrs = { disabled: Boolean, isOpen: Boolean }
 const DropdownRow = styled('div', rowAttrs)`