@vuetify/nightly 3.0.0-beta.0 → 3.0.0-beta.13

package/lib/components/VIcon/_variables.scss

@@ -2,11 +2,7 @@
 @use '../../styles/settings';
 @use '../../styles/tools';
 
-// Defaults
-$icon-btn-margin-start-multiplier: -9 !default;
-$icon-btn-margin-end-multiplier: 4.5 !default;
-$icon-btn-margin-start: calc(var(--v-btn-height) / #{$icon-btn-margin-start-multiplier}) !default;
-$icon-btn-margin-end: calc(var(--v-btn-height) / #{$icon-btn-margin-end-multiplier}) !default;
+// VIcon
 $icon-left-margin-left: map.get(settings.$grid-gutters, 'md') !default;
 $icon-letter-spacing: normal !default;
 $icon-line-height: 1 !default;
@@ -16,6 +12,7 @@ $icon-size: 1em !default;
 $icon-text-indent: 0 !default;
 $icon-vertical-align: middle !default;
 
+// Lists
 $icon-sizes: () !default;
 $icon-sizes: tools.map-deep-merge(
   (

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

@@ -0,0 +1,124 @@
+import * as vue from 'vue';
+import { PropType, JSXComponent } from 'vue';
+
+declare type IconValue = string | JSXComponent;
+declare const IconValue: PropType<IconValue>;
+declare const VComponentIcon: vue.DefineComponent<{
+    icon: {
+        type: PropType<IconValue>;
+        required: true;
+    };
+    tag: {
+        type: StringConstructor;
+        required: true;
+    };
+}, () => JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    icon: {
+        type: PropType<IconValue>;
+        required: true;
+    };
+    tag: {
+        type: StringConstructor;
+        required: true;
+    };
+}>>, {}>;
+declare const VSvgIcon: vue.DefineComponent<{
+    icon: {
+        type: PropType<IconValue>;
+        required: true;
+    };
+    tag: {
+        type: StringConstructor;
+        required: true;
+    };
+}, () => JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    icon: {
+        type: PropType<IconValue>;
+        required: true;
+    };
+    tag: {
+        type: StringConstructor;
+        required: true;
+    };
+}>>, {}>;
+declare const VLigatureIcon: vue.DefineComponent<{
+    icon: {
+        type: PropType<IconValue>;
+        required: true;
+    };
+    tag: {
+        type: StringConstructor;
+        required: true;
+    };
+}, () => JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    icon: {
+        type: PropType<IconValue>;
+        required: true;
+    };
+    tag: {
+        type: StringConstructor;
+        required: true;
+    };
+}>>, {}>;
+declare const VClassIcon: vue.DefineComponent<{
+    icon: {
+        type: PropType<IconValue>;
+        required: true;
+    };
+    tag: {
+        type: StringConstructor;
+        required: true;
+    };
+}, () => JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    icon: {
+        type: PropType<IconValue>;
+        required: true;
+    };
+    tag: {
+        type: StringConstructor;
+        required: true;
+    };
+}>>, {}>;
+
+declare const VIcon: vue.DefineComponent<{
+    theme: StringConstructor;
+    tag: Omit<{
+        type: StringConstructor;
+        default: string;
+    }, "type" | "default"> & {
+        type: vue.PropType<string>;
+        default: string;
+    };
+    size: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    color: StringConstructor;
+    start: BooleanConstructor;
+    end: BooleanConstructor;
+    icon: vue.PropType<IconValue>;
+}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    theme: StringConstructor;
+    tag: Omit<{
+        type: StringConstructor;
+        default: string;
+    }, "type" | "default"> & {
+        type: vue.PropType<string>;
+        default: string;
+    };
+    size: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    color: StringConstructor;
+    start: BooleanConstructor;
+    end: BooleanConstructor;
+    icon: vue.PropType<IconValue>;
+}>>, {
+    end: boolean;
+    start: boolean;
+    size: string | number;
+    tag: string;
+}>;
+
+export { VClassIcon, VComponentIcon, VIcon, VLigatureIcon, VSvgIcon };

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VIcon/index.ts"],"names":["VIcon","VComponentIcon","VSvgIcon","VLigatureIcon","VClassIcon"],"mappings":"SAASA,K;SAEPC,c,EACAC,Q,EACAC,a,EACAC,U","sourcesContent":["export { VIcon } from './VIcon'\nexport {\n  VComponentIcon,\n  VSvgIcon,\n  VLigatureIcon,\n  VClassIcon,\n} from '@/composables/icons'\n"],"file":"index.mjs"}
+{"version":3,"file":"index.mjs","names":["VIcon","VComponentIcon","VSvgIcon","VLigatureIcon","VClassIcon"],"sources":["../../../src/components/VIcon/index.ts"],"sourcesContent":["export { VIcon } from './VIcon'\nexport { VComponentIcon, VSvgIcon, VLigatureIcon, VClassIcon } from '@/composables/icons'\n"],"mappings":"SAASA,K;SACAC,c,EAAgBC,Q,EAAUC,a,EAAeC,U"}

package/lib/components/VImg/VImg.mjs

@@ -1,4 +1,4 @@
-import { withDirectives as _withDirectives, resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
+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
@@ -7,7 +7,7 @@ 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({
@@ -156,19 +156,22 @@ export const VImg = defineComponent({
       '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,
-        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,
@@ -178,9 +181,9 @@ 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", {
@@ -188,10 +191,10 @@ 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
@@ -200,10 +203,10 @@ 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
@@ -212,17 +215,17 @@ 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);
     {
@@ -249,7 +252,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,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VImg/VImg.tsx"],"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"],"mappings":"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","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        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"],"file":"VImg.mjs"}
+{"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","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","__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: ['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 = () => {\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/VImg.sass

@@ -1,4 +1,3 @@
-@forward './variables'
 @use '../../styles/tools'
 @use './variables' as *
 

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

@@ -0,0 +1,89 @@
+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, ("error" | "load" | "loadstart")[], "error" | "load" | "loadstart", 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?: ((...args: any[]) => any) | undefined;
+    onLoad?: ((...args: any[]) => any) | undefined;
+    onLoadstart?: ((...args: any[]) => 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,"sources":["../../../src/components/VImg/index.ts"],"names":["VImg"],"mappings":"SAASA,I","sourcesContent":["export { VImg } from './VImg'\n"],"file":"index.mjs"}
+{"version":3,"file":"index.mjs","names":["VImg"],"sources":["../../../src/components/VImg/index.ts"],"sourcesContent":["export { VImg } from './VImg'\n"],"mappings":"SAASA,I"}

package/lib/components/VInput/InputIcon.mjs

@@ -0,0 +1,33 @@
+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,K;SACAC,S;AAgBT,OAAO,SAASC,YAAT,CAAqEC,KAArE,EAAmG;EACxG,MAAM;IAAEC;EAAF,IAAQH,SAAS,EAAvB;;EAEA,SAASI,SAAT,OAA2D;IAAA,IAAvC;MAAEC;IAAF,CAAuC;IACzD,MAAMC,SAAS,GAAG;MAChBC,OAAO,EAAE,eADO;MAEhBC,YAAY,EAAE,eAFE;MAGhBC,MAAM,EAAE,cAHQ;MAIhBC,WAAW,EAAE,cAJG;MAKhBC,KAAK,EAAE;IALS,EAMhBN,IANgB,CAAlB;IAOA,MAAMO,QAAQ,GAAGV,KAAK,CAAE,WAAUG,IAAK,EAAjB,CAAtB;IACA,MAAMQ,KAAK,GAAGD,QAAQ,IAAIN,SAAZ,GACVH,CAAC,CAAE,kBAAiBG,SAAU,EAA7B,EAAgCJ,KAAK,CAACW,KAAN,IAAe,EAA/C,CADS,GAEVC,SAFJ;IAIA;MAAA,QAEWZ,KAAK,CAAE,GAAEG,IAAK,MAAT,CAFhB;MAAA,cAGiBQ,KAHjB;MAAA,WAIcD;IAJd;EAOD;;EAED,OAAO;IAAER;EAAF,CAAP;AACD"}

package/lib/components/VInput/VInput.css

@@ -1,6 +1,9 @@
 .v-input {
   display: grid;
   flex: 1 1 auto;
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.5;
 }
 .v-input--disabled {
   pointer-events: none;
@@ -34,7 +37,7 @@
 
 .v-input--horizontal {
   grid-template-areas: "prepend control append" "a messages b";
-  grid-template-columns: max-content auto max-content;
+  grid-template-columns: max-content minmax(0, 1fr) max-content;
   grid-template-rows: auto auto;
 }
 .v-input--horizontal .v-input__prepend {
@@ -52,7 +55,6 @@
   grid-area: messages;
   letter-spacing: 0.0333333333em;
   line-height: normal;
-  margin-bottom: 16px;
   min-height: 22px;
   padding-top: 6px;
   overflow: hidden;
@@ -106,5 +108,6 @@
 }
 
 .v-input__control {
+  display: flex;
   grid-area: control;
 }

package/lib/components/VInput/VInput.mjs

@@ -2,19 +2,20 @@ import { resolveDirective as _resolveDirective, createVNode as _createVNode } fr
 // Styles
 import "./VInput.css"; // Components
 
-import { VIcon } from "../VIcon/index.mjs";
 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: String,
-  prependIcon: String,
+  appendIcon: IconValue,
+  prependIcon: IconValue,
   hideDetails: [Boolean, String],
   messages: {
     type: [Array, String],
@@ -25,6 +26,8 @@ export const makeVInputProps = propsFactory({
     default: 'horizontal',
     validator: v => ['horizontal', 'vertical'].includes(v)
   },
+  'onClick:prepend': EventProp,
+  'onClick:append': EventProp,
   ...makeDensityProps(),
   ...makeValidationProps()
 });
@@ -33,19 +36,23 @@ export const VInput = genericComponent()({
   props: { ...makeVInputProps()
   },
   emits: {
-    'click:prepend': e => true,
-    'click:append': e => true,
     'update:modelValue': val => true
   },
 
   setup(props, _ref) {
     let {
+      attrs,
       slots,
       emit
     } = _ref;
     const {
       densityClasses
     } = useDensity(props);
+    const {
+      InputIcon
+    } = useInputIcon(props);
+    const uid = getUid();
+    const id = computed(() => props.id || `input-${uid}`);
     const {
       errorMessages,
       isDirty,
@@ -58,9 +65,7 @@ export const VInput = genericComponent()({
       resetValidation,
       validate,
       validationClasses
-    } = useValidation(props);
-    const uid = getUid();
-    const id = computed(() => props.id || `input-${uid}`);
+    } = useValidation(props, 'v-input', id);
     const slotProps = computed(() => ({
       id,
       isDirty,
@@ -79,22 +84,24 @@ export const VInput = genericComponent()({
       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);
-      const hasDetails = !props.hideDetails || props.hideDetails === 'auto' && hasMessages;
+      const hasDetails = !props.hideDetails || props.hideDetails === 'auto' && (hasMessages || !!slots.details);
       return _createVNode("div", {
         "class": ['v-input', `v-input--${props.direction}`, densityClasses.value, validationClasses.value]
       }, [hasPrepend && _createVNode("div", {
+        "key": "prepend",
         "class": "v-input__prepend"
-      }, [slots == null ? void 0 : (_slots$prepend = slots.prepend) == null ? void 0 : _slots$prepend.call(slots, slotProps.value), props.prependIcon && _createVNode(VIcon, {
-        "onClick": e => emit('click:prepend', e),
-        "icon": props.prependIcon
+      }, [(_slots$prepend = slots.prepend) == null ? void 0 : _slots$prepend.call(slots, slotProps.value), props.prependIcon && _createVNode(InputIcon, {
+        "key": "prepend-icon",
+        "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 == null ? void 0 : (_slots$append = slots.append) == null ? void 0 : _slots$append.call(slots, slotProps.value), props.appendIcon && _createVNode(VIcon, {
-        "onClick": e => emit('click:append', e),
-        "icon": props.appendIcon
-      }, null)]), hasDetails && _createVNode("div", {
+      }, [props.appendIcon && _createVNode(InputIcon, {
+        "key": "append-icon",
+        "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,
@@ -112,6 +119,7 @@ export const VInput = genericComponent()({
 
 });
 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