[Feature Request] VFileUpload Enhancement

[3dyuval]

Problem to solve

I pretty much love VFileUpload (introduced 3.7.6) and feel honored to suggest a couple of essential tweaks it so it can fit our requirements.

1. We want to hide the divider and icon.
2. We need clear distinction VFileUpload's slots and VFileUploadItem's slots.
3. We want all VField slots, such as #prepend, #append, #append-inner, etc.
4. Expose the browse method to be callable from outside the component's template scope.
5. Keep previously selected files when clicking browse

Proposed solution

1. Hide the default divider and icon using hide-divider and hide-icon
   Example:

<VFileUpload hide-divider hide-icon />

2. Clear distinction between VFileUpload slots and VFileUploadItem slots
   Example:

<v-file-upload>
  <template #prepend></template> 
  <!-- This is confusion, it's actually prepending to item -->

  <template #append-inner-item></template> 
  <!-- Looks more clear ^_^  -->
</v-file-upload>

3. All default slots that comes with VField
   Example:

<v-file-upload>
  <template #prepend-inner></template>
  <template #append-inner></template> 
  <template #clear></template> 
  <template #default></template> 
  <template #label></template> 
  <template #lodaer></template> 
</v-file-upload>

4. Expose the browse mechanism using a callback
   Example:

<script setup>
const fileUploadComponent = ref<InstanceType<typeof VFileUpload>>(null);
</script>
<template>
  <v-btn @click="fileUploadComponent?.browse()" />
  <v-file-upload ref="fileUploadComponent" />
</template>

5. I suggest keeping previously selected files when clicking browse the default behavior that could be disabled by a clear-on-browse prop
   Current behavior is clearing previously selected files when browse is clicked

Example

<script setup>
const files = ref([])
</script>

<template>
<v-file-upload
  clear-on-browse
/>
</template>