vue-intergrall-plugins 0.0.225 → 0.0.228

package/dist/vue-intergrall-plugins.ssr.js

@@ -54,10 +54,22 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
 
+function _toConsumableArray(arr) {
+  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+}
+
+function _arrayWithoutHoles(arr) {
+  if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+}
+
 function _arrayWithHoles(arr) {
   if (Array.isArray(arr)) return arr;
 }
 
+function _iterableToArray(iter) {
+  if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
+
 function _iterableToArrayLimit(arr, i) {
   var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
 
@@ -105,6 +117,10 @@ function _arrayLikeToArray(arr, len) {
   return arr2;
 }
 
+function _nonIterableSpread() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
 function _nonIterableRest() {
   throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }var top = 'top';
@@ -3497,8 +3513,7 @@ var __vue_component__$w = /*#__PURE__*/normalizeComponent({
   staticRenderFns: __vue_staticRenderFns__$o
 }, __vue_inject_styles__$o, __vue_script__$o, __vue_scope_id__$o, __vue_is_functional_template__$o, __vue_module_identifier__$o, false, undefined, createInjectorSSR, undefined);
 
-var MultipleFilePreview = __vue_component__$w;//
-var script$n = {
+var MultipleFilePreview = __vue_component__$w;var script$n = {
   components: {
     SingleFilePreview: SingleFilePreview,
     MultipleFilePreview: MultipleFilePreview
@@ -3651,11 +3666,14 @@ var script$n = {
     },
     fileUpload: function fileUpload(event, type, externalCall) {
       try {
+        var _this$file;
+
         this.fileSize = 0;
         if (this.fileFormatError) this.file = [];
         this.openFiles = false;
         var filesAux = !externalCall ? event.target.files ? event.target.files : event.dataTransfer.files : event;
-        this.file = filesAux.length ? filesAux : this.file;
+        var isStackable = this.fileSettings.stackFiles && this.fileSettings.multiple;
+        this.file = filesAux.length ? isStackable ? (_this$file = this.file).concat.apply(_this$file, _toConsumableArray(filesAux)) : filesAux : this.file;
         if (!this.file.length) return;
 
         if (this.file.length > this.fileSettings.max) {
@@ -3778,6 +3796,11 @@ var script$n = {
       if (this.isDoc) this.emitFileVars();
     },
     toggleFilePreview: function toggleFilePreview() {
+      if (this.fileSettings.handleFilePreview) {
+        this.emitFileVars();
+        return this.$emit("handle-file-preview");
+      }
+
       this.showFilePreview = !this.showFilePreview;
       if (this.showFilePreview && this.openFiles) this.toggleFiles();
     },
@@ -3835,24 +3858,30 @@ var __vue_render__$n = function __vue_render__() {
   return _c('span', {
     staticClass: "text-footer-actions--btn",
     class: {
-      'files-activated': _vm.openFiles || _vm.file.length || _vm.file.name
+      'files-activated': _vm.openFiles || _vm.file.name
     },
     on: {
       "click": function click($event) {
         return _vm.openFilesByClip();
       }
     }
-  }, [_c('transition', {
+  }, [_c('fa-icon', {
+    attrs: {
+      "icon": ['fas', 'paperclip'],
+      "title": _vm.dictionary.title_selecionar_anexo
+    }
+  }), _vm._ssrNode(" "), _c('transition', {
     attrs: {
       "name": "fade"
     }
   }, [_vm.fileSize > 0 ? _c('span', {
-    staticClass: "files-counter",
+    directives: [{
+      name: "tippy",
+      rawName: "v-tippy"
+    }],
+    class: "" + (_vm.fileSettings.filePreviewStyle == 2 ? 'files-counter-2' : 'files-counter'),
     attrs: {
-      "title": _vm.dictionary.msg_abrir_anexos
-    },
-    domProps: {
-      "textContent": _vm._s(_vm.fileSize)
+      "content": _vm.dictionary.msg_abrir_anexos
     },
     on: {
       "click": function click($event) {
@@ -3860,12 +3889,11 @@ var __vue_render__$n = function __vue_render__() {
         return _vm.toggleFilePreview.apply(null, arguments);
       }
     }
-  }) : _vm._e()]), _vm._ssrNode(" "), _c('fa-icon', {
+  }, [_vm.fileSettings.filePreviewStyle == 1 ? [_vm._v("\n        " + _vm._s(_vm.fileSize) + "\n      ")] : [_vm._v("\n        Anexos "), _c('fa-icon', {
     attrs: {
-      "icon": ['fas', 'paperclip'],
-      "title": _vm.dictionary.title_selecionar_anexo
+      "icon": ['fas', 'eye']
     }
-  }), _vm._ssrNode(" "), _c('transition', {
+  })]], 2) : _vm._e()]), _vm._ssrNode(" "), _c('transition', {
     attrs: {
       "name": "show"
     }
@@ -3996,8 +4024,8 @@ var __vue_staticRenderFns__$n = [];
 
 var __vue_inject_styles__$n = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-0d26cc3c_0", {
-    source: ".fade-enter-active,.fade-leave-active{transition:opacity .3s}.fade-enter,.fade-leave-to{opacity:0}.files-counter{position:absolute;top:unset;transform:translate(17.5px,-15px);background-color:#888;z-index:1;font-size:.5rem;width:15px;height:15px;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;opacity:.9;transition:all .3s;color:#fff;font-weight:900}.files-counter:hover{opacity:1}",
+  inject("data-v-5a1fae02_0", {
+    source: ".fade-enter-active,.fade-leave-active{transition:opacity .3s}.fade-enter,.fade-leave-to{opacity:0}.files-counter{position:absolute;top:unset;transform:translate(17.5px,-15px);background-color:#888;z-index:1;font-size:.5rem;width:15px;height:15px;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;opacity:.9;transition:all .3s;color:#fff;font-weight:900}.files-counter:hover{opacity:1}.files-counter-2{transform:translate(-15px,28px);opacity:.9;position:absolute;display:flex;justify-content:center;align-items:center;color:#888;font-size:.8rem}.files-counter-2 svg{margin-left:5px}.files-counter-2:hover{opacity:1;text-decoration:underline}",
     map: undefined,
     media: undefined
   });
@@ -4008,7 +4036,7 @@ var __vue_inject_styles__$n = function __vue_inject_styles__(inject) {
 var __vue_scope_id__$n = undefined;
 /* module identifier */
 
-var __vue_module_identifier__$n = "data-v-0d26cc3c";
+var __vue_module_identifier__$n = "data-v-5a1fae02";
 /* functional template */
 
 var __vue_is_functional_template__$n = false;
@@ -8402,7 +8430,10 @@ var script$j = {
           imagesExtensions: "",
           multiple: false,
           systemButton: false,
-          max: 3
+          max: 3,
+          handleFilePreview: false,
+          filePreviewStyle: 1,
+          stackFiles: false
         };
       },
       required: false
@@ -8890,7 +8921,10 @@ var __vue_render__$j = function __vue_render__() {
       "set-file-vars": _vm.setFileVars,
       "open-image": _vm.openImage,
       "open-file-system": _vm.openFileSystem,
-      "reset-file-system": _vm.resetFileSystem
+      "reset-file-system": _vm.resetFileSystem,
+      "handle-file-preview": function handleFilePreview($event) {
+        return _vm.$emit('handle-file-preview');
+      }
     }
   }), _vm._ssrNode(" "), _c('BtnExpand', {
     directives: [{
@@ -8941,7 +8975,7 @@ var __vue_staticRenderFns__$j = [];
 
 var __vue_inject_styles__$j = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-7d5d938e_0", {
+  inject("data-v-53fe87de_0", {
     source: ".toasted svg{margin-right:10px}.d-none{display:none}ul{list-style-type:none}.text-footer-container{display:flex;justify-content:center;align-items:center;flex-direction:column;width:100%;position:relative}.text-footer-container .text-footer{min-height:48px;box-shadow:0 3px 7px -2px rgba(0,0,0,.45);position:relative;display:flex;justify-content:center;align-items:center;border:1px solid #ccc;padding:5px 2px 5px 5px;border-radius:5px}.text-footer-container .text-footer.full{width:100%}.text-footer-container .text-footer.almostFull{width:95%}.text-footer-container .text-footer.medium{width:75%}.text-footer-container.bigger .text-footer{height:80px}.text-footer-container.bigger .text-footer>textarea{font-size:.875rem;height:75px;max-height:75px;min-height:75px}.text-footer-container textarea{margin:0 5px;border:unset;flex:1;resize:none;min-height:30px;max-height:60px;font-size:.875rem;font-family:inherit;background:inherit}.text-footer-container textarea:focus{outline:unset}.text-footer-container textarea::placeholder{font-size:.75rem}.text-footer-container .text-footer-audio{flex:1;display:flex;justify-content:center;align-items:center}.text-footer-container audio{flex:1;outline:unset;width:auto;height:38px}.text-footer-container .delete-audio{display:flex;justify-content:center;align-items:center;color:#e74c3c;transition:background .3s;border-radius:50%;font-size:1rem;padding:10px;cursor:pointer;margin:0 5px;width:31px;height:31px}.text-footer-container .delete-audio:hover{background-color:rgba(208,0,0,.2)}.text-footer-container .max-characters{font-size:.575rem;z-index:1;color:#444;position:relative;top:30px;left:-30px}.text-footer-container .max-characters.no-width{width:0}.text-footer-container .text-footer-actions{display:flex}.text-footer-container .text-footer-actions.outside-buttons{display:flex;align-items:center;justify-content:flex-end;position:absolute;top:-42px;right:2px;background-color:#ddd;box-shadow:inset 0 -10px 5px -11px rgba(0,0,0,.5)}.text-footer-container .text-footer-actions .text-footer-actions--btn{display:flex;justify-content:center;align-items:center;color:#777;border-radius:50%;transition:background .3s;padding:10px;font-size:1rem;width:36px;height:36px;cursor:pointer;margin-right:2.5px}.text-footer-container .text-footer-actions .text-footer-actions--btn:last-child{margin-right:unset}.text-footer-container .text-footer-actions .text-footer-actions--btn:hover{background-color:rgba(0,0,0,.1)}.text-footer-container .text-footer-actions .text-footer-actions--btn.files-activated{background-color:rgba(0,0,0,.1)}.text-footer-container .text-footer-actions .text-footer-actions--btn.audio-activated{background-color:rgba(208,0,0,.7);color:#fff}.text-footer-container .text-footer-actions .text-footer-actions--btn.left-button{position:absolute;left:0}.text-footer-container .text-footer-hsm-container{margin:12px 0 7px 0}.text-footer-container .text-footer-hsm-container.full{width:100%}.text-footer-container .text-footer-hsm-container.almostFull{width:95%}.text-footer-container .text-footer-hsm-container.medium{width:75%}.text-footer-container .text-footer-hsm-container .text-footer-v-select{border-radius:5px;margin-bottom:5px}.text-footer-container .text-footer-hsm-container .text-footer-select-03{display:flex;align-items:center;flex:1;width:100%}.text-footer-container .text-footer-hsm-container .text-footer-select-03 .text-footer-v-select{flex:1}.text-footer-container .text-footer-hsm-container .text-footer-select-03 .text-footer--btn-select-03{transition-duration:.3s;user-select:none;cursor:pointer;box-shadow:inset 0 -3px rgba(0,0,0,.2);opacity:.9;border-radius:2.5px;display:flex;justify-content:center;align-items:center;margin-left:5px;margin-bottom:5px;background-color:#f7fe72;width:32px;height:32px}.text-footer-container .text-footer-hsm-container .text-footer-select-03 .text-footer--btn-select-03:hover{opacity:1}.text-footer-container .text-footer-hsm-container .text-footer-select-03 .text-footer--btn-select-03:active{opacity:1;box-shadow:inset 0 -1px rgba(0,0,0,.2);-webkit-transform:translateY(1px);-moz-transform:translateY(1px);-o-transform:translateY(1px);-ms-transform:translateY(1px);transform:translateY(1px)}.text-footer-container .text-footer-hsm-container .text-footer-select-03 .text-footer--btn-select-03 svg{font-size:1rem}.text-footer-container .text-footer-files-container{position:absolute;right:0;top:-55px;padding:5px;background-color:rgba(0,0,0,.4);border-radius:5px;display:flex;align-items:center;justify-content:space-between;z-index:1}.text-footer-container .text-footer-files-container.horizontal{right:-55px;flex-direction:column}.text-footer-container .text-footer-files-container .files-btn{transition-duration:.3s;transition-property:opacity;opacity:.8;cursor:pointer;display:flex;justify-content:center;align-items:center;border-radius:10px;padding:3px;width:40px;height:40px;font-size:1rem;color:#fff}.text-footer-container .text-footer-files-container .files-btn:hover{opacity:1}.text-footer-container .text-footer-files-container .files-btn svg{color:#fff}.text-footer-container .text-footer-files-container .files-btn.images{background-color:#9575cd;margin-right:5px}.text-footer-container .text-footer-files-container .files-btn.images.margin-bottom{margin-right:unset;margin-bottom:5px}.text-footer-container .text-footer-files-container .files-btn.docs{background-color:#7986cb}.text-footer-container .text-footer-files-container .files-btn.system{background-color:#49a349;margin-left:5px}.text-footer-container .text-footer-files-container .files-btn.both{font-size:.95rem;background-color:#5555ec;flex-direction:column}.text-footer-container .text-footer-files-container .files-btn.both svg:nth-child(1){transform:translateX(5px)}.text-footer-container .text-footer-files-container .files-btn.both svg:nth-child(2){transform:translateX(-5px)}.text-footer-container .text-footer-preview-container{width:100%;cursor:default;position:absolute;left:0;background-color:#f1f1f1;border:2px solid #ccc;border-bottom:unset;border-top-left-radius:2.5px;border-top-right-radius:2.5px}.text-footer-container .text-footer-preview-container.isDoc{top:-50px;width:100%;height:45px}.text-footer-container .text-footer-preview-container.isImg,.text-footer-container .text-footer-preview-container.isMultiple{top:-205px;width:100%;height:200px}.text-footer-container .text-footer-preview-container.isImg .text-footer-image-preview{height:170px}.text-footer-container .text-footer-preview-container.isError{top:-80px;width:100%;height:75px}.text-footer-container .text-footer-alt{margin-top:-12px;width:100%;padding:0 10px}.text-footer-container .text-footer-alt .text-footer-out-session{margin-top:12px}.text-footer-container .text-footer-alt .text-footer-sem-24h{font-size:.8rem;text-align:right;font-weight:600;letter-spacing:-.5px;color:#dd7f0c;margin-top:5px;position:absolute;right:0}.text-footer-container .text-footer-alt .sem-templates{margin-top:10px;font-size:.8rem;text-align:right;font-weight:600;letter-spacing:-.5px;color:#921e12}.text-footer-container .text-footer-alt .text-footer-templates{position:relative;width:100%}.text-footer-container .text-footer-alt .text-footer-templates .text-footer-group-selection{width:100%;display:flex;align-items:center}.text-footer-container .text-footer-alt .text-footer-templates .text-footer-group-selection h4{margin-right:5px}.text-footer-container .text-footer-alt .text-footer-templates .text-footer-group-selection .sm__select{flex:1}.vs__dropdown-menu{font-size:.85rem!important}.emoji-mart-anchor,.emoji-mart-emoji span{cursor:pointer!important}.emoji-mart{z-index:2!important}.emoji-mart-scroll{overflow-x:hidden}",
     map: undefined,
     media: undefined
@@ -8953,7 +8987,7 @@ var __vue_inject_styles__$j = function __vue_inject_styles__(inject) {
 var __vue_scope_id__$j = undefined;
 /* module identifier */
 
-var __vue_module_identifier__$j = "data-v-7d5d938e";
+var __vue_module_identifier__$j = "data-v-53fe87de";
 /* functional template */
 
 var __vue_is_functional_template__$j = false;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-intergrall-plugins",
-  "version": "0.0.225",
+  "version": "0.0.228",
   "description": "",
   "main": "dist/vue-intergrall-plugins.ssr.js",
   "browser": "dist/vue-intergrall-plugins.esm.js",

package/src/lib-components/Chat/BtnFiles.vue

@@ -1,9 +1,21 @@
 <template>
-  <span class="text-footer-actions--btn" :class="{'files-activated' : openFiles || file.length || file.name}" @click="openFilesByClip()">
+  <span class="text-footer-actions--btn" :class="{'files-activated' : openFiles || file.name}" @click="openFilesByClip()"> <!-- || file.length -->
+    <!-- <transition name="fade">
+      <span v-if="fileSize > 0" @click.stop="toggleFilePreview" v-tippy :content="`Visualizar ${fileSize} arquivo(s)`" class="files-counter">
+        {{ fileSize }}
+      </span>
+    </transition> -->
+    <fa-icon :icon="['fas', 'paperclip']" :title="dictionary.title_selecionar_anexo" />
     <transition name="fade">
-      <span v-if="fileSize > 0" class="files-counter" v-text="fileSize" @click.stop="toggleFilePreview" :title="dictionary.msg_abrir_anexos"></span>
+      <span v-if="fileSize > 0" @click.stop="toggleFilePreview" v-tippy :content="dictionary.msg_abrir_anexos" :class="`${fileSettings.filePreviewStyle == 2 ? 'files-counter-2' : 'files-counter'}`">
+        <template v-if="fileSettings.filePreviewStyle == 1">
+          {{ fileSize }}
+        </template>
+        <template v-else>
+          Anexos <fa-icon :icon="['fas', 'eye']" />
+        </template>
+      </span>
     </transition>
-    <fa-icon :icon="['fas', 'paperclip']" :title="dictionary.title_selecionar_anexo" />
     <transition name="show">
       <div v-if="openFiles && hasButtonFiles" class="text-footer-files-container" :class="{'horizontal' : cssStyle.outsideButtons}">
         <template v-if="!fileSettings.multiple">
@@ -91,6 +103,23 @@
 .files-counter:hover {
   opacity: 1
 }
+.files-counter-2 {
+  transform: translate(-15px, 28px);
+  opacity: .9;
+  position: absolute;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #888;
+  font-size: .8rem
+}
+.files-counter-2 svg {
+  margin-left: 5px;
+}
+.files-counter-2:hover {
+  opacity: 1;
+  text-decoration: underline;
+}
 </style>
 
 <script>
@@ -231,14 +260,13 @@ export default {
         if(this.fileFormatError) this.file = []
         this.openFiles = false
         const filesAux = !externalCall ? event.target.files ? event.target.files : event.dataTransfer.files : event
-        this.file = filesAux.length ? filesAux : this.file 
-
+        const isStackable = this.fileSettings.stackFiles && this.fileSettings.multiple
+        this.file =  filesAux.length ? isStackable ? this.file.concat(...filesAux) : filesAux : this.file
         if(!this.file.length) return
         if(this.file.length > this.fileSettings.max) {
           this.file = []
           return this.$toasted.global.defaultInfo({ msg: `Limite de ${this.fileSettings.max} arquivos` })
         }
-
         this.hasAnyFile = true
         this.fileSize = this.file.length
         if(!this.fileSettings.multiple) {
@@ -329,6 +357,10 @@ export default {
       if(this.isDoc) this.emitFileVars()
     },
     toggleFilePreview() {
+      if(this.fileSettings.handleFilePreview) {
+        this.emitFileVars()
+        return this.$emit("handle-file-preview")
+      }
       this.showFilePreview = !this.showFilePreview
       if(this.showFilePreview && this.openFiles) this.toggleFiles()
     },

package/src/lib-components/Chat/TextFooter.vue

@@ -69,6 +69,7 @@
           @open-image="openImage"
           @open-file-system="openFileSystem"
           @reset-file-system="resetFileSystem"
+          @handle-file-preview="$emit('handle-file-preview')"
         />
         <BtnExpand 
           v-show="buttons.hasExpand && !audioFile"
@@ -146,7 +147,7 @@ export default {
     },
     fileSettings: {
       type: Object,
-      default: () => { return { docsExtensions: "", imagesExtensions: "", multiple: false, systemButton: false, max: 3 } },
+      default: () => { return { docsExtensions: "", imagesExtensions: "", multiple: false, systemButton: false, max: 3, handleFilePreview: false, filePreviewStyle: 1, stackFiles: false } },
       required: false
     },
     textId: {