@rededor/cura 2.0.0-alpha.10 → 2.0.0-alpha.12

package/dist/components/cura-tabs.js

@@ -1,146 +1 @@
-import { p as proxyCustomElement, H, e as createEvent, h, d as Host } from './p-D1cPOZpG.js';
-import { l as labelSizes } from './p-CHcd-uKK.js';
-import { d as defineCustomElement$3 } from './p-B5aO1chh.js';
-import { d as defineCustomElement$2 } from './p-DR1RHrEX.js';
-
-const curaTabsCss = ":host button,:host a{outline:none;box-shadow:none;box-sizing:border-box;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;border-radius:var(--border-radius);position:relative;background-color:transparent;box-sizing:border-box;border:none;min-width:120px;width:fit-content;display:flex;align-items:center;justify-content:center;border-radius:4px 4px 0 0}:host button:focus,:host a:focus{outline:2px solid #6EA8FF}:host button.border-bottom,:host a.border-bottom{border-bottom:1px solid var(--border-bottom-color)}:host button:not(.disabled,.selected):hover,:host a:not(.disabled,.selected):hover{background-color:var(--background-color-hover)}:host button:not(.disabled,.selected):hover.light,:host a:not(.disabled,.selected):hover.light{border-bottom-color:var(--primary-dark)}:host button:not(.disabled,.selected):hover.dark,:host a:not(.disabled,.selected):hover.dark{border-bottom-color:var(--neutral-purewhite)}:host button.small,:host a.small{padding:calc(var(--cura-spacing-base) * 2px) calc(var(--cura-spacing-base) * 2px)}:host button.medium,:host a.medium{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px)}:host button.large,:host a.large{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 4px)}:host button:focus,:host a:focus{border:2px solid var(--primary-light)}:host button cura-icon,:host a cura-icon{margin-right:calc(var(--cura-spacing-base) * 2px)}:host button.selected,:host a.selected{cursor:pointer;background-color:var(--background-color-selected)}:host button.selected.disabled,:host a.selected.disabled{background-color:var(--background-disabled-selected)}:host button.disabled,:host a.disabled{cursor:not-allowed}";
-
-const CuraTabs$1 = /*@__PURE__*/ proxyCustomElement(class CuraTabs extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.tabSelect = createEvent(this, "tabSelect");
-        this.selected = false;
-        this.disabled = false;
-        this.borderBottom = true;
-        this.size = 'large';
-        this.colorMode = 'light';
-        this.hovered = false;
-        this.styles = {};
-    }
-    setColors() {
-        const colors = [
-            { name: '--background-color-selected', theme: this.colorMode === 'light' ? 'primary-base' : 'primary-lighter' },
-            { name: '--background-color-hover', theme: this.colorMode === 'light' ? 'primary-lighter' : null },
-            {
-                name: '--background-disabled-selected',
-                theme: this.colorMode === 'light' ? 'neutral-pale' : 'neutral-black',
-            },
-            {
-                name: '--border-bottom-color',
-                theme: this.colorMode === 'light' ? 'neutral-base' : 'primary',
-            },
-        ];
-        colors.forEach(c => {
-            if (c.theme)
-                this.styles[c.name] = window.CuraAPI.theme.colors.getColor(c.theme);
-        });
-        this.styles = Object.assign({}, this.styles);
-    }
-    computeContentColor() {
-        if (this.disabled)
-            return 'neutral-dark';
-        if (this.colorMode === 'dark') {
-            if (this.hovered && !this.selected) {
-                return 'neutral-purewhite';
-            }
-            return this.selected ? 'neutral-black' : 'primary-lighter';
-        }
-        return this.selected ? 'neutral-purewhite' : 'primary-dark';
-    }
-    updateDynamicStyles() {
-        if (this.colorMode === 'dark' && this.hovered && !this.selected) {
-            this.styles = Object.assign(Object.assign({}, this.styles), { '--border-bottom-color': window.CuraAPI.theme.colors.getColor('neutral-purewhite') });
-        }
-    }
-    getIcon() {
-        if (!this.iconName)
-            return '';
-        const iconSize = this.size === 'large' ? 20 : 16;
-        const iconColor = this.computeContentColor();
-        return h("cura-icon", { name: this.iconName, size: iconSize, color: iconColor });
-    }
-    getClasses() {
-        return {
-            [this.size]: true,
-            [this.colorMode]: true,
-            'selected': this.selected,
-            'disabled': this.disabled,
-            'border-bottom': this.borderBottom,
-        };
-    }
-    connectedCallback() {
-        this.styles = Object.assign(Object.assign({}, this.styles), { '--primary-dark': window.CuraAPI.theme.colors.getColor('primary-dark'), '--neutral-purewhite': window.CuraAPI.theme.colors.getColor('neutral-purewhite'), '--base-spacing': window.CuraAPI.theme.spacing.getSpacing() });
-        this.setColors();
-    }
-    handleMouseEnter() {
-        if (this.disabled)
-            return;
-        this.hovered = true;
-    }
-    handleMouseLeave() {
-        this.hovered = false;
-    }
-    handleClick(e) {
-        if (this.disabled) {
-            e.preventDefault();
-            return;
-        }
-        this.selected = !this.selected;
-        this.tabSelect.emit({ name: this.name });
-    }
-    render() {
-        const labelSize = labelSizes[this.size] || labelSizes['default'];
-        const labelColor = this.computeContentColor();
-        this.updateDynamicStyles();
-        return (h(Host, { key: '3966968b73a9a51ec26f3206cdb09fbfcb3d3daf', role: "button", "aria-pressed": this.selected, "aria-disabled": this.disabled }, h("button", { key: '00cc6382c635a05c52fd74b3e02e968c2d94cacb', class: this.getClasses(), style: this.styles, onClick: e => this.handleClick(e), disabled: this.disabled, onMouseEnter: this.handleMouseEnter.bind(this), onMouseLeave: this.handleMouseLeave.bind(this) }, this.getIcon(), h("cura-label", { key: 'e193500f156c10cf0442e6f504e19d552c19f849', size: labelSize, color: labelColor, lineHeight: "0", marginBlock: "0" }, h("slot", { key: '8a0ac7c4b2ff4990093d13b4110e370616cf39f4' })))));
-    }
-    static get watchers() { return {
-        "colorMode": ["setColors"]
-    }; }
-    static get style() { return curaTabsCss; }
-}, [1, "cura-tabs", {
-        "name": [513],
-        "iconName": [513, "icon-name"],
-        "selected": [1540],
-        "disabled": [1540],
-        "borderBottom": [1540, "border-bottom"],
-        "size": [513],
-        "colorMode": [1537, "color-mode"],
-        "hovered": [32],
-        "styles": [32]
-    }, undefined, {
-        "colorMode": ["setColors"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["cura-tabs", "cura-icon", "cura-label"];
-    components.forEach(tagName => { switch (tagName) {
-        case "cura-tabs":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, CuraTabs$1);
-            }
-            break;
-        case "cura-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "cura-label":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const CuraTabs = CuraTabs$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { CuraTabs, defineCustomElement };
-//# sourceMappingURL=cura-tabs.js.map
-
-//# sourceMappingURL=cura-tabs.js.map
+import{p as t,H as e,k as o,i as s,j as r,t as a}from"./p-DBXUEjWh.js";import{l as i}from"./p-CHcd-uKK.js";import{d as c}from"./p-fn4zJrKE.js";import{d as n}from"./p-BSdkRryc.js";const l=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.tabSelect=o(this,"tabSelect"),this.selected=!1,this.disabled=!1,this.borderBottom=!0,this.size="large",this.colorMode="light",this.hovered=!1,this.styles={}}setColors(){[{name:"--background-color-selected",theme:"light"===this.colorMode?"primary-base":"primary-lighter"},{name:"--background-color-hover",theme:"light"===this.colorMode?"primary-lighter":null},{name:"--background-disabled-selected",theme:"light"===this.colorMode?"neutral-pale":"neutral-black"},{name:"--border-bottom-color",theme:"light"===this.colorMode?"neutral-base":"primary"}].forEach((t=>{t.theme&&(this.styles[t.name]=window.CuraAPI.theme.colors.getColor(t.theme))})),this.styles=Object.assign({},this.styles)}computeContentColor(){return this.disabled?"neutral-dark":"dark"===this.colorMode?this.hovered&&!this.selected?"neutral-purewhite":this.selected?"neutral-black":"primary-lighter":this.selected?"neutral-purewhite":"primary-dark"}updateDynamicStyles(){"dark"===this.colorMode&&this.hovered&&!this.selected&&(this.styles=Object.assign(Object.assign({},this.styles),{"--border-bottom-color":window.CuraAPI.theme.colors.getColor("neutral-purewhite")}))}getIcon(){if(!this.iconName)return"";const t="large"===this.size?20:16,e=this.computeContentColor();return s("cura-icon",{name:this.iconName,size:t,color:e})}getClasses(){return{[this.size]:!0,[this.colorMode]:!0,selected:this.selected,disabled:this.disabled,"border-bottom":this.borderBottom}}connectedCallback(){this.styles=Object.assign(Object.assign({},this.styles),{"--primary-dark":window.CuraAPI.theme.colors.getColor("primary-dark"),"--neutral-purewhite":window.CuraAPI.theme.colors.getColor("neutral-purewhite"),"--base-spacing":window.CuraAPI.theme.spacing.getSpacing()}),this.setColors()}handleMouseEnter(){this.disabled||(this.hovered=!0)}handleMouseLeave(){this.hovered=!1}handleClick(t){this.disabled?t.preventDefault():(this.selected=!this.selected,this.tabSelect.emit({name:this.name}))}render(){const t=i[this.size]||i.default,e=this.computeContentColor();return this.updateDynamicStyles(),s(r,{key:"3966968b73a9a51ec26f3206cdb09fbfcb3d3daf",role:"button","aria-pressed":this.selected,"aria-disabled":this.disabled},s("button",{key:"00cc6382c635a05c52fd74b3e02e968c2d94cacb",class:this.getClasses(),style:this.styles,onClick:t=>this.handleClick(t),disabled:this.disabled,onMouseEnter:this.handleMouseEnter.bind(this),onMouseLeave:this.handleMouseLeave.bind(this)},this.getIcon(),s("cura-label",{key:"e193500f156c10cf0442e6f504e19d552c19f849",size:t,color:e,lineHeight:"0",marginBlock:"0"},s("slot",{key:"8a0ac7c4b2ff4990093d13b4110e370616cf39f4"}))))}static get watchers(){return{colorMode:[{setColors:0}]}}static get style(){return":host button,:host a{outline:none;box-shadow:none;box-sizing:border-box;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;border-radius:var(--border-radius);position:relative;background-color:transparent;box-sizing:border-box;border:none;min-width:120px;width:fit-content;display:flex;align-items:center;justify-content:center;border-radius:4px 4px 0 0}:host button:focus,:host a:focus{outline:2px solid #6EA8FF}:host button.border-bottom,:host a.border-bottom{border-bottom:1px solid var(--border-bottom-color)}:host button:not(.disabled,.selected):hover,:host a:not(.disabled,.selected):hover{background-color:var(--background-color-hover)}:host button:not(.disabled,.selected):hover.light,:host a:not(.disabled,.selected):hover.light{border-bottom-color:var(--primary-dark)}:host button:not(.disabled,.selected):hover.dark,:host a:not(.disabled,.selected):hover.dark{border-bottom-color:var(--neutral-purewhite)}:host button.small,:host a.small{padding:calc(var(--cura-spacing-base) * 2px) calc(var(--cura-spacing-base) * 2px)}:host button.medium,:host a.medium{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px)}:host button.large,:host a.large{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 4px)}:host button:focus,:host a:focus{border:2px solid var(--primary-light)}:host button cura-icon,:host a cura-icon{margin-right:calc(var(--cura-spacing-base) * 2px)}:host button.selected,:host a.selected{cursor:pointer;background-color:var(--background-color-selected)}:host button.selected.disabled,:host a.selected.disabled{background-color:var(--background-disabled-selected)}:host button.disabled,:host a.disabled{cursor:not-allowed}"}},[257,"cura-tabs",{name:[513],iconName:[513,"icon-name"],selected:[1540],disabled:[1540],borderBottom:[1540,"border-bottom"],size:[513],colorMode:[1537,"color-mode"],hovered:[32],styles:[32]},void 0,{colorMode:[{setColors:0}]}]),d=l,h=function(){"undefined"!=typeof customElements&&["cura-tabs","cura-icon","cura-label"].forEach((t=>{switch(t){case"cura-tabs":customElements.get(a(t))||customElements.define(a(t),l);break;case"cura-icon":customElements.get(a(t))||c();break;case"cura-label":customElements.get(a(t))||n()}}))};export{d as CuraTabs,h as defineCustomElement}

package/dist/components/cura-toast.js

@@ -1,162 +1 @@
-import { p as proxyCustomElement, H, e as createEvent, h, d as Host } from './p-D1cPOZpG.js';
-import { d as defineCustomElement$5 } from './p-BHEafDKD.js';
-import { d as defineCustomElement$4 } from './p-B5aO1chh.js';
-import { d as defineCustomElement$3 } from './p-KIQMkSRF.js';
-import { d as defineCustomElement$2 } from './p-DI4g-ZH4.js';
-
-const curaToastCss = ":host{display:block;box-sizing:border-box}:host .container{position:fixed;z-index:99999;display:flex;box-sizing:border-box;min-width:320px;height:fit-content;padding:16px;border:1px solid var(--color-base);border-radius:12px;background-color:var(--neutral-purewhite);overflow:hidden;box-shadow:0px 8px 16px 0px var(--neutral-black-shadow-4, rgba(38, 38, 38, 0.12))}:host .container.loader{padding:16px 16px 20px}:host .container.top{top:24px}:host .container.top.center{top:-100%;left:50%;transform:translateX(-50%);opacity:0;transition:opacity 0.5s ease-in-out, top 0.5s ease-in-out}:host .container.top.center.active{top:24px;opacity:1}:host .container.bottom{bottom:24px}:host .container.bottom.center{bottom:-100%;left:50%;transform:translateX(-50%);opacity:0;transition:opacity 0.5s ease-in-out, bottom 0.5s ease-in-out}:host .container.bottom.center.active{bottom:24px;opacity:1}:host .container.left{left:-100%;opacity:0;transition:opacity 0.5s ease-in-out, left 0.5s ease-in-out}@media (max-width: 768px){:host .container.left{right:unset;left:50%;transform:translateX(-50%)}}:host .container.left.active{left:24px;opacity:1}:host .container.right{right:-100%;opacity:0;transition:opacity 0.5s ease-in-out, right 0.5s ease-in-out}@media (max-width: 768px){:host .container.right{right:unset;left:50%;transform:translateX(-50%)}}:host .container.right.active{right:24px;opacity:1}:host .container .content{flex:1 1 0;display:flex;flex-direction:column;gap:4px}:host .container .default-icon{margin-right:12px}:host .container .close-icon{margin-left:12px;cursor:pointer}";
-
-const CuraToast$1 = /*@__PURE__*/ proxyCustomElement(class CuraToast extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.toastClosed = createEvent(this, "toastClosed");
-        this.type = 'info';
-        this.position = 'top-right';
-        this.closeButton = true;
-        this.loader = true;
-        this.autoCloseDelay = 10000;
-        this.styles = {};
-        this.progress = 0;
-        this.handleClose = () => {
-            this.closeContainer();
-        };
-    }
-    /**
-     * Method to close toast component
-     */
-    async close() {
-        this.closeContainer();
-    }
-    handleChangeType() {
-        this.setStyle();
-    }
-    connectedCallback() {
-        this.setStyle();
-    }
-    render() {
-        return (h(Host, { key: 'c65f4295ed41485cdeb992dc29a76b4aeef87a39', role: "alert", "aria-live": "polite", "aria-atomic": "true", "aria-label": this.label }, h("div", { key: '62ec0a3170f862d0634df42ac4ccf0708c80fa32', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: 'bdb68633080a0032c4fdc2f3bb53a668e5b8ab1b', class: "default-icon", name: this.getNameIcon(), size: 16, color: `${this.type}-dark` }), h("div", { key: '42516aa76455a7b2c7e96613d6e0f38d8f9fbfba', class: "content" }, h("cura-heading", { key: '07402cf186ed3626248d682239b1105378dc2ae6', level: 4, size: "xsmall", color: `${this.type}-dark`, weight: "bold", "margin-block": "0" }, this.label), h("cura-paragraph", { key: 'f8239bb5c4ca52e3ce55cc50fab46bd45440e2ee', color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: 'd0491202942530967ddb5d34ecf1333975c8dda0' })), h("slot", { key: '3024563fbc18c2b4a4954849f74014b0be6b34ee', name: "actions" })), this.closeButton && h("cura-icon", { key: '20b315655b9d8ff4ddfc6c2cec6ebc8981f64643', class: "close-icon", name: "close", size: 16, color: "error-dark", onClick: this.handleClose }), this.loader && !!this.autoCloseDelay && h("cura-loader-bar", { key: 'a81f9da8704799af13009fa046b58e9d6eeb453c', color: `${this.type}-base`, progress: this.progress }))));
-    }
-    componentDidLoad() {
-        this.openContainer();
-        this.startAnimation();
-    }
-    setStyle() {
-        this.styles = Object.assign(Object.assign({}, this.styles), { '--neutral-purewhite': window.CuraAPI.theme.colors.getColor(`neutral-purewhite`), '--neutral-base': window.CuraAPI.theme.colors.getColor(`neutral-base`, 0.2), '--primary-base': window.CuraAPI.theme.colors.getColor(`primary-base`), '--color-base': window.CuraAPI.theme.colors.getColor(`${this.type}-base`) });
-    }
-    getClasses() {
-        const [firstPosition, secondPosition] = this.position.split('-');
-        const classes = {};
-        classes['container'] = true;
-        classes[firstPosition] = true;
-        classes[secondPosition] = true;
-        if (this.loader) {
-            classes['loader'] = true;
-        }
-        return classes;
-    }
-    getNameIcon() {
-        const iconMapping = {
-            info: 'infoCircle',
-            success: 'checkCircle',
-            warning: 'alertCircle',
-            error: 'alertTriangle',
-        };
-        return this.icon ? this.icon : iconMapping[this.type];
-    }
-    openContainer() {
-        this.container = this.host.shadowRoot.querySelector('.container');
-        this.container.classList.add('active');
-    }
-    closeContainer() {
-        this.container.classList.remove('active');
-        setTimeout(() => {
-            this.toastClosed.emit();
-            this.host.remove();
-        }, 500);
-    }
-    startAnimation() {
-        if (!!this.autoCloseDelay) {
-            if (this.loader) {
-                this.progress = 0;
-                let intervalId = setInterval(() => {
-                    if (this.progress >= 100) {
-                        clearInterval(intervalId);
-                        this.closeContainer();
-                    }
-                    else {
-                        this.progress++;
-                    }
-                }, this.autoCloseDelay / 100);
-            }
-            else {
-                let intervalId = setInterval(() => {
-                    clearInterval(intervalId);
-                    this.closeContainer();
-                }, this.autoCloseDelay);
-            }
-        }
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "type": ["handleChangeType"],
-        "position": ["handleChangeType"]
-    }; }
-    static get style() { return curaToastCss; }
-}, [1, "cura-toast", {
-        "type": [1],
-        "position": [1],
-        "icon": [513],
-        "label": [513],
-        "closeButton": [516, "close-button"],
-        "loader": [516],
-        "autoCloseDelay": [514, "auto-close-delay"],
-        "styles": [32],
-        "progress": [32],
-        "close": [64]
-    }, undefined, {
-        "type": ["handleChangeType"],
-        "position": ["handleChangeType"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["cura-toast", "cura-heading", "cura-icon", "cura-loader-bar", "cura-paragraph"];
-    components.forEach(tagName => { switch (tagName) {
-        case "cura-toast":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, CuraToast$1);
-            }
-            break;
-        case "cura-heading":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "cura-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "cura-loader-bar":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "cura-paragraph":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const CuraToast = CuraToast$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { CuraToast, defineCustomElement };
-//# sourceMappingURL=cura-toast.js.map
-
-//# sourceMappingURL=cura-toast.js.map
+import{p as t,H as e,k as a,i as o,j as s,t as i}from"./p-DBXUEjWh.js";import{d as r}from"./p-fR02COZb.js";import{d as n}from"./p-fn4zJrKE.js";import{d as c}from"./p-CCkEqDZb.js";import{d as l}from"./p-D7WNwjv-.js";const h=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.toastClosed=a(this,"toastClosed"),this.type="info",this.position="top-right",this.closeButton=!0,this.loader=!0,this.autoCloseDelay=1e4,this.styles={},this.progress=0,this.handleClose=()=>{this.closeContainer()}}async close(){this.closeContainer()}handleChangeType(){this.setStyle()}connectedCallback(){this.setStyle()}render(){return o(s,{key:"c65f4295ed41485cdeb992dc29a76b4aeef87a39",role:"alert","aria-live":"polite","aria-atomic":"true","aria-label":this.label},o("div",{key:"62ec0a3170f862d0634df42ac4ccf0708c80fa32",class:this.getClasses(),style:this.styles},o("cura-icon",{key:"bdb68633080a0032c4fdc2f3bb53a668e5b8ab1b",class:"default-icon",name:this.getNameIcon(),size:16,color:this.type+"-dark"}),o("div",{key:"42516aa76455a7b2c7e96613d6e0f38d8f9fbfba",class:"content"},o("cura-heading",{key:"07402cf186ed3626248d682239b1105378dc2ae6",level:4,size:"xsmall",color:this.type+"-dark",weight:"bold","margin-block":"0"},this.label),o("cura-paragraph",{key:"f8239bb5c4ca52e3ce55cc50fab46bd45440e2ee",color:this.type+"-darker",size:"xsmall",marginBlock:"0",lineHeight:"133.33%"},o("slot",{key:"d0491202942530967ddb5d34ecf1333975c8dda0"})),o("slot",{key:"3024563fbc18c2b4a4954849f74014b0be6b34ee",name:"actions"})),this.closeButton&&o("cura-icon",{key:"20b315655b9d8ff4ddfc6c2cec6ebc8981f64643",class:"close-icon",name:"close",size:16,color:"error-dark",onClick:this.handleClose}),this.loader&&!!this.autoCloseDelay&&o("cura-loader-bar",{key:"a81f9da8704799af13009fa046b58e9d6eeb453c",color:this.type+"-base",progress:this.progress})))}componentDidLoad(){this.openContainer(),this.startAnimation()}setStyle(){this.styles=Object.assign(Object.assign({},this.styles),{"--neutral-purewhite":window.CuraAPI.theme.colors.getColor("neutral-purewhite"),"--neutral-base":window.CuraAPI.theme.colors.getColor("neutral-base",.2),"--primary-base":window.CuraAPI.theme.colors.getColor("primary-base"),"--color-base":window.CuraAPI.theme.colors.getColor(this.type+"-base")})}getClasses(){const[t,e]=this.position.split("-"),a={container:!0};return a[t]=!0,a[e]=!0,this.loader&&(a.loader=!0),a}getNameIcon(){return this.icon?this.icon:{info:"infoCircle",success:"checkCircle",warning:"alertCircle",error:"alertTriangle"}[this.type]}openContainer(){this.container=this.host.shadowRoot.querySelector(".container"),this.container.classList.add("active")}closeContainer(){this.container.classList.remove("active"),setTimeout((()=>{this.toastClosed.emit(),this.host.remove()}),500)}startAnimation(){if(this.autoCloseDelay)if(this.loader){this.progress=0;let t=setInterval((()=>{this.progress>=100?(clearInterval(t),this.closeContainer()):this.progress++}),this.autoCloseDelay/100)}else{let t=setInterval((()=>{clearInterval(t),this.closeContainer()}),this.autoCloseDelay)}}get host(){return this}static get watchers(){return{type:[{handleChangeType:0}],position:[{handleChangeType:0}]}}static get style(){return":host{display:block;box-sizing:border-box}:host .container{position:fixed;z-index:99999;display:flex;box-sizing:border-box;min-width:320px;height:fit-content;padding:16px;border:1px solid var(--color-base);border-radius:12px;background-color:var(--neutral-purewhite);overflow:hidden;box-shadow:0px 8px 16px 0px var(--neutral-black-shadow-4, rgba(38, 38, 38, 0.12))}:host .container.loader{padding:16px 16px 20px}:host .container.top{top:24px}:host .container.top.center{top:-100%;left:50%;transform:translateX(-50%);opacity:0;transition:opacity 0.5s ease-in-out, top 0.5s ease-in-out}:host .container.top.center.active{top:24px;opacity:1}:host .container.bottom{bottom:24px}:host .container.bottom.center{bottom:-100%;left:50%;transform:translateX(-50%);opacity:0;transition:opacity 0.5s ease-in-out, bottom 0.5s ease-in-out}:host .container.bottom.center.active{bottom:24px;opacity:1}:host .container.left{left:-100%;opacity:0;transition:opacity 0.5s ease-in-out, left 0.5s ease-in-out}@media (max-width: 768px){:host .container.left{right:unset;left:50%;transform:translateX(-50%)}}:host .container.left.active{left:24px;opacity:1}:host .container.right{right:-100%;opacity:0;transition:opacity 0.5s ease-in-out, right 0.5s ease-in-out}@media (max-width: 768px){:host .container.right{right:unset;left:50%;transform:translateX(-50%)}}:host .container.right.active{right:24px;opacity:1}:host .container .content{flex:1 1 0;display:flex;flex-direction:column;gap:4px}:host .container .default-icon{margin-right:12px}:host .container .close-icon{margin-left:12px;cursor:pointer}"}},[257,"cura-toast",{type:[1],position:[1],icon:[513],label:[513],closeButton:[516,"close-button"],loader:[516],autoCloseDelay:[514,"auto-close-delay"],styles:[32],progress:[32],close:[64]},void 0,{type:[{handleChangeType:0}],position:[{handleChangeType:0}]}]),p=h,d=function(){"undefined"!=typeof customElements&&["cura-toast","cura-heading","cura-icon","cura-loader-bar","cura-paragraph"].forEach((t=>{switch(t){case"cura-toast":customElements.get(i(t))||customElements.define(i(t),h);break;case"cura-heading":customElements.get(i(t))||r();break;case"cura-icon":customElements.get(i(t))||n();break;case"cura-loader-bar":customElements.get(i(t))||c();break;case"cura-paragraph":customElements.get(i(t))||l()}}))};export{p as CuraToast,d as defineCustomElement}