@eturnity/eturnity_reusable_components 7.39.4-EPDM-11314.0 → 7.39.4-EPDM-11313.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eturnity/eturnity_reusable_components",
-  "version": "7.39.4-EPDM-11314.0",
+  "version": "7.39.4-EPDM-11313.0",
   "files": [
     "dist",
     "src"

package/src/components/buttons/mainButton/index.vue

@@ -11,7 +11,7 @@
       :type="type"
     >
       <LabelComponent :has-icon="Boolean(icon)">
-        <Icon v-if="icon" :name="icon" size="14px" />
+        <Icon v-if="icon" :name="icon" :color="iconColor" size="14px" />
         {{ text }}
       </LabelComponent>
     </ButtonContainer>
@@ -112,6 +112,11 @@
         default: null,
         type: String,
       },
+      iconColor: {
+        required: false,
+        default: '',
+        type: String,
+      },
       text: {
         required: true,
         type: String,

package/src/components/infoCard/index.vue

@@ -1,18 +1,6 @@
 <template>
-  <InfoContainer
-    :min-width="minWidth"
-    :color="color"
-    :align-items="alignItems"
-    :padding="padding"
-    :border-color="borderColor"
-    :border-style="borderStyle"
-    :preset-styles="presetStyles"
-  >
-    <RCIcon
-      name="info"
-      size="24px"
-      :color="color ? color : presetStyles.iconColor"
-    />
+  <InfoContainer>
+    <RCIcon name="info" size="24px" :color="color" />
     <TextContainer>
       <slot></slot>
     </TextContainer>
@@ -21,37 +9,14 @@
 
 <script>
   import styled from 'vue3-styled-components'
-  import theme from '../../assets/theme.js'
   import RCIcon from '../icon'
 
-  const infoContainerAttrs = {
-    minWidth: String,
-    color: String,
-    alignItems: String,
-    padding: String,
-    borderColor: String,
-    borderStyle: String,
-    presetStyles: Object,
-  }
-  const InfoContainer = styled('div', infoContainerAttrs)`
+  const InfoContainer = styled.div`
     display: flex;
-    align-items: ${(props) =>
-      props.alignItems ? props.alignItems : props.presetStyles.alignItems};
     gap: 15px;
-    min-width: ${(props) => props.minWidth};
-    padding: ${(props) =>
-      props.padding ? props.padding : props.presetStyles.padding};
-    color: ${(props) => (props.color ? props.color : props.presetStyles.color)};
+    padding: 20px;
+    border: 1px dashed ${(props) => props.theme.colors.grey4};
     border-radius: 4px;
-    background-color: ${(props) =>
-      props.backgroundColor
-        ? props.backgroundColor
-        : props.presetStyles.backgroundColor};
-    border-width: ${(props) => props.presetStyles.borderWidth};
-    border-style: ${(props) =>
-      props.borderStyle ? props.borderStyle : props.presetStyles.borderStyle};
-    border-color: ${(props) =>
-      props.borderColor ? props.borderColor : props.presetStyles.borderColor};
   `
 
   const TextContainer = styled.div`
@@ -67,60 +32,9 @@
       TextContainer,
     },
     props: {
-      type: {
-        required: false,
-        type: String,
-        default: 'info',
-      },
-      minWidth: {
-        required: false,
-        type: String,
-      },
       color: {
-        required: false,
-      },
-      alignItems: {
-        required: false,
-        type: String,
-      },
-      padding: {
-        required: false,
-        type: String,
-      },
-      borderColor: {
-        required: false,
-        type: String,
-      },
-      borderStyle: {
-        required: false,
-        type: String,
-      },
-    },
-    computed: {
-      isInfo() {
-        return this.type === 'info'
-      },
-      isWarning() {
-        return this.type === 'warning'
-      },
-      presetStyles() {
-        let stylesCollection = {}
-
-        if (this.isWarning) {
-          stylesCollection.alignItems = 'center'
-          stylesCollection.padding = '6px 10px'
-          stylesCollection.color = theme.colors.white
-          stylesCollection.backgroundColor = theme.colors.yellow
-          stylesCollection.iconColor = theme.colors.white
-        } else {
-          stylesCollection.padding = '20px'
-          stylesCollection.borderWidth = '1px'
-          stylesCollection.borderStyle = 'dashed'
-          stylesCollection.borderColor = theme.colors.grey4
-        }
-
-        return stylesCollection
-      },
-    },
+        required: false
+      }
+    }
   }
 </script>

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

@@ -86,7 +86,6 @@
           />
           <Selector
             v-else
-            :disabled="disabled"
             :padding-left="paddingLeft"
             :select-width="selectWidth"
             :show-border="showBorder"
@@ -97,9 +96,7 @@
             <Icon
               v-if="isDropdownOpen"
               :color="
-                caretColor || disabled
-                  ? 'grey2'
-                  : colorMode == 'dark'
+                caretColor || colorMode == 'dark'
                   ? 'white'
                   : 'transparentBlack1'
               "
@@ -109,9 +106,7 @@
             <Icon
               v-else
               :color="
-                caretColor || disabled
-                  ? 'grey2'
-                  : colorMode == 'dark'
+                caretColor || colorMode == 'dark'
                   ? 'white'
                   : 'transparentBlack1'
               "
@@ -204,13 +199,11 @@
   `
 
   const selectorProps = {
-    disabled: String,
     selectWidth: String,
     paddingLeft: String,
     showBorder: Boolean,
   }
   const Selector = styled('div', selectorProps)`
-    color: ${(props) => (props.disabled ? props.theme.colors.grey2 : '')};
     ${(props) =>
       props.selectWidth === '100%'
         ? 'width: 100%;'