Merge pull request #147 from libvue/improve/misc

Improve/misc

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@libvue/core",
-    "version": "1.1.2",
+    "version": "1.1.3",
     "private": false,
     "scripts": {
         "dev": "vite",

src/docs/layouts/DefaultLayout.vue

@@ -7,7 +7,7 @@
     >
         <main-navigation></main-navigation>
     </lv-drawer>
-    <lv-layout :sticky-header="breakpoints.greaterOrEqual.md" :sticky-sub-header="!breakpoints.greaterOrEqual.md" sidebar-width="200px">
+    <lv-layout :sticky-header="breakpoints.greaterOrEqual.md" :sticky-sub-header="!breakpoints.greaterOrEqual.md" sidebar-width="250px">
         <template #header>
             <lv-header>
                 <template #branding>

src/docs/main.js

@@ -1,4 +1,5 @@
 // Highlightjs
+/* eslint-disable import/no-extraneous-dependencies */
 import 'highlight.js/styles/stackoverflow-light.css';
 import hljs from 'highlight.js/lib/core';
 import javascript from 'highlight.js/lib/languages/javascript';
@@ -30,9 +31,6 @@ hljs.registerLanguage('scss', scss);
 hljs.registerLanguage('html', xml);
 hljs.registerLanguage('shell', shell);
 
-// opt-in to the new behavior now
-app.config.unwrapInjectedRef = true;
-
 // Register custom components
 app.component('ComponentDetails', ComponentDetails);
 app.component('CodePreview', CodePreview);

src/lib/components/LvDialog/LvDialog.vue

@@ -174,6 +174,7 @@ export default {
     #{$self}__content {
         flex-shrink: 1;
         overflow-y: v-bind(overflowY);
+        overflow-x: hidden;
     }
     #{$self}__footer {
         padding-top: 1rem;

src/lib/components/LvFileInput/LvFileInput.vue

@@ -188,6 +188,7 @@ export default {
     &__no-files {
         line-height: var(--line-height-small);
         font-size: var(--font-size-small);
+        height: calc(var(--font-size-small) + 1px);
     }
     &__info {
         margin-top: .5rem;

src/lib/components/LvImage/LvImage.vue

@@ -60,6 +60,7 @@ export default {
 .lv-image {
     $self: &;
     max-width: 100%;
+    height: 100%;
     padding: 0;
     margin: 0;
     line-height: 0;

src/lib/components/LvQuickFilter/LvQuickFilter.vue

@@ -21,6 +21,7 @@
                 :placeholder="placeholder"
                 :icon="icon"
                 type="text"
+                @keydown.enter="onEnter"
                 @focus="onFocusInput"
                 @blur="onBlurInput"
             />
@@ -108,7 +109,7 @@ export default {
             default: null,
         },
     },
-    emits: ['clear:filter', 'update:filter'],
+    emits: ['clear:filter', 'update:filter', 'enter'],
     data() {
         return {
             focused: false,
@@ -231,6 +232,9 @@ export default {
         onBlurInput() {
             this.focused = false;
         },
+        onEnter() {
+            this.$emit('enter');
+        },
         onClickClosePill(key) {
             this.$emit('clear:filter', key);
         },

src/lib/components/LvSwitch/LvSwitch.vue

@@ -18,7 +18,7 @@
             />
             <lv-spinner v-if="loading" class="lv-switch__loader" :size="12" />
         </div>
-        <label v-if="label" :for="labelFor" class="lv-switch__label" @click="toggleCheckbox">{{ label }}</label>
+        <label v-if="label" :for="labelFor" class="lv-switch__label">{{ label }}</label>
     </div>
 </template>
 

src/lib/components/LvTextarea/LvTextarea.vue

@@ -1,6 +1,13 @@
 <template>
     <div class="lv-textarea" :class="classObject">
-        <textarea class="lv-textarea__textarea" :value="modelValue" :disabled="disabled" :placeholder="placeholder" @input="onChange"></textarea>
+        <textarea
+            class="lv-textarea__textarea"
+            :value="modelValue"
+            :disabled="disabled"
+            :readonly="readonly"
+            :placeholder="placeholder"
+            @input="onChange"
+        ></textarea>
         <lv-spinner v-if="loading" class="lv-textarea__loading" />
     </div>
 </template>
@@ -24,14 +31,18 @@ export default {
             type: Boolean,
             default: false,
         },
+        readonly: {
+            type: Boolean,
+            default: false,
+        },
         height: {
             type: String,
             default: 'auto',
         },
         minHeight: {
             type: String,
             default: '100px',
-        }
+        },
     },
     emits: ['update:modelValue'],
     computed: {
@@ -46,8 +57,8 @@ export default {
     methods: {
         onChange(e) {
             this.$emit('update:modelValue', e.target.value);
-        }
-    }
+        },
+    },
 };
 </script>
 
@@ -93,6 +104,5 @@ export default {
             }
         }
     }
-
 }
 </style>