UNPKG

@limetech/lime-elements

Version:
1 lines 9.74 kB
import{r as e,c as t,h as a,H as r}from"./p-DBTJNfo7.js";import{t as i}from"./p-DVRaJQvC.js";function l(e){const t=e.trim().toLowerCase();return t.startsWith("https://")||t.startsWith("http://")}function o(e,t,a){return!!t.escapeNext&&(a(e),t.escapeNext=!1,!0)}function s(e,t,a){return!(!t.inQuotes||"\\"!==e||(a(e),t.escapeNext=!0,0))}function n(e,t,a){return'"'===e&&0===t.angleDepth&&(a(e),t.inQuotes=!t.inQuotes,!0)}function d(e,t,a){return!t.inQuotes&&("<"===e?(a(e),t.angleDepth+=1,!0):">"===e&&0!==t.angleDepth&&(a(e),t.angleDepth-=1,!0))}function m(e,t){return","===e&&!t.inQuotes&&0===t.angleDepth}function c(e,t=1){if(null==e||Number.isNaN(e))return"";if(e<0)return"";if(0===e)return"0 B";const a=["B","KB","MB","GB","TB","PB","EB","ZB","YB"],r=Math.max(0,Math.min(a.length-1,Math.floor(Math.log(e)/Math.log(1024)))),i=e/Math.pow(1024,r),l=Number.isFinite(t)?Math.trunc(t):0,o=i<10?Math.min(100,Math.max(0,l)):0;return`${Number.parseFloat(i.toFixed(o))} ${a[r]}`}const h=class{constructor(r){e(this,r),this.allowRemoteImagesChange=t(this,"allowRemoteImagesChange"),this.language="en",this.allowRemoteImagesState=!1,this.renderAttachment=(e,t)=>{var r,i;const l=(null===(r=e.filename)||void 0===r?void 0:r.trim())||this.getTranslation("file-viewer.email.attachment.unnamed"),o=(null===(i=e.mimeType)||void 0===i?void 0:i.trim())||"";return a("li",{key:`attachment-${t}`},a("span",{class:"attachment-filename"},l),a("span",{class:"attachment-mime-type"}," ",o),this.renderSizeBadge(e.size))},this.renderSizeBadge=e=>{if("number"==typeof e)return a("limel-badge",{class:"attachment-size",label:c(e)})},this.onEnableRemoteImagesClick=e=>{var t;null===(t=null==e?void 0:e.stopPropagation)||void 0===t||t.call(e),this.enableRemoteImages()},this.enableRemoteImages=()=>{void 0===this.allowRemoteImages?this.allowRemoteImagesState=!0:this.allowRemoteImagesChange.emit(!0)}}resetAllowRemoteImages(e,t){e?e.from!==(null==t?void 0:t.from)&&(this.allowRemoteImagesState=!1):this.allowRemoteImagesState=!1}render(){return a(r,{key:"b37cad79c4d85f9cef78ef741d882d5384c039db"},a("div",{key:"89e9fa6c9c39234ec9268d93837f0b27f328d046",class:"email",part:"email"},this.renderHeaders(),this.renderRemoteImageBanner(),a("section",{key:"01f4c97918464218bc0d4ab4e79214027993360d"},this.renderAttachments(),this.renderBody())))}renderHeaders(){return a("div",{class:"email-headers",part:"email-headers"},["subject","from","to","cc","date"].map((e=>{var t;return this.renderEmailHeader(e,this.getTranslation(`file-viewer.email.${e}`),null===(t=this.email)||void 0===t?void 0:t[e])})))}renderBody(){return this.renderBodyHtml()||this.renderBodyText()||this.renderFallbackUrl()||a("slot",{name:"fallback"})}renderBodyHtml(){var e;const t=null===(e=this.email)||void 0===e?void 0:e.bodyHtml;if(!t)return;const r=function(e,t){if(!t)return e;const a=(new DOMParser).parseFromString(e,"text/html"),r=a.querySelectorAll("img[data-remote-src]");for(const e of r){const t=e.dataset.remoteSrc;t&&l(t)?(e.setAttribute("src",t),delete e.dataset.remoteSrc):delete e.dataset.remoteSrc}return`${[...a.head.querySelectorAll("style")].map((e=>e.outerHTML)).join("")}${a.body.innerHTML}`}(t,this.getAllowRemoteImages());return a("div",{class:"body",innerHTML:r,part:"email-body"})}renderBodyText(){var e;const t=null===(e=this.email)||void 0===e?void 0:e.bodyText;if(t)return a("pre",{class:"body plain-text",part:"email-body"},t)}renderFallbackUrl(){if(this.fallbackUrl)return a("object",{data:this.fallbackUrl,type:"text/plain"},a("slot",{name:"fallback"}))}renderEmailHeader(e,t,r){if(!r)return;const i=this.getHeaderValues(e,r);return a("dl",{class:`headers ${e}`},a("dt",null,t),i.map(((t,r)=>a("dd",{key:`${e}-${r}`},t))))}getHeaderValues(e,t){return"to"===e||"cc"===e?function(e){const t=[];let a="";const r={inQuotes:!1,escapeNext:!1,angleDepth:0},i=e=>{a+=e},l=()=>{const e=a.trim();e&&t.push(e),a=""};for(const t of e)o(t,r,i)||s(t,r,i)||n(t,r,i)||d(t,r,i)||(m(t,r)?l():i(t));return l(),t}(t):[t]}renderAttachments(){var e;const t=null===(e=this.email)||void 0===e?void 0:e.attachments;if(!(null==t?void 0:t.length))return;const r=this.getTranslation("file-viewer.email.attachments");return a("div",{class:"attachments"},a("span",null,r),a("ul",null,t.map(((e,t)=>this.renderAttachment(e,t)))))}getTranslation(e){return i.get(e,this.language)}shouldShowRemoteImagesBanner(){var e;const t=null===(e=this.email)||void 0===e?void 0:e.bodyHtml;return!(!t||this.getAllowRemoteImages())&&(a=t,null!==(new DOMParser).parseFromString(a,"text/html").querySelector("img[data-remote-src]"));var a}renderRemoteImageBanner(){if(!this.shouldShowRemoteImagesBanner())return;const e=this.getTranslation("file-viewer.email.remote-images.warning"),t=this.getTranslation("file-viewer.email.remote-images.warning.description"),r=this.getTranslation("file-viewer.email.remote-images.load");return a("limel-collapsible-section",{header:e,icon:{name:"warning_shield",color:"rgb(var(--color-orange-default))"},language:this.language},a("button",{type:"button",class:"load-images",slot:"header",onClick:this.onEnableRemoteImagesClick},r),a("limel-markdown",{value:t}))}getAllowRemoteImages(){var e;return null!==(e=this.allowRemoteImages)&&void 0!==e?e:this.allowRemoteImagesState}static get watchers(){return{email:[{resetAllowRemoteImages:0}]}}};h.style='@charset "UTF-8";:host(limel-email-viewer){display:block;width:100%;height:100%;box-sizing:border-box}*,*::before,*::after{box-sizing:border-box;min-width:0;min-height:0}.email{display:flex;flex-direction:column;width:100%;height:100%;padding-bottom:0.5rem;box-shadow:var(--shadow-depth-8)}.email-headers{position:relative;flex-shrink:0;display:flex;flex-direction:column}.email-headers dl,.email-headers dt,.email-headers dd{margin:0}.email-headers dl{display:flex;flex-wrap:wrap;gap:0 0.5rem;padding:0.5rem 0.75rem;font-size:0.75rem}.email-headers dl:nth-child(even){background-color:rgb(var(--contrast-800), 0.1)}.email-headers dl dt{opacity:0.6;min-width:3rem}.email-headers dl dt::after{content:":"}.email-headers dl dd:not(:last-child)::after{content:",";opacity:0.6}.email-headers dl.subject dd{font-weight:bold}.email-headers dl.date{position:absolute;right:0.25rem;bottom:0;transform:translateY(50%);font-size:0.625rem;border-radius:9rem;padding:0.125rem 0.25rem;background-color:rgb(var(--contrast-100), 0.8);border:rgb(var(--contrast-600)) solid 1px}.email-headers dl.date dt{position:absolute;width:0;height:0;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0, 0, 0, 0);clip-path:inset(50%);white-space:nowrap}.attachments{flex-shrink:0;padding:0.5rem;border-bottom:1px dashed rga(var(--contrast-700))}.attachments span{padding-left:0.25rem;font-size:0.75rem;opacity:0.6}.attachments span:first-child::after{content:":"}.attachments ul{all:unset;display:grid;grid-template-columns:repeat(auto-fill, minmax(8rem, 1fr));gap:0.5rem;padding:0.5rem 0}.attachments li{all:unset;position:relative;display:flex;flex-direction:column;gap:0.25rem;font-size:0.6875rem;line-height:normal;padding:0.5rem 0.5rem 1rem 0.5rem;border-radius:0.5rem;border:1px solid rgba(var(--contrast-600));background-color:rgba(var(--contrast-400))}.attachments .attachment-filename{font-weight:500}.attachments .attachment-mime-type{opacity:0.7}.attachments limel-badge{--badge-max-width:auto;--badge-background-color:rgb(var(--contrast-1000), 0.7);--badge-text-color:rgb(var(--color-white));position:absolute;bottom:0.125rem;right:0.125rem;box-shadow:var(--shadow-brighten-edges-outside)}section{flex-grow:1;display:flex;flex-direction:column;border-top:1px dashed rgba(var(--contrast-700));min-height:2rem;overflow-y:auto}limel-collapsible-section{--closed-header-background-color:var( --lime-elevated-surface-background-color );flex-grow:1;flex-shrink:0;margin:0.5rem;border-radius:0.75rem;box-shadow:var(--shadow-depth-8)}limel-collapsible-section button{all:unset;flex-shrink:0;border-radius:0.375rem;padding:0.25rem 0.5rem;font-size:var(--limel-theme-small-font-size);margin:0 0.5rem}limel-collapsible-section button.load-images{transition:color var(--limel-clickable-transition-speed, 0.4s) ease, background-color var(--limel-clickable-transition-speed, 0.4s) ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease, transform var(--limel-clickable-transform-speed, 0.4s) var(--limel-clickable-transform-timing-function, ease);cursor:pointer;color:var(--lime-primary-color, var(--limel-theme-primary-color));background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal)}limel-collapsible-section button.load-images:hover,limel-collapsible-section button.load-images:focus,limel-collapsible-section button.load-images:focus-visible{will-change:color, background-color, box-shadow, transform}limel-collapsible-section button.load-images:hover,limel-collapsible-section button.load-images:focus-visible{transform:translate3d(0, -0.04rem, 0);color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}limel-collapsible-section button.load-images:active{--limel-clickable-transform-timing-function:cubic-bezier( 0.83, -0.15, 0.49, 1.16 );transform:translate3d(0, 0.05rem, 0);box-shadow:var(--button-shadow-pressed)}limel-collapsible-section button.load-images:hover,limel-collapsible-section button.load-images:active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}limel-collapsible-section limel-markdown{padding:0.5rem}.body{flex-grow:1;max-width:100%;padding:0.75rem}.body.plain-text{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;font-family:inherit}.body img{max-width:100% !important}';export{h as limel_email_viewer}