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

package/dist/components/cura-tooltip.js

@@ -1,291 +1 @@
-import { p as proxyCustomElement, H, e as createEvent, h, d as Host } from './p-D1cPOZpG.js';
-import { d as defineCustomElement$7 } from './p-BRDqwZ4N.js';
-import { d as defineCustomElement$6 } from './p-BHEafDKD.js';
-import { d as defineCustomElement$5 } from './p-B5aO1chh.js';
-import { d as defineCustomElement$4 } from './p-DR1RHrEX.js';
-import { d as defineCustomElement$3 } from './p-Dqm2sAwv.js';
-import { d as defineCustomElement$2 } from './p-DI4g-ZH4.js';
-
-const curaTooltipCss = ":host{position:absolute;z-index:99998;display:block;width:fit-content;height:fit-content;box-sizing:border-box}@media (max-width: 768px){:host{width:100%}}:host .container{display:flex;box-sizing:border-box;max-width:var(--max-width);height:auto;padding:calc(var(--cura-spacing-base) * 2px);border:1px solid var(--neutral-light);border-radius:calc(var(--cura-spacing-base) * 1px);background-color:var(--neutral-purewhite);box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16))}@media (max-width: 768px){:host .container{max-width:90%;height:fit-content;padding:calc(var(--cura-spacing-base) * 4px) calc(var(--cura-spacing-base) * 4px) 0 calc(var(--cura-spacing-base) * 4px);margin:0 auto;border:2px solid;border-radius:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px) 0 0;border-color:var(--neutral-light) var(--neutral-light) transparent var(--neutral-light)}}:host .container::after{content:\"\";position:absolute;z-index:99999;width:calc(var(--cura-spacing-base) * 2.5px);height:calc(var(--cura-spacing-base) * 2.5px);border:1px solid;border-radius:2px;background-color:var(--neutral-purewhite);left:var(--arrow-left);top:var(--arrow-top);border-color:var(--arrow-border-color);transform:var(--arrow-translate) rotate(45deg)}@media (max-width: 768px){:host .container::after{display:none}}:host .container .content{flex:1 1 0;display:flex;flex-direction:column;gap:calc(var(--cura-spacing-base) * 1px)}@media (max-width: 768px){:host .container .content{padding-bottom:calc(var(--cura-spacing-base) * 4px);border-bottom:1px dashed var(--neutral-light)}}:host .container .close-icon{margin-left:calc(var(--cura-spacing-base) * 3px);cursor:pointer}:host .container .close-button{padding:calc(var(--cura-spacing-base) * 2px) 0}";
-
-const BREAKPOINT_SMALL_MAX = 768;
-const CuraTooltip$1 = /*@__PURE__*/ proxyCustomElement(class CuraTooltip extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.tooltipClosed = createEvent(this, "tooltipClosed");
-        this.elementId = '';
-        this.interactive = true;
-        this.delay = 250;
-        this.maxWidth = '280px';
-        this.position = 'top';
-        this.closeButton = false;
-        this.isMobile = false;
-        this.styles = {};
-        this.handleClose = () => {
-            this.closeContainer();
-        };
-    }
-    onWindowResize() {
-        this.setPosition(this.targetElement);
-    }
-    onWindowScroll() {
-        this.setPosition(this.targetElement);
-    }
-    connectedCallback() {
-        this.setStyle();
-    }
-    render() {
-        return (h(Host, { key: '655c6aae9efc3aad790c6a45a7192ef01baeac97', role: "tooltip", id: this.elementId }, h("div", { key: 'c552ffd20262eed5e71f4cd93c078852cc52c1ca', class: "container", style: this.styles }, h("div", { key: '110f11205496428b674431e1b2bc8c3f95f9397a', class: "content" }, h("cura-heading", { key: 'd2a0caf6a338c9c0b839ea8671c6d524b943ca86', level: 4, size: "xsmall", color: "neutral-black", weight: "bold", "margin-block": "0" }, this.label), h("cura-paragraph", { key: 'bd7addb352119fead424151294e01eae111915e2', color: "neutral-dark", "spot-color": "secondary-darker", size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: '2323f1af541803e16caa042e9969953557a28976' }))), this.closeButton && !this.isMobile && h("cura-icon", { key: '92a672d383b057c53ce1771bea1ff9374a9a50a7', class: "close-icon", name: "close", size: 16, color: "error-dark", onClick: this.handleClose }), this.isMobile && h("cura-button-transparent", { key: 'a31de7e78e092b4fbf6b0e0b85c0c664399081a0', class: "close-button", size: "small", type: "button", color: "error", "icon-name": "close", "icon-position": "right", onClick: this.handleClose }, "OK, entendi."))));
-    }
-    componentDidLoad() {
-        var _a, _b, _c, _d, _e;
-        this.targetElement = document.querySelector(`[aria-labelledby="${this.elementId}"]`);
-        if (!this.interactive) {
-            this.host.style.visibility = 'visible';
-        }
-        else {
-            this.host.style.visibility = 'hidden';
-            let openTimeoutID = null;
-            let closeTimeoutID = null;
-            (_a = this.targetElement) === null || _a === void 0 ? void 0 : _a.addEventListener('mouseenter', () => {
-                clearTimeout(closeTimeoutID);
-                openTimeoutID = setTimeout(() => {
-                    this.host.style.visibility = 'visible';
-                }, typeof this.delay === 'number' && this.delay > 250 ? this.delay : 250);
-            });
-            (_b = this.targetElement) === null || _b === void 0 ? void 0 : _b.addEventListener('mouseleave', () => {
-                clearTimeout(openTimeoutID);
-                closeTimeoutID = setTimeout(() => {
-                    this.handleClose();
-                }, typeof this.delay === 'number' && this.delay > 250 ? this.delay : 250);
-            });
-            (_c = this.host) === null || _c === void 0 ? void 0 : _c.addEventListener('mouseenter', () => {
-                if (window.getComputedStyle(this.host).visibility === 'visible') {
-                    clearTimeout(closeTimeoutID);
-                }
-            });
-            (_d = this.host) === null || _d === void 0 ? void 0 : _d.addEventListener('mouseleave', () => {
-                clearTimeout(openTimeoutID);
-                this.handleClose();
-            });
-            (_e = this.targetElement) === null || _e === void 0 ? void 0 : _e.addEventListener('click', () => {
-                if (window.getComputedStyle(this.host).visibility === 'hidden') {
-                    openTimeoutID = setTimeout(() => {
-                        this.host.style.visibility = 'visible';
-                    }, typeof this.delay === 'number' && this.delay > 250 ? this.delay : 250);
-                }
-                else {
-                    clearTimeout(openTimeoutID);
-                    this.handleClose();
-                }
-            });
-            document === null || document === void 0 ? void 0 : document.addEventListener('click', (event) => {
-                if (!this.targetElement.contains(event.target) && !this.host.contains(event.target)) {
-                    clearTimeout(openTimeoutID);
-                    this.handleClose();
-                }
-            });
-        }
-        setTimeout(() => {
-            this.setPosition(this.targetElement);
-        }, 100);
-    }
-    setStyle() {
-        this.styles = Object.assign(Object.assign({}, this.styles), { '--max-width': this.maxWidth, '--base-spacing': window.CuraAPI.theme.spacing.getSpacing(), '--neutral-purewhite': window.CuraAPI.theme.colors.getColor(`neutral-purewhite`), '--neutral-light': window.CuraAPI.theme.colors.getColor(`neutral-light`), '--neutral-black-shadow': window.CuraAPI.theme.colors.getColor(`neutral-black`, 0.16) });
-    }
-    getClasses() {
-        const [firstPosition, secondPosition] = this.position.split('-');
-        const classes = {};
-        classes['container'] = true;
-        if (firstPosition) {
-            classes[firstPosition] = true;
-        }
-        if (secondPosition) {
-            classes[secondPosition] = true;
-        }
-        return classes;
-    }
-    setPosition(element) {
-        const windowWidth = window.innerWidth;
-        const windowHeight = window.innerHeight;
-        const container = this.host.shadowRoot.querySelector('.container');
-        this.isMobile = windowWidth <= BREAKPOINT_SMALL_MAX;
-        this.host.style.position = this.isMobile ? 'fixed' : 'absolute';
-        this.host.style.bottom = this.isMobile ? '0' : 'unset';
-        container.style.flexDirection = this.isMobile ? 'column' : 'row';
-        if (this.isMobile) {
-            this.host.style.left = '0';
-            this.host.style.top = 'unset';
-            return;
-        }
-        const elementRect = {
-            top: element.offsetTop,
-            left: element.offsetLeft,
-            width: element.offsetWidth,
-            height: element.offsetHeight
-        };
-        const tooltipRect = this.host.getBoundingClientRect();
-        const SCREEN_LIMIT = 10;
-        const SPACE_TO_ELEMENT = 10;
-        const ARROW_HORIZONTAL_ADJUSTMENT = (elementRect.width * 0.5) + 18;
-        const ARROW_VERTICAL_ADJUSTMENT = (elementRect.height * 0.5) + 18;
-        const BORDER_COLOR = this.styles['--neutral-light'];
-        let left = 0;
-        let top = 0;
-        const positions = Object.keys(this.getClasses()).filter((p) => ['top', 'left', 'bottom', 'right', 'start', 'end'].includes(p));
-        const setArrowProperties = ({ arrowTop = '', arrowLeft = '', translate = '', borderColor = '' }) => {
-            if (arrowLeft)
-                this.host.style.setProperty('--arrow-left', arrowLeft);
-            if (arrowTop)
-                this.host.style.setProperty('--arrow-top', arrowTop);
-            if (translate)
-                this.host.style.setProperty('--arrow-translate', translate);
-            if (borderColor)
-                this.host.style.setProperty('--arrow-border-color', borderColor);
-        };
-        //Posicionamento vertical
-        if (positions.includes('top') || positions.includes('bottom')) {
-            setArrowProperties({ arrowLeft: '50%', translate: 'translateX(-50%)' });
-            if (positions.includes('top')) {
-                top = elementRect.top - tooltipRect.height - SPACE_TO_ELEMENT;
-                setArrowProperties({ arrowTop: 'calc(100% - 6px)', borderColor: `transparent ${BORDER_COLOR} ${BORDER_COLOR} transparent` });
-                if (top < SCREEN_LIMIT) {
-                    top = elementRect.top + elementRect.height + SPACE_TO_ELEMENT;
-                    setArrowProperties({ arrowTop: '-6px', borderColor: `${BORDER_COLOR} transparent transparent ${BORDER_COLOR}` });
-                }
-            }
-            if (positions.includes('bottom')) {
-                top = elementRect.top + elementRect.height + SPACE_TO_ELEMENT;
-                setArrowProperties({ arrowTop: '-6px', borderColor: `${BORDER_COLOR} transparent transparent ${BORDER_COLOR}` });
-                if (top + tooltipRect.height > windowHeight - SCREEN_LIMIT) {
-                    top = elementRect.top - tooltipRect.height - SPACE_TO_ELEMENT;
-                    setArrowProperties({ arrowTop: 'calc(100% - 6px)', borderColor: `transparent ${BORDER_COLOR} ${BORDER_COLOR} transparent` });
-                }
-            }
-            left = elementRect.left + (elementRect.width - tooltipRect.width) / 2;
-            if (positions.includes('start')) {
-                left = elementRect.left - tooltipRect.width + ARROW_HORIZONTAL_ADJUSTMENT;
-                setArrowProperties({ arrowLeft: 'calc(100% - 18px)' });
-                if (left < SCREEN_LIMIT) {
-                    left = elementRect.left + elementRect.width - ARROW_HORIZONTAL_ADJUSTMENT;
-                    setArrowProperties({ arrowLeft: '18px' });
-                }
-            }
-            if (positions.includes('end')) {
-                left = elementRect.left + elementRect.width - ARROW_HORIZONTAL_ADJUSTMENT;
-                setArrowProperties({ arrowLeft: '18px' });
-                if (left + tooltipRect.width > windowWidth - SCREEN_LIMIT) {
-                    left = elementRect.left - tooltipRect.width + ARROW_HORIZONTAL_ADJUSTMENT;
-                    setArrowProperties({ arrowLeft: 'calc(100% - 18px)' });
-                }
-            }
-        }
-        //Posicionamento horizontal
-        if (positions.includes('right') || positions.includes('left')) {
-            setArrowProperties({ arrowTop: '50%', translate: 'translateY(-50%)' });
-            if (positions.includes('right')) {
-                left = elementRect.left + elementRect.width + SPACE_TO_ELEMENT;
-                setArrowProperties({ arrowLeft: '-6px', borderColor: `transparent transparent ${BORDER_COLOR} ${BORDER_COLOR}` });
-                if (left + tooltipRect.width > windowWidth - SCREEN_LIMIT) {
-                    left = elementRect.left - tooltipRect.width - SPACE_TO_ELEMENT;
-                    setArrowProperties({ arrowLeft: 'calc(100% - 6px)', borderColor: `${BORDER_COLOR} ${BORDER_COLOR} transparent transparent` });
-                }
-            }
-            if (positions.includes('left')) {
-                left = elementRect.left - tooltipRect.width - SPACE_TO_ELEMENT;
-                setArrowProperties({ arrowLeft: 'calc(100% - 6px)', borderColor: `${BORDER_COLOR} ${BORDER_COLOR} transparent transparent` });
-                if (left < SCREEN_LIMIT) {
-                    left = elementRect.left + elementRect.width + SPACE_TO_ELEMENT;
-                    setArrowProperties({ arrowLeft: '-6px', borderColor: `transparent transparent ${BORDER_COLOR} ${BORDER_COLOR}` });
-                }
-            }
-            top = elementRect.top + (elementRect.height - tooltipRect.height) / 2;
-            if (positions.includes('start')) {
-                top = elementRect.top - tooltipRect.height + ARROW_VERTICAL_ADJUSTMENT;
-                setArrowProperties({ arrowTop: 'calc(100% - 18px)' });
-                if (top < SCREEN_LIMIT) {
-                    top = elementRect.top + elementRect.height - ARROW_VERTICAL_ADJUSTMENT;
-                    setArrowProperties({ arrowTop: '18px' });
-                }
-            }
-            if (positions.includes('end')) {
-                top = elementRect.top + elementRect.height - ARROW_VERTICAL_ADJUSTMENT;
-                setArrowProperties({ arrowTop: '18px' });
-                if (top + tooltipRect.height > windowHeight - SCREEN_LIMIT) {
-                    top = elementRect.top - tooltipRect.height + ARROW_VERTICAL_ADJUSTMENT;
-                    setArrowProperties({ arrowTop: 'calc(100% - 18px)' });
-                }
-            }
-        }
-        this.host.style.left = `${left}px`;
-        this.host.style.top = `${top}px`;
-    }
-    closeContainer() {
-        this.host.style.visibility = 'hidden';
-        this.tooltipClosed.emit();
-    }
-    get host() { return this; }
-    static get style() { return curaTooltipCss; }
-}, [1, "cura-tooltip", {
-        "elementId": [1, "element-id"],
-        "interactive": [4],
-        "delay": [2],
-        "maxWidth": [1, "max-width"],
-        "position": [513],
-        "label": [513],
-        "closeButton": [516, "close-button"],
-        "isMobile": [32]
-    }, [[9, "resize", "onWindowResize"], [9, "scroll", "onWindowScroll"]]]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["cura-tooltip", "cura-button-transparent", "cura-heading", "cura-icon", "cura-label", "cura-loader-circle", "cura-paragraph"];
-    components.forEach(tagName => { switch (tagName) {
-        case "cura-tooltip":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, CuraTooltip$1);
-            }
-            break;
-        case "cura-button-transparent":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "cura-heading":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "cura-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "cura-label":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "cura-loader-circle":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "cura-paragraph":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const CuraTooltip = CuraTooltip$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { CuraTooltip, defineCustomElement };
-//# sourceMappingURL=cura-tooltip.js.map
-
-//# sourceMappingURL=cura-tooltip.js.map
+import{p as t,H as a,k as r,i as e,j as o,t as s}from"./p-DBXUEjWh.js";import{d as i}from"./p-DXlGQp3a.js";import{d as n}from"./p-fR02COZb.js";import{d as c}from"./p-fn4zJrKE.js";import{d as l}from"./p-BSdkRryc.js";import{d as p}from"./p-Bf21UQXV.js";import{d as h}from"./p-D7WNwjv-.js";const d=t(class extends a{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.tooltipClosed=r(this,"tooltipClosed"),this.elementId="",this.interactive=!0,this.delay=250,this.maxWidth="280px",this.position="top",this.closeButton=!1,this.isMobile=!1,this.styles={},this.handleClose=()=>{this.closeContainer()}}onWindowResize(){this.setPosition(this.targetElement)}onWindowScroll(){this.setPosition(this.targetElement)}connectedCallback(){this.setStyle()}render(){return e(o,{key:"655c6aae9efc3aad790c6a45a7192ef01baeac97",role:"tooltip",id:this.elementId},e("div",{key:"c552ffd20262eed5e71f4cd93c078852cc52c1ca",class:"container",style:this.styles},e("div",{key:"110f11205496428b674431e1b2bc8c3f95f9397a",class:"content"},e("cura-heading",{key:"d2a0caf6a338c9c0b839ea8671c6d524b943ca86",level:4,size:"xsmall",color:"neutral-black",weight:"bold","margin-block":"0"},this.label),e("cura-paragraph",{key:"bd7addb352119fead424151294e01eae111915e2",color:"neutral-dark","spot-color":"secondary-darker",size:"xsmall",marginBlock:"0",lineHeight:"133.33%"},e("slot",{key:"2323f1af541803e16caa042e9969953557a28976"}))),this.closeButton&&!this.isMobile&&e("cura-icon",{key:"92a672d383b057c53ce1771bea1ff9374a9a50a7",class:"close-icon",name:"close",size:16,color:"error-dark",onClick:this.handleClose}),this.isMobile&&e("cura-button-transparent",{key:"a31de7e78e092b4fbf6b0e0b85c0c664399081a0",class:"close-button",size:"small",type:"button",color:"error","icon-name":"close","icon-position":"right",onClick:this.handleClose},"OK, entendi.")))}componentDidLoad(){var t,a,r,e,o;if(this.targetElement=document.querySelector(`[aria-labelledby="${this.elementId}"]`),this.interactive){this.host.style.visibility="hidden";let s=null,i=null;null===(t=this.targetElement)||void 0===t||t.addEventListener("mouseenter",(()=>{clearTimeout(i),s=setTimeout((()=>{this.host.style.visibility="visible"}),"number"==typeof this.delay&&this.delay>250?this.delay:250)})),null===(a=this.targetElement)||void 0===a||a.addEventListener("mouseleave",(()=>{clearTimeout(s),i=setTimeout((()=>{this.handleClose()}),"number"==typeof this.delay&&this.delay>250?this.delay:250)})),null===(r=this.host)||void 0===r||r.addEventListener("mouseenter",(()=>{"visible"===window.getComputedStyle(this.host).visibility&&clearTimeout(i)})),null===(e=this.host)||void 0===e||e.addEventListener("mouseleave",(()=>{clearTimeout(s),this.handleClose()})),null===(o=this.targetElement)||void 0===o||o.addEventListener("click",(()=>{"hidden"===window.getComputedStyle(this.host).visibility?s=setTimeout((()=>{this.host.style.visibility="visible"}),"number"==typeof this.delay&&this.delay>250?this.delay:250):(clearTimeout(s),this.handleClose())})),null===document||void 0===document||document.addEventListener("click",(t=>{this.targetElement.contains(t.target)||this.host.contains(t.target)||(clearTimeout(s),this.handleClose())}))}else this.host.style.visibility="visible";setTimeout((()=>{this.setPosition(this.targetElement)}),100)}setStyle(){this.styles=Object.assign(Object.assign({},this.styles),{"--max-width":this.maxWidth,"--base-spacing":window.CuraAPI.theme.spacing.getSpacing(),"--neutral-purewhite":window.CuraAPI.theme.colors.getColor("neutral-purewhite"),"--neutral-light":window.CuraAPI.theme.colors.getColor("neutral-light"),"--neutral-black-shadow":window.CuraAPI.theme.colors.getColor("neutral-black",.16)})}getClasses(){const[t,a]=this.position.split("-"),r={container:!0};return t&&(r[t]=!0),a&&(r[a]=!0),r}setPosition(t){const a=window.innerWidth,r=window.innerHeight,e=this.host.shadowRoot.querySelector(".container");if(this.isMobile=a<=768,this.host.style.position=this.isMobile?"fixed":"absolute",this.host.style.bottom=this.isMobile?"0":"unset",e.style.flexDirection=this.isMobile?"column":"row",this.isMobile)return this.host.style.left="0",void(this.host.style.top="unset");const o=t.offsetTop,s=t.offsetLeft,i=t.offsetWidth,n=t.offsetHeight,c=this.host.getBoundingClientRect(),l=10,p=10,h=.5*i+18,d=.5*n+18,u=this.styles["--neutral-light"];let b=0,m=0;const w=Object.keys(this.getClasses()).filter((t=>["top","left","bottom","right","start","end"].includes(t))),x=({arrowTop:t="",arrowLeft:a="",translate:r="",borderColor:e=""})=>{a&&this.host.style.setProperty("--arrow-left",a),t&&this.host.style.setProperty("--arrow-top",t),r&&this.host.style.setProperty("--arrow-translate",r),e&&this.host.style.setProperty("--arrow-border-color",e)};(w.includes("top")||w.includes("bottom"))&&(x({arrowLeft:"50%",translate:"translateX(-50%)"}),w.includes("top")&&(m=o-c.height-p,x({arrowTop:"calc(100% - 6px)",borderColor:`transparent ${u} ${u} transparent`}),m<l&&(m=o+n+p,x({arrowTop:"-6px",borderColor:`${u} transparent transparent ${u}`}))),w.includes("bottom")&&(m=o+n+p,x({arrowTop:"-6px",borderColor:`${u} transparent transparent ${u}`}),m+c.height>r-l&&(m=o-c.height-p,x({arrowTop:"calc(100% - 6px)",borderColor:`transparent ${u} ${u} transparent`}))),b=s+(i-c.width)/2,w.includes("start")&&(b=s-c.width+h,x({arrowLeft:"calc(100% - 18px)"}),b<l&&(b=s+i-h,x({arrowLeft:"18px"}))),w.includes("end")&&(b=s+i-h,x({arrowLeft:"18px"}),b+c.width>a-l&&(b=s-c.width+h,x({arrowLeft:"calc(100% - 18px)"})))),(w.includes("right")||w.includes("left"))&&(x({arrowTop:"50%",translate:"translateY(-50%)"}),w.includes("right")&&(b=s+i+p,x({arrowLeft:"-6px",borderColor:`transparent transparent ${u} ${u}`}),b+c.width>a-l&&(b=s-c.width-p,x({arrowLeft:"calc(100% - 6px)",borderColor:`${u} ${u} transparent transparent`}))),w.includes("left")&&(b=s-c.width-p,x({arrowLeft:"calc(100% - 6px)",borderColor:`${u} ${u} transparent transparent`}),b<l&&(b=s+i+p,x({arrowLeft:"-6px",borderColor:`transparent transparent ${u} ${u}`}))),m=o+(n-c.height)/2,w.includes("start")&&(m=o-c.height+d,x({arrowTop:"calc(100% - 18px)"}),m<l&&(m=o+n-d,x({arrowTop:"18px"}))),w.includes("end")&&(m=o+n-d,x({arrowTop:"18px"}),m+c.height>r-l&&(m=o-c.height+d,x({arrowTop:"calc(100% - 18px)"})))),this.host.style.left=b+"px",this.host.style.top=m+"px"}closeContainer(){this.host.style.visibility="hidden",this.tooltipClosed.emit()}get host(){return this}static get style(){return':host{position:absolute;z-index:99998;display:block;width:fit-content;height:fit-content;box-sizing:border-box}@media (max-width: 768px){:host{width:100%}}:host .container{display:flex;box-sizing:border-box;max-width:var(--max-width);height:auto;padding:calc(var(--cura-spacing-base) * 2px);border:1px solid var(--neutral-light);border-radius:calc(var(--cura-spacing-base) * 1px);background-color:var(--neutral-purewhite);box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16))}@media (max-width: 768px){:host .container{max-width:90%;height:fit-content;padding:calc(var(--cura-spacing-base) * 4px) calc(var(--cura-spacing-base) * 4px) 0 calc(var(--cura-spacing-base) * 4px);margin:0 auto;border:2px solid;border-radius:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px) 0 0;border-color:var(--neutral-light) var(--neutral-light) transparent var(--neutral-light)}}:host .container::after{content:"";position:absolute;z-index:99999;width:calc(var(--cura-spacing-base) * 2.5px);height:calc(var(--cura-spacing-base) * 2.5px);border:1px solid;border-radius:2px;background-color:var(--neutral-purewhite);left:var(--arrow-left);top:var(--arrow-top);border-color:var(--arrow-border-color);transform:var(--arrow-translate) rotate(45deg)}@media (max-width: 768px){:host .container::after{display:none}}:host .container .content{flex:1 1 0;display:flex;flex-direction:column;gap:calc(var(--cura-spacing-base) * 1px)}@media (max-width: 768px){:host .container .content{padding-bottom:calc(var(--cura-spacing-base) * 4px);border-bottom:1px dashed var(--neutral-light)}}:host .container .close-icon{margin-left:calc(var(--cura-spacing-base) * 3px);cursor:pointer}:host .container .close-button{padding:calc(var(--cura-spacing-base) * 2px) 0}'}},[257,"cura-tooltip",{elementId:[1,"element-id"],interactive:[4],delay:[2],maxWidth:[1,"max-width"],position:[513],label:[513],closeButton:[516,"close-button"],isMobile:[32]},[[9,"resize","onWindowResize"],[9,"scroll","onWindowScroll"]]]),u=d,b=function(){"undefined"!=typeof customElements&&["cura-tooltip","cura-button-transparent","cura-heading","cura-icon","cura-label","cura-loader-circle","cura-paragraph"].forEach((t=>{switch(t){case"cura-tooltip":customElements.get(s(t))||customElements.define(s(t),d);break;case"cura-button-transparent":customElements.get(s(t))||i();break;case"cura-heading":customElements.get(s(t))||n();break;case"cura-icon":customElements.get(s(t))||c();break;case"cura-label":customElements.get(s(t))||l();break;case"cura-loader-circle":customElements.get(s(t))||p();break;case"cura-paragraph":customElements.get(s(t))||h()}}))};export{u as CuraTooltip,b as defineCustomElement}

package/dist/components/index.d.ts

@@ -32,6 +32,8 @@ export interface SetPlatformOptions {
 }
 export declare const setPlatformOptions: (opts: SetPlatformOptions) => void;
 
+export * from '../types';
+
 /**
  * Utility to define all custom elements within this package using the tag name provided in the component's source.
  * When defining each custom element, it will also check it's safe to define by:

package/dist/components/index.js

@@ -1,115 +1 @@
-import { C as CuraThemeModule, g as globalScripts } from './p-D1cPOZpG.js';
-export { a as getAssetPath, r as render, s as setAssetPath, b as setNonce, c as setPlatformOptions } from './p-D1cPOZpG.js';
-import { CuraAccordion } from './cura-accordion.js';
-import { CuraAccordionItem } from './cura-accordion-item.js';
-import { CuraAlert } from './cura-alert.js';
-import { CuraAvatar } from './cura-avatar.js';
-import { CuraBadgeCounter } from './cura-badge-counter.js';
-import { CuraBadgeDistance } from './cura-badge-distance.js';
-import { CuraBadgeDot } from './cura-badge-dot.js';
-import { CuraBadgePill } from './cura-badge-pill.js';
-import { CuraButton } from './cura-button.js';
-import { CuraButtonOutline } from './cura-button-outline.js';
-import { CuraButtonSelect } from './cura-button-select.js';
-import { CuraButtonTransparent } from './cura-button-transparent.js';
-import { CuraCalendar } from './cura-calendar.js';
-import { CuraCard } from './cura-card.js';
-import { CuraCheckbox } from './cura-checkbox.js';
-import { CuraDisplay } from './cura-display.js';
-import { CuraDropdownSearch } from './cura-dropdown-search.js';
-import { CuraDropdownSearchCategory } from './cura-dropdown-search-category.js';
-import { CuraDropdownSearchNotFound } from './cura-dropdown-search-not-found.js';
-import { CuraDropdownSearchOption } from './cura-dropdown-search-option.js';
-import { CuraHeading } from './cura-heading.js';
-import { CuraIcon } from './cura-icon.js';
-import { CuraIconsView } from './cura-icons-view.js';
-import { CuraInputDate } from './cura-input-date.js';
-import { CuraInputText } from './cura-input-text.js';
-import { CuraLabel } from './cura-label.js';
-import { CuraLoaderBar } from './cura-loader-bar.js';
-import { CuraLoaderCircle } from './cura-loader-circle.js';
-import { CuraModal } from './cura-modal.js';
-import { CuraPageTemplate } from './cura-page-template.js';
-import { CuraParagraph } from './cura-paragraph.js';
-import { CuraProgressBar } from './cura-progress-bar.js';
-import { CuraRadio } from './cura-radio.js';
-import { CuraSelect } from './cura-select.js';
-import { CuraSelectOption } from './cura-select-option.js';
-import { CuraStepper } from './cura-stepper.js';
-import { CuraStepperItem } from './cura-stepper-item.js';
-import { CuraSwitch } from './cura-switch.js';
-import { CuraTabs } from './cura-tabs.js';
-import { CuraTabsButton } from './cura-tabs-button.js';
-import { CuraTabsGroup } from './cura-tabs-group.js';
-import { CuraTabsTransparent } from './cura-tabs-transparent.js';
-import { CuraToast } from './cura-toast.js';
-import { CuraTooltip } from './cura-tooltip.js';
-
-function CuraInit(options, w = window) {
-    w.CuraInit = options;
-}
-function InitVarsTheme(theme) {
-    const themeModule = new CuraThemeModule();
-    return themeModule.loadVarsSSR(theme);
-}
-
-globalScripts();
-const defineCustomElements = (opts) => {
-    if (typeof customElements !== 'undefined') {
-        [
-            CuraAccordion,
-            CuraAccordionItem,
-            CuraAlert,
-            CuraAvatar,
-            CuraBadgeCounter,
-            CuraBadgeDistance,
-            CuraBadgeDot,
-            CuraBadgePill,
-            CuraButton,
-            CuraButtonOutline,
-            CuraButtonSelect,
-            CuraButtonTransparent,
-            CuraCalendar,
-            CuraCard,
-            CuraCheckbox,
-            CuraDisplay,
-            CuraDropdownSearch,
-            CuraDropdownSearchCategory,
-            CuraDropdownSearchNotFound,
-            CuraDropdownSearchOption,
-            CuraHeading,
-            CuraIcon,
-            CuraIconsView,
-            CuraInputDate,
-            CuraInputText,
-            CuraLabel,
-            CuraLoaderBar,
-            CuraLoaderCircle,
-            CuraModal,
-            CuraPageTemplate,
-            CuraParagraph,
-            CuraProgressBar,
-            CuraRadio,
-            CuraSelect,
-            CuraSelectOption,
-            CuraStepper,
-            CuraStepperItem,
-            CuraSwitch,
-            CuraTabs,
-            CuraTabsButton,
-            CuraTabsGroup,
-            CuraTabsTransparent,
-            CuraToast,
-            CuraTooltip,
-        ].forEach(cmp => {
-            if (!customElements.get(cmp.is)) {
-                customElements.define(cmp.is, cmp, opts);
-            }
-        });
-    }
-};
-
-export { CuraInit, InitVarsTheme, defineCustomElements };
-//# sourceMappingURL=index.js.map
-
-//# sourceMappingURL=index.js.map
+import{T as t,a as o,b as i,c as e,d as a,e as n,t as c}from"./p-DBXUEjWh.js";export{g as getAssetPath,r as render,s as setAssetPath,f as setNonce,h as setPlatformOptions}from"./p-DBXUEjWh.js";import{S as u}from"./p-B8xnU6YS.js";import{CuraAccordion as m}from"./cura-accordion.js";import{CuraAccordionItem as l}from"./cura-accordion-item.js";import{CuraAlert as p}from"./cura-alert.js";import{CuraAvatar as d}from"./cura-avatar.js";import{CuraBadgeCounter as j}from"./cura-badge-counter.js";import{CuraBadgeDistance as b}from"./cura-badge-distance.js";import{CuraBadgeDot as w}from"./cura-badge-dot.js";import{CuraBadgePill as v}from"./cura-badge-pill.js";import{CuraButton as y}from"./cura-button.js";import{CuraButtonOutline as $}from"./cura-button-outline.js";import{CuraButtonSelect as S}from"./cura-button-select.js";import{CuraButtonTransparent as C}from"./cura-button-transparent.js";import{CuraCalendar as k}from"./cura-calendar.js";import{CuraCard as x}from"./cura-card.js";import{CuraCheckbox as E}from"./cura-checkbox.js";import{CuraDisplay as O}from"./cura-display.js";import{CuraDropdownSearch as D}from"./cura-dropdown-search.js";import{CuraDropdownSearchCategory as A}from"./cura-dropdown-search-category.js";import{CuraDropdownSearchNotFound as P}from"./cura-dropdown-search-not-found.js";import{CuraDropdownSearchOption as W}from"./cura-dropdown-search-option.js";import{CuraHeading as B}from"./cura-heading.js";import{CuraIcon as N}from"./cura-icon.js";import{CuraIconsView as T}from"./cura-icons-view.js";import{CuraInputDate as U}from"./cura-input-date.js";import{CuraInputText as _}from"./cura-input-text.js";import{CuraLabel as z}from"./cura-label.js";import{CuraLoaderBar as F}from"./cura-loader-bar.js";import{CuraLoaderCircle as J}from"./cura-loader-circle.js";import{CuraModal as R}from"./cura-modal.js";import{CuraPageTemplate as X}from"./cura-page-template.js";import{CuraParagraph as G}from"./cura-paragraph.js";import{CuraProgressBar as I}from"./cura-progress-bar.js";import{CuraRadio as L}from"./cura-radio.js";import{CuraSelect as V}from"./cura-select.js";import{CuraSelectOption as Y}from"./cura-select-option.js";import{CuraStepper as q}from"./cura-stepper.js";import{CuraStepperItem as H}from"./cura-stepper-item.js";import{CuraSwitch as K}from"./cura-switch.js";import{CuraTabs as M}from"./cura-tabs.js";import{CuraTabsButton as Q}from"./cura-tabs-button.js";import{CuraTabsGroup as Z}from"./cura-tabs-group.js";import{CuraTabsTransparent as tt}from"./cura-tabs-transparent.js";import{CuraToast as rt}from"./cura-toast.js";import{CuraTooltip as ot}from"./cura-tooltip.js";const st={default:n,maternidade:a,oncologia:e,richet:i,perinatalTemp:o,legacyDefault:t};class it{constructor(){this.NeutralDepthAlias={purewhite:"0",white:"100",pale:"200",lighter:"300",light:"400",base:"500",medium:"600",dark:"700",darker:"800",black:"900"},this.ColorDepthAlias={lighter:"100",light:"300",base:"500",dark:"700",darker:"900"}}getColor(t="primary-base",r=1){const{color:o,depth:s}=this.splitColorDepth(t);return this.getStatic(o,s,r)||this.getDynamic(o,s,r)}getStatic(t,r,o=1){var s,i,e;if(!u.color[t])return null;const a="neutral"===t?this.NeutralDepthAlias[r]:this.ColorDepthAlias[r];return(null===(s=u.color[t])||void 0===s?void 0:s[a])?`rgba(${null===(i=u.color[t])||void 0===i?void 0:i[a]}, ${o})`:`rgba(${null===(e=u.color[t])||void 0===e?void 0:e[r]}, ${o})`}getDynamic(t,r,o){const s=this.ColorDepthAlias[r]?`--cura-color-${t}-${this.ColorDepthAlias[r]}`:`--cura-color-${t}-${r}`;return getComputedStyle(document.documentElement).getPropertyValue(s)?`rgba(var(${s}), ${o})`:`rgba(var(--cura-color-primary-500), ${o})`}splitColorDepth(t){const[r,o]=t.toLowerCase().split(/-(.*)/);return{color:null!=r?r:"primary",depth:null!=o?o:"base"}}}class et{constructor(){this.curaSpacing="--cura-spacing-base"}getSpacing(){return getComputedStyle(document.body).getPropertyValue(this.curaSpacing)?`var(${this.curaSpacing})`:"4"}}class at{constructor(){this.getSize=()=>"var(--cura-font-size)",this.getColor=()=>"var(--cura-font-color)"}getFamily(t="body"){const r="--cura-font-"+t.toLowerCase();return getComputedStyle(document.body).getPropertyValue(r)?`var(${r})`:"var(--cura-font-body)"}getWeights(){const t={};return Object.keys(n.font.weights).forEach((r=>t[r]=`var(--cura-font-weights-${r})`)),t}}class nt{constructor(){}get(t=null,r=null){if(t){const o=r?u.breakpoints[t][r]:u.breakpoints[t];if(o||0===o)return o}return u.breakpoints}}class ct{constructor(){var t;this.prefix="--cura",this.colors=new it,this.spacing=new et,this.fonts=new at,this.breakpoints=new nt,this.groupObject={},this.setCssVar=(t,r)=>{const o=this.groupPath(r,t[0]);this.rootElement.style.setProperty(o,t[1])},this.groupPath=(t,r)=>`${t}-${r}`,this.isObject=t=>t&&"object"==typeof t&&!Array.isArray(t),this.mergeObject=(t,r)=>{const o=Object.entries(t);for(let t of o)this.isObject(t[1])?this.mergeObject(t[1],r[t[0]]):r[t[0]]=t[1]},this.buildCssVars=(t,r,o=!1)=>{const s=Object.entries(r);for(let r of s)if(this.isObject(r[1]))this.buildCssVars(this.groupPath(t,r[0]),r[1],o);else if(o){const o=this.groupPath(t,r[0]);this.groupObject[o]=r[1]}else this.setCssVar(r,t)},"undefined"!=typeof window&&(this.rootElement=null===(t=null===window||void 0===window?void 0:window.document)||void 0===t?void 0:t.documentElement)}load(t="default"){this.buildCssVars(this.prefix,st[t]?st[t]:st.default)}loadVarsSSR(t="default"){return this.buildCssVars(this.prefix,st[t]?st[t]:st.default,!0),this.groupObject}setCustom(t){const r=t.name;if(r in st)console.log("Error building custom theme. Theme %s already exists. Loading default theme.",r),this.load("default");else{const o=Object.assign({},JSON.parse(JSON.stringify(t.fromPreset&&t.fromPreset in st?st[t.fromPreset]:st.default)));this.mergeObject(t.definitions,o),st[r]=o,this.load(r)}}}class ut{constructor(t){this.localAssetsPath=t&&t.localAssetsPath?t.localAssetsPath:"/assets";const r=new ct;this.theme={load:function(t){r.load(t)},setCustom:function(t){r.setCustom(t)},colors:{getColor:function(t,o){return r.colors.getColor(t,o)}},fonts:{getFamily:function(t){return r.fonts.getFamily(t)},getWeights:function(){return r.fonts.getWeights()},getSize:function(){return r.fonts.getSize()},getColor:function(){return r.fonts.getColor()}},spacing:{getSpacing:function(){return r.spacing.getSpacing()}},breakpoints:{get:function(t,o){return r.breakpoints.get(t,o)}}},this._addGlobalClasses(),t&&t.customTheme?this.theme.setCustom(t.customTheme):this.theme.load(t&&t.theme?t.theme:"default")}_addGlobalClasses(){const t="cura_global_classes";let r=document.head.querySelector("#"+t);r||(r=document.createElement("style"),r.id=t,r.textContent="\n  .cura-body-scroll-lock {\n    overflow: hidden;\n    position: fixed;\n    left: 0;\n    right: 0;\n    top: 0;\n  }\n      ",document.head.appendChild(r))}}function mt(t,r=window){r.CuraInit=t}function lt(t){return(new ct).loadVarsSSR(t)}(function(){const t=window.CuraInit;window.CuraAPI=t?new ut(t):new ut;const r=window.CuraAPI;window.dispatchEvent(new CustomEvent("CuraAPIReady",{detail:{api:r}})),t&&"function"==typeof t.onReady&&t.onReady(r)}||(()=>{}))();const pt=t=>{"undefined"!=typeof customElements&&[m,l,p,d,j,b,w,v,y,$,S,C,k,x,E,O,D,A,P,W,B,N,T,U,_,z,F,J,R,X,G,I,L,V,Y,q,H,K,M,Q,Z,tt,rt,ot].forEach((r=>{customElements.get(c(r.is))||customElements.define(c(r.is),r,t)}))};export{mt as CuraInit,lt as InitVarsTheme,pt as defineCustomElements}

package/dist/components/p-B2RN7oe_.js

@@ -0,0 +1 @@
+import{p as t,H as e,i as a,j as s,t as r}from"./p-DBXUEjWh.js";import{d as i}from"./p-BSdkRryc.js";const n=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.theme=window.CuraAPI.theme,this.color="primary",this.disabled=!1,this.type="solid",this.styles={},this.labelColor="primary-darker",this.bgColorName="primary-lighter"}handleColorChange(){this.setColors()}setColors(){const t=this.color.toLowerCase();"outline"===this.type||"transparent"===this.type?(this.bgColorName=this.disabled?"neutral-medium":`${t}-dark`,this.labelColor=this.bgColorName):(this.bgColorName="neutral"===t||this.disabled?"neutral-pale":`${t}-lighter`,this.labelColor=this.disabled?"neutral-medium":`${t}-dark`),this.styles=Object.assign(Object.assign({},this.styles),{"--background-color":this.theme.colors.getColor(`${this.bgColorName}`)})}connectedCallback(){this.styles["--base-spacing"]=this.theme.spacing.getSpacing(),this.setColors()}getClasses(){const t={container:!0};return t[this.type.toLowerCase()]=!0,t}render(){return a(s,{key:"8b67f2b913a10de53a519cdafcfbcb140b2adda5"},this.number&&this.number<=0?"":a("div",{class:this.getClasses(),style:this.styles},a("cura-label",{size:"xsmall","line-height":"none",color:this.labelColor},this.number>=100?"99+":this.number)))}static get watchers(){return{disabled:[{handleColorChange:0}],color:[{handleColorChange:0}],type:[{handleColorChange:0}]}}static get style(){return':host{width:fit-content;display:inline-block;height:calc(var(--cura-spacing-base) * 4px);position:relative}:host .container{display:flex;min-width:calc(var(--cura-spacing-base) * 4px);width:fit-content;height:calc(var(--cura-spacing-base) * 4px);justify-content:center;align-items:center;border-radius:calc(calc(var(--cura-spacing-base) * 4px) / 2);background:var(--background-color);box-sizing:border-box;padding:0 calc(var(--cura-spacing-base) * 1px);position:relative}:host .container.outline,:host .container.transparent{background:transparent !important}:host .container.outline::before{content:"";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:1px solid var(--background-color);border-radius:calc(calc(var(--cura-spacing-base) * 4px) / 2)}'}},[1,"cura-badge-counter",{number:[514],color:[1],disabled:[4],type:[1],styles:[32]},void 0,{disabled:[{handleColorChange:0}],color:[{handleColorChange:0}],type:[{handleColorChange:0}]}]);function o(){"undefined"!=typeof customElements&&["cura-badge-counter","cura-label"].forEach((t=>{switch(t){case"cura-badge-counter":customElements.get(r(t))||customElements.define(r(t),n);break;case"cura-label":customElements.get(r(t))||i()}}))}export{n as C,o as d}