(function(t,e,n,i){"use strict";var l={property:"DELIMITER",name:"bx-messenger-element-attach-delimiter",component:{props:{config:{type:Object,default:{}},color:{type:String,default:"transparent"}},computed:{styles:function t(){return{width:this.config.DELIMITER.SIZE?this.config.DELIMITER.SIZE+"px":"",backgroundColor:this.config.DELIMITER.COLOR?this.config.DELIMITER.COLOR:this.color}}},template:'<div class="bx-im-element-attach-type-delimiter" :style="styles">Delimiter</div>'}};var a={property:"FILE",name:"bx-messenger-element-attach-file",component:{props:{config:{type:Object,default:{}},color:{type:String,default:"transparent"}},methods:{openLink:function t(e){n.Utils.platform.openNewPage(e.LINK)},file:function t(){return{name:this.config.FILE.NAME,extension:this.config.FILE.NAME.split(".").splice(-1)[0],size:this.config.FILE.SIZE}},fileName:function t(e){var n=70;if(!e.NAME||e.NAME.length<n){return e.NAME}var i=10;var l=e.NAME.split(".").splice(-1)[0];var a=e.NAME.substring(e.NAME.length-1-(l.length+1+i));var m=e.NAME.substring(0,n-a.length-3);return m.trim()+"..."+a.trim()},fileNameFull:function t(e){return n.Utils.text.htmlspecialcharsback(e.NAME)},fileSize:function t(e){var n=e.SIZE;if(n<=0){return""}var i=["BYTE","KB","MB","GB","TB"];var l=0;while(n>=1024&&l<4){n/=1024;l++}return Math.round(n)+" "+this.localize["IM_MESSENGER_ATTACH_FILE_SIZE_"+i[l]]},fileIcon:function t(n){return e.FilesModel.getIconType(n.NAME.split(".").splice(-1)[0])}},computed:{localize:function t(){return i.Vue.getFilteredPhrases("IM_MESSENGER_ATTACH_FILE_",this.$root.$bitrixMessages)}},template:'\n\t\t\t<div class="bx-im-element-attach-type-file-element">\n\t\t\t\t<template v-for="(element, index) in config.FILE">\n\t\t\t\t\t<div class="bx-im-element-attach-type-file" @click="openLink(element)">\n\t\t\t\t\t\t<div class="bx-im-element-attach-type-file-icon">\n\t\t\t\t\t\t\t<div :class="[\'ui-icon\', \'ui-icon-file-\'+fileIcon(element)]"><i></i></div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class="bx-im-element-attach-type-file-block">\n\t\t\t\t\t\t\t<div class="bx-im-element-attach-type-file-name" :title="fileNameFull(element)">\n\t\t\t\t\t\t\t\t{{fileName(element)}}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class="bx-im-element-attach-type-file-size">{{fileSize(element)}}</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t</div>\n\t\t'}};var m={property:"GRID",name:"bx-messenger-element-attach-grid",component:{props:{config:{type:Object,default:{}},color:{type:String,default:"transparent"}},created:function t(){if(n.Utils.platform.isBitrixMobile()){this.maxCellWith=Math.floor(Math.min(screen.availWidth,screen.availHeight)/4)}else{this.maxCellWith=null}},methods:{openLink:function t(e){if(e.LINK){n.Utils.platform.openNewPage(e.LINK)}},getWidth:function t(e){if(this.type!=="row"){return e.WIDTH?e.WIDTH+"px":""}if(!e.VALUE){return false}if(this.maxCellWith&&e.WIDTH>this.maxCellWith){return this.maxCellWith+"px"}return e.WIDTH?e.WIDTH+"px":""},getValue:function t(n){if(!n.VALUE){return""}return e.MessagesModel.decodeBbCode({text:n.VALUE})}},computed:{type:function t(){return this.config.GRID[0].DISPLAY.toLowerCase()}},template:'\n\t\t\t<div class="bx-im-element-attach-type-grid">\n\t\t\t\t<template v-if="type === \'block\'">\n\t\t\t\t\t<template v-for="(element, index) in config.GRID">\n\t\t\t\t\t\t<div class="bx-im-element-attach-type-grid-display bx-im-element-attach-type-display-block" :style="{width: getWidth(element)}">\n\t\t\t\t\t\t\t<div class="bx-im-element-attach-type-grid-element-name" v-html="element.NAME"></div>\n\t\t\t\t\t\t\t<template v-if="element.LINK">\n\t\t\t\t\t\t\t\t<div class="bx-im-element-attach-type-grid-element-value bx-im-element-attach-type-grid-element-value-link" @click="openLink(element)" v-html="getValue(element)"></div>\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t<template v-else>\n\t\t\t\t\t\t\t\t<div class="bx-im-element-attach-type-grid-element-value" v-html="getValue(element)"></div>\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t</div>\t\n\t\t\t\t\t</template>\n\t\t\t\t</template>\n\t\t\t\t<template v-else-if="type === \'line\'">\n\t\t\t\t\t<template v-for="(element, index) in config.GRID">\n\t\t\t\t\t\t<div class="bx-im-element-attach-type-grid-display bx-im-element-attach-type-display-card" :style="{width: getWidth(element)}">\n\t\t\t\t\t\t\t<div class="bx-im-element-attach-type-grid-element-name" v-html="element.NAME"></div>\n\t\t\t\t\t\t\t<template v-if="element.LINK">\n\t\t\t\t\t\t\t\t<div class="bx-im-element-attach-type-grid-element-value bx-im-element-attach-type-grid-element-value-link" @click="openLink(element)" v-html="getValue(element)" :style="{color: element.COLOR? element.COLOR: \'\'}"></div>\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t<template v-else>\n\t\t\t\t\t\t\t\t<div class="bx-im-element-attach-type-grid-element-value" v-html="getValue(element)" :style="{color: element.COLOR? element.COLOR: \'\'}"></div>\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</template>\n\t\t\t\t</template>\n\t\t\t\t<template v-else-if="type === \'row\'">\n\t\t\t\t\t<div class="bx-im-element-attach-type-grid-display bx-im-element-attach-type-display-column">\n\t\t\t\t\t\t<table class="bx-im-element-attach-type-display-column-table">\n\t\t\t\t\t\t\t<tbody>\n\t\t\t\t\t\t\t\t<template v-for="(element, index) in config.GRID">\n\t\t\t\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t\t\t\t<template v-if="element.NAME">\n\t\t\t\t\t\t\t\t\t\t\t<td class="bx-im-element-attach-type-grid-element-name" :colspan="element.VALUE? 1: 2" v-html="element.NAME" :style="{width: getWidth(element)}"></td>\n\t\t\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t\t\t\t<template v-if="element.VALUE">\n\t\t\t\t\t\t\t\t\t\t\t<template v-if="element.LINK">\n\t\t\t\t\t\t\t\t\t\t\t\t<td class="bx-im-element-attach-type-grid-element-value bx-im-element-attach-type-grid-element-value-link" @click="openLink(element)" v-html="getValue(element)" :colspan="element.NAME? 1: 2" :style="{color: element.COLOR? element.COLOR: \'\'}"></td>\n\t\t\t\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t\t\t\t\t<template v-else>\n\t\t\t\t\t\t\t\t\t\t\t\t<td class="bx-im-element-attach-type-grid-element-value" v-html="getValue(element)" :colspan="element.NAME? 1: 2" :style="{color: element.COLOR? element.COLOR: \'\'}"></td>\n\t\t\t\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t</tbody>\n\t\t\t\t\t\t</table>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t</div>\n\t\t'}};var o={property:"HTML",name:"bx-messenger-element-attach-html",component:{props:{config:{type:Object,default:{}},color:{type:String,default:"transparent"}},template:'<div class="bx-im-element-attach-type-html" v-html="config.HTML"></div>'}};var c={property:"IMAGE",name:"bx-messenger-element-attach-image",component:{props:{config:{type:Object,default:{}},color:{type:String,default:"transparent"}},methods:{open:function t(e){if(!e){return false}if(n.Utils.platform.isBitrixMobile()){BXMobileApp.UI.Photo.show({photos:[{url:e}],default_photo:e})}else{window.open(e,"_blank")}},getImageSize:function t(e,n,i){var l;if(e>i){l=i/e}else{l=1}return{width:e*l,height:n*l}},getElementSource:function t(e){return e.PREVIEW?e.PREVIEW:e.LINK},getElementTitle:function t(e){return n.Utils.text.htmlspecialcharsback(e.NAME)},lazyLoadCallback:function t(e){if(!e.element.style.width){e.element.style.width=e.element.offsetWidth+"px"}if(!e.element.style.height){e.element.style.height=e.element.offsetHeight+"px"}},styleFileSizes:function t(e){if(!(e.WIDTH&&e.HEIGHT)){return{maxHeight:"100%",backgroundSize:"contain"}}var n=this.getImageSize(e.WIDTH,e.HEIGHT,250);return{width:n.width+"px",height:n.height+"px",backgroundSize:n.width<100||n.height<100?"contain":"initial"}},styleBoxSizes:function t(e){if(!(e.WIDTH&&e.HEIGHT)){return{height:"150px"}}if(parseInt(this.styleFileSizes(e).height)<=250){return{}}return{height:"280px"}}},template:'\n\t\t\t<div class="bx-im-element-attach-type-image">\n\t\t\t\t<template v-for="(image, index) in config.IMAGE">\n\t\t\t\t\t<div class="bx-im-element-attach-type-image-block" @click="open(image.LINK)" :style="styleBoxSizes(image)" :key="index">\n\t\t\t\t\t\t<img v-bx-lazyload="{callback: lazyLoadCallback}"\n\t\t\t\t\t\t\tclass="bx-im-element-attach-type-image-source"\n\t\t\t\t\t\t\t:data-lazyload-src="getElementSource(image)"\n\t\t\t\t\t\t\t:style="styleFileSizes(image)"\n\t\t\t\t\t\t\t:title="getElementTitle(image)"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t</div>\n\t\t'}};var r={property:"LINK",name:"bx-messenger-element-attach-link",component:{props:{config:{type:Object,default:{}},color:{type:String,default:"transparent"}},methods:{getImageConfig:function t(e){return{IMAGE:[{NAME:e.NAME,PREVIEW:e.PREVIEW,WIDTH:e.WIDTH,HEIGHT:e.HEIGHT}]}},openLink:function t(e){if(e.LINK){n.Utils.platform.openNewPage(e.LINK)}}},computed:{imageComponentName:function t(){return c.name}},components:babelHelpers.defineProperty({},c.name,c.component),template:'\n\t\t\t<div class="bx-im-element-attach-type-link">\n\t\t\t\t<template v-for="(element, index) in config.LINK">\n\t\t\t\t\t<div class="bx-im-element-attach-type-link-element" :key="index">\n\t\t\t\t\t\t<div v-if="element.PREVIEW" class="bx-im-element-attach-type-link-image" @click="openLink(element)">\n\t\t\t\t\t\t\t<component :is="imageComponentName" :config="getImageConfig(element)" :color="color"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class="bx-im-element-attach-type-link-name" @click="openLink(element)" v-html="element.NAME"></div>\n\t\t\t\t\t\t<div v-if="element.DESC" class="bx-im-element-attach-type-link-desc" v-html="element.DESC"></div>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t</div>\n\t\t'}};var s={property:"MESSAGE",name:"bx-messenger-element-attach-message",component:{props:{config:{type:Object,default:{}},color:{type:String,default:"transparent"}},computed:{message:function t(){return e.MessagesModel.decodeBbCode({text:this.config.MESSAGE})}},template:'<div class="bx-im-element-attach-type-message" v-html="message"></div>'}};var p={property:"RICH_LINK",name:"bx-messenger-element-attach-rich",component:{props:{config:{type:Object,default:{}},color:{type:String,default:"transparent"}},methods:{getImageConfig:function t(e){return{IMAGE:[{NAME:e.NAME,PREVIEW:e.PREVIEW,WIDTH:e.WIDTH,HEIGHT:e.HEIGHT}]}},openLink:function t(e){if(e.LINK){n.Utils.platform.openNewPage(e.LINK)}}},computed:{imageComponentName:function t(){return c.name}},components:babelHelpers.defineProperty({},c.name,c.component),template:'\n\t\t\t<div class="bx-im-element-attach-type-rich">\n\t\t\t\t<template v-for="(element, index) in config.RICH_LINK">\n\t\t\t\t\t<div class="bx-im-element-attach-type-rich-element" :key="index">\n\t\t\t\t\t\t<div v-if="element.PREVIEW" class="bx-im-element-attach-type-rich-image" @click="openLink(element)">\n\t\t\t\t\t\t\t<component :is="imageComponentName" :config="getImageConfig(element)" :color="color"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class="bx-im-element-attach-type-rich-name" @click="openLink(element)" v-html="element.NAME"></div>\n\t\t\t\t\t\t<div v-if="element.DESC" class="bx-im-element-attach-type-rich-desc" v-html="element.DESC"></div>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t</div>\n\t\t'}};var d={property:"USER",name:"bx-messenger-element-attach-user",component:{props:{config:{type:Object,default:{}},color:{type:String,default:"transparent"}},methods:{openLink:function t(e){if(e.LINK){n.Utils.platform.openNewPage(e.LINK)}},getAvatarType:function t(e){if(e.AVATAR){return""}var n="user";if(e.AVATAR_TYPE==="CHAT"){n="chat"}else if(e.AVATAR_TYPE==="BOT"){n="bot"}return"bx-im-element-attach-type-user-avatar-type-"+n}},template:'\n\t\t\t<div class="bx-im-element-attach-type-user">\n\t\t\t\t<template v-for="(element, index) in config.USER">\n\t\t\t\t\t<div class="bx-im-element-attach-type-user-body" @click="openLink(element)">\n\t\t\t\t\t\t<div class="bx-im-element-attach-type-user-avatar">\n\t\t\t\t\t\t\t<div :class="[\'bx-im-element-attach-type-user-avatar-type\', getAvatarType(element)]" :style="{backgroundColor: element.AVATAR? \'\': color}">\n\t\t\t\t\t\t\t\t<img v-if="element.AVATAR" \n\t\t\t\t\t\t\t\t\tv-bx-lazyload\n\t\t\t\t\t\t\t\t\tclass="bx-im-element-attach-type-user-avatar-source"\n\t\t\t\t\t\t\t\t\t:data-lazyload-src="element.AVATAR"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class="bx-im-element-attach-type-user-name" v-html="element.NAME"></div>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t</div>\n\t\t'}};var f=[l,a,m,o,c,r,s,p,d];var h={};f.forEach(function(t){h[t.name]=t.component});i.Vue.component("bx-messenger-element-attach",{props:{config:{type:Object,default:{}},baseColor:{type:String,default:"#17a3ea"}},methods:{getComponentForBlock:function t(e){var n=true;var i=false;var l=undefined;try{for(var a=f[Symbol.iterator](),m;!(n=(m=a.next()).done);n=true){var o=m.value;if(typeof e[o.property]!=="undefined"){return o.name}}}catch(t){i=true;l=t}finally{try{if(!n&&a.return!=null){a.return()}}finally{if(i){throw l}}}return""}},computed:{color:function t(){if(typeof this.config.COLOR==="undefined"||!this.config.COLOR){return this.baseColor}if(this.config.COLOR==="transparent"){return""}return this.config.COLOR}},components:h,template:'\n\t\t<div class="bx-im-element-attach">\n\t\t\t<div v-if="color" class="bx-im-element-attach-border" :style="{borderColor: color}"></div>\n\t\t\t<div class="bx-im-element-attach-content">\n\t\t\t\t<template v-for="(block, index) in config.BLOCKS">\n\t\t\t\t\t<component :is="getComponentForBlock(block)" :config="block" :color="color" :key="index" />\n\t\t\t\t</template>\n\t\t\t</div>\n\t\t</div>\n\t'})})(this.window=this.window||{},BX.Messenger.Model,BX.Messenger,BX);
//# sourceMappingURL=attach.bundle.map.js