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

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

@@ -0,0 +1,332 @@
+import * as vue from 'vue';
+import { VNodeChild, PropType, JSXComponent, ComputedRef, Ref } from 'vue';
+
+declare type SlotsToProps<T extends Record<string, Slot>> = {
+    $children: () => (T['default'] | VNodeChild | {
+        [K in keyof T]?: T[K];
+    });
+    'v-slots': new () => {
+        [K in keyof T]?: T[K] | false;
+    };
+};
+declare type Slot<T extends any[] = any[]> = (...args: T) => VNodeChild;
+declare type MakeSlots<T extends Record<string, any[]>> = {
+    [K in keyof T]?: Slot<T[K]>;
+};
+
+declare type EventProp<T = (...args: any[]) => any> = T | T[];
+declare const EventProp: PropType<EventProp<(...args: any[]) => any>>;
+
+declare type IconValue = string | JSXComponent;
+declare const IconValue: PropType<IconValue>;
+
+interface LoaderSlotProps {
+    color: string | undefined;
+    isActive: boolean;
+}
+
+interface VInputSlot {
+    id: ComputedRef<string>;
+    isDirty: ComputedRef<boolean>;
+    isDisabled: ComputedRef<boolean>;
+    isReadonly: ComputedRef<boolean>;
+    isPristine: Ref<boolean>;
+    isValid: ComputedRef<boolean | null>;
+    isValidating: Ref<boolean>;
+    reset: () => void;
+    resetValidation: () => void;
+    validate: () => void;
+}
+
+interface DefaultInputSlot {
+    isActive: Ref<boolean>;
+    isFocused: Ref<boolean>;
+    controlRef: Ref<HTMLElement | undefined>;
+    focus: () => void;
+    blur: () => void;
+}
+interface VFieldSlot extends DefaultInputSlot {
+    props: Record<string, unknown>;
+}
+declare type VFieldSlots = MakeSlots<{
+    clear: [];
+    'prepend-inner': [DefaultInputSlot & VInputSlot];
+    'append-inner': [DefaultInputSlot & VInputSlot];
+    label: [DefaultInputSlot & VInputSlot];
+    loader: [LoaderSlotProps];
+    default: [VFieldSlot];
+}>;
+declare const VField: {
+    new (...args: any[]): {
+        $: vue.ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            reverse: boolean;
+            error: boolean;
+            active: boolean;
+            loading: boolean;
+            disabled: boolean;
+            variant: "filled" | "outlined" | "plain" | "underlined" | "solo";
+            clearIcon: IconValue;
+            focused: boolean;
+            clearable: boolean;
+            dirty: boolean;
+            persistentClear: boolean;
+            singleLine: boolean;
+        }> & Omit<Readonly<vue.ExtractPropTypes<Omit<{
+            loading: BooleanConstructor;
+            theme: StringConstructor;
+            appendInnerIcon: PropType<IconValue>;
+            bgColor: StringConstructor;
+            clearable: BooleanConstructor;
+            clearIcon: {
+                type: PropType<IconValue>;
+                default: string;
+            };
+            active: BooleanConstructor;
+            color: StringConstructor;
+            dirty: BooleanConstructor;
+            disabled: BooleanConstructor;
+            error: BooleanConstructor;
+            label: StringConstructor;
+            persistentClear: BooleanConstructor;
+            prependInnerIcon: PropType<IconValue>;
+            reverse: BooleanConstructor;
+            singleLine: BooleanConstructor;
+            variant: {
+                type: PropType<"filled" | "outlined" | "plain" | "underlined" | "solo">;
+                default: string;
+                validator: (v: any) => boolean;
+            };
+            'onClick:clear': PropType<EventProp<(...args: any[]) => any>>;
+            'onClick:appendInner': PropType<EventProp<(...args: any[]) => any>>;
+            'onClick:prependInner': PropType<EventProp<(...args: any[]) => any>>;
+            focused: BooleanConstructor;
+            id: StringConstructor;
+        }, "onUpdate:modelValue" | "modelValue"> & SlotsToProps<MakeSlots<{
+            clear: [];
+            'prepend-inner': [DefaultInputSlot & VInputSlot];
+            'append-inner': [DefaultInputSlot & VInputSlot];
+            label: [DefaultInputSlot & VInputSlot];
+            loader: [LoaderSlotProps];
+            default: [VFieldSlot];
+        }>>>> & {
+            "onUpdate:focused"?: ((focused: boolean) => any) | undefined;
+            "onClick:control"?: ((e: MouseEvent) => any) | undefined;
+        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "reverse" | "error" | "active" | "loading" | "disabled" | "variant" | "clearIcon" | "focused" | "clearable" | "dirty" | "persistentClear" | "singleLine">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: vue.Slot | undefined;
+        }>;
+        $root: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+        $parent: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+        $emit: ((event: "click:control", e: MouseEvent) => void) & ((event: "update:focused", focused: boolean) => void);
+        $el: any;
+        $options: vue.ComponentOptionsBase<Readonly<vue.ExtractPropTypes<Omit<{
+            loading: BooleanConstructor;
+            theme: StringConstructor;
+            appendInnerIcon: PropType<IconValue>;
+            bgColor: StringConstructor;
+            clearable: BooleanConstructor;
+            clearIcon: {
+                type: PropType<IconValue>;
+                default: string;
+            };
+            active: BooleanConstructor;
+            color: StringConstructor;
+            dirty: BooleanConstructor;
+            disabled: BooleanConstructor;
+            error: BooleanConstructor;
+            label: StringConstructor;
+            persistentClear: BooleanConstructor;
+            prependInnerIcon: PropType<IconValue>;
+            reverse: BooleanConstructor;
+            singleLine: BooleanConstructor;
+            variant: {
+                type: PropType<"filled" | "outlined" | "plain" | "underlined" | "solo">;
+                default: string;
+                validator: (v: any) => boolean;
+            };
+            'onClick:clear': PropType<EventProp<(...args: any[]) => any>>;
+            'onClick:appendInner': PropType<EventProp<(...args: any[]) => any>>;
+            'onClick:prependInner': PropType<EventProp<(...args: any[]) => any>>;
+            focused: BooleanConstructor;
+            id: StringConstructor;
+        }, "onUpdate:modelValue" | "modelValue"> & SlotsToProps<MakeSlots<{
+            clear: [];
+            'prepend-inner': [DefaultInputSlot & VInputSlot];
+            'append-inner': [DefaultInputSlot & VInputSlot];
+            label: [DefaultInputSlot & VInputSlot];
+            loader: [LoaderSlotProps];
+            default: [VFieldSlot];
+        }>>>> & {
+            "onUpdate:focused"?: ((focused: boolean) => any) | undefined;
+            "onClick:control"?: ((e: MouseEvent) => any) | undefined;
+        }, {
+            controlRef: Ref<HTMLElement | undefined>;
+        }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
+            'click:control': (e: MouseEvent) => boolean;
+            'update:focused': (focused: boolean) => boolean;
+            'update:modelValue': (val: any) => boolean;
+        }, "update:modelValue" | "modelValue">, string, {
+            reverse: boolean;
+            error: boolean;
+            active: boolean;
+            loading: boolean;
+            disabled: boolean;
+            variant: "filled" | "outlined" | "plain" | "underlined" | "solo";
+            clearIcon: IconValue;
+            focused: boolean;
+            clearable: boolean;
+            dirty: boolean;
+            persistentClear: boolean;
+            singleLine: boolean;
+        }> & {
+            beforeCreate?: ((() => void) | (() => void)[]) | undefined;
+            created?: ((() => void) | (() => void)[]) | undefined;
+            beforeMount?: ((() => void) | (() => void)[]) | undefined;
+            mounted?: ((() => void) | (() => void)[]) | undefined;
+            beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
+            updated?: ((() => void) | (() => void)[]) | undefined;
+            activated?: ((() => void) | (() => void)[]) | undefined;
+            deactivated?: ((() => void) | (() => void)[]) | undefined;
+            beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
+            beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
+            destroyed?: ((() => void) | (() => void)[]) | undefined;
+            unmounted?: ((() => void) | (() => void)[]) | undefined;
+            renderTracked?: (((e: vue.DebuggerEvent) => void) | ((e: vue.DebuggerEvent) => void)[]) | undefined;
+            renderTriggered?: (((e: vue.DebuggerEvent) => void) | ((e: vue.DebuggerEvent) => void)[]) | undefined;
+            errorCaptured?: (((err: unknown, instance: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void) | ((err: unknown, instance: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void)[]) | undefined;
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof vue.nextTick;
+        $watch(source: string | Function, cb: Function, options?: vue.WatchOptions<boolean> | undefined): vue.WatchStopHandle;
+    } & Readonly<vue.ExtractPropTypes<Omit<{
+        loading: BooleanConstructor;
+        theme: StringConstructor;
+        appendInnerIcon: PropType<IconValue>;
+        bgColor: StringConstructor;
+        clearable: BooleanConstructor;
+        clearIcon: {
+            type: PropType<IconValue>;
+            default: string;
+        };
+        active: BooleanConstructor;
+        color: StringConstructor;
+        dirty: BooleanConstructor;
+        disabled: BooleanConstructor;
+        error: BooleanConstructor;
+        label: StringConstructor;
+        persistentClear: BooleanConstructor;
+        prependInnerIcon: PropType<IconValue>;
+        reverse: BooleanConstructor;
+        singleLine: BooleanConstructor;
+        variant: {
+            type: PropType<"filled" | "outlined" | "plain" | "underlined" | "solo">;
+            default: string;
+            validator: (v: any) => boolean;
+        };
+        'onClick:clear': PropType<EventProp<(...args: any[]) => any>>;
+        'onClick:appendInner': PropType<EventProp<(...args: any[]) => any>>;
+        'onClick:prependInner': PropType<EventProp<(...args: any[]) => any>>;
+        focused: BooleanConstructor;
+        id: StringConstructor;
+    }, "onUpdate:modelValue" | "modelValue"> & SlotsToProps<MakeSlots<{
+        clear: [];
+        'prepend-inner': [DefaultInputSlot & VInputSlot];
+        'append-inner': [DefaultInputSlot & VInputSlot];
+        label: [DefaultInputSlot & VInputSlot];
+        loader: [LoaderSlotProps];
+        default: [VFieldSlot];
+    }>>>> & {
+        "onUpdate:focused"?: ((focused: boolean) => any) | undefined;
+        "onClick:control"?: ((e: MouseEvent) => any) | undefined;
+    } & vue.ShallowUnwrapRef<{
+        controlRef: Ref<HTMLElement | undefined>;
+    }> & {} & vue.ComponentCustomProperties;
+    __isFragment?: undefined;
+    __isTeleport?: undefined;
+    __isSuspense?: undefined;
+} & vue.ComponentOptionsBase<Readonly<vue.ExtractPropTypes<Omit<{
+    loading: BooleanConstructor;
+    theme: StringConstructor;
+    appendInnerIcon: PropType<IconValue>;
+    bgColor: StringConstructor;
+    clearable: BooleanConstructor;
+    clearIcon: {
+        type: PropType<IconValue>;
+        default: string;
+    };
+    active: BooleanConstructor;
+    color: StringConstructor;
+    dirty: BooleanConstructor;
+    disabled: BooleanConstructor;
+    error: BooleanConstructor;
+    label: StringConstructor;
+    persistentClear: BooleanConstructor;
+    prependInnerIcon: PropType<IconValue>;
+    reverse: BooleanConstructor;
+    singleLine: BooleanConstructor;
+    variant: {
+        type: PropType<"filled" | "outlined" | "plain" | "underlined" | "solo">;
+        default: string;
+        validator: (v: any) => boolean;
+    };
+    'onClick:clear': PropType<EventProp<(...args: any[]) => any>>;
+    'onClick:appendInner': PropType<EventProp<(...args: any[]) => any>>;
+    'onClick:prependInner': PropType<EventProp<(...args: any[]) => any>>;
+    focused: BooleanConstructor;
+    id: StringConstructor;
+}, "onUpdate:modelValue" | "modelValue"> & SlotsToProps<MakeSlots<{
+    clear: [];
+    'prepend-inner': [DefaultInputSlot & VInputSlot];
+    'append-inner': [DefaultInputSlot & VInputSlot];
+    label: [DefaultInputSlot & VInputSlot];
+    loader: [LoaderSlotProps];
+    default: [VFieldSlot];
+}>>>> & {
+    "onUpdate:focused"?: ((focused: boolean) => any) | undefined;
+    "onClick:control"?: ((e: MouseEvent) => any) | undefined;
+}, {
+    controlRef: Ref<HTMLElement | undefined>;
+}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
+    'click:control': (e: MouseEvent) => boolean;
+    'update:focused': (focused: boolean) => boolean;
+    'update:modelValue': (val: any) => boolean;
+}, "update:modelValue" | "modelValue">, string, {
+    reverse: boolean;
+    error: boolean;
+    active: boolean;
+    loading: boolean;
+    disabled: boolean;
+    variant: "filled" | "outlined" | "plain" | "underlined" | "solo";
+    clearIcon: IconValue;
+    focused: boolean;
+    clearable: boolean;
+    dirty: boolean;
+    persistentClear: boolean;
+    singleLine: boolean;
+}> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T>() => {
+    $props: {
+        modelValue?: T | undefined;
+        'onUpdate:modelValue'?: ((val: T) => any) | undefined;
+    };
+    $slots: VFieldSlots;
+});
+declare type VField = InstanceType<typeof VField>;
+
+declare const VFieldLabel: vue.DefineComponent<{
+    floating: BooleanConstructor;
+}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    floating: BooleanConstructor;
+}>>, {
+    floating: boolean;
+}>;
+declare type VFieldLabel = InstanceType<typeof VFieldLabel>;
+
+export { VField, VFieldLabel };

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VField/index.ts"],"names":["VField","VFieldLabel"],"mappings":"SAASA,M;SACAC,W","sourcesContent":["export { VField } from './VField'\nexport { VFieldLabel } from './VFieldLabel'\n"],"file":"index.mjs"}
+{"version":3,"file":"index.mjs","names":["VField","VFieldLabel"],"sources":["../../../src/components/VField/index.ts"],"sourcesContent":["export { VField } from './VField'\nexport { VFieldLabel } from './VFieldLabel'\n"],"mappings":"SAASA,M;SACAC,W"}

package/lib/components/VFileInput/VFileInput.css

@@ -1,8 +1,8 @@
 .v-file-input input[type=file] {
+  height: 100%;
   left: 0;
-  max-width: 0;
   opacity: 0;
-  pointer-events: none;
   position: absolute;
-  width: 0;
+  top: 0;
+  width: 100%;
 }

package/lib/components/VFileInput/VFileInput.mjs

@@ -3,18 +3,18 @@ import { resolveDirective as _resolveDirective, createVNode as _createVNode, mer
 import "./VFileInput.css"; // Components
 
 import { filterFieldProps, makeVFieldProps } from "../VField/VField.mjs";
+import { filterInputProps, makeVInputProps, VInput } from "../VInput/VInput.mjs";
 import { VChip } from "../VChip/index.mjs";
 import { VCounter } from "../VCounter/index.mjs";
 import { VField } from "../VField/index.mjs"; // Composables
 
-import { useForwardRef } from "../../composables/forwardRef.mjs";
+import { forwardRefs } from "../../composables/forwardRefs.mjs";
 import { useLocale } from "../../composables/locale.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
 
 import { computed, nextTick, ref } from 'vue';
-import { defineComponent, filterInputAttrs, humanReadableFileSize, useRender, wrapInArray } from "../../util/index.mjs"; // Types
+import { callEvent, defineComponent, filterInputAttrs, humanReadableFileSize, useRender, wrapInArray } from "../../util/index.mjs"; // Types
 
-import { filterInputProps, makeVInputProps, VInput } from "../VInput/VInput.mjs";
 export const VFileInput = defineComponent({
   name: 'VFileInput',
   inheritAttrs: false,
@@ -40,11 +40,9 @@ export const VFileInput = defineComponent({
         return typeof v === 'boolean' || [1000, 1024].includes(v);
       }
     },
-    ...makeVInputProps(),
-    prependIcon: {
-      type: String,
-      default: '$file'
-    },
+    ...makeVInputProps({
+      prependIcon: '$file'
+    }),
     modelValue: {
       type: Array,
       default: () => [],
@@ -57,7 +55,6 @@ export const VFileInput = defineComponent({
     })
   },
   emits: {
-    'click:clear': e => true,
     'click:control': e => true,
     'update:modelValue': files => true
   },
@@ -73,32 +70,24 @@ export const VFileInput = defineComponent({
     } = useLocale();
     const model = useProxiedModel(props, 'modelValue');
     const base = computed(() => typeof props.showSize !== 'boolean' ? props.showSize : undefined);
-    const totalBytes = computed(() => {
-      var _model$value;
-
-      return ((_model$value = model.value) != null ? _model$value : []).reduce((bytes, _ref2) => {
-        let {
-          size = 0
-        } = _ref2;
-        return bytes + size;
-      }, 0);
-    });
+    const totalBytes = computed(() => (model.value ?? []).reduce((bytes, _ref2) => {
+      let {
+        size = 0
+      } = _ref2;
+      return bytes + size;
+    }, 0));
     const totalBytesReadable = computed(() => humanReadableFileSize(totalBytes.value, base.value));
-    const fileNames = computed(() => {
-      var _model$value2;
-
-      return ((_model$value2 = model.value) != null ? _model$value2 : []).map(file => {
-        const {
-          name = '',
-          size = 0
-        } = file;
-        return !props.showSize ? name : `${name} (${humanReadableFileSize(size, base.value)})`;
-      });
-    });
+    const fileNames = computed(() => (model.value ?? []).map(file => {
+      const {
+        name = '',
+        size = 0
+      } = file;
+      return !props.showSize ? name : `${name} (${humanReadableFileSize(size, base.value)})`;
+    }));
     const counterValue = computed(() => {
-      var _model$value$length, _model$value3;
+      var _model$value;
 
-      const fileCount = (_model$value$length = (_model$value3 = model.value) == null ? void 0 : _model$value3.length) != null ? _model$value$length : 0;
+      const fileCount = ((_model$value = model.value) == null ? void 0 : _model$value.length) ?? 0;
       if (props.showSize) return t(props.counterSizeString, fileCount, totalBytesReadable.value);else return t(props.counterString, fileCount);
     });
     const vInputRef = ref();
@@ -121,6 +110,11 @@ export const VFileInput = defineComponent({
       }
     }
 
+    function onClickPrepend(e) {
+      callEvent(props['onClick:prepend'], e);
+      onControlClick(e);
+    }
+
     function onControlClick(e) {
       var _inputRef$value2;
 
@@ -138,12 +132,13 @@ export const VFileInput = defineComponent({
           inputRef.value.value = '';
         }
 
-        emit('click:clear', e);
+        callEvent(props['onClick:clear'], e);
       });
     }
 
     useRender(() => {
-      const hasCounter = !!(slots.counter || props.counter || counterValue.value);
+      const hasCounter = !!(slots.counter || props.counter);
+      const hasDetails = !!(hasCounter || slots.details);
       const [rootAttrs, inputAttrs] = filterInputAttrs(attrs);
       const [{
         modelValue: _,
@@ -154,9 +149,10 @@ export const VFileInput = defineComponent({
         "ref": vInputRef,
         "modelValue": model.value,
         "onUpdate:modelValue": $event => model.value = $event,
-        "class": "v-file-input"
+        "class": "v-file-input",
+        "onClick:prepend": onClickPrepend,
+        "onClick:append": props['onClick:append']
       }, rootAttrs, inputProps, {
-        "onClick:prepend": onControlClick,
         "messages": messages.value
       }), { ...slots,
         default: _ref3 => {
@@ -170,7 +166,9 @@ export const VFileInput = defineComponent({
             "ref": vFieldRef,
             "prepend-icon": props.prependIcon,
             "onClick:control": onControlClick,
-            "onClick:clear": onClear
+            "onClick:clear": onClear,
+            "onClick:prependInner": props['onClick:prependInner'],
+            "onClick:appendInner": props['onClick:appendInner']
           }, fieldProps, {
             "active": isDirty.value || isFocused.value,
             "dirty": isDirty.value,
@@ -196,17 +194,15 @@ export const VFileInput = defineComponent({
                   onFocus();
                 },
                 "onChange": e => {
-                  var _target$files;
-
                   if (!e.target) return;
                   const target = e.target;
-                  model.value = [...((_target$files = target.files) != null ? _target$files : [])];
+                  model.value = [...(target.files ?? [])];
                 },
                 "onFocus": onFocus,
                 "onBlur": () => isFocused.value = false
-              }, slotProps, inputAttrs), null), model.value.length > 0 && _createVNode("div", {
+              }, slotProps, inputAttrs), null), _createVNode("div", {
                 "class": fieldClass
-              }, [slots.selection ? slots.selection({
+              }, [model.value.length > 0 && (slots.selection ? slots.selection({
                 fileNames: fileNames.value,
                 totalBytes: totalBytes.value,
                 totalBytesReadable: totalBytesReadable.value
@@ -216,16 +212,21 @@ export const VFileInput = defineComponent({
                 "color": props.color
               }, {
                 default: () => [text]
-              })) : fileNames.value.join(', ')])]);
+              })) : fileNames.value.join(', '))])]);
             }
           });
         },
-        details: hasCounter ? () => _createVNode(_Fragment, null, [_createVNode("span", null, null), _createVNode(VCounter, {
-          "value": counterValue.value
-        }, slots.counter)]) : undefined
+        details: hasDetails ? slotProps => {
+          var _slots$details;
+
+          return _createVNode(_Fragment, null, [(_slots$details = slots.details) == null ? void 0 : _slots$details.call(slots, slotProps), hasCounter && _createVNode(_Fragment, null, [_createVNode("span", null, null), _createVNode(VCounter, {
+            "active": !!model.value.length,
+            "value": counterValue.value
+          }, slots.counter)])]);
+        } : undefined
       });
     });
-    return useForwardRef({}, vInputRef, vFieldRef, inputRef);
+    return forwardRefs({}, vInputRef, vFieldRef, inputRef);
   }
 
 });

package/lib/components/VFileInput/VFileInput.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VFileInput/VFileInput.tsx"],"names":["filterFieldProps","makeVFieldProps","VChip","VCounter","VField","useForwardRef","useLocale","useProxiedModel","computed","nextTick","ref","defineComponent","filterInputAttrs","humanReadableFileSize","useRender","wrapInArray","filterInputProps","makeVInputProps","VInput","VFileInput","name","inheritAttrs","props","chips","Boolean","counter","counterSizeString","type","String","default","counterString","multiple","hint","persistentHint","placeholder","showSize","Number","validator","v","includes","prependIcon","modelValue","Array","val","every","clearable","emits","e","files","setup","attrs","emit","slots","t","model","base","undefined","totalBytes","value","reduce","bytes","size","totalBytesReadable","fileNames","map","file","counterValue","fileCount","length","vInputRef","vFieldRef","isFocused","inputRef","messages","onFocus","document","activeElement","focus","onControlClick","click","onClear","stopPropagation","hasCounter","rootAttrs","inputAttrs","_","inputProps","fieldProps","isDisabled","isDirty","isReadonly","isValid","class","fieldClass","slotProps","target","selection","text","color","join","details"],"mappings":"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","sourcesContent":["// Styles\nimport './VFileInput.sass'\n\n// Components\nimport { filterFieldProps, makeVFieldProps } from '@/components/VField/VField'\nimport { VChip } from '@/components/VChip'\nimport { VCounter } from '@/components/VCounter'\nimport { VField } from '@/components/VField'\n\n// Composables\nimport { useForwardRef } from '@/composables/forwardRef'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, nextTick, ref } from 'vue'\nimport { defineComponent, filterInputAttrs, humanReadableFileSize, useRender, wrapInArray } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport { filterInputProps, makeVInputProps, VInput } from '@/components/VInput/VInput'\n\nexport const VFileInput = defineComponent({\n  name: 'VFileInput',\n\n  inheritAttrs: false,\n\n  props: {\n    chips: Boolean,\n    counter: Boolean,\n    counterSizeString: {\n      type: String,\n      default: '$vuetify.fileInput.counterSize',\n    },\n    counterString: {\n      type: String,\n      default: '$vuetify.fileInput.counter',\n    },\n    multiple: Boolean,\n    hint: String,\n    persistentHint: Boolean,\n    placeholder: String,\n    showSize: {\n      type: [Boolean, Number] as PropType<boolean | 1000 | 1024>,\n      default: false,\n      validator: (v: boolean | number) => {\n        return (\n          typeof v === 'boolean' ||\n          [1000, 1024].includes(v)\n        )\n      },\n    },\n\n    ...makeVInputProps(),\n\n    prependIcon: {\n      type: String,\n      default: '$file',\n    },\n    modelValue: {\n      type: Array as PropType<File[]>,\n      default: () => ([]),\n      validator: (val: any) => {\n        return wrapInArray(val).every(v => v != null && typeof v === 'object')\n      },\n    },\n\n    ...makeVFieldProps({ clearable: true }),\n  },\n\n  emits: {\n    'click:clear': (e: MouseEvent) => true,\n    'click:control': (e: MouseEvent) => true,\n    'update:modelValue': (files: File[]) => true,\n  },\n\n  setup (props, { attrs, emit, slots }) {\n    const { t } = useLocale()\n    const model = useProxiedModel(props, 'modelValue')\n    const base = computed(() => typeof props.showSize !== 'boolean' ? props.showSize : undefined)\n    const totalBytes = computed(() => (model.value ?? []).reduce((bytes, { size = 0 }) => bytes + size, 0))\n    const totalBytesReadable = computed(() => humanReadableFileSize(totalBytes.value, base.value))\n\n    const fileNames = computed(() => (model.value ?? []).map(file => {\n      const { name = '', size = 0 } = file\n\n      return !props.showSize\n        ? name\n        : `${name} (${humanReadableFileSize(size, base.value)})`\n    }))\n\n    const counterValue = computed(() => {\n      const fileCount = model.value?.length ?? 0\n      if (props.showSize) return t(props.counterSizeString, fileCount, totalBytesReadable.value)\n      else return t(props.counterString, fileCount)\n    })\n    const vInputRef = ref<VInput>()\n    const vFieldRef = ref<VInput>()\n    const isFocused = ref(false)\n    const inputRef = ref<HTMLInputElement>()\n    const messages = computed(() => {\n      return props.messages.length\n        ? props.messages\n        : (props.persistentHint) ? props.hint : ''\n    })\n    function onFocus () {\n      if (inputRef.value !== document.activeElement) {\n        inputRef.value?.focus()\n      }\n\n      if (!isFocused.value) {\n        isFocused.value = true\n      }\n    }\n    function onControlClick (e: MouseEvent) {\n      inputRef.value?.click()\n\n      emit('click:control', e)\n    }\n    function onClear (e: MouseEvent) {\n      e.stopPropagation()\n\n      onFocus()\n\n      nextTick(() => {\n        model.value = []\n\n        if (inputRef?.value) {\n          inputRef.value.value = ''\n        }\n\n        emit('click:clear', e)\n      })\n    }\n\n    useRender(() => {\n      const hasCounter = !!(slots.counter || props.counter || counterValue.value)\n      const [rootAttrs, inputAttrs] = filterInputAttrs(attrs)\n      const [{ modelValue: _, ...inputProps }] = filterInputProps(props)\n      const [fieldProps] = filterFieldProps(props)\n\n      return (\n        <VInput\n          ref={ vInputRef }\n          v-model={ model.value }\n          class=\"v-file-input\"\n          { ...rootAttrs }\n          { ...inputProps }\n          onClick:prepend={ onControlClick }\n          messages={ messages.value }\n        >\n          {{\n            ...slots,\n            default: ({\n              isDisabled,\n              isDirty,\n              isReadonly,\n              isValid,\n            }) => (\n              <VField\n                ref={ vFieldRef }\n                prepend-icon={ props.prependIcon }\n                onClick:control={ onControlClick }\n                onClick:clear={ onClear }\n                { ...fieldProps }\n                active={ isDirty.value || isFocused.value }\n                dirty={ isDirty.value }\n                focused={ isFocused.value }\n                error={ isValid.value === false }\n              >\n                {{\n                  ...slots,\n                  default: ({\n                    props: { class: fieldClass, ...slotProps },\n                  }) => (\n                    <>\n                      <input\n                        ref={ inputRef }\n                        type=\"file\"\n                        readonly={ isReadonly.value }\n                        disabled={ isDisabled.value }\n                        multiple={ props.multiple }\n                        name={ props.name }\n                        onClick={ e => {\n                          e.stopPropagation()\n\n                          onFocus()\n                        } }\n                        onChange={ e => {\n                          if (!e.target) return\n\n                          const target = e.target as HTMLInputElement\n                          model.value = [...target.files ?? []]\n                        } }\n                        onFocus={ onFocus }\n                        onBlur={ () => (isFocused.value = false) }\n                        { ...slotProps }\n                        { ...inputAttrs }\n                      />\n\n                      { model.value.length > 0 && (\n                        <div class={ fieldClass }>\n                          { slots.selection ? slots.selection({\n                            fileNames: fileNames.value,\n                            totalBytes: totalBytes.value,\n                            totalBytesReadable: totalBytesReadable.value,\n                          })\n                          : props.chips ? fileNames.value.map(text => (\n                            <VChip\n                              key={ text }\n                              size=\"small\"\n                              color={ props.color }\n                            >{ text }</VChip>\n                          ))\n                          : fileNames.value.join(', ') }\n                        </div>\n                      ) }\n                    </>\n                  ),\n                }}\n              </VField>\n            ),\n            details: hasCounter ? () => (\n              <>\n                <span />\n\n                <VCounter\n                  value={ counterValue.value }\n                  v-slots={ slots.counter }\n                />\n              </>\n            ) : undefined,\n          }}\n        </VInput>\n      )\n    })\n\n    return useForwardRef({}, vInputRef, vFieldRef, inputRef)\n  },\n})\n\nexport type VFileInput = InstanceType<typeof VFileInput>\n"],"file":"VFileInput.mjs"}
+{"version":3,"file":"VFileInput.mjs","names":["filterFieldProps","makeVFieldProps","filterInputProps","makeVInputProps","VInput","VChip","VCounter","VField","forwardRefs","useLocale","useProxiedModel","computed","nextTick","ref","callEvent","defineComponent","filterInputAttrs","humanReadableFileSize","useRender","wrapInArray","VFileInput","name","inheritAttrs","props","chips","Boolean","counter","counterSizeString","type","String","default","counterString","multiple","hint","persistentHint","placeholder","showSize","Number","validator","v","includes","prependIcon","modelValue","Array","val","every","clearable","emits","e","files","setup","attrs","emit","slots","t","model","base","undefined","totalBytes","value","reduce","bytes","size","totalBytesReadable","fileNames","map","file","counterValue","fileCount","length","vInputRef","vFieldRef","isFocused","inputRef","messages","onFocus","document","activeElement","focus","onClickPrepend","onControlClick","click","onClear","stopPropagation","hasCounter","hasDetails","details","rootAttrs","inputAttrs","_","inputProps","fieldProps","isDisabled","isDirty","isReadonly","isValid","class","fieldClass","slotProps","target","selection","text","color","join"],"sources":["../../../src/components/VFileInput/VFileInput.tsx"],"sourcesContent":["// Styles\nimport './VFileInput.sass'\n\n// Components\nimport { filterFieldProps, makeVFieldProps } from '@/components/VField/VField'\nimport { filterInputProps, makeVInputProps, VInput } from '@/components/VInput/VInput'\nimport { VChip } from '@/components/VChip'\nimport { VCounter } from '@/components/VCounter'\nimport { VField } from '@/components/VField'\n\n// Composables\nimport { forwardRefs } from '@/composables/forwardRefs'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, nextTick, ref } from 'vue'\nimport { callEvent, defineComponent, filterInputAttrs, humanReadableFileSize, useRender, wrapInArray } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport const VFileInput = defineComponent({\n  name: 'VFileInput',\n\n  inheritAttrs: false,\n\n  props: {\n    chips: Boolean,\n    counter: Boolean,\n    counterSizeString: {\n      type: String,\n      default: '$vuetify.fileInput.counterSize',\n    },\n    counterString: {\n      type: String,\n      default: '$vuetify.fileInput.counter',\n    },\n    multiple: Boolean,\n    hint: String,\n    persistentHint: Boolean,\n    placeholder: String,\n    showSize: {\n      type: [Boolean, Number] as PropType<boolean | 1000 | 1024>,\n      default: false,\n      validator: (v: boolean | number) => {\n        return (\n          typeof v === 'boolean' ||\n          [1000, 1024].includes(v)\n        )\n      },\n    },\n\n    ...makeVInputProps({ prependIcon: '$file' }),\n\n    modelValue: {\n      type: Array as PropType<File[]>,\n      default: () => ([]),\n      validator: (val: any) => {\n        return wrapInArray(val).every(v => v != null && typeof v === 'object')\n      },\n    },\n\n    ...makeVFieldProps({ clearable: true }),\n  },\n\n  emits: {\n    'click:control': (e: MouseEvent) => true,\n    'update:modelValue': (files: File[]) => true,\n  },\n\n  setup (props, { attrs, emit, slots }) {\n    const { t } = useLocale()\n    const model = useProxiedModel(props, 'modelValue')\n    const base = computed(() => typeof props.showSize !== 'boolean' ? props.showSize : undefined)\n    const totalBytes = computed(() => (model.value ?? []).reduce((bytes, { size = 0 }) => bytes + size, 0))\n    const totalBytesReadable = computed(() => humanReadableFileSize(totalBytes.value, base.value))\n\n    const fileNames = computed(() => (model.value ?? []).map(file => {\n      const { name = '', size = 0 } = file\n\n      return !props.showSize\n        ? name\n        : `${name} (${humanReadableFileSize(size, base.value)})`\n    }))\n\n    const counterValue = computed(() => {\n      const fileCount = model.value?.length ?? 0\n      if (props.showSize) return t(props.counterSizeString, fileCount, totalBytesReadable.value)\n      else return t(props.counterString, fileCount)\n    })\n    const vInputRef = ref<VInput>()\n    const vFieldRef = ref<VInput>()\n    const isFocused = ref(false)\n    const inputRef = ref<HTMLInputElement>()\n    const messages = computed(() => {\n      return props.messages.length\n        ? props.messages\n        : (props.persistentHint) ? props.hint : ''\n    })\n    function onFocus () {\n      if (inputRef.value !== document.activeElement) {\n        inputRef.value?.focus()\n      }\n\n      if (!isFocused.value) {\n        isFocused.value = true\n      }\n    }\n    function onClickPrepend (e: MouseEvent) {\n      callEvent(props['onClick:prepend'], e)\n      onControlClick(e)\n    }\n    function onControlClick (e: MouseEvent) {\n      inputRef.value?.click()\n\n      emit('click:control', e)\n    }\n    function onClear (e: MouseEvent) {\n      e.stopPropagation()\n\n      onFocus()\n\n      nextTick(() => {\n        model.value = []\n\n        if (inputRef?.value) {\n          inputRef.value.value = ''\n        }\n\n        callEvent(props['onClick:clear'], e)\n      })\n    }\n\n    useRender(() => {\n      const hasCounter = !!(slots.counter || props.counter)\n      const hasDetails = !!(hasCounter || slots.details)\n      const [rootAttrs, inputAttrs] = filterInputAttrs(attrs)\n      const [{ modelValue: _, ...inputProps }] = filterInputProps(props)\n      const [fieldProps] = filterFieldProps(props)\n\n      return (\n        <VInput\n          ref={ vInputRef }\n          v-model={ model.value }\n          class=\"v-file-input\"\n          onClick:prepend={ onClickPrepend }\n          onClick:append={ props['onClick:append'] }\n          { ...rootAttrs }\n          { ...inputProps }\n          messages={ messages.value }\n        >\n          {{\n            ...slots,\n            default: ({\n              isDisabled,\n              isDirty,\n              isReadonly,\n              isValid,\n            }) => (\n              <VField\n                ref={ vFieldRef }\n                prepend-icon={ props.prependIcon }\n                onClick:control={ onControlClick }\n                onClick:clear={ onClear }\n                onClick:prependInner={ props['onClick:prependInner'] }\n                onClick:appendInner={ props['onClick:appendInner'] }\n                { ...fieldProps }\n                active={ isDirty.value || isFocused.value }\n                dirty={ isDirty.value }\n                focused={ isFocused.value }\n                error={ isValid.value === false }\n              >\n                {{\n                  ...slots,\n                  default: ({\n                    props: { class: fieldClass, ...slotProps },\n                  }) => (\n                    <>\n                      <input\n                        ref={ inputRef }\n                        type=\"file\"\n                        readonly={ isReadonly.value }\n                        disabled={ isDisabled.value }\n                        multiple={ props.multiple }\n                        name={ props.name }\n                        onClick={ e => {\n                          e.stopPropagation()\n\n                          onFocus()\n                        } }\n                        onChange={ e => {\n                          if (!e.target) return\n\n                          const target = e.target as HTMLInputElement\n                          model.value = [...target.files ?? []]\n                        } }\n                        onFocus={ onFocus }\n                        onBlur={ () => (isFocused.value = false) }\n                        { ...slotProps }\n                        { ...inputAttrs }\n                      />\n\n                      <div class={ fieldClass }>\n                        { model.value.length > 0 && (\n                          slots.selection ? slots.selection({\n                            fileNames: fileNames.value,\n                            totalBytes: totalBytes.value,\n                            totalBytesReadable: totalBytesReadable.value,\n                          })\n                          : props.chips ? fileNames.value.map(text => (\n                            <VChip\n                              key={ text }\n                              size=\"small\"\n                              color={ props.color }\n                            >{ text }</VChip>\n                          ))\n                          : fileNames.value.join(', ')\n                        )}\n                      </div>\n                    </>\n                  ),\n                }}\n              </VField>\n            ),\n            details: hasDetails ? slotProps => (\n              <>\n                { slots.details?.(slotProps) }\n\n                { hasCounter && (\n                  <>\n                    <span />\n\n                    <VCounter\n                      active={ !!model.value.length }\n                      value={ counterValue.value }\n                      v-slots={ slots.counter }\n                    />\n                  </>\n                ) }\n              </>\n            ) : undefined,\n          }}\n        </VInput>\n      )\n    })\n\n    return forwardRefs({}, vInputRef, vFieldRef, inputRef)\n  },\n})\n\nexport type VFileInput = InstanceType<typeof VFileInput>\n"],"mappings":"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"}

package/lib/components/VFileInput/VFileInput.sass

@@ -1,12 +1,11 @@
-@forward './variables'
 @use './variables' as *
 
 // Block
 .v-file-input
   input[type="file"]
+    height: 100%
     left: 0
-    max-width: 0
     opacity: 0
-    pointer-events: none
     position: absolute
-    width: 0
+    top: 0
+    width: 100%