toggle-components-library 1.38.0 → 1.38.1-beta.1

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "toggle-components-library",
-    "version": "1.38.0",
+    "version": "1.38.1-beta.1",
     "private": false,
     "scripts": {
         "serve": "vue-cli-service serve",

package/src/components/forms/ToggleInputSelect.vue

@@ -1,8 +1,8 @@
 <template>
 
-<div class="toggle-input-container" :class="{'toggle-input-is-invalid':isInvalid, 'toggle-input-is-disabled':disabled}"  v-on:click="focusClosestInput">
+<div :class="{'toggle-input-container' : size != 'streamline', 'toggle-input-is-invalid':isInvalid, 'toggle-input-is-disabled':disabled}"  v-on:click="focusClosestInput">
     <label 
-        v-if="label"
+        v-if="label && size != 'streamline'"
         :for="name ? name : 'ToggleInputSelect' " 
         class="toggle-input-label"
     > {{ label }} 
@@ -18,7 +18,7 @@
             :disabled="disabled"
             :style="`${fontFamily ? 'font-family: ' + fontFamily : ''}`"
             >
-                <option value="">Select an option</option>
+                <option value="">{{size == 'streamline' ? label : 'Select an option' }}</option>
                 <option :value="option.value" v-for="(option, key) in options" v-bind:key="key">{{option.label}}</option>
         </select>
     </div>
@@ -60,7 +60,7 @@ export default {
         size: {
             type: String,
             validator: function (value) {
-                return ['extra-small', 'small', 'medium', 'large', 'full'].indexOf(value) !== -1
+                return ['extra-small', 'small', 'medium', 'large', 'full', 'streamline'].indexOf(value) !== -1
             }
         },
         required: {

package/src/components/tables/ToggleTableRow.vue

@@ -1,5 +1,5 @@
 <template>
-    <tr :class="['toggle-tablee-tr',{'tr-disabled':disabled }]" @click="handleClick" >
+    <tr :class="['toggle-tablee-tr',{'tr-disabled': disabled,'tr-no-hover': noHover}]" @click="handleClick" >
         <slot></slot>
     </tr>
 </template>
@@ -10,7 +10,11 @@ export default {
     disabled: {
       type: Boolean,
       default: false
-    }
+    },
+    noHover: {
+            type: Boolean,
+            default: false
+        }
   },
   methods: {
     handleClick() {

package/src/sass/includes/_as_table.scss

@@ -79,27 +79,24 @@ table.toggle-table {
 
   tbody {
     tr.toggle-tablee-tr:nth-child(odd) {
-      background-color: #FAFBFB;
+        background-color: #FAFBFB;
 
-      &:hover {
-        background-color: #FFF;
-      }
+        &:not(.tr-no-hover):hover {
+            background-color: #FFF;
+        }
     }
 
     tr.toggle-tablee-tr:nth-child(even) {
-      &:hover {
-        background-color: #E7EEF0;
-      }
+        &:not(.tr-no-hover):hover {
+            background-color: #E7EEF0;
+        }
     }
 
     td.toggle-tablee-td {
         @include toggle-global-font-config;
- 
         font-size: $toggle-font-size-small;
         padding: 1rem 0;
         padding-left:1rem;
-
-        cursor: pointer;
         vertical-align: middle;
         text-overflow: ellipsis;
         overflow: hidden;
@@ -114,12 +111,16 @@ table.toggle-table {
     }
 
     tr.toggle-tablee-tr {
-        &:hover {
+        cursor: pointer;
+        &:not(.tr-no-hover):hover {
             background-color: #FFF;
             .arrow-order {
-                display: block;
+            display: block;
             }
         }
+        &.tr-no-hover:hover, &.tr-no-hover:hover * {
+            cursor: default !important;
+        }
         td.toggle-tablee-td:first-child {
             border-top-left-radius: 10px;
             border-bottom-left-radius: 10px;