@eturnity/eturnity_reusable_components 6.37.0-EDPM-8208.0 → 6.37.0-EPDM-8148.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eturnity/eturnity_reusable_components",
-  "version": "6.37.0-EDPM-8208.0",
+  "version": "6.37.0-EPDM-8148.0",
   "private": false,
   "scripts": {
     "dev": "vue-cli-service serve",

package/src/App.vue

@@ -60,14 +60,7 @@
             fontColor="black"
             :disabled="false"
           />
-          <icon
-            name="opacity"
-            color="red"
-            hoveredColor="blue"
-            size="60px"
-            cursor="default"
-            isStriked = "true"
-          />
+
           <Select
             :value="value"
             selectWidth="100%"
@@ -111,7 +104,6 @@ import Option from '@/components/inputs/select/option'
 import iconCollection from '@/components/icon/iconCollection'
 import dropdownComponent from '@/components/dropdown'
 import videoThumbnail from '@/components/videoThumbnail'
-import icon from '@/components/icon'
 // import TableDropdown from "@/components/tableDropdown"
 
 const PageContainer = styled.div`
@@ -135,8 +127,7 @@ export default {
     SwitchField,
     iconCollection,
     dropdownComponent,
-    videoThumbnail,
-    icon
+    videoThumbnail
   },
   data() {
     return {

package/src/assets/svgIcons/integrations.svg

@@ -0,0 +1,3 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10 0H11H16C17.1046 0 18 0.895431 18 2V12H12C10.8954 12 10 11.1046 10 10V4L0 4V2C0 0.89543 0.895431 0 2 0H10ZM0 6H6C7.10457 6 8 6.89543 8 8V14H18V16C18 17.1046 17.1046 18 16 18H8H7H2C0.895431 18 0 17.1046 0 16V6Z" fill="white"/>
+</svg>

package/src/assets/svgIcons/opacity.svg

@@ -1 +1 @@
-<svg class="svg-icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M753.493333 341.12L512 100.053333l-241.493333 241.066667C203.946667 407.68 170.666667 496.426667 170.666667 581.76s33.28 175.36 99.84 241.92a340.906667 340.906667 0 0 0 482.986666 0C820.053333 757.12 853.333333 667.093333 853.333333 581.76s-33.28-174.08-99.84-240.64zM256 597.333333c0.426667-85.333333 26.453333-139.733333 75.093333-187.946666L512 224.64l180.906667 186.666667C741.546667 459.733333 767.573333 512 768 597.333333H256z"  /></svg>
+<svg class="svg-icon" style="width: 1em; height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M753.493333 341.12L512 100.053333l-241.493333 241.066667C203.946667 407.68 170.666667 496.426667 170.666667 581.76s33.28 175.36 99.84 241.92a340.906667 340.906667 0 0 0 482.986666 0C820.053333 757.12 853.333333 667.093333 853.333333 581.76s-33.28-174.08-99.84-240.64zM256 597.333333c0.426667-85.333333 26.453333-139.733333 75.093333-187.946666L512 224.64l180.906667 186.666667C741.546667 459.733333 767.573333 512 768 597.333333H256z"  /></svg>

package/src/components/icon/index.vue

@@ -9,7 +9,6 @@
         require(`!html-loader!./../../assets/svgIcons/${name.toLowerCase()}.svg`)
       "
     ></icon-image>
-    <striked-line v-if="isStriked" :color="color" :disabled="disabled" :hoveredColor="hoveredColor"></striked-line>
   </Wrapper>
 </template>
 
@@ -22,7 +21,6 @@
 //   hoveredColor="blue"
 //   size="60px" by default, this is 30px
 //   cursor="default"
-//   isStriked = "true"
 // />
 
 import styled from 'vue-styled-components'
@@ -30,7 +28,6 @@ import styled from 'vue-styled-components'
 const wrapperAttrs = { isDisabled: Boolean, size: String, cursor: String }
 const Wrapper = styled('div', wrapperAttrs)`
   display: flex;
-  position:relative
   align-content: center;
   justify-content: center;
   width: ${(props) => props.size};
@@ -40,22 +37,6 @@ const Wrapper = styled('div', wrapperAttrs)`
   cursor: ${(props) => (props.isDisabled ? 'not-allowed' : props.cursor)};
   line-height: 0;
 `
-const strikedAttrs = { isDisabled: Boolean, color: String, hoveredColor: String }
-const strikedLine = styled('div', strikedAttrs)`
-  display: flex;
-  position: absolute;
-  bottom:0;
-  left:0;
-  align-content: center;
-  justify-content: center;
-  width: 143%;
-  height:8%;
-  background-color: ${(props)=>props.theme.colors[props.color] || props.color};
-  min-height: 0;
-  line-height: 0;
-  transform-origin: 0% 100%;
-  transform: rotate(-45deg);
-`
 const IconImageProps = { color: String, hoveredColor: String, size: String }
 const IconImage = styled('div', IconImageProps)`
   svg {
@@ -69,17 +50,13 @@ const IconImage = styled('div', IconImageProps)`
   &:hover > svg path {
     ${(props) => props.hoveredColor && `fill: ${props.hoveredColor};`}
   }
-  &:hover + div {
-    background-color: ${(props)=>props.hoveredColor};
-  }
 `
 
 export default {
   name: 'icon',
   components: {
     IconImage,
-    Wrapper,
-    strikedLine
+    Wrapper
   },
   props: {
     disabled: {
@@ -102,10 +79,6 @@ export default {
     cursor: {
       required: false,
       default: null
-    },
-    isStriked: {
-      required: false,
-      default: false
     }
   },
   data() {

package/src/components/iconWrapper/index.vue

@@ -4,8 +4,6 @@
     :size="size" 
     :backgroundColor="backgroundColor" 
     :borderRadius="borderRadius"
-    :hasBorder="hasBorder"
-    :color="iconColor"
     :hoveredBackgroundColor="hoveredBackgroundColor"
     :isHovered="isHovered"
     >
@@ -13,10 +11,7 @@
             :size="iconSize" 
             :name="name" 
             :color="iconColor" 
-            :hoveredColor="hoveredIconColor" 
-            :isStriked="isStriked"
-            />
-            
+            :hoveredColor="hoveredIconColor" />
         <caret v-if="hasCaret">
           <iconWrapper :disabled="disabled" 
             size="10px" 
@@ -41,13 +36,12 @@
   
   import styled from 'vue-styled-components'
   import icon from '../icon'
-  const wrapperAttrs = { color: String, isHovered:Boolean,borderRadius:String,disabled: Boolean, size: String,backgroundColor:String,hoveredBackgroundColor:String,hasBorder:Boolean }
+  const wrapperAttrs = { isHovered:Boolean,borderRadius:String,disabled: Boolean, size: String,backgroundColor:String,hoveredBackgroundColor:String }
   const Wrapper = styled('div', wrapperAttrs)`
     position:relative;
     display: inline-flex;
     width: ${(props) => props.size};
     height: ${(props) => props.size};
-    border: ${(props) => props.hasBorder? 'solid 1px '+props.theme.colors[props.color] || props.color : ""};
     justify-content:center;
     align-items:center;
     cursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};
@@ -90,9 +84,6 @@
       backgroundColor: {
         required: false,
       },
-      hasBorder: {
-        required: false,
-      },
       hoveredBackgroundColor: {
         required: false,
         default:"transparentWhite1"
@@ -111,15 +102,11 @@
       },
       borderRadius:{
         required:false,
-        default:'4px'
+        default:'6px'
       },
       isHovered:{
         required:false,
         default:false
-      },
-      isStriked:{
-        required:false,
-        default:false
       }
     },
     data() {