vue-intergrall-plugins 0.0.235 → 0.0.238

package/package.json

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

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

@@ -7,7 +7,7 @@
     </transition> -->
     <fa-icon :icon="['fas', 'paperclip']" :title="dictionary.title_selecionar_anexo" />
     <transition name="fade">
-      <span v-if="fileSize > 0" @click.stop="toggleFilePreview" v-tippy :content="dictionary.msg_abrir_anexos" :class="`${fileSettings.filePreviewStyle == 2 ? 'files-counter-2' : 'files-counter'}`">
+      <span v-if="fileSize > 0" @click.stop="toggleFilePreview" v-tippy :content="!fileSettings.handleFilePreview ? dictionary.msg_abrir_anexos : `${file.length} anexo(s) selecionado(s)`" :class="`${fileSettings.filePreviewStyle == 2 ? 'files-counter-2' : 'files-counter'}`">
         <template v-if="fileSettings.filePreviewStyle == 1">
           {{ fileSize }}
         </template>
@@ -266,6 +266,19 @@ export default {
         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
+
+        let sizeInBytes = 0
+        Array.from(this.file).forEach(file => sizeInBytes += file.size)
+        const sizeInMb = parseFloat((sizeInBytes / (1024*1024)).toFixed(2))
+        if(sizeInMb == 0) {
+          this.file = []
+          return this.$toasted.global.defaultInfo({ msg: this.dictionary.msg_arquivo_invalido }) 
+        }
+        if(sizeInMb >= 9.5) {
+          this.file = []
+          return this.$toasted.global.defaultInfo({ msg: `Limite de 9.5 MB por arquivo` })
+        }
+
         if(this.file.length > this.fileSettings.max) {
           this.file = []
           return this.$toasted.global.defaultInfo({ msg: `Limite de ${this.fileSettings.max} arquivos` })

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

@@ -0,0 +1,32 @@
+<template>
+  <div class="text-footer-actions--btn" @click="$emit('toggle-standard-messages')" :title="dictionary.title_screen_share">
+    <fa-icon :icon="['fas', 'desktop']" />
+    <fa-icon :icon="['fas', 'share']" />
+  </div>
+</template>
+
+<style scoped>
+  .text-footer-actions--btn {
+    position: relative;
+  }
+  .text-footer-actions--btn > svg:nth-child(1) {
+    font-size: 1.2rem;
+  }
+  .text-footer-actions--btn > svg:nth-child(2) {
+    font-size: .6rem;
+    position: absolute;
+    transform: translateY(-2px)
+  }
+</style>
+
+<script>
+export default {
+  props: {
+    dictionary: {
+      type: Object,
+      default: {},
+      required: false
+    }
+  }
+}
+</script>

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

@@ -38,12 +38,13 @@
         :message="message"
         :maxCharacters="textareaSettings.maxCharacters"
       />
-      <div class="text-footer-actions" v-if="buttons.hasSendButton">
-        <span class="text-footer-actions--btn" :title="dictionary.title_enviar_msg" @click="sendMessageHandler">
-          <fa-icon :icon="['fas', 'paper-plane']" />
-        </span>
-      </div>
-      <div v-if="buttons.hasFiles || buttons.hasAudio || buttons.hasExpand || formattedMessageSettings.hasStandardMessages" class="text-footer-actions" :class="{'outside-buttons' : cssStyle.outsideButtons && !audioFile}">
+      <div v-if="buttons.hasFiles || buttons.hasAudio || buttons.hasExpand || formattedMessageSettings.hasStandardMessages || buttons.hasScreenShare" class="text-footer-actions" :class="{'outside-buttons' : cssStyle.outsideButtons && !audioFile}">
+        <BtnScreenShare 
+          v-show="buttons.hasScreenShare && !audioFile"
+          @handle-screen-share="handleScreenShare"
+          :dictionary="dictionary"
+          :ref="`${textId}-screen-share`"
+        />
         <BtnMic 
           v-show="buttons.hasAudio && !audioFile"
           :dictionary="dictionary"
@@ -79,6 +80,11 @@
           :dictionary="dictionary"
         />
       </div>
+      <div class="text-footer-actions" v-if="buttons.hasSendButton">
+        <span class="text-footer-actions--btn" :title="dictionary.title_enviar_msg" @click="sendMessageHandler">
+          <fa-icon :icon="['fas', 'paper-plane']" />
+        </span>
+      </div>
     </div>
     <transition name="fade">
       <StandardMessages 
@@ -116,14 +122,15 @@ import BtnFiles from "./BtnFiles"
 import BtnExpand from "./BtnExpand"
 import BtnStandardMessages from "./BtnStandardMessages"
 import StandardMessages from "./StandardMessages"
+import BtnScreenShare from "./BtnScreenShare"
 
 export default {
-  components: { BtnEmojis, Loader, BtnMic, BtnFiles, BtnExpand, RemainingCharacters, BtnStandardMessages, StandardMessages },
+  components: { BtnEmojis, Loader, BtnMic, BtnFiles, BtnExpand, RemainingCharacters, BtnStandardMessages, StandardMessages, BtnScreenShare },
   mixins: [ clickaway ],
   props: {
     buttons: {
       type: Object,
-      default: () => { return { hasEmojis: false, hasSendButton: false, hasFiles: false, hasAudio: false, hasExpand: false } },
+      default: () => { return { hasEmojis: false, hasSendButton: false, hasFiles: false, hasAudio: false, hasExpand: false, hasScreenShare: false } },
       required: false
     },
     cssStyle: {
@@ -441,7 +448,7 @@ export default {
       try {
         e.stopPropagation()
         e.preventDefault()
-        if(!this.buttons.hasFiles) return false
+        if(!this.buttons.hasFiles || this.fileSettings.handleFileClick) return false
         const files = e.dataTransfer.files.length ? e.dataTransfer.files : ""
         this.filesHandler(files)
       }catch(e) {
@@ -463,6 +470,9 @@ export default {
         console.error(e)
       }
     },
+    handleScreenShare() {
+      this.$emit("handle-screen-share")
+    },
     toggleStandardMessages() {
       this.showStandardMessages = !this.showStandardMessages
     },