goodteditor-ui 1.0.27 → 1.0.29

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "goodteditor-ui",
-    "version": "1.0.27",
+    "version": "1.0.29",
     "main": "index.js",
     "homepage": "https://goodt-ui.netlify.app/",
     "scripts": {

package/src/components/ui/Grid.vue

@@ -71,7 +71,7 @@ export default {
     },
     methods: {
         getSlotStyle(name) {
-            return { 'grid-area': name };
+            return { 'grid-area': name, 'min-height': 0 };
         },
     },
     render(h) {

package/src/components/ui/InputAutocomplete.vue

@@ -80,6 +80,17 @@
                 </template>
             </ui-datalist>
         </ui-popover>
+        <!-- 
+        @slot Custom clear btn slot
+        @binding {Function} clear   function that clears the value
+        -->
+        <slot
+            name="clear-btn"
+            v-if="useClearBtn && value.length > 0"
+            v-bind="{ clear: clearValue }"
+        >
+            <i class="mdi mdi-close cursor-pointer" @click="clearValue"></i>
+        </slot>
     </div>
 </template>
 <style lang="less" scoped>
@@ -165,6 +176,13 @@ export default {
             type: Boolean,
             default: true,
         },
+        /**
+         * Clear data btn
+         */
+        useClearBtn: {
+            type: Boolean,
+            default: false,
+        },
     },
     data() {
         return {
@@ -205,6 +223,13 @@ export default {
         },
     },
     methods: {
+        clearValue() {
+            this.$emit('input', '');
+            this.caretIndex = 0;
+            this.delimitedValuePrev = null;
+            this.filterTID = null;
+            this.suggestedOptions = [];
+        },
         defaultFilter(val, options) {
             return new Promise(resolve => {
                 let arr = options.filter(opt => opt.toLowerCase().indexOf(val.toLowerCase()) === 0);