@scania/tegel
Version:
Tegel Design System
1 lines • 4.68 kB
JavaScript
import{r as t,c as s,h as o,H as e,a}from"./p-9xxNGlso.js";import{g as r}from"./p-Cn4f8w1e.js";import{h as d}from"./p-DDX6uFcm.js";const i=class{constructor(o){t(this,o),this.tdsClose=s(this,"tdsClose",7),this.toastId=r(),this.variant="information",this.hidden=!1,this.closable=!0,this.toastRole="alert",this.tdsAriaLive="polite",this.getIconName=()=>{switch(this.variant){case"information":default:return"info";case"error":return"error";case"warning":return"warning";case"success":return"tick"}},this.handleClose=()=>{this.tdsClose.emit({toastId:this.toastId}).defaultPrevented||(this.hidden=!0)},this.handleShow=()=>{this.tdsClose.emit({toastId:this.toastId}).defaultPrevented||(this.hidden=!1)}}async hideToast(){this.hidden=!0}async showToast(){this.hidden=!1}connectedCallback(){this.tdsCloseAriaLabel||console.warn("tds-toast: tdsCloseAriaLabel is required")}render(){const t=d("header",this.host),s=d("subheader",this.host),a=d("actions",this.host);return o(e,{key:"05cfab6acac4bf8a86b3bfede4ddfa80d9f1a304","aria-live":this.tdsAriaLive,toastRole:this.toastRole,"aria-describedby":this.host.getAttribute("aria-describedby"),class:{hide:this.hidden,show:!this.hidden}},o("div",{key:"32583b47e144a437be6c194445b22f4a0aa00ba8",class:`\n wrapper\n ${this.variant}`},o("tds-icon",{key:"0a3b7c306323b02ae1b1ef67cbe339f51404dade",name:this.getIconName(),size:"20px",svgTitle:this.getIconName()}),o("div",{key:"f8759ce8357c526cfedc218220c950b1b5e637c7",class:"content"},o("div",{key:"bb4487290f95f36554afc7f6b2ce672eda8eaebc",class:"header-subheader"},this.header&&o("div",{key:"ff99a04a22409cd318710d013e8d25b8a0aa3861",class:"header"},this.header),t&&o("slot",{key:"101a2ada1599fdc15b90ccc658e508b51dee2900",name:"header"}),this.subheader&&o("div",{key:"2edc1acb846a8a364bc589f90891b07722d558c9",class:"subheader"},this.subheader),s&&o("slot",{key:"572ff0654cd2eda217ff0f124e8599748b71d151",name:"subheader"})),a&&o("div",{key:"efb4061f8574866c8944d1349d37cae8d7348993",class:"toast-bottom "+(s||this.subheader?"subheader":"no-subheader")},o("slot",{key:"ae41441a2d602ae150ec685725a7ee6722e84a4e",name:"actions"}))),this.closable&&o("button",{key:"52f934fb79a07225a393ff799e6189aa51052b6c",id:"my-button","aria-label":this.tdsCloseAriaLabel,onClick:this.handleClose,class:"close"},o("tds-icon",{key:"c208a433f3be14c1ad2e38a74ef9945ab05bbf7d",name:"cross",size:"20px",svgTitle:"cross"}))))}get host(){return a(this)}};i.style=":host(.hide){display:none;visibility:hidden}:host{z-index:800}:host .wrapper{display:flex;width:348px;background-color:var(--tds-toast-background-color);border-radius:4px}:host .wrapper.information{border-left:4px solid var(--tds-toast-color-info)}:host .wrapper.information tds-icon{color:var(--tds-toast-color-info)}:host .wrapper.success{border-left:4px solid var(--tds-toast-color-success)}:host .wrapper.success tds-icon{color:var(--tds-toast-color-success)}:host .wrapper.error{border-left:4px solid var(--tds-toast-color-error)}:host .wrapper.error tds-icon{color:var(--tds-toast-color-error)}:host .wrapper.warning{border-left:4px solid var(--tds-toast-color-warning)}:host .wrapper.warning tds-icon{color:var(--tds-toast-icon-color-warning)}:host .wrapper button.close{height:20px;width:20px;display:flex;align-items:center;justify-content:center;margin:14px 14px 0 22px;border:none;background:transparent}:host .wrapper button.close:hover{cursor:pointer}:host .wrapper button.close:focus{outline:2px solid var(--tds-focus-outline-color);box-shadow:0 0 0 1px var(--tds-white);outline-offset:1px;z-index:1}:host .wrapper button.close tds-icon{color:var(--tds-toast-dissmiss-color);padding:0}:host tds-icon{padding:14px 0 0 12px}:host .content{padding:16px 0 16px 10px;display:flex;flex-direction:column;flex:1;max-width:250px;word-break:break-word}:host .content .header-subheader{display:flex;flex-direction:column;gap:4px}:host .content .header,:host .content slot[name=header]::slotted(*){font:var(--tds-headline-07) !important;letter-spacing:var(--tds-headline-07-ls) !important;color:var(--tds-toast-headline-color)}:host .content .subheader,:host .content slot[name=subheader]::slotted(*){color:var(--tds-toast-subheadline-color);font:var(--tds-detail-02) !important;letter-spacing:var(--tds-detail-02-ls) !important}:host .content .subheader.no-link slot::slotted(*),:host .content slot[name=subheader]::slotted(*).no-link slot::slotted(*){padding-bottom:0}:host .content .toast-bottom{padding-top:12px}:host .tds-mode-variant-primary{--tds-toast-background:var(--tds-toast-background-primary)}:host .tds-mode-variant-secondary{--tds-toast-background:var(--tds-toast-background-secondary)}";export{i as tds_toast}