primevue 3.16.2 → 3.17.0

package/fileupload/FileUpload.vue

@@ -1,40 +1,40 @@
 <template>
-    <div class="p-fileupload p-fileupload-advanced p-component" v-if="isAdvanced">
+    <div v-if="isAdvanced" class="p-fileupload p-fileupload-advanced p-component">
         <div class="p-fileupload-buttonbar">
-            <span :class="advancedChooseButtonClass" :style="style" @click="choose" @keydown.enter="choose" @focus="onFocus" @blur="onBlur" v-ripple tabindex="0">
+            <span v-ripple :class="advancedChooseButtonClass" :style="style" @click="choose" @keydown.enter="choose" @focus="onFocus" @blur="onBlur" tabindex="0">
                 <input ref="fileInput" type="file" @change="onFileSelect" :multiple="multiple" :accept="accept" :disabled="chooseDisabled" />
                 <span :class="advancedChooseIconClass"></span>
-                <span class="p-button-label">{{chooseButtonLabel}}</span>
+                <span class="p-button-label">{{ chooseButtonLabel }}</span>
             </span>
-            <FileUploadButton :label="uploadButtonLabel" :icon="uploadIcon" @click="upload" :disabled="uploadDisabled" v-if="showUploadButton" />
-            <FileUploadButton :label="cancelButtonLabel" :icon="cancelIcon" @click="clear" :disabled="cancelDisabled" v-if="showCancelButton" />
+            <FileUploadButton v-if="showUploadButton" :label="uploadButtonLabel" :icon="uploadIcon" @click="upload" :disabled="uploadDisabled" />
+            <FileUploadButton v-if="showCancelButton" :label="cancelButtonLabel" :icon="cancelIcon" @click="clear" :disabled="cancelDisabled" />
         </div>
         <div ref="content" class="p-fileupload-content" @dragenter="onDragEnter" @dragover="onDragOver" @dragleave="onDragLeave" @drop="onDrop">
-            <FileUploadProgressBar :value="progress" v-if="hasFiles" />
-            <FileUploadMessage v-for="msg of messages" severity="error" :key="msg" @close="onMessageClose">{{msg}}</FileUploadMessage>
-            <div class="p-fileupload-files" v-if="hasFiles">
-                <div class="p-fileupload-row" v-for="(file, index) of files" :key="file.name + file.type + file.size">
+            <FileUploadProgressBar v-if="hasFiles" :value="progress" />
+            <FileUploadMessage v-for="msg of messages" :key="msg" severity="error" @close="onMessageClose">{{ msg }}</FileUploadMessage>
+            <div v-if="hasFiles" class="p-fileupload-files">
+                <div v-for="(file, index) of files" :key="file.name + file.type + file.size" class="p-fileupload-row">
                     <div>
                         <img v-if="isImage(file)" role="presentation" :alt="file.name" :src="file.objectURL" :width="previewWidth" />
                     </div>
-                    <div class="p-fileupload-filename">{{file.name}}</div>
-                    <div>{{formatSize(file.size)}}</div>
+                    <div class="p-fileupload-filename">{{ file.name }}</div>
+                    <div>{{ formatSize(file.size) }}</div>
                     <div>
                         <FileUploadButton type="button" icon="pi pi-times" @click="remove(index)" />
                     </div>
                 </div>
             </div>
-            <div class="p-fileupload-empty" v-if="$slots.empty && !hasFiles">
+            <div v-if="$slots.empty && !hasFiles" class="p-fileupload-empty">
                 <slot name="empty"></slot>
             </div>
         </div>
     </div>
-    <div class="p-fileupload p-fileupload-basic p-component" v-else-if="isBasic">
-        <FileUploadMessage v-for="msg of messages" severity="error" :key="msg" @close="onMessageClose">{{msg}}</FileUploadMessage>
-        <span :class="basicChooseButtonClass" :style="style" @mouseup="onBasicUploaderClick"  @keydown.enter="choose" @focus="onFocus" @blur="onBlur" v-ripple tabindex="0" >
+    <div v-else-if="isBasic" class="p-fileupload p-fileupload-basic p-component">
+        <FileUploadMessage v-for="msg of messages" :key="msg" severity="error" @close="onMessageClose">{{ msg }}</FileUploadMessage>
+        <span v-ripple :class="basicChooseButtonClass" :style="style" @mouseup="onBasicUploaderClick" @keydown.enter="choose" @focus="onFocus" @blur="onBlur" tabindex="0">
             <span :class="basicChooseButtonIconClass"></span>
-            <span class="p-button-label">{{basicChooseButtonLabel}}</span>
-            <input ref="fileInput" type="file" :accept="accept" :disabled="disabled" :multiple="multiple" @change="onFileSelect" @focus="onFocus" @blur="onBlur" v-if="!hasFiles" />
+            <span class="p-button-label">{{ basicChooseButtonLabel }}</span>
+            <input v-if="!hasFiles" ref="fileInput" type="file" :accept="accept" :disabled="disabled" :multiple="multiple" @change="onFileSelect" @focus="onFocus" @blur="onBlur" />
         </span>
     </div>
 </template>
@@ -43,7 +43,7 @@
 import Button from 'primevue/button';
 import ProgressBar from 'primevue/progressbar';
 import Message from 'primevue/message';
-import {DomHandler} from 'primevue/utils';
+import { DomHandler } from 'primevue/utils';
 import Ripple from 'primevue/ripple';
 
 export default {
@@ -62,10 +62,10 @@ export default {
             type: String,
             default: 'advanced'
         },
-		multiple: {
-			type: Boolean,
-			default: false
-		},
+        multiple: {
+            type: Boolean,
+            default: false
+        },
         accept: {
             type: String,
             default: null
@@ -153,30 +153,33 @@ export default {
             messages: [],
             focused: false,
             progress: null
-        }
+        };
     },
     methods: {
         onFileSelect(event) {
             if (event.type !== 'drop' && this.isIE11() && this.duplicateIEEvent) {
                 this.duplicateIEEvent = false;
+
                 return;
             }
 
             this.messages = [];
             this.files = this.files || [];
             let files = event.dataTransfer ? event.dataTransfer.files : event.target.files;
+
             for (let file of files) {
                 if (!this.isFileSelected(file)) {
                     if (this.validate(file)) {
                         if (this.isImage(file)) {
                             file.objectURL = window.URL.createObjectURL(file);
                         }
+
                         this.files.push(file);
                     }
                 }
             }
 
-            this.$emit('select', {originalEvent: event, files: this.files});
+            this.$emit('select', { originalEvent: event, files: this.files });
 
             if (this.fileLimit) {
                 this.checkFileLimit();
@@ -188,8 +191,7 @@ export default {
 
             if (event.type !== 'drop' && this.isIE11()) {
                 this.clearIEInput();
-            }
-            else {
+            } else {
                 this.clearInputElement();
             }
         },
@@ -202,16 +204,15 @@ export default {
                     this.uploadedFileCount += this.files.length;
                 }
 
-                this.$emit('uploader', {files: this.files});
-                this.clear()
-            }
-            else {
+                this.$emit('uploader', { files: this.files });
+                this.clear();
+            } else {
                 let xhr = new XMLHttpRequest();
                 let formData = new FormData();
 
                 this.$emit('before-upload', {
-                    'xhr': xhr,
-                    'formData': formData
+                    xhr: xhr,
+                    formData: formData
                 });
 
                 for (let file of this.files) {
@@ -242,8 +243,7 @@ export default {
                                 xhr: xhr,
                                 files: this.files
                             });
-                        }
-                        else {
+                        } else {
                             this.$emit('error', {
                                 xhr: xhr,
                                 files: this.files
@@ -257,8 +257,8 @@ export default {
                 xhr.open('POST', this.url, true);
 
                 this.$emit('before-send', {
-                    'xhr': xhr,
-                    'formData': formData
+                    xhr: xhr,
+                    formData: formData
                 });
 
                 xhr.withCredentials = this.withCredentials;
@@ -284,8 +284,7 @@ export default {
         isFileSelected(file) {
             if (this.files && this.files.length) {
                 for (let sFile of this.files) {
-                    if ((sFile.name + sFile.type + sFile.size) === (file.name + file.type + file.size))
-                        return true;
+                    if (sFile.name + sFile.type + sFile.size === file.name + file.type + file.size) return true;
                 }
             }
 
@@ -296,22 +295,24 @@ export default {
         },
         validate(file) {
             if (this.accept && !this.isFileTypeValid(file)) {
-                this.messages.push(this.invalidFileTypeMessage.replace('{0}', file.name).replace('{1}', this.accept))
+                this.messages.push(this.invalidFileTypeMessage.replace('{0}', file.name).replace('{1}', this.accept));
+
                 return false;
             }
 
             if (this.maxFileSize && file.size > this.maxFileSize) {
                 this.messages.push(this.invalidFileSizeMessage.replace('{0}', file.name).replace('{1}', this.formatSize(this.maxFileSize)));
+
                 return false;
             }
 
             return true;
         },
         isFileTypeValid(file) {
-            let acceptableTypes = this.accept.split(',').map(type => type.trim());
-            for(let type of acceptableTypes) {
-                let acceptable = this.isWildcard(type) ? this.getTypeClass(file.type) === this.getTypeClass(type)
-                    : file.type == type || this.getFileExtension(file).toLowerCase() === type.toLowerCase();
+            let acceptableTypes = this.accept.split(',').map((type) => type.trim());
+
+            for (let type of acceptableTypes) {
+                let acceptable = this.isWildcard(type) ? this.getTypeClass(file.type) === this.getTypeClass(type) : file.type == type || this.getFileExtension(file).toLowerCase() === type.toLowerCase();
 
                 if (acceptable) {
                     return true;
@@ -323,7 +324,7 @@ export default {
         getTypeClass(fileType) {
             return fileType.substring(0, fileType.indexOf('/'));
         },
-        isWildcard(fileType){
+        isWildcard(fileType) {
             return fileType.indexOf('*') !== -1;
         },
         getFileExtension(file) {
@@ -365,14 +366,13 @@ export default {
             }
         },
         onBasicUploaderClick() {
-            if (this.hasFiles)
-                this.upload();
-            else
-                this.$refs.fileInput.click();
+            if (this.hasFiles) this.upload();
+            else this.$refs.fileInput.click();
         },
         remove(index) {
             this.clearInputElement();
             let removedFile = this.files.splice(index, 1)[0];
+
             this.files = [...this.files];
             this.$emit('remove', {
                 file: removedFile,
@@ -392,10 +392,11 @@ export default {
             if (bytes === 0) {
                 return '0 B';
             }
+
             let k = 1000,
-            dm = 3,
-            sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
-            i = Math.floor(Math.log(bytes) / Math.log(k));
+                dm = 3,
+                sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
+                i = Math.floor(Math.log(bytes) / Math.log(k));
 
             return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
         },
@@ -408,7 +409,7 @@ export default {
         },
         checkFileLimit() {
             if (this.isFileLimitExceeded()) {
-                this.messages.push(this.invalidFileLimitMessage.replace('{0}', this.fileLimit.toString()))
+                this.messages.push(this.invalidFileLimitMessage.replace('{0}', this.fileLimit.toString()));
             }
         },
         onMessageClose() {
@@ -423,29 +424,34 @@ export default {
             return this.mode === 'basic';
         },
         advancedChooseButtonClass() {
-            return ['p-button p-component p-fileupload-choose', this.class, {
+            return [
+                'p-button p-component p-fileupload-choose',
+                this.class,
+                {
                     'p-disabled': this.disabled,
                     'p-focus': this.focused
                 }
             ];
         },
         basicChooseButtonClass() {
-            return ['p-button p-component p-fileupload-choose', this.class, {
-                'p-fileupload-choose-selected': this.hasFiles,
-                'p-disabled': this.disabled,
-                'p-focus': this.focused
-            }];
+            return [
+                'p-button p-component p-fileupload-choose',
+                this.class,
+                {
+                    'p-fileupload-choose-selected': this.hasFiles,
+                    'p-disabled': this.disabled,
+                    'p-focus': this.focused
+                }
+            ];
         },
         advancedChooseIconClass() {
             return ['p-button-icon p-button-icon-left pi-fw', this.chooseIcon];
         },
         basicChooseButtonIconClass() {
-            return ['p-button-icon p-button-icon-left',
-                !this.hasFiles || this.auto ? this.uploadIcon : this.chooseIcon
-            ];
+            return ['p-button-icon p-button-icon-left', !this.hasFiles || this.auto ? this.uploadIcon : this.chooseIcon];
         },
         basicChooseButtonLabel() {
-            return this.auto ? this.chooseButtonLabel : (this.hasFiles ? this.files.map(f => f.name).join(', ') : this.chooseButtonLabel);
+            return this.auto ? this.chooseButtonLabel : this.hasFiles ? this.files.map((f) => f.name).join(', ') : this.chooseButtonLabel;
         },
         hasFiles() {
             return this.files && this.files.length > 0;
@@ -470,14 +476,14 @@ export default {
         }
     },
     components: {
-        'FileUploadButton': Button,
-        'FileUploadProgressBar': ProgressBar,
-        'FileUploadMessage': Message
+        FileUploadButton: Button,
+        FileUploadProgressBar: ProgressBar,
+        FileUploadMessage: Message
     },
     directives: {
-        'ripple': Ripple
+        ripple: Ripple
     }
-}
+};
 </script>
 
 <style>
@@ -511,11 +517,11 @@ export default {
     overflow: hidden;
 }
 
-.p-button.p-fileupload-choose input[type=file] {
+.p-button.p-fileupload-choose input[type='file'] {
     display: none;
 }
 
-.p-fileupload-choose.p-fileupload-choose-selected input[type=file] {
+.p-fileupload-choose.p-fileupload-choose-selected input[type='file'] {
     display: none;
 }
 

package/fileupload/fileupload.cjs.js

@@ -30,10 +30,10 @@ var script = {
             type: String,
             default: 'advanced'
         },
-		multiple: {
-			type: Boolean,
-			default: false
-		},
+        multiple: {
+            type: Boolean,
+            default: false
+        },
         accept: {
             type: String,
             default: null
@@ -121,30 +121,33 @@ var script = {
             messages: [],
             focused: false,
             progress: null
-        }
+        };
     },
     methods: {
         onFileSelect(event) {
             if (event.type !== 'drop' && this.isIE11() && this.duplicateIEEvent) {
                 this.duplicateIEEvent = false;
+
                 return;
             }
 
             this.messages = [];
             this.files = this.files || [];
             let files = event.dataTransfer ? event.dataTransfer.files : event.target.files;
+
             for (let file of files) {
                 if (!this.isFileSelected(file)) {
                     if (this.validate(file)) {
                         if (this.isImage(file)) {
                             file.objectURL = window.URL.createObjectURL(file);
                         }
+
                         this.files.push(file);
                     }
                 }
             }
 
-            this.$emit('select', {originalEvent: event, files: this.files});
+            this.$emit('select', { originalEvent: event, files: this.files });
 
             if (this.fileLimit) {
                 this.checkFileLimit();
@@ -156,8 +159,7 @@ var script = {
 
             if (event.type !== 'drop' && this.isIE11()) {
                 this.clearIEInput();
-            }
-            else {
+            } else {
                 this.clearInputElement();
             }
         },
@@ -170,16 +172,15 @@ var script = {
                     this.uploadedFileCount += this.files.length;
                 }
 
-                this.$emit('uploader', {files: this.files});
+                this.$emit('uploader', { files: this.files });
                 this.clear();
-            }
-            else {
+            } else {
                 let xhr = new XMLHttpRequest();
                 let formData = new FormData();
 
                 this.$emit('before-upload', {
-                    'xhr': xhr,
-                    'formData': formData
+                    xhr: xhr,
+                    formData: formData
                 });
 
                 for (let file of this.files) {
@@ -210,8 +211,7 @@ var script = {
                                 xhr: xhr,
                                 files: this.files
                             });
-                        }
-                        else {
+                        } else {
                             this.$emit('error', {
                                 xhr: xhr,
                                 files: this.files
@@ -225,8 +225,8 @@ var script = {
                 xhr.open('POST', this.url, true);
 
                 this.$emit('before-send', {
-                    'xhr': xhr,
-                    'formData': formData
+                    xhr: xhr,
+                    formData: formData
                 });
 
                 xhr.withCredentials = this.withCredentials;
@@ -252,8 +252,7 @@ var script = {
         isFileSelected(file) {
             if (this.files && this.files.length) {
                 for (let sFile of this.files) {
-                    if ((sFile.name + sFile.type + sFile.size) === (file.name + file.type + file.size))
-                        return true;
+                    if (sFile.name + sFile.type + sFile.size === file.name + file.type + file.size) return true;
                 }
             }
 
@@ -265,21 +264,23 @@ var script = {
         validate(file) {
             if (this.accept && !this.isFileTypeValid(file)) {
                 this.messages.push(this.invalidFileTypeMessage.replace('{0}', file.name).replace('{1}', this.accept));
+
                 return false;
             }
 
             if (this.maxFileSize && file.size > this.maxFileSize) {
                 this.messages.push(this.invalidFileSizeMessage.replace('{0}', file.name).replace('{1}', this.formatSize(this.maxFileSize)));
+
                 return false;
             }
 
             return true;
         },
         isFileTypeValid(file) {
-            let acceptableTypes = this.accept.split(',').map(type => type.trim());
-            for(let type of acceptableTypes) {
-                let acceptable = this.isWildcard(type) ? this.getTypeClass(file.type) === this.getTypeClass(type)
-                    : file.type == type || this.getFileExtension(file).toLowerCase() === type.toLowerCase();
+            let acceptableTypes = this.accept.split(',').map((type) => type.trim());
+
+            for (let type of acceptableTypes) {
+                let acceptable = this.isWildcard(type) ? this.getTypeClass(file.type) === this.getTypeClass(type) : file.type == type || this.getFileExtension(file).toLowerCase() === type.toLowerCase();
 
                 if (acceptable) {
                     return true;
@@ -291,7 +292,7 @@ var script = {
         getTypeClass(fileType) {
             return fileType.substring(0, fileType.indexOf('/'));
         },
-        isWildcard(fileType){
+        isWildcard(fileType) {
             return fileType.indexOf('*') !== -1;
         },
         getFileExtension(file) {
@@ -333,14 +334,13 @@ var script = {
             }
         },
         onBasicUploaderClick() {
-            if (this.hasFiles)
-                this.upload();
-            else
-                this.$refs.fileInput.click();
+            if (this.hasFiles) this.upload();
+            else this.$refs.fileInput.click();
         },
         remove(index) {
             this.clearInputElement();
             let removedFile = this.files.splice(index, 1)[0];
+
             this.files = [...this.files];
             this.$emit('remove', {
                 file: removedFile,
@@ -360,10 +360,11 @@ var script = {
             if (bytes === 0) {
                 return '0 B';
             }
+
             let k = 1000,
-            dm = 3,
-            sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
-            i = Math.floor(Math.log(bytes) / Math.log(k));
+                dm = 3,
+                sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
+                i = Math.floor(Math.log(bytes) / Math.log(k));
 
             return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
         },
@@ -391,29 +392,34 @@ var script = {
             return this.mode === 'basic';
         },
         advancedChooseButtonClass() {
-            return ['p-button p-component p-fileupload-choose', this.class, {
+            return [
+                'p-button p-component p-fileupload-choose',
+                this.class,
+                {
                     'p-disabled': this.disabled,
                     'p-focus': this.focused
                 }
             ];
         },
         basicChooseButtonClass() {
-            return ['p-button p-component p-fileupload-choose', this.class, {
-                'p-fileupload-choose-selected': this.hasFiles,
-                'p-disabled': this.disabled,
-                'p-focus': this.focused
-            }];
+            return [
+                'p-button p-component p-fileupload-choose',
+                this.class,
+                {
+                    'p-fileupload-choose-selected': this.hasFiles,
+                    'p-disabled': this.disabled,
+                    'p-focus': this.focused
+                }
+            ];
         },
         advancedChooseIconClass() {
             return ['p-button-icon p-button-icon-left pi-fw', this.chooseIcon];
         },
         basicChooseButtonIconClass() {
-            return ['p-button-icon p-button-icon-left',
-                !this.hasFiles || this.auto ? this.uploadIcon : this.chooseIcon
-            ];
+            return ['p-button-icon p-button-icon-left', !this.hasFiles || this.auto ? this.uploadIcon : this.chooseIcon];
         },
         basicChooseButtonLabel() {
-            return this.auto ? this.chooseButtonLabel : (this.hasFiles ? this.files.map(f => f.name).join(', ') : this.chooseButtonLabel);
+            return this.auto ? this.chooseButtonLabel : this.hasFiles ? this.files.map((f) => f.name).join(', ') : this.chooseButtonLabel;
         },
         hasFiles() {
             return this.files && this.files.length > 0;
@@ -438,12 +444,12 @@ var script = {
         }
     },
     components: {
-        'FileUploadButton': Button__default["default"],
-        'FileUploadProgressBar': ProgressBar__default["default"],
-        'FileUploadMessage': Message__default["default"]
+        FileUploadButton: Button__default["default"],
+        FileUploadProgressBar: ProgressBar__default["default"],
+        FileUploadMessage: Message__default["default"]
     },
     directives: {
-        'ripple': Ripple__default["default"]
+        ripple: Ripple__default["default"]
     }
 };
 
@@ -539,8 +545,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             : vue.createCommentVNode("", true),
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($data.messages, (msg) => {
             return (vue.openBlock(), vue.createBlock(_component_FileUploadMessage, {
-              severity: "error",
               key: msg,
+              severity: "error",
               onClose: $options.onMessageClose
             }, {
               default: vue.withCtx(() => [
@@ -553,8 +559,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
                 (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($data.files, (file, index) => {
                   return (vue.openBlock(), vue.createElementBlock("div", {
-                    class: "p-fileupload-row",
-                    key: file.name + file.type + file.size
+                    key: file.name + file.type + file.size,
+                    class: "p-fileupload-row"
                   }, [
                     vue.createElementVNode("div", null, [
                       ($options.isImage(file))
@@ -591,8 +597,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_9, [
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($data.messages, (msg) => {
             return (vue.openBlock(), vue.createBlock(_component_FileUploadMessage, {
-              severity: "error",
               key: msg,
+              severity: "error",
               onClose: $options.onMessageClose
             }, {
               default: vue.withCtx(() => [
@@ -661,7 +667,7 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z = "\n.p-fileupload-content {\n    position: relative;\n}\n.p-fileupload-row {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n}\n.p-fileupload-row > div {\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1 auto;\n            flex: 1 1 auto;\n    width: 25%;\n}\n.p-fileupload-row > div:last-child {\n    text-align: right;\n}\n.p-fileupload-content .p-progressbar {\n    width: 100%;\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-button.p-fileupload-choose {\n    position: relative;\n    overflow: hidden;\n}\n.p-button.p-fileupload-choose input[type=file] {\n    display: none;\n}\n.p-fileupload-choose.p-fileupload-choose-selected input[type=file] {\n    display: none;\n}\n.p-fileupload-filename {\n    word-break: break-all;\n}\n.p-fluid .p-fileupload .p-button {\n    width: auto;\n}\n";
+var css_248z = "\n.p-fileupload-content {\n    position: relative;\n}\n.p-fileupload-row {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n}\n.p-fileupload-row > div {\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1 auto;\n            flex: 1 1 auto;\n    width: 25%;\n}\n.p-fileupload-row > div:last-child {\n    text-align: right;\n}\n.p-fileupload-content .p-progressbar {\n    width: 100%;\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-button.p-fileupload-choose {\n    position: relative;\n    overflow: hidden;\n}\n.p-button.p-fileupload-choose input[type='file'] {\n    display: none;\n}\n.p-fileupload-choose.p-fileupload-choose-selected input[type='file'] {\n    display: none;\n}\n.p-fileupload-filename {\n    word-break: break-all;\n}\n.p-fluid .p-fileupload .p-button {\n    width: auto;\n}\n";
 styleInject(css_248z);
 
 script.render = render;