@dimailn/vuetify 2.7.2-alpha29 → 2.7.2-alpha31

package/src/components/VFileInput/__tests__/__snapshots__/VFileInput.spec.ts.snap

@@ -4,31 +4,35 @@ exports[`VFileInput.ts should be unclearable 1`] = `
 <div class="v-input theme--light v-text-field v-file-input">
   <div class="v-input__prepend-outer">
     <div class="v-input__icon v-input__icon--prepend">
-      <button type="button"
-              aria-label=" prepended action"
-              class="v-icon notranslate v-icon--link material-icons theme--light"
+      <button aria-hidden="false"
+              class="v-icon--link v-icon notranslate mdi mdi-paperclip theme--light"
+              type="button"
+              aria-label="File input prepended action"
       >
-        $file
       </button>
     </div>
   </div>
   <div class="v-input__control">
     <div class="v-input__slot">
       <div class="v-text-field__slot">
+        <label class="v-label theme--light"
+               for="input-44"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
         <div class="v-file-input__text">
         </div>
-        <input id="input-29"
+        <input id="input-44"
                type="file"
         >
       </div>
     </div>
     <div class="v-text-field__details">
       <div class="v-messages theme--light">
-        <span name="message-transition"
-              tag="div"
-              class="v-messages__wrapper"
-        >
-        </span>
+        <div class="v-messages__wrapper">
+        </div>
       </div>
     </div>
   </div>
@@ -39,43 +43,47 @@ exports[`VFileInput.ts should display file size 1`] = `
 <div class="v-input v-input--is-label-active v-input--is-dirty theme--light v-text-field v-file-input">
   <div class="v-input__prepend-outer">
     <div class="v-input__icon v-input__icon--prepend">
-      <button type="button"
-              aria-label=" prepended action"
-              class="v-icon notranslate v-icon--link material-icons theme--light"
+      <button aria-hidden="false"
+              class="v-icon--link v-icon notranslate mdi mdi-paperclip theme--light"
+              type="button"
+              aria-label="File input prepended action"
       >
-        $file
       </button>
     </div>
   </div>
   <div class="v-input__control">
     <div class="v-input__slot">
       <div class="v-text-field__slot">
+        <label class="v-label v-label--active theme--light"
+               for="input-25"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
         <div class="v-file-input__text">
           test (2.1 MB)
         </div>
-        <input id="input-17"
+        <input id="input-25"
                type="file"
         >
       </div>
       <div class="v-input__append-inner">
         <div class="v-input__icon v-input__icon--clear">
-          <button type="button"
-                  aria-label="Clear "
+          <button aria-hidden="false"
+                  class="v-icon--link v-icon notranslate mdi mdi-close theme--light"
+                  type="button"
+                  aria-label="Clear File input"
                   tabindex="-1"
-                  class="v-icon notranslate v-icon--link material-icons theme--light"
           >
-            $clear
           </button>
         </div>
       </div>
     </div>
     <div class="v-text-field__details">
       <div class="v-messages theme--light">
-        <span name="message-transition"
-              tag="div"
-              class="v-messages__wrapper"
-        >
-        </span>
+        <div class="v-messages__wrapper">
+        </div>
       </div>
     </div>
   </div>
@@ -86,43 +94,47 @@ exports[`VFileInput.ts should display file size 2`] = `
 <div class="v-input v-input--is-label-active v-input--is-dirty theme--light v-text-field v-file-input">
   <div class="v-input__prepend-outer">
     <div class="v-input__icon v-input__icon--prepend">
-      <button type="button"
-              aria-label=" prepended action"
-              class="v-icon notranslate v-icon--link material-icons theme--light"
+      <button aria-hidden="false"
+              class="v-icon--link v-icon notranslate mdi mdi-paperclip theme--light"
+              type="button"
+              aria-label="File input prepended action"
       >
-        $file
       </button>
     </div>
   </div>
   <div class="v-input__control">
     <div class="v-input__slot">
       <div class="v-text-field__slot">
+        <label class="v-label v-label--active theme--light"
+               for="input-25"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
         <div class="v-file-input__text">
           test (2.1 MB)
         </div>
-        <input id="input-17"
+        <input id="input-25"
                type="file"
         >
       </div>
       <div class="v-input__append-inner">
         <div class="v-input__icon v-input__icon--clear">
-          <button type="button"
-                  aria-label="Clear "
+          <button aria-hidden="false"
+                  class="v-icon--link v-icon notranslate mdi mdi-close theme--light"
+                  type="button"
+                  aria-label="Clear File input"
                   tabindex="-1"
-                  class="v-icon notranslate v-icon--link material-icons theme--light"
           >
-            $clear
           </button>
         </div>
       </div>
     </div>
     <div class="v-text-field__details">
       <div class="v-messages theme--light">
-        <span name="message-transition"
-              tag="div"
-              class="v-messages__wrapper"
-        >
-        </span>
+        <div class="v-messages__wrapper">
+        </div>
       </div>
     </div>
   </div>
@@ -133,46 +145,50 @@ exports[`VFileInput.ts should display total size in counter 1`] = `
 <div class="v-input v-input--is-label-active v-input--is-dirty theme--light v-text-field v-file-input">
   <div class="v-input__prepend-outer">
     <div class="v-input__icon v-input__icon--prepend">
-      <button type="button"
-              aria-label=" prepended action"
-              class="v-icon notranslate v-icon--link material-icons theme--light"
+      <button aria-hidden="false"
+              class="v-icon--link v-icon notranslate mdi mdi-paperclip theme--light"
+              type="button"
+              aria-label="File input prepended action"
       >
-        $file
       </button>
     </div>
   </div>
   <div class="v-input__control">
     <div class="v-input__slot">
       <div class="v-text-field__slot">
+        <label class="v-label v-label--active theme--light"
+               for="input-34"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
         <div class="v-file-input__text">
           2 files
         </div>
-        <input id="input-23"
+        <input id="input-34"
                type="file"
         >
       </div>
       <div class="v-input__append-inner">
         <div class="v-input__icon v-input__icon--clear">
-          <button type="button"
-                  aria-label="Clear "
+          <button aria-hidden="false"
+                  class="v-icon--link v-icon notranslate mdi mdi-close theme--light"
+                  type="button"
+                  aria-label="Clear File input"
                   tabindex="-1"
-                  class="v-icon notranslate v-icon--link material-icons theme--light"
           >
-            $clear
           </button>
         </div>
       </div>
     </div>
     <div class="v-text-field__details">
       <div class="v-messages theme--light">
-        <span name="message-transition"
-              tag="div"
-              class="v-messages__wrapper"
-        >
-        </span>
+        <div class="v-messages__wrapper">
+        </div>
       </div>
       <div class="v-counter theme--light">
-        0 files (3.1 MB in total)
+        {0} files (3.1 MB in total)
       </div>
     </div>
   </div>
@@ -183,46 +199,50 @@ exports[`VFileInput.ts should display total size in counter 2`] = `
 <div class="v-input v-input--is-label-active v-input--is-dirty theme--light v-text-field v-file-input">
   <div class="v-input__prepend-outer">
     <div class="v-input__icon v-input__icon--prepend">
-      <button type="button"
-              aria-label=" prepended action"
-              class="v-icon notranslate v-icon--link material-icons theme--light"
+      <button aria-hidden="false"
+              class="v-icon--link v-icon notranslate mdi mdi-paperclip theme--light"
+              type="button"
+              aria-label="File input prepended action"
       >
-        $file
       </button>
     </div>
   </div>
   <div class="v-input__control">
     <div class="v-input__slot">
       <div class="v-text-field__slot">
+        <label class="v-label v-label--active theme--light"
+               for="input-34"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
         <div class="v-file-input__text">
           2 files
         </div>
-        <input id="input-23"
+        <input id="input-34"
                type="file"
         >
       </div>
       <div class="v-input__append-inner">
         <div class="v-input__icon v-input__icon--clear">
-          <button type="button"
-                  aria-label="Clear "
+          <button aria-hidden="false"
+                  class="v-icon--link v-icon notranslate mdi mdi-close theme--light"
+                  type="button"
+                  aria-label="Clear File input"
                   tabindex="-1"
-                  class="v-icon notranslate v-icon--link material-icons theme--light"
           >
-            $clear
           </button>
         </div>
       </div>
     </div>
     <div class="v-text-field__details">
       <div class="v-messages theme--light">
-        <span name="message-transition"
-              tag="div"
-              class="v-messages__wrapper"
-        >
-        </span>
+        <div class="v-messages__wrapper">
+        </div>
       </div>
       <div class="v-counter theme--light">
-        0 files (3.1 MB in total)
+        {0} files (3.1 MB in total)
       </div>
     </div>
   </div>
@@ -233,17 +253,24 @@ exports[`VFileInput.ts should render 1`] = `
 <div class="v-input theme--light v-text-field v-file-input">
   <div class="v-input__prepend-outer">
     <div class="v-input__icon v-input__icon--prepend">
-      <button type="button"
-              aria-label=" prepended action"
-              class="v-icon notranslate v-icon--link material-icons theme--light"
+      <button aria-hidden="false"
+              class="v-icon--link v-icon notranslate mdi mdi-paperclip theme--light"
+              type="button"
+              aria-label="File input prepended action"
       >
-        $file
       </button>
     </div>
   </div>
   <div class="v-input__control">
     <div class="v-input__slot">
       <div class="v-text-field__slot">
+        <label class="v-label theme--light"
+               for="input-1"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
         <div class="v-file-input__text">
         </div>
         <input id="input-1"
@@ -257,11 +284,8 @@ exports[`VFileInput.ts should render 1`] = `
     </div>
     <div class="v-text-field__details">
       <div class="v-messages theme--light">
-        <span name="message-transition"
-              tag="div"
-              class="v-messages__wrapper"
-        >
-        </span>
+        <div class="v-messages__wrapper">
+        </div>
       </div>
     </div>
   </div>
@@ -272,17 +296,24 @@ exports[`VFileInput.ts should render chips 1`] = `
 <div class="v-input v-input--is-label-active v-input--is-dirty theme--light v-text-field v-file-input">
   <div class="v-input__prepend-outer">
     <div class="v-input__icon v-input__icon--prepend">
-      <button type="button"
-              aria-label=" prepended action"
-              class="v-icon notranslate v-icon--link material-icons theme--light"
+      <button aria-hidden="false"
+              class="v-icon--link v-icon notranslate mdi mdi-paperclip theme--light"
+              type="button"
+              aria-label="File input prepended action"
       >
-        $file
       </button>
     </div>
   </div>
   <div class="v-input__control">
     <div class="v-input__slot">
       <div class="v-text-field__slot">
+        <label class="v-label v-label--active theme--light"
+               for="input-99"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
         <div class="v-file-input__text v-file-input__text--chips">
           <span class="v-chip v-chip--no-color theme--light v-size--default">
             <span class="v-chip__content">
@@ -290,29 +321,26 @@ exports[`VFileInput.ts should render chips 1`] = `
             </span>
           </span>
         </div>
-        <input id="input-67"
+        <input id="input-99"
                type="file"
         >
       </div>
       <div class="v-input__append-inner">
         <div class="v-input__icon v-input__icon--clear">
-          <button type="button"
-                  aria-label="Clear "
+          <button aria-hidden="false"
+                  class="v-icon--link v-icon notranslate mdi mdi-close theme--light"
+                  type="button"
+                  aria-label="Clear File input"
                   tabindex="-1"
-                  class="v-icon notranslate v-icon--link material-icons theme--light"
           >
-            $clear
           </button>
         </div>
       </div>
     </div>
     <div class="v-text-field__details">
       <div class="v-messages theme--light">
-        <span name="message-transition"
-              tag="div"
-              class="v-messages__wrapper"
-        >
-        </span>
+        <div class="v-messages__wrapper">
+        </div>
       </div>
     </div>
   </div>
@@ -323,46 +351,50 @@ exports[`VFileInput.ts should render counter 1`] = `
 <div class="v-input v-input--is-label-active v-input--is-dirty theme--light v-text-field v-file-input">
   <div class="v-input__prepend-outer">
     <div class="v-input__icon v-input__icon--prepend">
-      <button type="button"
-              aria-label=" prepended action"
-              class="v-icon notranslate v-icon--link material-icons theme--light"
+      <button aria-hidden="false"
+              class="v-icon--link v-icon notranslate mdi mdi-paperclip theme--light"
+              type="button"
+              aria-label="File input prepended action"
       >
-        $file
       </button>
     </div>
   </div>
   <div class="v-input__control">
     <div class="v-input__slot">
       <div class="v-text-field__slot">
+        <label class="v-label v-label--active theme--light"
+               for="input-15"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
         <div class="v-file-input__text">
           test
         </div>
-        <input id="input-11"
+        <input id="input-15"
                type="file"
         >
       </div>
       <div class="v-input__append-inner">
         <div class="v-input__icon v-input__icon--clear">
-          <button type="button"
-                  aria-label="Clear "
+          <button aria-hidden="false"
+                  class="v-icon--link v-icon notranslate mdi mdi-close theme--light"
+                  type="button"
+                  aria-label="Clear File input"
                   tabindex="-1"
-                  class="v-icon notranslate v-icon--link material-icons theme--light"
           >
-            $clear
           </button>
         </div>
       </div>
     </div>
     <div class="v-text-field__details">
       <div class="v-messages theme--light">
-        <span name="message-transition"
-              tag="div"
-              class="v-messages__wrapper"
-        >
-        </span>
+        <div class="v-messages__wrapper">
+        </div>
       </div>
       <div class="v-counter theme--light">
-        0 files
+        {0} files
       </div>
     </div>
   </div>
@@ -373,22 +405,29 @@ exports[`VFileInput.ts should render multiple 1`] = `
 <div class="v-input theme--light v-text-field v-file-input">
   <div class="v-input__prepend-outer">
     <div class="v-input__icon v-input__icon--prepend">
-      <button type="button"
-              aria-label=" prepended action"
-              class="v-icon notranslate v-icon--link material-icons theme--light"
+      <button aria-hidden="false"
+              class="v-icon--link v-icon notranslate mdi mdi-paperclip theme--light"
+              type="button"
+              aria-label="File input prepended action"
       >
-        $file
       </button>
     </div>
   </div>
   <div class="v-input__control">
     <div class="v-input__slot">
       <div class="v-text-field__slot">
+        <label class="v-label theme--light"
+               for="input-8"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
         <div class="v-file-input__text">
         </div>
-        <input id="input-6"
+        <input id="input-8"
                type="file"
-               multiple="multiple"
+               multiple
         >
       </div>
       <div class="v-input__append-inner">
@@ -398,11 +437,8 @@ exports[`VFileInput.ts should render multiple 1`] = `
     </div>
     <div class="v-text-field__details">
       <div class="v-messages theme--light">
-        <span name="message-transition"
-              tag="div"
-              class="v-messages__wrapper"
-        >
-        </span>
+        <div class="v-messages__wrapper">
+        </div>
       </div>
     </div>
   </div>
@@ -413,17 +449,24 @@ exports[`VFileInput.ts should render small chips 1`] = `
 <div class="v-input v-input--is-label-active v-input--is-dirty theme--light v-text-field v-file-input">
   <div class="v-input__prepend-outer">
     <div class="v-input__icon v-input__icon--prepend">
-      <button type="button"
-              aria-label=" prepended action"
-              class="v-icon notranslate v-icon--link material-icons theme--light"
+      <button aria-hidden="false"
+              class="v-icon--link v-icon notranslate mdi mdi-paperclip theme--light"
+              type="button"
+              aria-label="File input prepended action"
       >
-        $file
       </button>
     </div>
   </div>
   <div class="v-input__control">
     <div class="v-input__slot">
       <div class="v-text-field__slot">
+        <label class="v-label v-label--active theme--light"
+               for="input-109"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
         <div class="v-file-input__text v-file-input__text--chips">
           <span class="v-chip v-chip--no-color theme--light v-size--small">
             <span class="v-chip__content">
@@ -431,29 +474,74 @@ exports[`VFileInput.ts should render small chips 1`] = `
             </span>
           </span>
         </div>
-        <input id="input-74"
+        <input id="input-109"
                type="file"
         >
       </div>
       <div class="v-input__append-inner">
         <div class="v-input__icon v-input__icon--clear">
-          <button type="button"
-                  aria-label="Clear "
+          <button aria-hidden="false"
+                  class="v-icon--link v-icon notranslate mdi mdi-close theme--light"
+                  type="button"
+                  aria-label="Clear File input"
                   tabindex="-1"
-                  class="v-icon notranslate v-icon--link material-icons theme--light"
           >
-            $clear
           </button>
         </div>
       </div>
     </div>
     <div class="v-text-field__details">
       <div class="v-messages theme--light">
-        <span name="message-transition"
-              tag="div"
-              class="v-messages__wrapper"
+        <div class="v-messages__wrapper">
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`VFileInput.ts should render with hideInput prop like original Vuetify 1`] = `
+<div class="v-input theme--light v-text-field v-file-input"
+     accept="image/*"
+>
+  <div class="v-input__prepend-outer">
+    <div class="v-input__icon v-input__icon--prepend">
+      <button aria-hidden="false"
+              class="v-icon--link v-icon notranslate mdi mdi-paperclip theme--light"
+              type="button"
+              aria-label="File input prepended action"
+      >
+      </button>
+    </div>
+  </div>
+  <div class="v-input__control"
+       style="display: none;"
+  >
+    <div class="v-input__slot">
+      <div class="v-text-field__slot">
+        <label class="v-label theme--light"
+               for="input-175"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
+        <div class="v-file-input__text">
+        </div>
+        <input accept="image/*"
+               id="input-175"
+               type="file"
         >
-        </span>
+      </div>
+      <div class="v-input__append-inner">
+        <div>
+        </div>
+      </div>
+    </div>
+    <div class="v-text-field__details">
+      <div class="v-messages theme--light">
+        <div class="v-messages__wrapper">
+        </div>
       </div>
     </div>
   </div>
@@ -465,9 +553,16 @@ exports[`VFileInput.ts should render without icon 1`] = `
   <div class="v-input__control">
     <div class="v-input__slot">
       <div class="v-text-field__slot">
+        <label class="v-label theme--light"
+               for="input-119"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
         <div class="v-file-input__text">
         </div>
-        <input id="input-81"
+        <input id="input-119"
                type="file"
         >
       </div>
@@ -478,11 +573,8 @@ exports[`VFileInput.ts should render without icon 1`] = `
     </div>
     <div class="v-text-field__details">
       <div class="v-messages theme--light">
-        <span name="message-transition"
-              tag="div"
-              class="v-messages__wrapper"
-        >
-        </span>
+        <div class="v-messages__wrapper">
+        </div>
       </div>
     </div>
   </div>
@@ -493,11 +585,11 @@ exports[`VFileInput.ts should set display none if hide-input prop is set 1`] = `
 <div class="v-input theme--light v-text-field v-file-input">
   <div class="v-input__prepend-outer">
     <div class="v-input__icon v-input__icon--prepend">
-      <button type="button"
-              aria-label=" prepended action"
-              class="v-icon notranslate v-icon--link material-icons theme--light"
+      <button aria-hidden="false"
+              class="v-icon--link v-icon notranslate mdi mdi-paperclip theme--light"
+              type="button"
+              aria-label="File input prepended action"
       >
-        $file
       </button>
     </div>
   </div>
@@ -506,9 +598,16 @@ exports[`VFileInput.ts should set display none if hide-input prop is set 1`] = `
   >
     <div class="v-input__slot">
       <div class="v-text-field__slot">
+        <label class="v-label theme--light"
+               for="input-154"
+               aria-hidden="false"
+               style="left: 0px; position: absolute;"
+        >
+          File input
+        </label>
         <div class="v-file-input__text">
         </div>
-        <input id="input-107"
+        <input id="input-154"
                type="file"
         >
       </div>
@@ -519,11 +618,8 @@ exports[`VFileInput.ts should set display none if hide-input prop is set 1`] = `
     </div>
     <div class="v-text-field__details">
       <div class="v-messages theme--light">
-        <span name="message-transition"
-              tag="div"
-              class="v-messages__wrapper"
-        >
-        </span>
+        <div class="v-messages__wrapper">
+        </div>
       </div>
     </div>
   </div>