UNPKG

@limetech/lime-elements

Version:
2 lines 4.11 kB
import{r as e,c as o,h as t,g as r}from"./p-288f0842.js";import{c as i}from"./p-ad52787a.js";import{E as s}from"./p-aa25f475.js";import{z as n}from"./p-e781d905.js";import"./p-0c9cb62b.js";import"./p-8008edb7.js";import"./p-88b3ee98.js";import"./p-9bdd72e2.js";import"./p-23071d2f.js";import"./p-c93050d6.js";import"./p-4f8562ee.js";function a(e,o){var t;if(e.contains(o)||((t=e.shadowRoot)===null||t===void 0?void 0:t.contains(o))){return true}const r=p(o);if(!r){return false}return a(e,r)}function p(e){const o=e.closest(".limel-portal--container");if(o){return o.portalSource}const t=e.getRootNode();return t.host}const c=".trigger-anchor{display:inline-block;position:relative}";const l=class{constructor(t){e(this,t);this.close=o(this,"close",7);this.handleGlobalKeyPress=e=>{if(e.key!==s){return}e.stopPropagation();e.preventDefault();this.close.emit()};this.setTriggerAttributes=e=>{const o={"aria-haspopup":true,"aria-expanded":this.open,"aria-controls":this.portalId,role:"button"};for(const[t,r]of Object.entries(o)){if(r){e.setAttribute(t,String(r))}else{e.removeAttribute(t)}}};this.open=false;this.openDirection=undefined;this.portalId=i();this.globalClickListener=this.globalClickListener.bind(this)}watchOpen(){this.setupGlobalHandlers()}componentWillLoad(){this.setupGlobalHandlers()}componentDidRender(){const e=this.host.shadowRoot.querySelector("slot");e.assignedElements().forEach(this.setTriggerAttributes)}setupGlobalHandlers(){if(this.open){document.addEventListener("click",this.globalClickListener,{capture:true});document.addEventListener("keyup",this.handleGlobalKeyPress)}else{document.removeEventListener("click",this.globalClickListener);document.removeEventListener("keyup",this.handleGlobalKeyPress)}}render(){const e=this.getCssProperties();const o=getComputedStyle(this.host).getPropertyValue("--popover-z-index");return t("div",{class:"trigger-anchor"},t("slot",{name:"trigger"}),t("limel-portal",{visible:this.open,containerId:this.portalId,containerStyle:{"z-index":o},openDirection:this.openDirection},t("limel-popover-surface",{contentCollection:this.host.children,style:e})))}globalClickListener(e){const o=e.target;const t=a(this.host,o);if(this.open&&!t){e.stopPropagation();e.preventDefault();this.close.emit()}}getCssProperties(){const e=["--popover-surface-width","--popover-body-background-color","--popover-border-radius","--popover-box-shadow"];const o=getComputedStyle(this.host);const t=e.map((e=>o.getPropertyValue(e)));return n(e,t)}get host(){return r(this)}static get watchers(){return{open:["watchOpen"]}}};l.style=c;const d='@charset "UTF-8";:host(limel-popover-surface){isolation:isolate;position:relative;display:flex;width:var(--popover-surface-width, auto);max-height:inherit;max-width:calc(100vw - 2rem);margin:0 0.25rem}.limel-popover-surface{flex:1;min-width:0;min-height:0;border-radius:var(--popover-border-radius, 0.75rem);box-shadow:var(--popover-box-shadow, var(--shadow-depth-16));backdrop-filter:blur(0.3125rem);-webkit-backdrop-filter:blur(0.3125rem)}.limel-popover-surface:after{transition:opacity 0.4s ease;pointer-events:none;content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;opacity:0.95;border-radius:var(--popover-border-radius, 0.75rem);background-color:var(--popover-body-background-color, var(--lime-elevated-surface-background-color))}.limel-popover-surface:focus{outline:none}.limel-popover-surface:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.limel-popover-surface:focus:after,.limel-popover-surface:focus-within:after{opacity:1}.limel-popover-surface>*{box-sizing:border-box}';const h=class{constructor(o){e(this,o);this.contentCollection=undefined}componentDidLoad(){this.appendElement()}render(){return t("div",{class:"limel-popover-surface",tabindex:"0"})}appendElement(){const e=this.host.shadowRoot.querySelector(".limel-popover-surface");const o=[...this.contentCollection];for(const t of o){if(t.slot==="trigger"){continue}e.append(t)}}get host(){return r(this)}};h.style=d;export{l as limel_popover,h as limel_popover_surface}; //# sourceMappingURL=p-034d0498.entry.js.map