mbio-ui/components/popover/index.js

Web components library containing lightweight, ready-to-use and framework-agnostic User Interface elements.

!function(t){var e={};function __webpack_require__(o){if(e[o])return e[o].exports;var r=e[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,__webpack_require__),r.l=!0,r.exports}__webpack_require__.m=t,__webpack_require__.c=e,__webpack_require__.d=function(t,e,o){__webpack_require__.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},__webpack_require__.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},__webpack_require__.t=function(t,e){if(1&e&&(t=__webpack_require__(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(__webpack_require__.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)__webpack_require__.d(o,r,function(e){return t[e]}.bind(null,r));return o},__webpack_require__.n=function(t){var e=t&&t.__esModule?function getDefault(){return t.default}:function getModuleExports(){return t};return __webpack_require__.d(e,"a",e),e},__webpack_require__.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},__webpack_require__.p="",__webpack_require__(__webpack_require__.s=48)}({0:function(t,e,o){"use strict";o.d(e,"b",(function(){return css_tag_r})),o.d(e,"c",(function(){return r.a})),o.d(e,"a",(function(){return lit_element_h}));var r=o(3);const s=window.ShadowRoot&&(void 0===window.ShadyCSS||window.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,l=Symbol();class n{constructor(t,e){if(e!==l)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t}get styleSheet(){return s&&void 0===this.t&&(this.t=new CSSStyleSheet,this.t.replaceSync(this.cssText)),this.t}toString(){return this.cssText}}const h=new Map,css_tag_r=(t,...e)=>{const o=e.reduce((e,o,r)=>e+(t=>{if(t instanceof n)return t.cssText;if("number"==typeof t)return t;throw Error(`Value passed to 'css' function must be a 'css' function result: ${t}. Use 'unsafeCSS' to pass non-literal values, but\n            take care to ensure page security.`)})(o)+t[r+1],t[0]);let r=h.get(o);return void 0===r&&h.set(o,r=new n(o,l)),r},p=s?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const o of t.cssRules)e+=o.cssText;return(t=>new n(t+"",l))(e)})(t):t;var u,v,f,g;const m={toAttribute(t,e){switch(e){case Boolean:t=t?"":null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,e){let o=t;switch(e){case Boolean:o=null!==t;break;case Number:o=null===t?null:Number(t);break;case Object:case Array:try{o=JSON.parse(t)}catch(t){o=null}}return o}},reactive_element_n=(t,e)=>e!==t&&(e==e||t==t),y={attribute:!0,type:String,converter:m,reflect:!1,hasChanged:reactive_element_n};class reactive_element_a extends HTMLElement{constructor(){super(),this.Πi=new Map,this.Πo=void 0,this.Πl=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this.Πh=null,this.u()}static addInitializer(t){var e;null!==(e=this.v)&&void 0!==e||(this.v=[]),this.v.push(t)}static get observedAttributes(){this.finalize();const t=[];return this.elementProperties.forEach((e,o)=>{const r=this.Πp(o,e);void 0!==r&&(this.Πm.set(r,o),t.push(r))}),t}static createProperty(t,e=y){if(e.state&&(e.attribute=!1),this.finalize(),this.elementProperties.set(t,e),!e.noAccessor&&!this.prototype.hasOwnProperty(t)){const o="symbol"==typeof t?Symbol():"__"+t,r=this.getPropertyDescriptor(t,o,e);void 0!==r&&Object.defineProperty(this.prototype,t,r)}}static getPropertyDescriptor(t,e,o){return{get(){return this[e]},set(r){const s=this[t];this[e]=r,this.requestUpdate(t,s,o)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)||y}static finalize(){if(this.hasOwnProperty("finalized"))return!1;this.finalized=!0;const t=Object.getPrototypeOf(this);if(t.finalize(),this.elementProperties=new Map(t.elementProperties),this.Πm=new Map,this.hasOwnProperty("properties")){const t=this.properties,e=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const o of e)this.createProperty(o,t[o])}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const o=new Set(t.flat(1/0).reverse());for(const t of o)e.unshift(p(t))}else void 0!==t&&e.push(p(t));return e}static"Πp"(t,e){const o=e.attribute;return!1===o?void 0:"string"==typeof o?o:"string"==typeof t?t.toLowerCase():void 0}u(){var t;this.Πg=new Promise(t=>this.enableUpdating=t),this.L=new Map,this.Π_(),this.requestUpdate(),null===(t=this.constructor.v)||void 0===t||t.forEach(t=>t(this))}addController(t){var e,o;(null!==(e=this.ΠU)&&void 0!==e?e:this.ΠU=[]).push(t),void 0!==this.renderRoot&&this.isConnected&&(null===(o=t.hostConnected)||void 0===o||o.call(t))}removeController(t){var e;null===(e=this.ΠU)||void 0===e||e.splice(this.ΠU.indexOf(t)>>>0,1)}"Π_"(){this.constructor.elementProperties.forEach((t,e)=>{this.hasOwnProperty(e)&&(this.Πi.set(e,this[e]),delete this[e])})}createRenderRoot(){var t;const e=null!==(t=this.shadowRoot)&&void 0!==t?t:this.attachShadow(this.constructor.shadowRootOptions);return((t,e)=>{s?t.adoptedStyleSheets=e.map(t=>t instanceof CSSStyleSheet?t:t.styleSheet):e.forEach(e=>{const o=document.createElement("style");o.textContent=e.cssText,t.appendChild(o)})})(e,this.constructor.elementStyles),e}connectedCallback(){var t;void 0===this.renderRoot&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),null===(t=this.ΠU)||void 0===t||t.forEach(t=>{var e;return null===(e=t.hostConnected)||void 0===e?void 0:e.call(t)}),this.Πl&&(this.Πl(),this.Πo=this.Πl=void 0)}enableUpdating(t){}disconnectedCallback(){var t;null===(t=this.ΠU)||void 0===t||t.forEach(t=>{var e;return null===(e=t.hostDisconnected)||void 0===e?void 0:e.call(t)}),this.Πo=new Promise(t=>this.Πl=t)}attributeChangedCallback(t,e,o){this.K(t,o)}"Πj"(t,e,o=y){var r,s;const l=this.constructor.Πp(t,o);if(void 0!==l&&!0===o.reflect){const h=(null!==(s=null===(r=o.converter)||void 0===r?void 0:r.toAttribute)&&void 0!==s?s:m.toAttribute)(e,o.type);this.Πh=t,null==h?this.removeAttribute(l):this.setAttribute(l,h),this.Πh=null}}K(t,e){var o,r,s;const l=this.constructor,h=l.Πm.get(t);if(void 0!==h&&this.Πh!==h){const t=l.getPropertyOptions(h),p=t.converter,u=null!==(s=null!==(r=null===(o=p)||void 0===o?void 0:o.fromAttribute)&&void 0!==r?r:"function"==typeof p?p:null)&&void 0!==s?s:m.fromAttribute;this.Πh=h,this[h]=u(e,t.type),this.Πh=null}}requestUpdate(t,e,o){let r=!0;void 0!==t&&(((o=o||this.constructor.getPropertyOptions(t)).hasChanged||reactive_element_n)(this[t],e)?(this.L.has(t)||this.L.set(t,e),!0===o.reflect&&this.Πh!==t&&(void 0===this.Πk&&(this.Πk=new Map),this.Πk.set(t,o))):r=!1),!this.isUpdatePending&&r&&(this.Πg=this.Πq())}async"Πq"(){this.isUpdatePending=!0;try{for(await this.Πg;this.Πo;)await this.Πo}catch(t){Promise.reject(t)}const t=this.performUpdate();return null!=t&&await t,!this.isUpdatePending}performUpdate(){var t;if(!this.isUpdatePending)return;this.hasUpdated,this.Πi&&(this.Πi.forEach((t,e)=>this[e]=t),this.Πi=void 0);let e=!1;const o=this.L;try{e=this.shouldUpdate(o),e?(this.willUpdate(o),null===(t=this.ΠU)||void 0===t||t.forEach(t=>{var e;return null===(e=t.hostUpdate)||void 0===e?void 0:e.call(t)}),this.update(o)):this.Π$()}catch(t){throw e=!1,this.Π$(),t}e&&this.E(o)}willUpdate(t){}E(t){var e;null===(e=this.ΠU)||void 0===e||e.forEach(t=>{var e;return null===(e=t.hostUpdated)||void 0===e?void 0:e.call(t)}),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}"Π$"(){this.L=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this.Πg}shouldUpdate(t){return!0}update(t){void 0!==this.Πk&&(this.Πk.forEach((t,e)=>this.Πj(e,this[e],t)),this.Πk=void 0),this.Π$()}updated(t){}firstUpdated(t){}}var _,w,x,O,P,$;reactive_element_a.finalized=!0,reactive_element_a.shadowRootOptions={mode:"open"},null===(v=(u=globalThis).reactiveElementPlatformSupport)||void 0===v||v.call(u,{ReactiveElement:reactive_element_a}),(null!==(f=(g=globalThis).reactiveElementVersions)&&void 0!==f?f:g.reactiveElementVersions=[]).push("1.0.0-rc.1");(null!==(_=($=globalThis).litElementVersions)&&void 0!==_?_:$.litElementVersions=[]).push("3.0.0-rc.1");class lit_element_h extends reactive_element_a{constructor(){super(...arguments),this.renderOptions={host:this},this.Φt=void 0}createRenderRoot(){var t,e;const o=super.createRenderRoot();return null!==(t=(e=this.renderOptions).renderBefore)&&void 0!==t||(e.renderBefore=o.firstChild),o}update(t){const e=this.render();super.update(t),this.Φt=Object(r.d)(e,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),null===(t=this.Φt)||void 0===t||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),null===(t=this.Φt)||void 0===t||t.setConnected(!1)}render(){return r.b}}lit_element_h.finalized=!0,lit_element_h._$litElement$=!0,null===(x=(w=globalThis).litElementHydrateSupport)||void 0===x||x.call(w,{LitElement:lit_element_h}),null===(P=(O=globalThis).litElementPlatformSupport)||void 0===P||P.call(O,{LitElement:lit_element_h})},1:function(t,e,o){"use strict";o.d(e,"a",(function(){return property_e})),o.d(e,"b",(function(){return state_r}));const i=(t,e)=>"method"===e.kind&&e.descriptor&&!("value"in e.descriptor)?{...e,finisher(o){o.createProperty(e.key,t)}}:{kind:"field",key:Symbol(),placement:"own",descriptor:{},originalKey:e.key,initializer(){"function"==typeof e.initializer&&(this[e.key]=e.initializer.call(this))},finisher(o){o.createProperty(e.key,t)}};function property_e(t){return(e,o)=>void 0!==o?((t,e,o)=>{e.constructor.createProperty(o,t)})(t,e,o):i(t,e)}function state_r(t){return property_e({...t,state:!0,attribute:!1})}const r=Element.prototype;r.msMatchesSelector||r.webkitMatchesSelector},11:function(t,e,o){"use strict";o.d(e,"a",(function(){return mbioPopover}));var r=o(0),s=o(1),l=o(2),h=(o(9),function(t,e,o,r){var s,l=arguments.length,h=l<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)h=Reflect.decorate(t,e,o,r);else for(var p=t.length-1;p>=0;p--)(s=t[p])&&(h=(l<3?s(h):l>3?s(e,o,h):s(e,o))||h);return l>3&&h&&Object.defineProperty(e,o,h),h});class mbioPopover extends r.a{constructor(){super(...arguments),this.flexDirection="column",this.position="bottom",this.emptyHeader=!0,this.emptyFunctions=!0,this.emptyFooter=!0}static get styles(){return[l.a,r.b`
        :host {
          background-color: rgb(var(--base-4));
          border-radius: var(--border-radius);
          display: flex;
          box-shadow: var(--shadow-1);
          transition: var(--transition-1), 0s top, 0s left;
          position: fixed;
          opacity: 1;
          z-index: 4;
          width: 240px;
          /* css properties */
          --body-gap: var(--spacing-m);
          --header-gap: var(--spacing-m);
          --functions-gap: var(--spacing-m);
          --footer-gap: var(--spacing-m);
        }
        :host(:not([visible])) {
          opacity: 0;
          pointer-events: none;
        }
        :host([position^='bottom']:not([visible])) {
          margin-top: -8px;
        }
        :host([position^='top']:not([visible])) {
          margin-top: 8px;
        }
        :host([position^='right']:not([visible])) {
          margin-left: -8px;
        }
        :host([position^='left']:not([visible])) {
          margin-left: 8px;
        }
        mbio-card {
          background-color: transparent;
          box-shadow: none;
          --body-gap: inherit;
          --header-gap: inherit;
          --functions-gap: inherit;
          --footer-gap: inherit;
        }
      `]}render(){return r.c`
      <mbio-card
        @click="${t=>t.stopPropagation()}"
        @wheel="${t=>t.stopPropagation()}"
        .label="${this.label}"
        .icon="${this.icon}"
        flex-direction="${this.flexDirection}"
      >
        <slot
          name="header"
          slot="${this.emptyHeader?"hidden":"header"}"
          @slotchange="${t=>this.emptyHeader=0===t.target.assignedNodes().length}"
        ></slot>
        <slot
          name="functions"
          slot="${this.emptyFunctions?"hidden":"functions"}"
          @slotchange="${t=>this.emptyFunctions=0===t.target.assignedNodes().length}"
        ></slot>
        <slot></slot>
        <slot
          name="footer"
          slot="${this.emptyFooter?"hidden":"footer"}"
          @slotchange="${t=>this.emptyFooter=0===t.target.assignedNodes().length}"
        ></slot>
      </mbio-card>
    `}attributeChangedCallback(t,e,o){super.attributeChangedCallback(t,e,o),this.dispatchEvent(new Event(t+"-changed")),"target"===t&&this.target?this.targetObserver():"visible"===t&&this.visible&&this.visibleObserver()}targetObserver(){const t="string"==typeof this.target?document.querySelector(this.target):this.target;t&&t.addEventListener("click",()=>this.handlePosition(t))}visibleObserver(){const t="string"==typeof this.target?document.querySelector(this.target):this.target;t&&(this.handlePosition(t),!this.sticky&&this.target&&this.addDocListener(t))}handlePosition(t){if(!t)return;let e=this,o=t.getBoundingClientRect();if(e.visible=!0,e.position.startsWith("bottom"))e.style.top=o.top+o.height+8+"px";else if(e.position.startsWith("top"))e.style.top=o.top-e.clientHeight-8+"px";else{e.style.top=o.top+o.height/2-e.clientHeight/2+"px",parseInt(e.style.top)<0&&(e.style.top="8px");const t=Math.max(document.documentElement.clientHeight||0,window.innerHeight||0);parseInt(e.style.top)+e.clientHeight>t&&(e.style.top=t-e.clientHeight-8+"px")}e.position.startsWith("right")?e.style.left=o.left+o.width+8+"px":e.position.startsWith("left")?e.style.left=o.left-e.clientWidth-8+"px":e.style.left=o.left+o.width/2-e.clientWidth/2+"px"}addDocListener(t){let closePopover=e=>{(e.composedPath()[0]!==t&&e.target!==t&&"click"===e.type||"wheel"===e.type)&&(this.visible=!1,document.removeEventListener("click",closePopover),document.removeEventListener("wheel",closePopover))};document.addEventListener("click",closePopover),document.addEventListener("wheel",closePopover)}}h([Object(s.a)({type:String,reflect:!0})],mbioPopover.prototype,"label",void 0),h([Object(s.a)({type:String,reflect:!0})],mbioPopover.prototype,"icon",void 0),h([Object(s.a)({type:String,reflect:!0,attribute:"flex-direction"})],mbioPopover.prototype,"flexDirection",void 0),h([Object(s.a)({type:String,reflect:!0})],mbioPopover.prototype,"position",void 0),h([Object(s.a)({type:String,reflect:!0})],mbioPopover.prototype,"target",void 0),h([Object(s.a)({type:Boolean,reflect:!0})],mbioPopover.prototype,"visible",void 0),h([Object(s.a)({type:Boolean,reflect:!0})],mbioPopover.prototype,"sticky",void 0),h([Object(s.b)()],mbioPopover.prototype,"emptyHeader",void 0),h([Object(s.b)()],mbioPopover.prototype,"emptyFunctions",void 0),h([Object(s.b)()],mbioPopover.prototype,"emptyFooter",void 0),window.customElements.get("mbio-popover")||window.customElements.define("mbio-popover",mbioPopover)},2:function(t,e,o){"use strict";o.d(e,"a",(function(){return r}));const r=o(0).b`
  /* scrollbar */
  *::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background-color: transparent;
    visibility: hidden;
  }
  *::-webkit-scrollbar-track {
    background-color: rgba(var(--neutral-1), 0.05);
    border-radius: 8px;
  }
  *::-webkit-scrollbar-thumb {
    background-color: rgba(var(--neutral-1), 0.1);
    border-radius: 8px;
  }
  *::-webkit-scrollbar-thumb:active,
  *::-webkit-scrollbar-thumb:hover {
    background-color: rgba(var(--neutral-1), 0.2);
  }
`},3:function(t,e,o){"use strict";var r,s,l,h;o.d(e,"a",(function(){return j})),o.d(e,"b",(function(){return U})),o.d(e,"c",(function(){return A})),o.d(e,"d",(function(){return V}));const p=globalThis.trustedTypes,u=p?p.createPolicy("lit-html",{createHTML:t=>t}):void 0,v=`lit$${(Math.random()+"").slice(9)}$`,f="?"+v,g=`<${f}>`,m=document,c=(t="")=>m.createComment(t),d=t=>null===t||"object"!=typeof t&&"function"!=typeof t,y=Array.isArray,a=t=>{var e;return y(t)||"function"==typeof(null===(e=t)||void 0===e?void 0:e[Symbol.iterator])},_=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,w=/-->/g,x=/>/g,O=/>|[ 	\n\r](?:([^\s"'>=/]+)([ 	\n\r]*=[ 	\n\r]*(?:[^ 	\n\r"'`<>=]|("|')|))|$)/g,P=/'/g,$=/"/g,E=/^(?:script|style|textarea)$/i,b=t=>(e,...o)=>({_$litType$:t,strings:e,values:o}),j=b(1),U=(b(2),Symbol.for("lit-noChange")),A=Symbol.for("lit-nothing"),T=new WeakMap,V=(t,e,o)=>{var r,s;const l=null!==(r=null==o?void 0:o.renderBefore)&&void 0!==r?r:e;let h=l._$litPart$;if(void 0===h){const t=null!==(s=null==o?void 0:o.renderBefore)&&void 0!==s?s:null;l._$litPart$=h=new C(e.insertBefore(c(),t),t,void 0,o)}return h.I(t),h},q=m.createTreeWalker(m,129,null,!1),M=(t,e)=>{const o=t.length-1,r=[];let s,l=2===e?"<svg>":"",h=_;for(let e=0;e<o;e++){const o=t[e];let p,u,f=-1,m=0;for(;m<o.length&&(h.lastIndex=m,u=h.exec(o),null!==u);)m=h.lastIndex,h===_?"!--"===u[1]?h=w:void 0!==u[1]?h=x:void 0!==u[2]?(E.test(u[2])&&(s=RegExp("</"+u[2],"g")),h=O):void 0!==u[3]&&(h=O):h===O?">"===u[0]?(h=null!=s?s:_,f=-1):void 0===u[1]?f=-2:(f=h.lastIndex-u[2].length,p=u[1],h=void 0===u[3]?O:'"'===u[3]?$:P):h===$||h===P?h=O:h===w||h===x?h=_:(h=O,s=void 0);const y=h===O&&t[e+1].startsWith("/>")?" ":"";l+=h===_?o+g:f>=0?(r.push(p),o.slice(0,f)+"$lit$"+o.slice(f)+v+y):o+v+(-2===f?(r.push(void 0),e):y)}const p=l+(t[o]||"<?>")+(2===e?"</svg>":"");return[void 0!==u?u.createHTML(p):p,r]};class N{constructor({strings:t,_$litType$:e},o){let r;this.parts=[];let s=0,l=0;const h=t.length-1,u=this.parts,[g,m]=M(t,e);if(this.el=N.createElement(g,o),q.currentNode=this.el.content,2===e){const t=this.el.content,e=t.firstChild;e.remove(),t.append(...e.childNodes)}for(;null!==(r=q.nextNode())&&u.length<h;){if(1===r.nodeType){if(r.hasAttributes()){const t=[];for(const e of r.getAttributeNames())if(e.endsWith("$lit$")||e.startsWith(v)){const o=m[l++];if(t.push(e),void 0!==o){const t=r.getAttribute(o.toLowerCase()+"$lit$").split(v),e=/([.?@])?(.*)/.exec(o);u.push({type:1,index:s,name:e[2],strings:t,ctor:"."===e[1]?I:"?"===e[1]?L:"@"===e[1]?R:H})}else u.push({type:6,index:s})}for(const e of t)r.removeAttribute(e)}if(E.test(r.tagName)){const t=r.textContent.split(v),e=t.length-1;if(e>0){r.textContent=p?p.emptyScript:"";for(let o=0;o<e;o++)r.append(t[o],c()),q.nextNode(),u.push({type:2,index:++s});r.append(t[e],c())}}}else if(8===r.nodeType)if(r.data===f)u.push({type:2,index:s});else{let t=-1;for(;-1!==(t=r.data.indexOf(v,t+1));)u.push({type:7,index:s}),t+=v.length-1}s++}}static createElement(t,e){const o=m.createElement("template");return o.innerHTML=t,o}}function S(t,e,o=t,r){var s,l,h,p;if(e===U)return e;let u=void 0!==r?null===(s=o.Σi)||void 0===s?void 0:s[r]:o.Σo;const v=d(e)?void 0:e._$litDirective$;return(null==u?void 0:u.constructor)!==v&&(null===(l=null==u?void 0:u.O)||void 0===l||l.call(u,!1),void 0===v?u=void 0:(u=new v(t),u.T(t,o,r)),void 0!==r?(null!==(h=(p=o).Σi)&&void 0!==h?h:p.Σi=[])[r]=u:o.Σo=u),void 0!==u&&(e=S(t,u.S(t,e.values),u,r)),e}class k{constructor(t,e){this.l=[],this.N=void 0,this.D=t,this.M=e}u(t){var e;const{el:{content:o},parts:r}=this.D,s=(null!==(e=null==t?void 0:t.creationScope)&&void 0!==e?e:m).importNode(o,!0);q.currentNode=s;let l=q.nextNode(),h=0,p=0,u=r[0];for(;void 0!==u;){if(h===u.index){let e;2===u.type?e=new C(l,l.nextSibling,this,t):1===u.type?e=new u.ctor(l,u.name,u.strings,this,t):6===u.type&&(e=new z(l,this,t)),this.l.push(e),u=r[++p]}h!==(null==u?void 0:u.index)&&(l=q.nextNode(),h++)}return s}v(t){let e=0;for(const o of this.l)void 0!==o&&(void 0!==o.strings?(o.I(t,o,e),e+=o.strings.length-2):o.I(t[e])),e++}}class C{constructor(t,e,o,r){this.type=2,this.N=void 0,this.A=t,this.B=e,this.M=o,this.options=r}setConnected(t){var e;null===(e=this.P)||void 0===e||e.call(this,t)}get parentNode(){return this.A.parentNode}get startNode(){return this.A}get endNode(){return this.B}I(t,e=this){t=S(this,t,e),d(t)?t===A||null==t||""===t?(this.H!==A&&this.R(),this.H=A):t!==this.H&&t!==U&&this.m(t):void 0!==t._$litType$?this._(t):void 0!==t.nodeType?this.$(t):a(t)?this.g(t):this.m(t)}k(t,e=this.B){return this.A.parentNode.insertBefore(t,e)}$(t){this.H!==t&&(this.R(),this.H=this.k(t))}m(t){const e=this.A.nextSibling;null!==e&&3===e.nodeType&&(null===this.B?null===e.nextSibling:e===this.B.previousSibling)?e.data=t:this.$(m.createTextNode(t)),this.H=t}_(t){var e;const{values:o,_$litType$:r}=t,s="number"==typeof r?this.C(t):(void 0===r.el&&(r.el=N.createElement(r.h,this.options)),r);if((null===(e=this.H)||void 0===e?void 0:e.D)===s)this.H.v(o);else{const t=new k(s,this),e=t.u(this.options);t.v(o),this.$(e),this.H=t}}C(t){let e=T.get(t.strings);return void 0===e&&T.set(t.strings,e=new N(t)),e}g(t){y(this.H)||(this.H=[],this.R());const e=this.H;let o,r=0;for(const s of t)r===e.length?e.push(o=new C(this.k(c()),this.k(c()),this,this.options)):o=e[r],o.I(s),r++;r<e.length&&(this.R(o&&o.B.nextSibling,r),e.length=r)}R(t=this.A.nextSibling,e){var o;for(null===(o=this.P)||void 0===o||o.call(this,!1,!0,e);t&&t!==this.B;){const e=t.nextSibling;t.remove(),t=e}}}class H{constructor(t,e,o,r,s){this.type=1,this.H=A,this.N=void 0,this.V=void 0,this.element=t,this.name=e,this.M=r,this.options=s,o.length>2||""!==o[0]||""!==o[1]?(this.H=Array(o.length-1).fill(A),this.strings=o):this.H=A}get tagName(){return this.element.tagName}I(t,e=this,o,r){const s=this.strings;let l=!1;if(void 0===s)t=S(this,t,e,0),l=!d(t)||t!==this.H&&t!==U,l&&(this.H=t);else{const r=t;let h,p;for(t=s[0],h=0;h<s.length-1;h++)p=S(this,r[o+h],e,h),p===U&&(p=this.H[h]),l||(l=!d(p)||p!==this.H[h]),p===A?t=A:t!==A&&(t+=(null!=p?p:"")+s[h+1]),this.H[h]=p}l&&!r&&this.W(t)}W(t){t===A?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class I extends H{constructor(){super(...arguments),this.type=3}W(t){this.element[this.name]=t===A?void 0:t}}class L extends H{constructor(){super(...arguments),this.type=4}W(t){t&&t!==A?this.element.setAttribute(this.name,""):this.element.removeAttribute(this.name)}}class R extends H{constructor(){super(...arguments),this.type=5}I(t,e=this){var o;if((t=null!==(o=S(this,t,e,0))&&void 0!==o?o:A)===U)return;const r=this.H,s=t===A&&r!==A||t.capture!==r.capture||t.once!==r.once||t.passive!==r.passive,l=t!==A&&(r===A||s);s&&this.element.removeEventListener(this.name,this,r),l&&this.element.addEventListener(this.name,this,t),this.H=t}handleEvent(t){var e,o;"function"==typeof this.H?this.H.call(null!==(o=null===(e=this.options)||void 0===e?void 0:e.host)&&void 0!==o?o:this.element,t):this.H.handleEvent(t)}}class z{constructor(t,e,o){this.element=t,this.type=6,this.N=void 0,this.V=void 0,this.M=e,this.options=o}I(t){S(this,t)}}null===(s=(r=globalThis).litHtmlPlatformSupport)||void 0===s||s.call(r,N,C),(null!==(l=(h=globalThis).litHtmlVersions)&&void 0!==l?l:h.litHtmlVersions=[]).push("2.0.0-rc.2")},4:function(t,e,o){"use strict";o.d(e,"a",(function(){return mbioIcon}));var r=o(0),s=o(1),l=o(2),__decorate=function(t,e,o,r){var s,l=arguments.length,h=l<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)h=Reflect.decorate(t,e,o,r);else for(var p=t.length-1;p>=0;p--)(s=t[p])&&(h=(l<3?s(h):l>3?s(e,o,h):s(e,o))||h);return l>3&&h&&Object.defineProperty(e,o,h),h};class mbioIcon extends r.a{constructor(){super(...arguments),this.size="m"}static get styles(){return[l.a,r.b`
        :host {
          font-family: 'md-icons';
          line-height: 1;
          -webkit-font-smoothing: auto;
          text-rendering: optimizeLegibility;
          -moz-osx-font-smoothing: grayscale;
          font-feature-settings: 'liga';
          opacity: 0.9;
          color: var(--text-1);
          transition: var(--transition-1);
          height: max-content;
          width: max-content;
          min-height: max-content;
          min-width: max-content;
          overflow: hidden;
          background-repeat: no-repeat;
          background-position: center;
          background-size: contain;
        }
        :host([button]) {
          opacity: 0.6;
          cursor: pointer;
        }
        :host([disabled]) {
          pointer-events: none;
          opacity: 0.2;
        }
        /* size */
        :host([size='xl']) {
          height: 48px;
          width: 48px;
          font-size: 48px;
        }
        :host([size='l']) {
          height: 32px;
          width: 32px;
          font-size: 32px;
        }
        :host([size='m']) {
          height: 24px;
          width: 24px;
          font-size: 24px;
        }
        :host([size='s']) {
          height: 16px;
          width: 16px;
          font-size: 16px;
        }
        /* hover inputs */
        @media (hover: hover) {
          :host([button]:hover:not(:active)) {
            opacity: 0.9;
          }
        }
      `]}render(){var t;return r.c` ${(null===(t=this.icon)||void 0===t?void 0:t.indexOf("url"))?r.c` ${this.icon} `:""}`}attributeChangedCallback(t,e,o){super.attributeChangedCallback(t,e,o),this.dispatchEvent(new Event(t+"-changed")),"color"==t&&this.color?this.style.color=this.color:"icon"==t&&o.indexOf("url")>-1&&this.setBackgroundImage(o)}setBackgroundImage(t){this.style.backgroundImage=t}}__decorate([Object(s.a)({type:String,reflect:!0})],mbioIcon.prototype,"icon",void 0),__decorate([Object(s.a)({type:String,reflect:!0})],mbioIcon.prototype,"color",void 0),__decorate([Object(s.a)({type:String,reflect:!0})],mbioIcon.prototype,"size",void 0),__decorate([Object(s.a)({type:Boolean,reflect:!0})],mbioIcon.prototype,"button",void 0),__decorate([Object(s.a)({type:Boolean,reflect:!0})],mbioIcon.prototype,"disabled",void 0),window.customElements.get("mbio-icon")||window.customElements.define("mbio-icon",mbioIcon)},48:function(t,e,o){"use strict";o.r(e);var r=o(11);o.d(e,"mbioPopover",(function(){return r.a}))},5:function(t,e,o){"use strict";o.r(e);var r=o(4);o.d(e,"mbioIcon",(function(){return r.a}))},8:function(t,e,o){"use strict";o.d(e,"a",(function(){return mbioCard}));var r=o(0),s=o(1),l=o(2),h=(o(5),function(t,e,o,r){var s,l=arguments.length,h=l<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)h=Reflect.decorate(t,e,o,r);else for(var p=t.length-1;p>=0;p--)(s=t[p])&&(h=(l<3?s(h):l>3?s(e,o,h):s(e,o))||h);return l>3&&h&&Object.defineProperty(e,o,h),h});class mbioCard extends r.a{constructor(){super(...arguments),this.flexDirection="column",this.emptyHeader=!0,this.emptyFunctions=!0,this.emptyFooter=!0}static get styles(){return[l.a,r.b`
        :host {
          display: flex;
          flex-direction: column;
          flex: 1;
          border-radius: var(--border-radius);
          box-sizing: border-box;
          overflow: hidden;
          /* css properties */
          --body-gap: var(--spacing-m);
          --header-gap: var(--spacing-m);
          --functions-gap: var(--spacing-m);
          --footer-gap: var(--spacing-m);
        }
        :host(:not([flat])) {
          background-color: rgb(var(--base-3));
          box-shadow: var(--shadow-1);
          padding: var(--spacing-l);
        }
        /* header */
        slot,
        .header,
        .top {
          display: flex;
          overflow: auto;
        }
        .header,
        slot[name='functions'] {
          height: max-content;
        }
        .header {
          flex: 1;
        }
        .top:not(.empty) {
          padding-bottom: var(--spacing-l);
        }
        slot[name='footer']:not(.empty) {
          padding-top: var(--spacing-l);
        }
        .label {
          flex: 1;
          display: flex;
          gap: var(--spacing-s);
        }
        .label p {
          font: var(--header-1);
          color: var(--text-1);
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          margin: unset;
        }
        /* slots */
        slot[name='functions'] {
          gap: var(--functions-gap);
        }
        slot[name='header'] {
          gap: var(--header-gap);
        }
        slot:not([name]) {
          gap: var(--spacing-m);
        }
        slot[name='header'],
        slot[name='functions'],
        slot[name='footer'] {
          align-items: center;
        }
        /* content */
        slot:not([name]) {
          flex: 1;
          width: 100%;
          padding: 0 var(--spacing-l);
          margin-right: calc(var(--spacing-l) * -1);
          margin-left: calc(var(--spacing-l) * -1);
          gap: var(--body-gap);
        }
        :host([flex-direction='column']) slot:not([name]),
        .header {
          flex-direction: column;
        }
        /* footer */
        slot[name='footer'] {
          justify-content: flex-end;
          gap: var(--footer-gap);
        }
        /* image */
        .image {
          width: calc(100% + 32px);
          margin: calc(var(--spacing-l) * -1) calc(var(--spacing-l) * -1)
            var(--spacing-l) calc(var(--spacing-l) * -1);
        }
      `]}render(){return r.c`
      ${this.image?r.c` <img class="image" src="${this.image}" /> `:""}
      <div
        class="top ${this.emptyHeader&&this.emptyFunctions&&!this.label&&!this.icon?"empty":""}"
      >
        <div class="header">
          ${this.label||this.icon?r.c`
                <div class="label">
                  ${this.icon?r.c` <mbio-icon icon="${this.icon}"></mbio-icon> `:""}
                  <p>${this.label}</p>
                </div>
                ${this.emptyHeader||!this.label&&!this.icon?"":r.c` <div style="margin-top: var(--spacing-l)"></div> `}
              `:""}
          <slot
            name="header"
            @slotchange="${t=>this.emptyHeader=0===t.target.assignedNodes().length}"
            class="${this.emptyHeader?"empty":""}"
          ></slot>
        </div>
        <slot
          name="functions"
          @slotchange="${t=>this.emptyFunctions=0===t.target.assignedNodes().length}"
        ></slot>
      </div>
      <slot></slot>
      <slot
        name="footer"
        @slotchange="${t=>this.emptyFooter=0===t.target.assignedNodes().length}"
        class="${this.emptyFooter?"empty":""}"
      ></slot>
    `}attributeChangedCallback(t,e,o){super.attributeChangedCallback(t,e,o),this.dispatchEvent(new Event(t+"-changed"))}}h([Object(s.a)({type:String,reflect:!0})],mbioCard.prototype,"label",void 0),h([Object(s.a)({type:String,reflect:!0})],mbioCard.prototype,"icon",void 0),h([Object(s.a)({type:String,reflect:!0})],mbioCard.prototype,"image",void 0),h([Object(s.a)({type:String,reflect:!0,attribute:"flex-direction"})],mbioCard.prototype,"flexDirection",void 0),h([Object(s.a)({type:Boolean,reflect:!0})],mbioCard.prototype,"flat",void 0),h([Object(s.b)()],mbioCard.prototype,"emptyHeader",void 0),h([Object(s.b)()],mbioCard.prototype,"emptyFunctions",void 0),h([Object(s.b)()],mbioCard.prototype,"emptyFooter",void 0),window.customElements.get("mbio-card")||window.customElements.define("mbio-card",mbioCard)},9:function(t,e,o){"use strict";o.r(e);var r=o(8);o.d(e,"mbioCard",(function(){return r.a}))}});