@nylas/web-elements 1.1.0-canary.19.c → 1.1.0-canary.19.e

package/dist/nylas-web-elements/{p-f2d1b1a6.entry.js.map → p-de2f4643.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["nylasThreadsRefreshCss","NylasThreadsRefreshStyle0","NylasThreadsRefresh","constructor","hostRef","this","threshold","onTouchStart","e","debug","touches","pageY","containerElement","scrollTop","offsetHeight","contentElement","start","onTouchMove","distance","pulling","onTouchEnd","changedTouches","refresh","emit","updateState","bind","connectedCallback","componentWillLoad","componentDidLoad","addEventListener","disconnectedCallback","removeEventListener","state","render","h","Host","key","class","ref","r","refreshing","slot","__decorate","RegisterComponent","name","eventToProps","async","event","nylasConnector","detail","threads","getThreads","undefined","fireRegisterEvent"],"sources":["src/components/mailbox/nylas-threads-refresh/nylas-threads-refresh.scss?tag=nylas-threads-refresh&encapsulation=shadow","src/components/mailbox/nylas-threads-refresh/nylas-threads-refresh.tsx"],"sourcesContent":[":host {\n  display: contents;\n}\n\n.container {\n  width: 100%;\n  overflow: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n.pull-to-refresh {\n  display: none;\n  border: 0;\n  background-color: transparent;\n  text-align: center;\n  width: 100%;\n  justify-content: center;\n}\n\n.pulling {\n  position: relative;\n  display: flex;\n  margin: 0 auto;\n  padding: 1rem;\n  svg {\n    width: 24px;\n    height: 24px;\n    color: var(--nylas-color-primary-500);\n    transform: rotate(90deg);\n  }\n}\n\n.refreshing {\n  position: relative;\n  display: flex;\n  margin: 0 auto;\n  padding: 1rem;\n  svg {\n    width: 24px;\n    height: 24px;\n    fill: var(--nylas-color-primary-500);\n    animation: rotate 1s linear infinite;\n  }\n}\n\n@keyframes rotate {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { Component, Event, EventEmitter, Host, Method, State, h } from '@stencil/core';\nimport { NylasMailboxConnector } from '../../../components';\nimport { NylasMailbox } from '../nylas-mailbox/nylas-mailbox';\nimport { debug } from '@/utils/utils';\n\nexport type RefreshEvent = {\n  updateState: (state: 'ready' | 'loading' | 'error') => Promise<void>;\n};\n\n@Component({\n  tag: 'nylas-threads-refresh',\n  styleUrl: 'nylas-threads-refresh.scss',\n  shadow: true,\n})\nexport class NylasThreadsRefresh {\n  private readonly threshold: number = 100;\n\n  @State() start: number = 0;\n\n  @State() state: 'ready' | 'loading' | 'error' = 'ready';\n\n  @State() pulling: boolean = false;\n\n  @Event() refresh!: EventEmitter<RefreshEvent>;\n\n  private containerElement?: HTMLElement;\n  private contentElement?: HTMLElement;\n\n  constructor() {\n    debug(`[nylas-threads-refresh] Constructor`);\n    this.updateState = this.updateState.bind(this);\n  }\n\n  connectedCallback() {}\n\n  async componentWillLoad() {\n    debug(`[nylas-threads-refresh] Component will load`);\n  }\n\n  componentDidLoad() {\n    debug(`[nylas-threads-refresh] Component did load`);\n    this.containerElement?.addEventListener('touchstart', this.onTouchStart);\n    this.containerElement?.addEventListener('touchmove', this.onTouchMove);\n    this.containerElement?.addEventListener('touchend', this.onTouchEnd);\n  }\n\n  disconnectedCallback() {\n    debug(`[nylas-threads-refresh] Component disconnected`);\n    this.containerElement?.removeEventListener('touchstart', this.onTouchStart);\n    this.containerElement?.removeEventListener('touchmove', this.onTouchMove);\n    this.containerElement?.removeEventListener('touchend', this.onTouchEnd);\n  }\n\n  @Method()\n  public async updateState(state: 'ready' | 'loading' | 'error') {\n    this.state = state;\n  }\n\n  private onTouchStart = (e: TouchEvent) => {\n    debug(`[nylas-threads-refresh] Touch start`, e.touches[0].pageY, this.containerElement?.scrollTop, this.containerElement?.offsetHeight, this.contentElement?.scrollTop);\n    if (this.containerElement?.scrollTop === 0) {\n      this.start = e.touches[0].pageY;\n    } else {\n      this.start = 0;\n    }\n  };\n\n  private onTouchMove = (e: TouchEvent) => {\n    if (this.start) {\n      const distance = e.touches[0].pageY - this.start;\n      if (distance > this.threshold) {\n        this.pulling = true;\n      } else {\n        this.pulling = false;\n      }\n    }\n  };\n\n  private onTouchEnd = (e: TouchEvent) => {\n    if (this.start) {\n      const distance = e.changedTouches[0].pageY - this.start;\n      if (distance > this.threshold) {\n        this.pulling = false;\n        this.refresh.emit({\n          updateState: this.updateState,\n        });\n      }\n      this.start = 0;\n    }\n  };\n  @RegisterComponent<NylasThreadsRefresh, NylasMailboxConnector, Exclude<NylasMailbox['stores'], undefined>>({\n    name: 'nylas-threads-refresh',\n    eventToProps: {\n      refresh: async (event: CustomEvent<RefreshEvent>, nylasConnector: NylasMailboxConnector) => {\n        debug(`[nylas-threads-refresh] Refreshing threads`);\n        const { updateState } = event.detail;\n        await updateState('loading');\n        await nylasConnector.threads.getThreads(undefined, 'overwrite', false);\n        await updateState('ready');\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class=\"container\" ref={r => (this.containerElement = r)}>\n          <button\n            class={{\n              'pull-to-refresh': true,\n              'pulling': this.pulling,\n              'refreshing': this.state === 'loading',\n            }}\n            aria-label=\"Refreshing...\"\n          >\n            {this.state === 'loading' && <refresh-icon slot=\"icon\" />}\n            {this.state !== 'loading' && <arrow-icon slot=\"icon\" />}\n          </button>\n          <div class=\"content\" ref={r => (this.contentElement = r)}>\n            <slot></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"iLAAA,MAAMA,EAAyB,2nBAC/B,MAAAC,EAAeD,E,ugBCcFE,EAAmB,MAc9B,WAAAC,CAAAC,G,2CAbiBC,KAAAC,UAAoB,IA2C7BD,KAAAE,aAAgBC,IACtBC,EAAM,sCAAuCD,EAAEE,QAAQ,GAAGC,MAAON,KAAKO,kBAAkBC,UAAWR,KAAKO,kBAAkBE,aAAcT,KAAKU,gBAAgBF,WAC7J,GAAIR,KAAKO,kBAAkBC,YAAc,EAAG,CAC1CR,KAAKW,MAAQR,EAAEE,QAAQ,GAAGC,K,KACrB,CACLN,KAAKW,MAAQ,C,GAITX,KAAAY,YAAeT,IACrB,GAAIH,KAAKW,MAAO,CACd,MAAME,EAAWV,EAAEE,QAAQ,GAAGC,MAAQN,KAAKW,MAC3C,GAAIE,EAAWb,KAAKC,UAAW,CAC7BD,KAAKc,QAAU,I,KACV,CACLd,KAAKc,QAAU,K,IAKbd,KAAAe,WAAcZ,IACpB,GAAIH,KAAKW,MAAO,CACd,MAAME,EAAWV,EAAEa,eAAe,GAAGV,MAAQN,KAAKW,MAClD,GAAIE,EAAWb,KAAKC,UAAW,CAC7BD,KAAKc,QAAU,MACfd,KAAKiB,QAAQC,KAAK,CAChBC,YAAanB,KAAKmB,a,CAGtBnB,KAAKW,MAAQ,C,cAtEQ,E,WAEuB,Q,aAEpB,MAQ1BP,EAAM,uCACNJ,KAAKmB,YAAcnB,KAAKmB,YAAYC,KAAKpB,K,CAG3C,iBAAAqB,GAAiB,CAEjB,uBAAMC,GACJlB,EAAM,8C,CAGR,gBAAAmB,GACEnB,EAAM,8CACNJ,KAAKO,kBAAkBiB,iBAAiB,aAAcxB,KAAKE,cAC3DF,KAAKO,kBAAkBiB,iBAAiB,YAAaxB,KAAKY,aAC1DZ,KAAKO,kBAAkBiB,iBAAiB,WAAYxB,KAAKe,W,CAG3D,oBAAAU,GACErB,EAAM,kDACNJ,KAAKO,kBAAkBmB,oBAAoB,aAAc1B,KAAKE,cAC9DF,KAAKO,kBAAkBmB,oBAAoB,YAAa1B,KAAKY,aAC7DZ,KAAKO,kBAAkBmB,oBAAoB,WAAY1B,KAAKe,W,CAIvD,iBAAMI,CAAYQ,GACvB3B,KAAK2B,MAAQA,C,CAgDf,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,YAAYC,IAAKC,GAAMlC,KAAKO,iBAAmB2B,GACxDL,EAAA,UAAAE,IAAA,2CACEC,MAAO,CACL,kBAAmB,KACnBlB,QAAWd,KAAKc,QAChBqB,WAAcnC,KAAK2B,QAAU,WAC9B,aACU,iBAEV3B,KAAK2B,QAAU,WAAaE,EAAA,gBAAcO,KAAK,SAC/CpC,KAAK2B,QAAU,WAAaE,EAAA,cAAYO,KAAK,UAEhDP,EAAA,OAAAE,IAAA,2CAAKC,MAAM,UAAUC,IAAKC,GAAMlC,KAAKU,eAAiBwB,GACpDL,EAAA,QAAAE,IAAA,+C,GAhBVM,EAAA,CAbCC,EAA0G,CACzGC,KAAM,wBACNC,aAAc,CACZvB,QAASwB,MAAOC,EAAkCC,KAChDvC,EAAM,8CACN,MAAMe,YAAEA,GAAgBuB,EAAME,aACxBzB,EAAY,iBACZwB,EAAeE,QAAQC,WAAWC,UAAW,YAAa,aAC1D5B,EAAY,QAAQ,GAG9B6B,kBAAmB,O"}
+{"version":3,"names":["nylasThreadsRefreshCss","NylasThreadsRefreshStyle0","NylasThreadsRefresh","constructor","hostRef","this","threshold","onTouchStart","e","debug","touches","pageY","containerElement","scrollTop","offsetHeight","contentElement","start","onTouchMove","distance","pulling","onTouchEnd","changedTouches","refresh","emit","updateState","bind","connectedCallback","componentWillLoad","componentDidLoad","addEventListener","disconnectedCallback","removeEventListener","state","render","h","Host","key","class","ref","r","refreshing","slot","__decorate","RegisterComponent","name","eventToProps","async","event","nylasConnector","detail","threads","getThreads","undefined","fireRegisterEvent"],"sources":["src/components/mailbox/nylas-threads-refresh/nylas-threads-refresh.scss?tag=nylas-threads-refresh&encapsulation=shadow","src/components/mailbox/nylas-threads-refresh/nylas-threads-refresh.tsx"],"sourcesContent":[":host {\n  display: contents;\n}\n\n.container {\n  width: 100%;\n  overflow: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n.pull-to-refresh {\n  display: none;\n  border: 0;\n  background-color: transparent;\n  text-align: center;\n  width: 100%;\n  justify-content: center;\n}\n\n.pulling {\n  position: relative;\n  display: flex;\n  margin: 0 auto;\n  padding: 1rem;\n  svg {\n    width: 24px;\n    height: 24px;\n    color: var(--nylas-color-primary-500);\n    transform: rotate(90deg);\n  }\n}\n\n.refreshing {\n  position: relative;\n  display: flex;\n  margin: 0 auto;\n  padding: 1rem;\n  svg {\n    width: 24px;\n    height: 24px;\n    fill: var(--nylas-color-primary-500);\n    animation: rotate 1s linear infinite;\n  }\n}\n\n@keyframes rotate {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { Component, Event, EventEmitter, Host, Method, State, h } from '@stencil/core';\nimport { NylasMailboxConnector } from '../../../components';\nimport { NylasMailbox } from '../nylas-mailbox/nylas-mailbox';\nimport { debug } from '@/utils/utils';\n\nexport type RefreshEvent = {\n  updateState: (state: 'ready' | 'loading' | 'error') => Promise<void>;\n};\n\n@Component({\n  tag: 'nylas-threads-refresh',\n  styleUrl: 'nylas-threads-refresh.scss',\n  shadow: true,\n})\nexport class NylasThreadsRefresh {\n  private readonly threshold: number = 100;\n\n  @State() start: number = 0;\n\n  @State() state: 'ready' | 'loading' | 'error' = 'ready';\n\n  @State() pulling: boolean = false;\n\n  @Event() refresh!: EventEmitter<RefreshEvent>;\n\n  private containerElement?: HTMLElement;\n  private contentElement?: HTMLElement;\n\n  constructor() {\n    debug(`[nylas-threads-refresh] Constructor`);\n    this.updateState = this.updateState.bind(this);\n  }\n\n  connectedCallback() {}\n\n  async componentWillLoad() {\n    debug(`[nylas-threads-refresh] Component will load`);\n  }\n\n  componentDidLoad() {\n    debug(`[nylas-threads-refresh] Component did load`);\n    this.containerElement?.addEventListener('touchstart', this.onTouchStart);\n    this.containerElement?.addEventListener('touchmove', this.onTouchMove);\n    this.containerElement?.addEventListener('touchend', this.onTouchEnd);\n  }\n\n  disconnectedCallback() {\n    debug(`[nylas-threads-refresh] Component disconnected`);\n    this.containerElement?.removeEventListener('touchstart', this.onTouchStart);\n    this.containerElement?.removeEventListener('touchmove', this.onTouchMove);\n    this.containerElement?.removeEventListener('touchend', this.onTouchEnd);\n  }\n\n  @Method()\n  public async updateState(state: 'ready' | 'loading' | 'error') {\n    this.state = state;\n  }\n\n  private onTouchStart = (e: TouchEvent) => {\n    debug(`[nylas-threads-refresh] Touch start`, e.touches[0].pageY, this.containerElement?.scrollTop, this.containerElement?.offsetHeight, this.contentElement?.scrollTop);\n    if (this.containerElement?.scrollTop === 0) {\n      this.start = e.touches[0].pageY;\n    } else {\n      this.start = 0;\n    }\n  };\n\n  private onTouchMove = (e: TouchEvent) => {\n    if (this.start) {\n      const distance = e.touches[0].pageY - this.start;\n      if (distance > this.threshold) {\n        this.pulling = true;\n      } else {\n        this.pulling = false;\n      }\n    }\n  };\n\n  private onTouchEnd = (e: TouchEvent) => {\n    if (this.start) {\n      const distance = e.changedTouches[0].pageY - this.start;\n      if (distance > this.threshold) {\n        this.pulling = false;\n        this.refresh.emit({\n          updateState: this.updateState,\n        });\n      }\n      this.start = 0;\n    }\n  };\n  @RegisterComponent<NylasThreadsRefresh, NylasMailboxConnector, Exclude<NylasMailbox['stores'], undefined>>({\n    name: 'nylas-threads-refresh',\n    eventToProps: {\n      refresh: async (event: CustomEvent<RefreshEvent>, nylasConnector: NylasMailboxConnector) => {\n        debug(`[nylas-threads-refresh] Refreshing threads`);\n        const { updateState } = event.detail;\n        await updateState('loading');\n        await nylasConnector.threads.getThreads(undefined, 'overwrite', false);\n        await updateState('ready');\n      },\n    },\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class=\"container\" ref={r => (this.containerElement = r)}>\n          <button\n            class={{\n              'pull-to-refresh': true,\n              'pulling': this.pulling,\n              'refreshing': this.state === 'loading',\n            }}\n            aria-label=\"Refreshing...\"\n          >\n            {this.state === 'loading' && <refresh-icon slot=\"icon\" />}\n            {this.state !== 'loading' && <arrow-icon slot=\"icon\" />}\n          </button>\n          <div class=\"content\" ref={r => (this.contentElement = r)}>\n            <slot></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"4KAAA,MAAMA,EAAyB,2nBAC/B,MAAAC,EAAeD,E,ugBCcFE,EAAmB,MAc9B,WAAAC,CAAAC,G,2CAbiBC,KAAAC,UAAoB,IA2C7BD,KAAAE,aAAgBC,IACtBC,EAAM,sCAAuCD,EAAEE,QAAQ,GAAGC,MAAON,KAAKO,kBAAkBC,UAAWR,KAAKO,kBAAkBE,aAAcT,KAAKU,gBAAgBF,WAC7J,GAAIR,KAAKO,kBAAkBC,YAAc,EAAG,CAC1CR,KAAKW,MAAQR,EAAEE,QAAQ,GAAGC,K,KACrB,CACLN,KAAKW,MAAQ,C,GAITX,KAAAY,YAAeT,IACrB,GAAIH,KAAKW,MAAO,CACd,MAAME,EAAWV,EAAEE,QAAQ,GAAGC,MAAQN,KAAKW,MAC3C,GAAIE,EAAWb,KAAKC,UAAW,CAC7BD,KAAKc,QAAU,I,KACV,CACLd,KAAKc,QAAU,K,IAKbd,KAAAe,WAAcZ,IACpB,GAAIH,KAAKW,MAAO,CACd,MAAME,EAAWV,EAAEa,eAAe,GAAGV,MAAQN,KAAKW,MAClD,GAAIE,EAAWb,KAAKC,UAAW,CAC7BD,KAAKc,QAAU,MACfd,KAAKiB,QAAQC,KAAK,CAChBC,YAAanB,KAAKmB,a,CAGtBnB,KAAKW,MAAQ,C,cAtEQ,E,WAEuB,Q,aAEpB,MAQ1BP,EAAM,uCACNJ,KAAKmB,YAAcnB,KAAKmB,YAAYC,KAAKpB,K,CAG3C,iBAAAqB,GAAiB,CAEjB,uBAAMC,GACJlB,EAAM,8C,CAGR,gBAAAmB,GACEnB,EAAM,8CACNJ,KAAKO,kBAAkBiB,iBAAiB,aAAcxB,KAAKE,cAC3DF,KAAKO,kBAAkBiB,iBAAiB,YAAaxB,KAAKY,aAC1DZ,KAAKO,kBAAkBiB,iBAAiB,WAAYxB,KAAKe,W,CAG3D,oBAAAU,GACErB,EAAM,kDACNJ,KAAKO,kBAAkBmB,oBAAoB,aAAc1B,KAAKE,cAC9DF,KAAKO,kBAAkBmB,oBAAoB,YAAa1B,KAAKY,aAC7DZ,KAAKO,kBAAkBmB,oBAAoB,WAAY1B,KAAKe,W,CAIvD,iBAAMI,CAAYQ,GACvB3B,KAAK2B,MAAQA,C,CAgDf,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,YAAYC,IAAKC,GAAMlC,KAAKO,iBAAmB2B,GACxDL,EAAA,UAAAE,IAAA,2CACEC,MAAO,CACL,kBAAmB,KACnBlB,QAAWd,KAAKc,QAChBqB,WAAcnC,KAAK2B,QAAU,WAC9B,aACU,iBAEV3B,KAAK2B,QAAU,WAAaE,EAAA,gBAAcO,KAAK,SAC/CpC,KAAK2B,QAAU,WAAaE,EAAA,cAAYO,KAAK,UAEhDP,EAAA,OAAAE,IAAA,2CAAKC,MAAM,UAAUC,IAAKC,GAAMlC,KAAKU,eAAiBwB,GACpDL,EAAA,QAAAE,IAAA,+C,GAhBVM,EAAA,CAbCC,EAA0G,CACzGC,KAAM,wBACNC,aAAc,CACZvB,QAASwB,MAAOC,EAAkCC,KAChDvC,EAAM,8CACN,MAAMe,YAAEA,GAAgBuB,EAAME,aACxBzB,EAAY,iBACZwB,EAAeE,QAAQC,WAAWC,UAAW,YAAa,aAC1D5B,EAAY,QAAQ,GAG9B6B,kBAAmB,O"}

package/dist/nylas-web-elements/{p-25c97a60.entry.js → p-de84d999.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as e,a as o}from"./p-68c2fadf.js";const n=".sc-info-icon-h{display:flex}";const a=n;const s=class{constructor(e){t(this,e);this.width="14";this.height="14"}render(){return e("svg",{key:"3b39e75ccc51ecef3016e2efacde52c32ebd3d7f",width:this.width,height:this.height,fill:"none",xmlns:"http://www.w3.org/2000/svg"},e("path",{key:"27399ed4f40a68e7c6cace9ccb098289e524e501",fill:"currentColor",d:"M6.5 5.5C6.77614 5.5 7 5.72386 7 6V9C7 9.27614 6.77614 9.5 6.5 9.5C6.22386 9.5 6 9.27614 6 9V6C6 5.72386 6.22386 5.5 6.5 5.5ZM6.50001 4.74907C6.91369 4.74907 7.24905 4.41371 7.24905 4.00003C7.24905 3.58635 6.91369 3.251 6.50001 3.251C6.08633 3.251 5.75098 3.58635 5.75098 4.00003C5.75098 4.41371 6.08633 4.74907 6.50001 4.74907ZM0.5 6.5C0.5 3.18629 3.18629 0.5 6.5 0.5C9.81371 0.5 12.5 3.18629 12.5 6.5C12.5 9.81371 9.81371 12.5 6.5 12.5C3.18629 12.5 0.5 9.81371 0.5 6.5ZM6.5 1.5C3.73858 1.5 1.5 3.73858 1.5 6.5C1.5 9.26142 3.73858 11.5 6.5 11.5C9.26142 11.5 11.5 9.26142 11.5 6.5C11.5 3.73858 9.26142 1.5 6.5 1.5Z"}))}};s.style=a;const r='.tooltip-container{position:relative;display:flex;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:"Inter", sans-serif}.tooltip-content{visibility:hidden;background-color:var(--nylas-base-800);color:var(--nylas-base-0);text-align:left;border-radius:6px;padding:5px 0;position:absolute;z-index:1;opacity:0;transition:opacity 0.3s;padding:0.5rem 1rem;max-width:200px;width:max-content}.tooltip-content.top{bottom:0;left:0;margin-bottom:1.25rem;transform:translateX(-50%)}.tooltip-content.right{top:50%;left:0%;margin-left:1.25rem;transform:translateY(-50%)}.tooltip-content.bottom{top:0;left:0;margin-top:1.25rem;transform:translateX(-50%)}.tooltip-content.left{top:50%;right:0%;margin-right:1.25rem;transform:translateY(-50%)}.tooltip-container:hover .tooltip-content,.tooltip-container:focus-within .tooltip-content{visibility:visible;opacity:1}.tooltip-content::after{content:"";position:absolute;top:-0.75rem;left:50%;transform:rotate(180deg);border-width:6px;border-style:solid;border-color:black transparent transparent transparent}.tooltip-content.top::after{top:100%;left:50%;transform:rotate(0deg)}.tooltip-content.bottom::after{top:-0.75rem;left:50%;transform:rotate(180deg)}.tooltip-content.left::after{top:47.5%;left:100%;transform:rotate(270deg)}.tooltip-content.right::after{top:47.5%;left:-0.75rem;transform:rotate(90deg)}';const i=r;const l=class{constructor(e){t(this,e);this.position="bottom"}showTooltip(t){t.target.nextElementSibling.style.visibility="visible";t.target.nextElementSibling.style.opacity="1"}hideTooltip(t){t.target.nextElementSibling.style.visibility="hidden";t.target.nextElementSibling.style.opacity="0"}render(){return e("div",{key:"18b608bb808e958a45cf72aeb8b1e25c0227ea62",class:"tooltip-container",part:"tc__container"},e("span",{key:"4e7a423a9de7f26914169d3b4b72507de459a782",class:"info-icon",tabindex:"0",onFocus:this.showTooltip.bind(this),onBlur:this.hideTooltip.bind(this)},e("slot",{key:"6820cbb0852277eb96fb9f4b6ad88576f41d602f",name:"tooltip-icon"},"i")),e("span",{key:"99c67c01fcadf2de5890498fb7422b26807e1562",class:`tooltip-content ${this.position}`,part:"tc__content"},e("slot",{key:"416736464010dee66cc5f5fbb03114d6c6bc32f8",name:"tooltip-content"},"This is a help text.")))}get el(){return o(this)}};l.style=i;export{s as info_icon,l as tooltip_component};
-//# sourceMappingURL=p-25c97a60.entry.js.map
+import{r as t,h as e,a as o}from"./p-68c2fadf.js";const a=".sc-info-icon-h{display:flex}";const n=a;const s=class{constructor(e){t(this,e);this.width="14";this.height="14"}render(){return e("svg",{key:"496a3b939401c1361d0dc4fda1e5dcf1e69a0665",width:this.width,height:this.height,fill:"none",xmlns:"http://www.w3.org/2000/svg"},e("path",{key:"2c6588c343ec966569b68ee7e3730e7efd8087f1",fill:"currentColor",d:"M6.5 5.5C6.77614 5.5 7 5.72386 7 6V9C7 9.27614 6.77614 9.5 6.5 9.5C6.22386 9.5 6 9.27614 6 9V6C6 5.72386 6.22386 5.5 6.5 5.5ZM6.50001 4.74907C6.91369 4.74907 7.24905 4.41371 7.24905 4.00003C7.24905 3.58635 6.91369 3.251 6.50001 3.251C6.08633 3.251 5.75098 3.58635 5.75098 4.00003C5.75098 4.41371 6.08633 4.74907 6.50001 4.74907ZM0.5 6.5C0.5 3.18629 3.18629 0.5 6.5 0.5C9.81371 0.5 12.5 3.18629 12.5 6.5C12.5 9.81371 9.81371 12.5 6.5 12.5C3.18629 12.5 0.5 9.81371 0.5 6.5ZM6.5 1.5C3.73858 1.5 1.5 3.73858 1.5 6.5C1.5 9.26142 3.73858 11.5 6.5 11.5C9.26142 11.5 11.5 9.26142 11.5 6.5C11.5 3.73858 9.26142 1.5 6.5 1.5Z"}))}};s.style=n;const r='.tooltip-container{position:relative;display:flex;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:"Inter", sans-serif}.tooltip-content{visibility:hidden;background-color:var(--nylas-base-800);color:var(--nylas-base-0);text-align:left;border-radius:6px;padding:5px 0;position:absolute;z-index:1;opacity:0;transition:opacity 0.3s;padding:0.5rem 1rem;max-width:200px;width:max-content}.tooltip-content.top{bottom:0;left:0;margin-bottom:1.25rem;transform:translateX(-50%)}.tooltip-content.right{top:50%;left:0%;margin-left:1.25rem;transform:translateY(-50%)}.tooltip-content.bottom{top:0;left:0;margin-top:1.25rem;transform:translateX(-50%)}.tooltip-content.left{top:50%;right:0%;margin-right:1.25rem;transform:translateY(-50%)}.tooltip-container:hover .tooltip-content,.tooltip-container:focus-within .tooltip-content{visibility:visible;opacity:1}.tooltip-content::after{content:"";position:absolute;top:-0.75rem;left:50%;transform:rotate(180deg);border-width:6px;border-style:solid;border-color:black transparent transparent transparent}.tooltip-content.top::after{top:100%;left:50%;transform:rotate(0deg)}.tooltip-content.bottom::after{top:-0.75rem;left:50%;transform:rotate(180deg)}.tooltip-content.left::after{top:47.5%;left:100%;transform:rotate(270deg)}.tooltip-content.right::after{top:47.5%;left:-0.75rem;transform:rotate(90deg)}';const i=r;const l=class{constructor(e){t(this,e);this.position="bottom"}showTooltip(t){t.target.nextElementSibling.style.visibility="visible";t.target.nextElementSibling.style.opacity="1"}hideTooltip(t){t.target.nextElementSibling.style.visibility="hidden";t.target.nextElementSibling.style.opacity="0"}render(){return e("div",{key:"f3fdc486d7ca7ef6ff0aec39289091fee30e4836",class:"tooltip-container",part:"tc__container"},e("span",{key:"48d370ecb473b38c10328f90d5ff891ea0762a02",class:"info-icon",tabindex:"0",onFocus:this.showTooltip.bind(this),onBlur:this.hideTooltip.bind(this)},e("slot",{key:"2838e64ca0434b0616c5118b6ec0b0718d7aae2f",name:"tooltip-icon"},"i")),e("span",{key:"54ccaea6247be13d692bd04fd913293327b6d123",class:`tooltip-content ${this.position}`,part:"tc__content"},e("slot",{key:"89495a237556d4bfef511554fcfbda95c76342a8",name:"tooltip-content"},"This is a help text.")))}get el(){return o(this)}};l.style=i;export{s as info_icon,l as tooltip_component};
+//# sourceMappingURL=p-de84d999.entry.js.map