fix(VFileInput): add hideInput prop

[Reidemption]

My attempt at adding the hideInput prop back in for Vuetify 3. Please let me know if it requires more changes. :^)

Description

I added a hideInput prop and toggled the styling to display: 'none' if the prop is set to true. I'm sure there are better ways to do this, but this seemed the simplest. I made this change because it was previously an option in v2, but it currently is not in v3.

resolves #17142

Markup:

<template>
  <div class="hello">
    <v-form style="width: 50%; margin: 0 auto">
      <v-file-input
        class="fileInput"
        label="Select a image"
        accept="image/*"
        :hide-input="true"
        :clearable="false"
        :counter="false"
      />
    </v-form>
  </div>
</template>

<script>
  export default {
    name: 'HelloWorld',
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
  .hello {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
  }
  .fileInput {
    width: 100%;
  }
</style>

[landynfrancis]

Does anyone have an idea when this PR will be merged in? I need the Hide Input prop for my VFileInput.

[johnleider]

Instead of manually applying a style, use a class and then "display: none" in VFileInput.sass.

[landynfrancis]

Hey all, any idea when this will get merged in? Been looking forward to this change for a little bit now.

[johnleider]

Hey all, any idea when this will get merged in? Been looking forward to this change for a little bit now.

I left feedback for the author.

[landynfrancis]

@Reidemption