vuetify 3.0.0-beta.9 → 3.0.1

package/lib/components/VImg/VImg.mjs

@@ -1,15 +1,12 @@
-import { withDirectives as _withDirectives, resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
-import "./VImg.css"; // Components
+import { withDirectives as _withDirectives, resolveDirective as _resolveDirective, Fragment as _Fragment, createVNode as _createVNode } from "vue";
+import "./VImg.css";
 
+// Components
 import { VResponsive } from "../VResponsive/index.mjs"; // Directives
-
 import intersect from "../../directives/intersect/index.mjs"; // Composables
-
 import { makeTransitionProps, MaybeTransition } from "../../composables/transition.mjs"; // Utilities
-
-import { computed, h, nextTick, onBeforeMount, ref, vShow, watch, withDirectives } from 'vue';
+import { computed, nextTick, onBeforeMount, ref, vShow, watch, withDirectives } from 'vue';
 import { convertToUnit, defineComponent, SUPPORTS_INTERSECTION, useRender } from "../../util/index.mjs"; // Types
-
 export const VImg = defineComponent({
   name: 'VImg',
   directives: {
@@ -41,15 +38,17 @@ export const VImg = defineComponent({
     width: [String, Number],
     ...makeTransitionProps()
   },
-  emits: ['loadstart', 'load', 'error'],
-
+  emits: {
+    loadstart: event => true,
+    load: event => true,
+    error: event => true
+  },
   setup(props, _ref) {
     let {
       emit,
       slots
     } = _ref;
     const currentSrc = ref(''); // Set from srcset
-
     const image = ref();
     const state = ref(props.eager ? 'loading' : 'idle');
     const naturalWidth = ref();
@@ -72,32 +71,27 @@ export const VImg = defineComponent({
     });
     watch(() => props.src, () => {
       init(state.value !== 'idle');
-    }); // TODO: getSrc when window width changes
+    });
+    // TODO: getSrc when window width changes
 
     onBeforeMount(() => init());
-
     function init(isIntersecting) {
       if (props.eager && isIntersecting) return;
       if (SUPPORTS_INTERSECTION && !isIntersecting && !props.eager) return;
       state.value = 'loading';
-
       if (normalisedSrc.value.lazySrc) {
         const lazyImg = new Image();
         lazyImg.src = normalisedSrc.value.lazySrc;
         pollForSize(lazyImg, null);
       }
-
       if (!normalisedSrc.value.src) return;
       nextTick(() => {
         var _image$value, _image$value2;
-
         emit('loadstart', ((_image$value = image.value) == null ? void 0 : _image$value.currentSrc) || normalisedSrc.value.src);
-
         if ((_image$value2 = image.value) != null && _image$value2.complete) {
           if (!image.value.naturalWidth) {
             onError();
           }
-
           if (state.value === 'error') return;
           if (!aspectRatio.value) pollForSize(image.value, null);
           onLoad();
@@ -107,36 +101,28 @@ export const VImg = defineComponent({
         }
       });
     }
-
     function onLoad() {
       var _image$value3;
-
       getSrc();
       state.value = 'loaded';
       emit('load', ((_image$value3 = image.value) == null ? void 0 : _image$value3.currentSrc) || normalisedSrc.value.src);
     }
-
     function onError() {
       var _image$value4;
-
       state.value = 'error';
       emit('error', ((_image$value4 = image.value) == null ? void 0 : _image$value4.currentSrc) || normalisedSrc.value.src);
     }
-
     function getSrc() {
       const img = image.value;
       if (img) currentSrc.value = img.currentSrc || img.src;
     }
-
     function pollForSize(img) {
       let timeout = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 100;
-
       const poll = () => {
         const {
           naturalHeight: imgHeight,
           naturalWidth: imgWidth
         } = img;
-
         if (imgHeight || imgWidth) {
           naturalWidth.value = imgWidth;
           naturalHeight.value = imgHeight;
@@ -147,29 +133,25 @@ export const VImg = defineComponent({
           naturalHeight.value = 1;
         }
       };
-
       poll();
     }
-
     const containClasses = computed(() => ({
       'v-img__img--cover': props.cover,
       'v-img__img--contain': !props.cover
     }));
-
-    const __image = computed(() => {
+    const __image = () => {
       var _slots$sources;
-
-      if (!normalisedSrc.value.src || state.value === 'idle') return;
-      const img = h('img', {
-        class: ['v-img__img', containClasses.value],
-        src: normalisedSrc.value.src,
-        srcset: normalisedSrc.value.srcset,
-        alt: '',
-        sizes: props.sizes,
-        ref: image,
-        onLoad,
-        onError
-      });
+      if (!normalisedSrc.value.src || state.value === 'idle') return null;
+      const img = _createVNode("img", {
+        "class": ['v-img__img', containClasses.value],
+        "src": normalisedSrc.value.src,
+        "srcset": normalisedSrc.value.srcset,
+        "alt": "",
+        "sizes": props.sizes,
+        "ref": image,
+        "onLoad": onLoad,
+        "onError": onError
+      }, null);
       const sources = (_slots$sources = slots.sources) == null ? void 0 : _slots$sources.call(slots);
       return _createVNode(MaybeTransition, {
         "transition": props.transition,
@@ -179,9 +161,8 @@ export const VImg = defineComponent({
           "class": "v-img__picture"
         }, [sources, img]) : img, [[vShow, state.value === 'loaded']])]
       });
-    });
-
-    const __preloadImage = computed(() => _createVNode(MaybeTransition, {
+    };
+    const __preloadImage = () => _createVNode(MaybeTransition, {
       "transition": props.transition
     }, {
       default: () => [normalisedSrc.value.lazySrc && state.value !== 'loaded' && _createVNode("img", {
@@ -189,10 +170,9 @@ export const VImg = defineComponent({
         "src": normalisedSrc.value.lazySrc,
         "alt": ""
       }, null)]
-    }));
-
-    const __placeholder = computed(() => {
-      if (!slots.placeholder) return;
+    });
+    const __placeholder = () => {
+      if (!slots.placeholder) return null;
       return _createVNode(MaybeTransition, {
         "transition": props.transition,
         "appear": true
@@ -201,10 +181,9 @@ export const VImg = defineComponent({
           "class": "v-img__placeholder"
         }, [slots.placeholder()])]
       });
-    });
-
-    const __error = computed(() => {
-      if (!slots.error) return;
+    };
+    const __error = () => {
+      if (!slots.error) return null;
       return _createVNode(MaybeTransition, {
         "transition": props.transition,
         "appear": true
@@ -213,18 +192,16 @@ export const VImg = defineComponent({
           "class": "v-img__error"
         }, [slots.error()])]
       });
-    });
-
-    const __gradient = computed(() => {
-      if (!props.gradient) return;
+    };
+    const __gradient = () => {
+      if (!props.gradient) return null;
       return _createVNode("div", {
         "class": "v-img__gradient",
         "style": {
           backgroundImage: `linear-gradient(${props.gradient})`
         }
       }, null);
-    });
-
+    };
     const isBooted = ref(false);
     {
       const stop = watch(aspectRatio, val => {
@@ -250,7 +227,7 @@ export const VImg = defineComponent({
       "aria-label": props.alt,
       "role": props.alt ? 'img' : undefined
     }, {
-      additional: () => [__image.value, __preloadImage.value, __gradient.value, __placeholder.value, __error.value],
+      additional: () => _createVNode(_Fragment, null, [_createVNode(__image, null, null), _createVNode(__preloadImage, null, null), _createVNode(__gradient, null, null), _createVNode(__placeholder, null, null), _createVNode(__error, null, null)]),
       default: slots.default
     }), [[_resolveDirective("intersect"), {
       handler: init,
@@ -266,6 +243,5 @@ export const VImg = defineComponent({
       naturalHeight
     };
   }
-
 });
 //# sourceMappingURL=VImg.mjs.map

package/lib/components/VImg/VImg.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VImg.mjs","names":["VResponsive","intersect","makeTransitionProps","MaybeTransition","computed","h","nextTick","onBeforeMount","ref","vShow","watch","withDirectives","convertToUnit","defineComponent","SUPPORTS_INTERSECTION","useRender","VImg","name","directives","props","aspectRatio","String","Number","alt","cover","Boolean","eager","gradient","lazySrc","options","type","Object","default","root","undefined","rootMargin","threshold","sizes","src","srcset","width","emits","setup","emit","slots","currentSrc","image","state","naturalWidth","naturalHeight","normalisedSrc","aspect","value","init","isIntersecting","lazyImg","Image","pollForSize","complete","onError","onLoad","getSrc","img","timeout","poll","imgHeight","imgWidth","setTimeout","endsWith","startsWith","containClasses","__image","class","sources","transition","__preloadImage","__placeholder","placeholder","error","__error","__gradient","backgroundImage","isBooted","stop","val","requestAnimationFrame","additional","handler"],"sources":["../../../src/components/VImg/VImg.tsx"],"sourcesContent":["import './VImg.sass'\n\n// Components\nimport { VResponsive } from '@/components/VResponsive'\n\n// Directives\nimport intersect from '@/directives/intersect'\n\n// Composables\nimport { makeTransitionProps, MaybeTransition } from '@/composables/transition'\n\n// Utilities\nimport {\n  computed,\n  h,\n  nextTick,\n  onBeforeMount,\n  ref,\n  vShow,\n  watch,\n  withDirectives,\n} from 'vue'\nimport {\n  convertToUnit,\n  defineComponent,\n  SUPPORTS_INTERSECTION,\n  useRender,\n} from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\n// not intended for public use, this is passed in by vuetify-loader\nexport interface srcObject {\n  src?: string\n  srcset?: string\n  lazySrc?: string\n  aspect: number\n}\n\nexport const VImg = defineComponent({\n  name: 'VImg',\n\n  directives: { intersect },\n\n  props: {\n    aspectRatio: [String, Number],\n    alt: String,\n    cover: Boolean,\n    eager: Boolean,\n    gradient: String,\n    lazySrc: String,\n    options: {\n      type: Object as PropType<IntersectionObserverInit>,\n      // For more information on types, navigate to:\n      // https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API\n      default: () => ({\n        root: undefined,\n        rootMargin: undefined,\n        threshold: undefined,\n      }),\n    },\n    sizes: String,\n    src: {\n      type: [String, Object] as PropType<string | srcObject>,\n      default: '',\n    },\n    srcset: String,\n    width: [String, Number],\n\n    ...makeTransitionProps(),\n  },\n\n  emits: ['loadstart', 'load', 'error'],\n\n  setup (props, { emit, slots }) {\n    const currentSrc = ref('') // Set from srcset\n    const image = ref<HTMLImageElement>()\n    const state = ref<'idle' | 'loading' | 'loaded' | 'error'>(props.eager ? 'loading' : 'idle')\n    const naturalWidth = ref<number>()\n    const naturalHeight = ref<number>()\n\n    const normalisedSrc = computed<srcObject>(() => {\n      return props.src && typeof props.src === 'object'\n        ? {\n          src: props.src.src,\n          srcset: props.srcset || props.src.srcset,\n          lazySrc: props.lazySrc || props.src.lazySrc,\n          aspect: Number(props.aspectRatio || props.src.aspect),\n        } : {\n          src: props.src,\n          srcset: props.srcset,\n          lazySrc: props.lazySrc,\n          aspect: Number(props.aspectRatio || 0),\n        }\n    })\n    const aspectRatio = computed(() => {\n      return normalisedSrc.value.aspect || naturalWidth.value! / naturalHeight.value! || 0\n    })\n\n    watch(() => props.src, () => {\n      init(state.value !== 'idle')\n    })\n    // TODO: getSrc when window width changes\n\n    onBeforeMount(() => init())\n\n    function init (isIntersecting?: boolean) {\n      if (props.eager && isIntersecting) return\n      if (\n        SUPPORTS_INTERSECTION &&\n        !isIntersecting &&\n        !props.eager\n      ) return\n\n      state.value = 'loading'\n\n      if (normalisedSrc.value.lazySrc) {\n        const lazyImg = new Image()\n        lazyImg.src = normalisedSrc.value.lazySrc\n        pollForSize(lazyImg, null)\n      }\n\n      if (!normalisedSrc.value.src) return\n\n      nextTick(() => {\n        emit('loadstart', image.value?.currentSrc || normalisedSrc.value.src)\n\n        if (image.value?.complete) {\n          if (!image.value.naturalWidth) {\n            onError()\n          }\n\n          if (state.value === 'error') return\n\n          if (!aspectRatio.value) pollForSize(image.value, null)\n          onLoad()\n        } else {\n          if (!aspectRatio.value) pollForSize(image.value!)\n          getSrc()\n        }\n      })\n    }\n\n    function onLoad () {\n      getSrc()\n      state.value = 'loaded'\n      emit('load', image.value?.currentSrc || normalisedSrc.value.src)\n    }\n\n    function onError () {\n      state.value = 'error'\n      emit('error', image.value?.currentSrc || normalisedSrc.value.src)\n    }\n\n    function getSrc () {\n      const img = image.value\n      if (img) currentSrc.value = img.currentSrc || img.src\n    }\n\n    function pollForSize (img: HTMLImageElement, timeout: number | null = 100) {\n      const poll = () => {\n        const { naturalHeight: imgHeight, naturalWidth: imgWidth } = img\n\n        if (imgHeight || imgWidth) {\n          naturalWidth.value = imgWidth\n          naturalHeight.value = imgHeight\n        } else if (!img.complete && state.value === 'loading' && timeout != null) {\n          setTimeout(poll, timeout)\n        } else if (img.currentSrc.endsWith('.svg') || img.currentSrc.startsWith('data:image/svg+xml')) {\n          naturalWidth.value = 1\n          naturalHeight.value = 1\n        }\n      }\n\n      poll()\n    }\n\n    const containClasses = computed(() => ({\n      'v-img__img--cover': props.cover,\n      'v-img__img--contain': !props.cover,\n    }))\n\n    const __image = computed(() => {\n      if (!normalisedSrc.value.src || state.value === 'idle') return\n\n      const img = h('img', {\n        class: ['v-img__img', containClasses.value],\n        src: normalisedSrc.value.src,\n        srcset: normalisedSrc.value.srcset,\n        alt: '',\n        sizes: props.sizes,\n        ref: image,\n        onLoad,\n        onError,\n      })\n\n      const sources = slots.sources?.()\n\n      return (\n        <MaybeTransition transition={ props.transition } appear>\n          {\n            withDirectives(\n              sources\n                ? <picture class=\"v-img__picture\">{ sources }{ img }</picture>\n                : img,\n              [[vShow, state.value === 'loaded']]\n            )\n          }\n        </MaybeTransition>\n      )\n    })\n\n    const __preloadImage = computed(() => (\n      <MaybeTransition transition={ props.transition }>\n        { normalisedSrc.value.lazySrc && state.value !== 'loaded' && (\n          <img\n            class={['v-img__img', 'v-img__img--preload', containClasses.value]}\n            src={ normalisedSrc.value.lazySrc }\n            alt=\"\"\n          />\n        )}\n      </MaybeTransition>\n    ))\n\n    const __placeholder = computed(() => {\n      if (!slots.placeholder) return\n\n      return (\n        <MaybeTransition transition={ props.transition } appear>\n          { (state.value === 'loading' || (state.value === 'error' && !slots.error)) &&\n          <div class=\"v-img__placeholder\">{ slots.placeholder() }</div>\n          }\n        </MaybeTransition>\n      )\n    })\n\n    const __error = computed(() => {\n      if (!slots.error) return\n\n      return (\n        <MaybeTransition transition={ props.transition } appear>\n          { state.value === 'error' &&\n            <div class=\"v-img__error\">{ slots.error() }</div>\n          }\n        </MaybeTransition>\n      )\n    })\n\n    const __gradient = computed(() => {\n      if (!props.gradient) return\n\n      return <div class=\"v-img__gradient\" style={{ backgroundImage: `linear-gradient(${props.gradient})` }} />\n    })\n\n    const isBooted = ref(false)\n    {\n      const stop = watch(aspectRatio, val => {\n        if (val) {\n          // Doesn't work with nextTick, idk why\n          requestAnimationFrame(() => {\n            requestAnimationFrame(() => {\n              isBooted.value = true\n            })\n          })\n          stop()\n        }\n      })\n    }\n\n    useRender(() => (\n      <VResponsive\n        class={[\n          'v-img',\n          { 'v-img--booting': !isBooted.value },\n        ]}\n        style={{ width: convertToUnit(props.width === 'auto' ? naturalWidth.value : props.width) }}\n        aspectRatio={ aspectRatio.value }\n        aria-label={ props.alt }\n        role={ props.alt ? 'img' : undefined }\n        v-intersect={[{\n          handler: init,\n          options: props.options,\n        }, null, ['once']]}\n        v-slots={{\n          additional: () => [__image.value, __preloadImage.value, __gradient.value, __placeholder.value, __error.value],\n          default: slots.default,\n        }}\n      />\n    ))\n\n    return {\n      currentSrc,\n      image,\n      state,\n      naturalWidth,\n      naturalHeight,\n    }\n  },\n})\n\nexport type VImg = InstanceType<typeof VImg>\n"],"mappings":"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"}
+{"version":3,"file":"VImg.mjs","names":["VResponsive","intersect","makeTransitionProps","MaybeTransition","computed","nextTick","onBeforeMount","ref","vShow","watch","withDirectives","convertToUnit","defineComponent","SUPPORTS_INTERSECTION","useRender","VImg","name","directives","props","aspectRatio","String","Number","alt","cover","Boolean","eager","gradient","lazySrc","options","type","Object","default","root","undefined","rootMargin","threshold","sizes","src","srcset","width","emits","loadstart","event","load","error","setup","emit","slots","currentSrc","image","state","naturalWidth","naturalHeight","normalisedSrc","aspect","value","init","isIntersecting","lazyImg","Image","pollForSize","complete","onError","onLoad","getSrc","img","timeout","poll","imgHeight","imgWidth","setTimeout","endsWith","startsWith","containClasses","__image","sources","transition","__preloadImage","__placeholder","placeholder","__error","__gradient","backgroundImage","isBooted","stop","val","requestAnimationFrame","additional","handler"],"sources":["../../../src/components/VImg/VImg.tsx"],"sourcesContent":["import './VImg.sass'\n\n// Components\nimport { VResponsive } from '@/components/VResponsive'\n\n// Directives\nimport intersect from '@/directives/intersect'\n\n// Composables\nimport { makeTransitionProps, MaybeTransition } from '@/composables/transition'\n\n// Utilities\nimport {\n  computed,\n  nextTick,\n  onBeforeMount,\n  ref,\n  vShow,\n  watch,\n  withDirectives,\n} from 'vue'\nimport {\n  convertToUnit,\n  defineComponent,\n  SUPPORTS_INTERSECTION,\n  useRender,\n} from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\n// not intended for public use, this is passed in by vuetify-loader\nexport interface srcObject {\n  src?: string\n  srcset?: string\n  lazySrc?: string\n  aspect: number\n}\n\nexport const VImg = defineComponent({\n  name: 'VImg',\n\n  directives: { intersect },\n\n  props: {\n    aspectRatio: [String, Number],\n    alt: String,\n    cover: Boolean,\n    eager: Boolean,\n    gradient: String,\n    lazySrc: String,\n    options: {\n      type: Object as PropType<IntersectionObserverInit>,\n      // For more information on types, navigate to:\n      // https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API\n      default: () => ({\n        root: undefined,\n        rootMargin: undefined,\n        threshold: undefined,\n      }),\n    },\n    sizes: String,\n    src: {\n      type: [String, Object] as PropType<string | srcObject>,\n      default: '',\n    },\n    srcset: String,\n    width: [String, Number],\n\n    ...makeTransitionProps(),\n  },\n\n  emits: {\n    loadstart: (event: string | undefined) => true,\n    load: (event: string | undefined) => true,\n    error: (event: string | undefined) => true,\n  },\n\n  setup (props, { emit, slots }) {\n    const currentSrc = ref('') // Set from srcset\n    const image = ref<HTMLImageElement>()\n    const state = ref<'idle' | 'loading' | 'loaded' | 'error'>(props.eager ? 'loading' : 'idle')\n    const naturalWidth = ref<number>()\n    const naturalHeight = ref<number>()\n\n    const normalisedSrc = computed<srcObject>(() => {\n      return props.src && typeof props.src === 'object'\n        ? {\n          src: props.src.src,\n          srcset: props.srcset || props.src.srcset,\n          lazySrc: props.lazySrc || props.src.lazySrc,\n          aspect: Number(props.aspectRatio || props.src.aspect),\n        } : {\n          src: props.src,\n          srcset: props.srcset,\n          lazySrc: props.lazySrc,\n          aspect: Number(props.aspectRatio || 0),\n        }\n    })\n    const aspectRatio = computed(() => {\n      return normalisedSrc.value.aspect || naturalWidth.value! / naturalHeight.value! || 0\n    })\n\n    watch(() => props.src, () => {\n      init(state.value !== 'idle')\n    })\n    // TODO: getSrc when window width changes\n\n    onBeforeMount(() => init())\n\n    function init (isIntersecting?: boolean) {\n      if (props.eager && isIntersecting) return\n      if (\n        SUPPORTS_INTERSECTION &&\n        !isIntersecting &&\n        !props.eager\n      ) return\n\n      state.value = 'loading'\n\n      if (normalisedSrc.value.lazySrc) {\n        const lazyImg = new Image()\n        lazyImg.src = normalisedSrc.value.lazySrc\n        pollForSize(lazyImg, null)\n      }\n\n      if (!normalisedSrc.value.src) return\n\n      nextTick(() => {\n        emit('loadstart', image.value?.currentSrc || normalisedSrc.value.src)\n\n        if (image.value?.complete) {\n          if (!image.value.naturalWidth) {\n            onError()\n          }\n\n          if (state.value === 'error') return\n\n          if (!aspectRatio.value) pollForSize(image.value, null)\n          onLoad()\n        } else {\n          if (!aspectRatio.value) pollForSize(image.value!)\n          getSrc()\n        }\n      })\n    }\n\n    function onLoad () {\n      getSrc()\n      state.value = 'loaded'\n      emit('load', image.value?.currentSrc || normalisedSrc.value.src)\n    }\n\n    function onError () {\n      state.value = 'error'\n      emit('error', image.value?.currentSrc || normalisedSrc.value.src)\n    }\n\n    function getSrc () {\n      const img = image.value\n      if (img) currentSrc.value = img.currentSrc || img.src\n    }\n\n    function pollForSize (img: HTMLImageElement, timeout: number | null = 100) {\n      const poll = () => {\n        const { naturalHeight: imgHeight, naturalWidth: imgWidth } = img\n\n        if (imgHeight || imgWidth) {\n          naturalWidth.value = imgWidth\n          naturalHeight.value = imgHeight\n        } else if (!img.complete && state.value === 'loading' && timeout != null) {\n          setTimeout(poll, timeout)\n        } else if (img.currentSrc.endsWith('.svg') || img.currentSrc.startsWith('data:image/svg+xml')) {\n          naturalWidth.value = 1\n          naturalHeight.value = 1\n        }\n      }\n\n      poll()\n    }\n\n    const containClasses = computed(() => ({\n      'v-img__img--cover': props.cover,\n      'v-img__img--contain': !props.cover,\n    }))\n\n    const __image = () => {\n      if (!normalisedSrc.value.src || state.value === 'idle') return null\n\n      const img = (\n        <img\n          class={['v-img__img', containClasses.value]}\n          src={ normalisedSrc.value.src }\n          srcset={ normalisedSrc.value.srcset }\n          alt=\"\"\n          sizes={ props.sizes }\n          ref={ image }\n          onLoad={ onLoad }\n          onError={ onError }\n        />\n      )\n\n      const sources = slots.sources?.()\n\n      return (\n        <MaybeTransition transition={ props.transition } appear>\n          {\n            withDirectives(\n              sources\n                ? <picture class=\"v-img__picture\">{ sources }{ img }</picture>\n                : img,\n              [[vShow, state.value === 'loaded']]\n            )\n          }\n        </MaybeTransition>\n      )\n    }\n\n    const __preloadImage = () => (\n      <MaybeTransition transition={ props.transition }>\n        { normalisedSrc.value.lazySrc && state.value !== 'loaded' && (\n          <img\n            class={['v-img__img', 'v-img__img--preload', containClasses.value]}\n            src={ normalisedSrc.value.lazySrc }\n            alt=\"\"\n          />\n        )}\n      </MaybeTransition>\n    )\n\n    const __placeholder = () => {\n      if (!slots.placeholder) return null\n\n      return (\n        <MaybeTransition transition={ props.transition } appear>\n          { (state.value === 'loading' || (state.value === 'error' && !slots.error)) &&\n          <div class=\"v-img__placeholder\">{ slots.placeholder() }</div>\n          }\n        </MaybeTransition>\n      )\n    }\n\n    const __error = () => {\n      if (!slots.error) return null\n\n      return (\n        <MaybeTransition transition={ props.transition } appear>\n          { state.value === 'error' &&\n            <div class=\"v-img__error\">{ slots.error() }</div>\n          }\n        </MaybeTransition>\n      )\n    }\n\n    const __gradient = () => {\n      if (!props.gradient) return null\n\n      return <div class=\"v-img__gradient\" style={{ backgroundImage: `linear-gradient(${props.gradient})` }} />\n    }\n\n    const isBooted = ref(false)\n    {\n      const stop = watch(aspectRatio, val => {\n        if (val) {\n          // Doesn't work with nextTick, idk why\n          requestAnimationFrame(() => {\n            requestAnimationFrame(() => {\n              isBooted.value = true\n            })\n          })\n          stop()\n        }\n      })\n    }\n\n    useRender(() => (\n      <VResponsive\n        class={[\n          'v-img',\n          { 'v-img--booting': !isBooted.value },\n        ]}\n        style={{ width: convertToUnit(props.width === 'auto' ? naturalWidth.value : props.width) }}\n        aspectRatio={ aspectRatio.value }\n        aria-label={ props.alt }\n        role={ props.alt ? 'img' : undefined }\n        v-intersect={[{\n          handler: init,\n          options: props.options,\n        }, null, ['once']]}\n      >{{\n        additional: () => (\n          <>\n            <__image />\n            <__preloadImage />\n            <__gradient />\n            <__placeholder />\n            <__error />\n          </>\n        ),\n        default: slots.default,\n      }}</VResponsive>\n    ))\n\n    return {\n      currentSrc,\n      image,\n      state,\n      naturalWidth,\n      naturalHeight,\n    }\n  },\n})\n\nexport type VImg = InstanceType<typeof VImg>\n"],"mappings":"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"}

package/lib/components/VImg/index.d.ts

@@ -0,0 +1,93 @@
+import * as vue from 'vue';
+import { PropType } from 'vue';
+
+interface srcObject {
+    src?: string;
+    srcset?: string;
+    lazySrc?: string;
+    aspect: number;
+}
+declare const VImg: vue.DefineComponent<{
+    transition: {
+        type: PropType<string | boolean | (vue.TransitionProps & {
+            component?: vue.Component<any, any, any, vue.ComputedOptions, vue.MethodOptions> | undefined;
+        })>;
+        default: string;
+        validator: (val: unknown) => boolean;
+    };
+    aspectRatio: (StringConstructor | NumberConstructor)[];
+    alt: StringConstructor;
+    cover: BooleanConstructor;
+    eager: BooleanConstructor;
+    gradient: StringConstructor;
+    lazySrc: StringConstructor;
+    options: {
+        type: PropType<IntersectionObserverInit>;
+        default: () => {
+            root: undefined;
+            rootMargin: undefined;
+            threshold: undefined;
+        };
+    };
+    sizes: StringConstructor;
+    src: {
+        type: PropType<string | srcObject>;
+        default: string;
+    };
+    srcset: StringConstructor;
+    width: (StringConstructor | NumberConstructor)[];
+}, {
+    currentSrc: vue.Ref<string>;
+    image: vue.Ref<HTMLImageElement | undefined>;
+    state: vue.Ref<"error" | "loaded" | "idle" | "loading">;
+    naturalWidth: vue.Ref<number | undefined>;
+    naturalHeight: vue.Ref<number | undefined>;
+}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
+    loadstart: (event: string | undefined) => true;
+    load: (event: string | undefined) => true;
+    error: (event: string | undefined) => true;
+}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    transition: {
+        type: PropType<string | boolean | (vue.TransitionProps & {
+            component?: vue.Component<any, any, any, vue.ComputedOptions, vue.MethodOptions> | undefined;
+        })>;
+        default: string;
+        validator: (val: unknown) => boolean;
+    };
+    aspectRatio: (StringConstructor | NumberConstructor)[];
+    alt: StringConstructor;
+    cover: BooleanConstructor;
+    eager: BooleanConstructor;
+    gradient: StringConstructor;
+    lazySrc: StringConstructor;
+    options: {
+        type: PropType<IntersectionObserverInit>;
+        default: () => {
+            root: undefined;
+            rootMargin: undefined;
+            threshold: undefined;
+        };
+    };
+    sizes: StringConstructor;
+    src: {
+        type: PropType<string | srcObject>;
+        default: string;
+    };
+    srcset: StringConstructor;
+    width: (StringConstructor | NumberConstructor)[];
+}>> & {
+    onError?: ((event: string | undefined) => any) | undefined;
+    onLoad?: ((event: string | undefined) => any) | undefined;
+    onLoadstart?: ((event: string | undefined) => any) | undefined;
+}, {
+    transition: string | boolean | (vue.TransitionProps & {
+        component?: vue.Component<any, any, any, vue.ComputedOptions, vue.MethodOptions> | undefined;
+    });
+    eager: boolean;
+    options: IntersectionObserverInit;
+    cover: boolean;
+    src: string | srcObject;
+}>;
+declare type VImg = InstanceType<typeof VImg>;
+
+export { VImg };

package/lib/components/VImg/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["VImg"],"sources":["../../../src/components/VImg/index.ts"],"sourcesContent":["export { VImg } from './VImg'\n"],"mappings":"SAASA,I"}
+{"version":3,"file":"index.mjs","names":["VImg"],"sources":["../../../src/components/VImg/index.ts"],"sourcesContent":["export { VImg } from './VImg'\n"],"mappings":"SAASA,IAAI"}

package/lib/components/VInput/InputIcon.mjs

@@ -0,0 +1,31 @@
+import { createVNode as _createVNode } from "vue";
+import { VIcon } from "../VIcon/index.mjs";
+import { useLocale } from "../../composables/locale.mjs";
+export function useInputIcon(props) {
+  const {
+    t
+  } = useLocale();
+  function InputIcon(_ref) {
+    let {
+      name
+    } = _ref;
+    const localeKey = {
+      prepend: 'prependAction',
+      prependInner: 'prependAction',
+      append: 'appendAction',
+      appendInner: 'appendAction',
+      clear: 'clear'
+    }[name];
+    const listener = props[`onClick:${name}`];
+    const label = listener && localeKey ? t(`$vuetify.input.${localeKey}`, props.label ?? '') : undefined;
+    return _createVNode(VIcon, {
+      "icon": props[`${name}Icon`],
+      "aria-label": label,
+      "onClick": listener
+    }, null);
+  }
+  return {
+    InputIcon
+  };
+}
+//# sourceMappingURL=InputIcon.mjs.map

package/lib/components/VInput/InputIcon.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputIcon.mjs","names":["VIcon","useLocale","useInputIcon","props","t","InputIcon","name","localeKey","prepend","prependInner","append","appendInner","clear","listener","label","undefined"],"sources":["../../../src/components/VInput/InputIcon.tsx"],"sourcesContent":["import { VIcon } from '@/components/VIcon'\nimport { useLocale } from '@/composables/locale'\nimport type { IconValue } from '@/composables/icons'\n\ntype names = 'clear' | 'prepend' | 'append' | 'appendInner' | 'prependInner'\n\ntype EventProp<T = (...args: any[]) => any> = T | T[]\ntype InputIconProps<T extends names> = {\n  label: string | undefined\n} & {\n  [K in `${T}Icon`]: IconValue | undefined\n} & {\n  [K in `onClick:${T}`]: EventProp | undefined\n}\n\ntype Listeners<T extends {}, U = keyof T> = U extends `onClick:${infer V extends names}` ? V : never\n\nexport function useInputIcon<T extends {}, K extends names = Listeners<T>> (props: T & InputIconProps<K>) {\n  const { t } = useLocale()\n\n  function InputIcon ({ name }: { name: Extract<names, K> }) {\n    const localeKey = {\n      prepend: 'prependAction',\n      prependInner: 'prependAction',\n      append: 'appendAction',\n      appendInner: 'appendAction',\n      clear: 'clear',\n    }[name]\n    const listener = props[`onClick:${name}`]\n    const label = listener && localeKey\n      ? t(`$vuetify.input.${localeKey}`, props.label ?? '')\n      : undefined\n\n    return (\n      <VIcon\n        icon={ props[`${name}Icon`] }\n        aria-label={ label }\n        onClick={ listener }\n      />\n    )\n  }\n\n  return { InputIcon }\n}\n"],"mappings":";SAASA,KAAK;AAAA,SACLC,SAAS;AAgBlB,OAAO,SAASC,YAAY,CAAgDC,KAA4B,EAAE;EACxG,MAAM;IAAEC;EAAE,CAAC,GAAGH,SAAS,EAAE;EAEzB,SAASI,SAAS,OAAyC;IAAA,IAAvC;MAAEC;IAAkC,CAAC;IACvD,MAAMC,SAAS,GAAG;MAChBC,OAAO,EAAE,eAAe;MACxBC,YAAY,EAAE,eAAe;MAC7BC,MAAM,EAAE,cAAc;MACtBC,WAAW,EAAE,cAAc;MAC3BC,KAAK,EAAE;IACT,CAAC,CAACN,IAAI,CAAC;IACP,MAAMO,QAAQ,GAAGV,KAAK,CAAE,WAAUG,IAAK,EAAC,CAAC;IACzC,MAAMQ,KAAK,GAAGD,QAAQ,IAAIN,SAAS,GAC/BH,CAAC,CAAE,kBAAiBG,SAAU,EAAC,EAAEJ,KAAK,CAACW,KAAK,IAAI,EAAE,CAAC,GACnDC,SAAS;IAEb;MAAA,QAEWZ,KAAK,CAAE,GAAEG,IAAK,MAAK,CAAC;MAAA,cACdQ,KAAK;MAAA,WACRD;IAAQ;EAGxB;EAEA,OAAO;IAAER;EAAU,CAAC;AACtB"}

package/lib/components/VInput/VInput.mjs

@@ -1,17 +1,15 @@
 import { resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
 // Styles
-import "./VInput.css"; // Components
+import "./VInput.css";
 
-import { VIcon } from "../VIcon/index.mjs";
+// Components
 import { VMessages } from "../VMessages/index.mjs"; // Composables
-
 import { IconValue } from "../../composables/icons.mjs";
 import { makeDensityProps, useDensity } from "../../composables/density.mjs";
 import { makeValidationProps, useValidation } from "../../composables/validation.mjs"; // Utilities
-
 import { computed } from 'vue';
-import { genericComponent, getUid, pick, propsFactory, useRender } from "../../util/index.mjs"; // Types
-
+import { EventProp, genericComponent, getUid, isOn, pick, propsFactory, useRender } from "../../util/index.mjs"; // Types
+import { useInputIcon } from "./InputIcon.mjs";
 export const makeVInputProps = propsFactory({
   id: String,
   appendIcon: IconValue,
@@ -26,17 +24,19 @@ export const makeVInputProps = propsFactory({
     default: 'horizontal',
     validator: v => ['horizontal', 'vertical'].includes(v)
   },
+  'onClick:prepend': EventProp,
+  'onClick:append': EventProp,
   ...makeDensityProps(),
   ...makeValidationProps()
-});
+}, 'v-input');
 export const VInput = genericComponent()({
   name: 'VInput',
-  props: { ...makeVInputProps()
+  props: {
+    ...makeVInputProps()
   },
   emits: {
     'update:modelValue': val => true
   },
-
   setup(props, _ref) {
     let {
       attrs,
@@ -46,6 +46,9 @@ export const VInput = genericComponent()({
     const {
       densityClasses
     } = useDensity(props);
+    const {
+      InputIcon
+    } = useInputIcon(props);
     const uid = getUid();
     const id = computed(() => props.id || `input-${uid}`);
     const {
@@ -75,7 +78,6 @@ export const VInput = genericComponent()({
     }));
     useRender(() => {
       var _props$messages, _slots$prepend, _slots$default, _slots$append, _slots$details;
-
       const hasPrepend = !!(slots.prepend || props.prependIcon);
       const hasAppend = !!(slots.append || props.appendIcon);
       const hasMessages = !!((_props$messages = props.messages) != null && _props$messages.length || errorMessages.value.length);
@@ -85,20 +87,18 @@ export const VInput = genericComponent()({
       }, [hasPrepend && _createVNode("div", {
         "key": "prepend",
         "class": "v-input__prepend"
-      }, [props.prependIcon && _createVNode(VIcon, {
+      }, [(_slots$prepend = slots.prepend) == null ? void 0 : _slots$prepend.call(slots, slotProps.value), props.prependIcon && _createVNode(InputIcon, {
         "key": "prepend-icon",
-        "onClick": attrs['onClick:prepend'],
-        "icon": props.prependIcon
-      }, null), (_slots$prepend = slots.prepend) == null ? void 0 : _slots$prepend.call(slots, slotProps.value)]), slots.default && _createVNode("div", {
+        "name": "prepend"
+      }, null)]), slots.default && _createVNode("div", {
         "class": "v-input__control"
       }, [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots, slotProps.value)]), hasAppend && _createVNode("div", {
         "key": "append",
         "class": "v-input__append"
-      }, [(_slots$append = slots.append) == null ? void 0 : _slots$append.call(slots, slotProps.value), props.appendIcon && _createVNode(VIcon, {
+      }, [props.appendIcon && _createVNode(InputIcon, {
         "key": "append-icon",
-        "onClick": attrs['onClick:append'],
-        "icon": props.appendIcon
-      }, null)]), hasDetails && _createVNode("div", {
+        "name": "append"
+      }, null), (_slots$append = slots.append) == null ? void 0 : _slots$append.call(slots, slotProps.value)]), hasDetails && _createVNode("div", {
         "class": "v-input__details"
       }, [_createVNode(VMessages, {
         "active": hasMessages,
@@ -113,9 +113,9 @@ export const VInput = genericComponent()({
       validate
     };
   }
-
 });
 export function filterInputProps(props) {
-  return pick(props, Object.keys(VInput.props));
+  const keys = Object.keys(VInput.props).filter(k => !isOn(k));
+  return pick(props, keys);
 }
 //# sourceMappingURL=VInput.mjs.map

package/lib/components/VInput/VInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VInput.mjs","names":["VIcon","VMessages","IconValue","makeDensityProps","useDensity","makeValidationProps","useValidation","computed","genericComponent","getUid","pick","propsFactory","useRender","makeVInputProps","id","String","appendIcon","prependIcon","hideDetails","Boolean","messages","type","Array","default","direction","validator","v","includes","VInput","name","props","emits","val","setup","attrs","slots","emit","densityClasses","uid","errorMessages","isDirty","isDisabled","isReadonly","isPristine","isValid","isValidating","reset","resetValidation","validate","validationClasses","slotProps","hasPrepend","prepend","hasAppend","append","hasMessages","length","value","hasDetails","details","message","filterInputProps","Object","keys"],"sources":["../../../src/components/VInput/VInput.tsx"],"sourcesContent":["// Styles\nimport './VInput.sass'\n\n// Components\nimport { VIcon } from '@/components/VIcon'\nimport { VMessages } from '@/components/VMessages'\n\n// Composables\nimport { IconValue } from '@/composables/icons'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeValidationProps, useValidation } from '@/composables/validation'\n\n// Utilities\nimport { computed } from 'vue'\nimport { genericComponent, getUid, pick, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { ComputedRef, ExtractPropTypes, PropType, Ref } from 'vue'\nimport type { MakeSlots } from '@/util'\n\nexport interface VInputSlot {\n  id: ComputedRef<string>\n  isDirty: ComputedRef<boolean>\n  isDisabled: ComputedRef<boolean>\n  isReadonly: ComputedRef<boolean>\n  isPristine: Ref<boolean>\n  isValid: ComputedRef<boolean | null>\n  isValidating: Ref<boolean>\n  reset: () => void\n  resetValidation: () => void\n  validate: () => void\n}\n\nexport const makeVInputProps = propsFactory({\n  id: String,\n  appendIcon: IconValue,\n  prependIcon: IconValue,\n  hideDetails: [Boolean, String] as PropType<boolean | 'auto'>,\n  messages: {\n    type: [Array, String] as PropType<string | string[]>,\n    default: () => ([]),\n  },\n  direction: {\n    type: String as PropType<'horizontal' | 'vertical'>,\n    default: 'horizontal',\n    validator: (v: any) => ['horizontal', 'vertical'].includes(v),\n  },\n\n  ...makeDensityProps(),\n  ...makeValidationProps(),\n})\n\nexport type VInputSlots = MakeSlots<{\n  default: [VInputSlot]\n  prepend: [VInputSlot]\n  append: [VInputSlot]\n  details: [VInputSlot]\n}>\n\nexport const VInput = genericComponent<new <T>() => {\n  $slots: VInputSlots\n}>()({\n  name: 'VInput',\n\n  props: {\n    ...makeVInputProps(),\n  },\n\n  emits: {\n    'update:modelValue': (val: any) => true,\n  },\n\n  setup (props, { attrs, slots, emit }) {\n    const { densityClasses } = useDensity(props)\n\n    const uid = getUid()\n    const id = computed(() => props.id || `input-${uid}`)\n\n    const {\n      errorMessages,\n      isDirty,\n      isDisabled,\n      isReadonly,\n      isPristine,\n      isValid,\n      isValidating,\n      reset,\n      resetValidation,\n      validate,\n      validationClasses,\n    } = useValidation(props, 'v-input', id)\n\n    const slotProps = computed<VInputSlot>(() => ({\n      id,\n      isDirty,\n      isDisabled,\n      isReadonly,\n      isPristine,\n      isValid,\n      isValidating,\n      reset,\n      resetValidation,\n      validate,\n    }))\n\n    useRender(() => {\n      const hasPrepend = !!(slots.prepend || props.prependIcon)\n      const hasAppend = !!(slots.append || props.appendIcon)\n      const hasMessages = !!(\n        props.messages?.length ||\n        errorMessages.value.length\n      )\n      const hasDetails = !props.hideDetails || (\n        props.hideDetails === 'auto' &&\n        (hasMessages || !!slots.details)\n      )\n\n      return (\n        <div class={[\n          'v-input',\n          `v-input--${props.direction}`,\n          densityClasses.value,\n          validationClasses.value,\n        ]}\n        >\n          { hasPrepend && (\n            <div key=\"prepend\" class=\"v-input__prepend\">\n              { props.prependIcon && (\n                <VIcon\n                  key=\"prepend-icon\"\n                  onClick={ attrs['onClick:prepend'] }\n                  icon={ props.prependIcon }\n                />\n              ) }\n\n              { slots.prepend?.(slotProps.value) }\n            </div>\n          ) }\n\n          { slots.default && (\n            <div class=\"v-input__control\">\n              { slots.default?.(slotProps.value) }\n            </div>\n          ) }\n\n          { hasAppend && (\n            <div key=\"append\" class=\"v-input__append\">\n              { slots.append?.(slotProps.value) }\n\n              { props.appendIcon && (\n                <VIcon\n                  key=\"append-icon\"\n                  onClick={ attrs['onClick:append'] }\n                  icon={ props.appendIcon }\n                />\n              ) }\n            </div>\n          ) }\n\n          { hasDetails && (\n            <div class=\"v-input__details\">\n              <VMessages\n                active={ hasMessages }\n                messages={ errorMessages.value.length > 0\n                  ? errorMessages.value\n                  : props.messages\n                }\n                v-slots={{ message: slots.message }}\n              />\n\n              { slots.details?.(slotProps.value) }\n            </div>\n          ) }\n        </div>\n      )\n    })\n\n    return {\n      reset,\n      resetValidation,\n      validate,\n    }\n  },\n})\n\nexport type VInput = InstanceType<typeof VInput>\n\nexport function filterInputProps (props: ExtractPropTypes<ReturnType<typeof makeVInputProps>>) {\n  return pick(props, Object.keys(VInput.props) as any)\n}\n"],"mappings":"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"}
+{"version":3,"file":"VInput.mjs","names":["VMessages","IconValue","makeDensityProps","useDensity","makeValidationProps","useValidation","computed","EventProp","genericComponent","getUid","isOn","pick","propsFactory","useRender","useInputIcon","makeVInputProps","id","String","appendIcon","prependIcon","hideDetails","Boolean","messages","type","Array","default","direction","validator","v","includes","VInput","name","props","emits","val","setup","attrs","slots","emit","densityClasses","InputIcon","uid","errorMessages","isDirty","isDisabled","isReadonly","isPristine","isValid","isValidating","reset","resetValidation","validate","validationClasses","slotProps","hasPrepend","prepend","hasAppend","append","hasMessages","length","value","hasDetails","details","message","filterInputProps","keys","Object","filter","k"],"sources":["../../../src/components/VInput/VInput.tsx"],"sourcesContent":["// Styles\nimport './VInput.sass'\n\n// Components\nimport { VMessages } from '@/components/VMessages'\n\n// Composables\nimport { IconValue } from '@/composables/icons'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeValidationProps, useValidation } from '@/composables/validation'\n\n// Utilities\nimport { computed } from 'vue'\nimport { EventProp, genericComponent, getUid, isOn, pick, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { ComputedRef, PropType, Ref } from 'vue'\nimport type { MakeSlots, SlotsToProps } from '@/util'\nimport { useInputIcon } from '@/components/VInput/InputIcon'\n\nexport interface VInputSlot {\n  id: ComputedRef<string>\n  isDirty: ComputedRef<boolean>\n  isDisabled: ComputedRef<boolean>\n  isReadonly: ComputedRef<boolean>\n  isPristine: Ref<boolean>\n  isValid: ComputedRef<boolean | null>\n  isValidating: Ref<boolean>\n  reset: () => void\n  resetValidation: () => void\n  validate: () => void\n}\n\nexport const makeVInputProps = propsFactory({\n  id: String,\n  appendIcon: IconValue,\n  prependIcon: IconValue,\n  hideDetails: [Boolean, String] as PropType<boolean | 'auto'>,\n  messages: {\n    type: [Array, String] as PropType<string | string[]>,\n    default: () => ([]),\n  },\n  direction: {\n    type: String as PropType<'horizontal' | 'vertical'>,\n    default: 'horizontal',\n    validator: (v: any) => ['horizontal', 'vertical'].includes(v),\n  },\n\n  'onClick:prepend': EventProp,\n  'onClick:append': EventProp,\n\n  ...makeDensityProps(),\n  ...makeValidationProps(),\n}, 'v-input')\n\nexport type VInputSlots = MakeSlots<{\n  default: [VInputSlot]\n  prepend: [VInputSlot]\n  append: [VInputSlot]\n  details: [VInputSlot]\n}>\n\nexport const VInput = genericComponent<new () => {\n  $props: SlotsToProps<VInputSlots>\n}>()({\n  name: 'VInput',\n\n  props: {\n    ...makeVInputProps(),\n  },\n\n  emits: {\n    'update:modelValue': (val: any) => true,\n  },\n\n  setup (props, { attrs, slots, emit }) {\n    const { densityClasses } = useDensity(props)\n    const { InputIcon } = useInputIcon(props)\n\n    const uid = getUid()\n    const id = computed(() => props.id || `input-${uid}`)\n\n    const {\n      errorMessages,\n      isDirty,\n      isDisabled,\n      isReadonly,\n      isPristine,\n      isValid,\n      isValidating,\n      reset,\n      resetValidation,\n      validate,\n      validationClasses,\n    } = useValidation(props, 'v-input', id)\n\n    const slotProps = computed<VInputSlot>(() => ({\n      id,\n      isDirty,\n      isDisabled,\n      isReadonly,\n      isPristine,\n      isValid,\n      isValidating,\n      reset,\n      resetValidation,\n      validate,\n    }))\n\n    useRender(() => {\n      const hasPrepend = !!(slots.prepend || props.prependIcon)\n      const hasAppend = !!(slots.append || props.appendIcon)\n      const hasMessages = !!(\n        props.messages?.length ||\n        errorMessages.value.length\n      )\n      const hasDetails = !props.hideDetails || (\n        props.hideDetails === 'auto' &&\n        (hasMessages || !!slots.details)\n      )\n\n      return (\n        <div class={[\n          'v-input',\n          `v-input--${props.direction}`,\n          densityClasses.value,\n          validationClasses.value,\n        ]}\n        >\n          { hasPrepend && (\n            <div key=\"prepend\" class=\"v-input__prepend\">\n              { slots.prepend?.(slotProps.value) }\n\n              { props.prependIcon && (\n                <InputIcon\n                  key=\"prepend-icon\"\n                  name=\"prepend\"\n                />\n              ) }\n            </div>\n          ) }\n\n          { slots.default && (\n            <div class=\"v-input__control\">\n              { slots.default?.(slotProps.value) }\n            </div>\n          ) }\n\n          { hasAppend && (\n            <div key=\"append\" class=\"v-input__append\">\n              { props.appendIcon && (\n                <InputIcon\n                  key=\"append-icon\"\n                  name=\"append\"\n                />\n              ) }\n\n              { slots.append?.(slotProps.value) }\n            </div>\n          ) }\n\n          { hasDetails && (\n            <div class=\"v-input__details\">\n              <VMessages\n                active={ hasMessages }\n                messages={ errorMessages.value.length > 0\n                  ? errorMessages.value\n                  : props.messages\n                }\n                v-slots={{ message: slots.message }}\n              />\n\n              { slots.details?.(slotProps.value) }\n            </div>\n          ) }\n        </div>\n      )\n    })\n\n    return {\n      reset,\n      resetValidation,\n      validate,\n    }\n  },\n})\n\nexport type VInput = InstanceType<typeof VInput>\n\nexport function filterInputProps (props: Record<string, unknown>) {\n  const keys = Object.keys(VInput.props).filter(k => !isOn(k))\n  return pick(props, keys)\n}\n"],"mappings":"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"}