UNPKG

@duetds/components

Version:

This package includes Duet Components and related tools.

1 lines 4.13 kB
import{r as t,h as o,g as e}from"./p-e7cbb506.js";import{c as i}from"./p-ea56b96b.js";class s{constructor(o){t(this,o),this.theme="",this.position="bottom",this.active=!1}componentWillLoad(){"default"!==this.theme&&document.documentElement.classList.contains("duet-theme-turva")&&(this.theme="turva")}render(){const t=i("duet-tooltip",{"duet-theme-turva":"turva"===this.theme,"bottom-center":"bottom-center"===this.position,"top-center":"top-center"===this.position,"top-right":"top-right"===this.position,"top-left":"top-left"===this.position,"bottom-right":"bottom-right"===this.position,"bottom-left":"bottom-left"===this.position,active:!0===this.active});return o("div",{class:t},o("div",{class:"duet-tooltip-scrollable"},o("slot",null)))}get element(){return e(this)}static get style(){return":host{background:transparent;border:0;padding:0;margin:0;margin-right:4px;margin-bottom:8px;display:block;width:auto;max-width:100%}.duet-tooltip,:host{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}.duet-tooltip{background:transparent;border:0;padding:0;margin:0;padding:20px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;opacity:0;visibility:hidden;-webkit-transition:.3s ease;transition:.3s ease;will-change:transform,opacity,visibility;-webkit-transform:scale(.85) translateZ(0) translateY(20px);transform:scale(.85) translateZ(0) translateY(20px);background:#fff;border:1px solid #e1e3e6;-webkit-box-shadow:0 2px 10px 0 rgba(0,41,77,.07);box-shadow:0 2px 10px 0 rgba(0,41,77,.07);border-radius:4px;min-height:48px;position:relative;max-height:340px;max-width:340px;font-family:localtapiola-sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;font-size:.875rem;color:#00294d;font-weight:400;line-height:1.25;z-index:950}.duet-tooltip.duet-theme-turva{color:#111;font-family:turva-sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;border-color:#e6e6e6;-webkit-box-shadow:0 2px 10px 0 hsla(0,0%,45.9%,.13);box-shadow:0 2px 10px 0 hsla(0,0%,45.9%,.13)}.duet-tooltip:after{content:\"\";position:absolute;bottom:-20px;left:50%;width:0;height:0;z-index:200;border:10px solid transparent;border-top:10px solid #fff;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.duet-tooltip:before{content:\"\";position:absolute;bottom:-22px;left:50%;width:0;height:0;z-index:100;border:11px solid transparent;border-top:11px solid #e1e3e6;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.duet-theme-turva .duet-tooltip:before{background:#e6e6e6}.duet-tooltip.active{opacity:1;visibility:visible;-webkit-transform:scale(1) translateZ(0) translateY(0);transform:scale(1) translateZ(0) translateY(0)}.duet-tooltip.top-center:after,.duet-tooltip.top-left:after,.duet-tooltip.top-right:after{top:-20px;bottom:auto;border:10px solid transparent;border-bottom:10px solid #fff}.duet-tooltip.top-center:before,.duet-tooltip.top-left:before,.duet-tooltip.top-right:before{top:-22px;bottom:auto;border:11px solid transparent;border-bottom:11px solid #e1e3e6}.duet-theme-turva .duet-tooltip.top-center:before,.duet-theme-turva .duet-tooltip.top-left:before,.duet-theme-turva .duet-tooltip.top-right:before{border-bottom-color:#e6e6e6}.duet-tooltip.bottom-right:after,.duet-tooltip.top-right:after{left:90%}.duet-tooltip.bottom-right:before,.duet-tooltip.top-right:before{left:90%}.duet-tooltip.bottom-left:after,.duet-tooltip.top-left:after{left:10%}.duet-tooltip.bottom-left:before,.duet-tooltip.top-left:before{left:10%}.duet-tooltip-scrollable{overflow-y:auto;-webkit-overflow-scrolling:touch;width:calc(100% - 8px);padding-right:12px;max-height:250px}.duet-tooltip-scrollable::-webkit-scrollbar{width:4px}.duet-tooltip-scrollable::-webkit-scrollbar-track{border-radius:4px}.duet-tooltip-scrollable::-webkit-scrollbar-thumb{border-radius:4px;background:#e1e3e6}.duet-theme-turva .duet-tooltip-scrollable::-webkit-scrollbar-thumb{background:#e6e6e6}"}}export{s as duet_tooltip};