@meetelise/chat 1.20.176 → 1.20.177

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@meetelise/chat",
3
- "version": "1.20.176",
3
+ "version": "1.20.177",
4
4
  "description": "",
5
5
  "main": "public/dist/index.js",
6
6
  "type": "module",
@@ -117,59 +117,62 @@
117
117
  <!-- Webpack dev server will serve the bundle, index.js, at the path '/' -->
118
118
  <script type="module" async>
119
119
  import MEChat from "/index.js";
120
- MEChat.start({
121
- // // 123 Main Street
122
- // organization: "test-company",
123
- // building: "e2e-test-yardi-building",
120
+ // MEChat.start({
121
+ // // // 123 Main Street
122
+ // // organization: "test-company",
123
+ // // building: "e2e-test-yardi-building",
124
124
 
125
- // organization: "edward-rose",
126
- // building: "rivers-edge-apartments",
127
- // mobileStyles: {
128
- // bottom: "100px",
129
- // },
125
+ // // organization: "edward-rose",
126
+ // // building: "rivers-edge-apartments",
127
+ // // mobileStyles: {
128
+ // // bottom: "100px",
129
+ // // },
130
130
 
131
- // organization: "mill-creek",
132
- // building: "5ec32c42-2548-11ec-b813-e361780537f5",
131
+ // // organization: "mill-creek",
132
+ // // building: "5ec32c42-2548-11ec-b813-e361780537f5",
133
133
 
134
- // organization: "d1a1060d-3844-48d4-a454-1ba26292bc69",
135
- // building: "25feb690-c76f-11ed-83b9-a7aa9698a486",
134
+ // // organization: "d1a1060d-3844-48d4-a454-1ba26292bc69",
135
+ // // building: "25feb690-c76f-11ed-83b9-a7aa9698a486",
136
136
 
137
- // organization: "TT",
138
- // building: "ffc97070-5c73-11ed-8507-77860136d3bf",
137
+ // // organization: "TT",
138
+ // // building: "ffc97070-5c73-11ed-8507-77860136d3bf",
139
139
 
140
- // AMLI
141
- organization: "amli",
142
- building: "6e43581c-c4a4-11ec-a62b-9311f60f23f8",
140
+ // // AMLI
141
+ // organization: "amli",
142
+ // building: "6e43581c-c4a4-11ec-a62b-9311f60f23f8",
143
143
 
144
- // organization: "d1a1060d-3844-48d4-a454-1ba26292bc69",
145
- // building: "25fead9e-c76f-11ed-83b2-7b1e7b442e9f",
144
+ // // organization: "d1a1060d-3844-48d4-a454-1ba26292bc69",
145
+ // // building: "25fead9e-c76f-11ed-83b2-7b1e7b442e9f",
146
146
 
147
- // Taylor Street Apartments
148
- // organization: "test-company",
149
- // building: "e2e-test-yardi-building",
147
+ // // Taylor Street Apartments
148
+ // // organization: "test-company",
149
+ // // building: "e2e-test-yardi-building",
150
150
 
151
- // The Qual People
152
- // organization: "Pacific Urban Residential",
153
- // building: "1ac49f90-6150-11ed-b327-1b3f05e7b9db",
151
+ // // The Qual People
152
+ // // organization: "Pacific Urban Residential",
153
+ // // building: "1ac49f90-6150-11ed-b327-1b3f05e7b9db",
154
154
 
155
- // organization: "Pacific Urban Residential",
156
- // building: "1ac49f90-6150-11ed-b327-1b3f05e7b9db",
155
+ // // organization: "Pacific Urban Residential",
156
+ // // building: "1ac49f90-6150-11ed-b327-1b3f05e7b9db",
157
157
 
158
- // Cambridge House
159
- // organization: "elise-ai",
160
- // building: "the-cambridge-house-3",
158
+ // // Cambridge House
159
+ // // organization: "elise-ai",
160
+ // // building: "the-cambridge-house-3",
161
161
 
162
- // Artistry on 10th
163
- // organization: "lindy",
164
- // building: "c4cfc3ec-c4da-11ec-bda4-43aed00ca1b2",
162
+ // // Artistry on 10th
163
+ // // organization: "lindy",
164
+ // // building: "c4cfc3ec-c4da-11ec-bda4-43aed00ca1b2",
165
165
 
166
- // brandColor: "#a44ef5",
166
+ // // brandColor: "#a44ef5",
167
167
 
168
- // organization: "Pacific Urban Residential",
169
- // building: "1ac49f90-6150-11ed-b327-1b3f05e7b9db",
168
+ // // organization: "Pacific Urban Residential",
169
+ // // building: "1ac49f90-6150-11ed-b327-1b3f05e7b9db",
170
170
 
171
- // organization: "sparrow",
172
- // building: "8e87ae6e-eae8-11ed-aae8-fb82f4692a79",
171
+ // // organization: "sparrow",
172
+ // // building: "8e87ae6e-eae8-11ed-aae8-fb82f4692a79",
173
+ // });
174
+ MEChat.healthcareStart({
175
+ id: "6a9e65e5-9699-4c96-af75-1741d0df79aa",
173
176
  });
174
177
  </script>
175
178
  <main>
@@ -3035,8 +3035,6 @@ otherwise there's some empty space at the bottom of the button, which interferes
3035
3035
  font-family: Poppins, "Open Sans", "Helvetica", sans-serif;
3036
3036
  }
3037
3037
  .healthchat-container__desktop {
3038
- right: 18px;
3039
- bottom: 130px;
3040
3038
  width: 300px;
3041
3039
  height: 420px;
3042
3040
  border-radius: 10px;
@@ -3490,10 +3488,11 @@ otherwise there's some empty space at the bottom of the button, which interferes
3490
3488
  </div>
3491
3489
  </div>
3492
3490
  </a></div> `}))}
3493
- </div>`:U``}};kr.styles=[ln,Mr],Dr([ue({attribute:!0})],kr.prototype,"message",void 0),Dr([ue({attribute:!0})],kr.prototype,"myPubnub",void 0),Dr([ue({attribute:!0})],kr.prototype,"onMount",void 0),Dr([le()],kr.prototype,"loadingPreviews",void 0),Dr([le()],kr.prototype,"parsedMessage",void 0),Dr([le()],kr.prototype,"websitePreviewInfo",void 0),Dr([le()],kr.prototype,"imagesToDisplay",void 0),Dr([le()],kr.prototype,"imageUrlError",void 0),kr=Dr([ae("pubnub-message")],kr);var Ur=function(e,t,n,i){var r,o=arguments.length,a=o<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,n,i);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(o<3?r(a):o>3?r(t,n,a):r(t,n))||a);return o>3&&a&&Object.defineProperty(t,n,a),a};let qr=class extends re{constructor(){super(...arguments),this.onMount=()=>({}),this.isHealthChat=!1,this.brandColor=Fe,this.onClickExit=()=>({}),this.requiresConsent=!1,this.messages=[],this.isLoadingMessages=!1,this.hasReceivedConsent=!1,this.privacyPolicyUrl="http://bit.ly/me_privacy_policy",this.websitePreviewMapping={},this.sendMessage=async e=>{var t;this.messageInput.value="",this.autoResizeMessageInput(),await(null===(t=this.myPubnub)||void 0===t?void 0:t.sendMessage(e))},this.scrollToChatBottom=()=>{this.messageBody.scrollTo({top:this.messageBody.scrollHeight-this.messageBody.clientHeight,behavior:"smooth"})},this.autoResizeMessageInput=()=>{this.messageInput.style.height="auto",this.messageInput.style.height=this.messageInput.scrollHeight+"px"},this.needsConsent=()=>!!this.requiresConsent&&!!this.requiresConsent&&!this.hasReceivedConsent}firstUpdated(){var e,t;this.messages=(null===(e=this.myPubnub)||void 0===e?void 0:e.messages)||[],null===(t=this.myPubnub)||void 0===t||t.addChatListener((e=>{this.messages=e.messages,this.isLoadingMessages=e.isLoading})),this.onMount()}async updated(){this.scrollToChatBottom()}render(){var e,t,n;if(!this.buildingSlug)return U``;if(this.isHealthChat)return U`
3491
+ </div>`:U``}};kr.styles=[ln,Mr],Dr([ue({attribute:!0})],kr.prototype,"message",void 0),Dr([ue({attribute:!0})],kr.prototype,"myPubnub",void 0),Dr([ue({attribute:!0})],kr.prototype,"onMount",void 0),Dr([le()],kr.prototype,"loadingPreviews",void 0),Dr([le()],kr.prototype,"parsedMessage",void 0),Dr([le()],kr.prototype,"websitePreviewInfo",void 0),Dr([le()],kr.prototype,"imagesToDisplay",void 0),Dr([le()],kr.prototype,"imageUrlError",void 0),kr=Dr([ae("pubnub-message")],kr);var Ur=function(e,t,n,i){var r,o=arguments.length,a=o<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,n,i);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(o<3?r(a):o>3?r(t,n,a):r(t,n))||a);return o>3&&a&&Object.defineProperty(t,n,a),a};let qr=class extends re{constructor(){super(...arguments),this.right=0,this.bottom=0,this.top=0,this.left=0,this.onMount=()=>({}),this.isHealthChat=!1,this.brandColor=Fe,this.onClickExit=()=>({}),this.requiresConsent=!1,this.messages=[],this.isLoadingMessages=!1,this.hasReceivedConsent=!1,this.privacyPolicyUrl="http://bit.ly/me_privacy_policy",this.websitePreviewMapping={},this.sendMessage=async e=>{var t;this.messageInput.value="",this.autoResizeMessageInput(),await(null===(t=this.myPubnub)||void 0===t?void 0:t.sendMessage(e))},this.scrollToChatBottom=()=>{this.messageBody.scrollTo({top:this.messageBody.scrollHeight-this.messageBody.clientHeight,behavior:"smooth"})},this.autoResizeMessageInput=()=>{this.messageInput.style.height="auto",this.messageInput.style.height=this.messageInput.scrollHeight+"px"},this.needsConsent=()=>!!this.requiresConsent&&!!this.requiresConsent&&!this.hasReceivedConsent}firstUpdated(){var e,t;this.messages=(null===(e=this.myPubnub)||void 0===e?void 0:e.messages)||[],null===(t=this.myPubnub)||void 0===t||t.addChatListener((e=>{this.messages=e.messages,this.isLoadingMessages=e.isLoading})),this.onMount()}async updated(){this.scrollToChatBottom()}render(){var e,t,n;if(!this.buildingSlug)return U``;let i={};if(i=un()?{top:void 0,bottom:0,left:void 0,right:0}:{top:isNaN(this.top)?void 0:`${this.top}px`,bottom:isNaN(this.bottom)?"130px":`${this.bottom}px`,left:isNaN(this.left)?void 0:`${this.left}px`,right:isNaN(this.right)?"18px":`${this.right}px`},this.isHealthChat)return U`
3494
3492
  <div
3495
3493
  id="healthchat-container"
3496
3494
  class=${fe({"pubnub-container__mobile":un(),"healthchat-container__desktop":!un()})}
3495
+ style=${Pe(i)}
3497
3496
  >
3498
3497
  <div id="healthchat-header">
3499
3498
  ${"6a9e65e5-9699-4c96-af75-1741d0df79aa"===this.buildingSlug?U` <div>
@@ -3591,7 +3590,7 @@ otherwise there's some empty space at the bottom of the button, which interferes
3591
3590
  </div>
3592
3591
  </div>
3593
3592
  </div>
3594
- `;if(!this.building)return U``;const i=this.building.orgId;return U`
3593
+ `;if(!this.building)return U``;const r=this.building.orgId;return U`
3595
3594
  <div
3596
3595
  id="pubnub-chat-container"
3597
3596
  class=${fe({"pubnub-container__mobile":un(),"pubnub-container__desktop":!un()})}
@@ -3621,7 +3620,7 @@ otherwise there's some empty space at the bottom of the button, which interferes
3621
3620
  >
3622
3621
  ${Br(null!==(n=this.orgSlug)&&void 0!==n?n:"")}
3623
3622
  ${this.building.welcomeMessage?U` <li
3624
- class=${fe({"message-container":!0,"ai-message":!0,"with-box-shadow":444===i})}
3623
+ class=${fe({"message-container":!0,"ai-message":!0,"with-box-shadow":444===r})}
3625
3624
  >
3626
3625
  <p
3627
3626
  class=${fe({"message-text":!0,"webchat-font__desktop":!un(),"webchat-font__mobile":un()})}
@@ -3631,7 +3630,7 @@ otherwise there's some empty space at the bottom of the button, which interferes
3631
3630
  </li>`:""}
3632
3631
  ${this.messages.map((e=>{var t,n;return U`
3633
3632
  <li
3634
- class=${Ln()("message-container",{"lead-message":null===(t=this.myPubnub)||void 0===t?void 0:t.isLeadMessage(e),"ai-message":!(null===(n=this.myPubnub)||void 0===n?void 0:n.isLeadMessage(e)),"with-box-shadow":444===i})}
3633
+ class=${Ln()("message-container",{"lead-message":null===(t=this.myPubnub)||void 0===t?void 0:t.isLeadMessage(e),"ai-message":!(null===(n=this.myPubnub)||void 0===n?void 0:n.isLeadMessage(e)),"with-box-shadow":444===r})}
3635
3634
  key=${e.timetoken}
3636
3635
  >
3637
3636
  <pubnub-message
@@ -3672,7 +3671,7 @@ otherwise there's some empty space at the bottom of the button, which interferes
3672
3671
  </button>
3673
3672
  </div>
3674
3673
  </div>
3675
- `}};qr.styles=[ln,Mr,Fr,Pr],Ur([ue({attribute:!0})],qr.prototype,"onMount",void 0),Ur([ue({attribute:!0})],qr.prototype,"channel",void 0),Ur([ue({attribute:!0})],qr.prototype,"isHealthChat",void 0),Ur([ue({attribute:!0})],qr.prototype,"myPubnub",void 0),Ur([ue({attribute:!0})],qr.prototype,"orgSlug",void 0),Ur([ue({attribute:!0})],qr.prototype,"buildingSlug",void 0),Ur([ue({attribute:!0})],qr.prototype,"building",void 0),Ur([ue({attribute:!0})],qr.prototype,"brandColor",void 0),Ur([ue({attribute:!0})],qr.prototype,"onClickExit",void 0),Ur([ue({attribute:!0})],qr.prototype,"requiresConsent",void 0),Ur([de("#message-input",!0)],qr.prototype,"messageInput",void 0),Ur([de("#conversation-body",!0)],qr.prototype,"messageBody",void 0),Ur([le()],qr.prototype,"messages",void 0),Ur([le()],qr.prototype,"isLoadingMessages",void 0),Ur([le()],qr.prototype,"hasReceivedConsent",void 0),Ur([le()],qr.prototype,"privacyPolicyUrl",void 0),Ur([le()],qr.prototype,"websitePreviewMapping",void 0),qr=Ur([ae("pubnub-chat")],qr);const Br=e=>"avb"===e?U`
3674
+ `}};qr.styles=[ln,Mr,Fr,Pr],Ur([ue({type:Number})],qr.prototype,"right",void 0),Ur([ue({type:Number})],qr.prototype,"bottom",void 0),Ur([ue({type:Number})],qr.prototype,"top",void 0),Ur([ue({type:Number})],qr.prototype,"left",void 0),Ur([ue({attribute:!0})],qr.prototype,"onMount",void 0),Ur([ue({attribute:!0})],qr.prototype,"channel",void 0),Ur([ue({attribute:!0})],qr.prototype,"isHealthChat",void 0),Ur([ue({attribute:!0})],qr.prototype,"myPubnub",void 0),Ur([ue({attribute:!0})],qr.prototype,"orgSlug",void 0),Ur([ue({attribute:!0})],qr.prototype,"buildingSlug",void 0),Ur([ue({attribute:!0})],qr.prototype,"building",void 0),Ur([ue({attribute:!0})],qr.prototype,"brandColor",void 0),Ur([ue({attribute:!0})],qr.prototype,"onClickExit",void 0),Ur([ue({attribute:!0})],qr.prototype,"requiresConsent",void 0),Ur([de("#message-input",!0)],qr.prototype,"messageInput",void 0),Ur([de("#conversation-body",!0)],qr.prototype,"messageBody",void 0),Ur([le()],qr.prototype,"messages",void 0),Ur([le()],qr.prototype,"isLoadingMessages",void 0),Ur([le()],qr.prototype,"hasReceivedConsent",void 0),Ur([le()],qr.prototype,"privacyPolicyUrl",void 0),Ur([le()],qr.prototype,"websitePreviewMapping",void 0),qr=Ur([ae("pubnub-chat")],qr);const Br=e=>"avb"===e?U`
3676
3675
  <li class="message-container disclaimer-message">
3677
3676
  <p class="disclaimer-inner">
3678
3677
  Chats may be recorded by us and our vendors.
@@ -3926,8 +3925,6 @@ otherwise there's some empty space at the bottom of the button, which interferes
3926
3925
  `,Jr([ue({type:String})],jr.prototype,"buildingSlug",void 0),Jr([ue({type:String})],jr.prototype,"orgSlug",void 0),Jr([ue({type:Object})],jr.prototype,"launcherStyles",void 0),Jr([ue()],jr.prototype,"mobileStyles",void 0),Jr([ue({type:Boolean})],jr.prototype,"isMinimized",void 0),Jr([ue({type:String})],jr.prototype,"brandColor",void 0),Jr([le()],jr.prototype,"chatId",void 0),Jr([le()],jr.prototype,"analytics",void 0),Jr([le()],jr.prototype,"launcher",void 0),Jr([le()],jr.prototype,"building",void 0),Jr([le()],jr.prototype,"designConcept",void 0),Jr([le()],jr.prototype,"leadSources",void 0),Jr([le()],jr.prototype,"currentLeadSource",void 0),Jr([le()],jr.prototype,"featureFlagShowDropdown",void 0),Jr([le()],jr.prototype,"phoneNumberForSource",void 0),Jr([le()],jr.prototype,"hasMounted",void 0),Jr([le()],jr.prototype,"hideLauncher",void 0),Jr([le()],jr.prototype,"isLoading",void 0),Jr([le()],jr.prototype,"showTourNextToChat",void 0),Jr([le()],jr.prototype,"displayPubnubChat",void 0),Jr([le()],jr.prototype,"myPubnub",void 0),Jr([le()],jr.prototype,"enabledChatWidgets",void 0),Jr([le()],jr.prototype,"webchatConfigHasAutoOpenChat",void 0),Jr([le()],jr.prototype,"requiresConsent",void 0),Jr([le()],jr.prototype,"privacyPolicyUrl",void 0),jr=Jr([ae("me-chat")],jr);const Hr=e=>{for(const t of e){const e=document.getElementById(t);if(e)return e}return null},Gr=async(e,n)=>{var i;if(!n||!e)return;const r=await async function(e){if(!e)return!1;try{return(await t().get(Gn(e),{params:{building_slug:e,flag_type:"bool",feature_flag:"webchat-use-override-contact-us-form",default_str:null,default_bool:!1}})).data}catch(e){return!1}}(n);if(!r)return;const o=Hr(["myContactForm","contactus"]);let a;if(!(o&&o instanceof HTMLFormElement)){const t=document.querySelector("form");return void(window.location.pathname.toLowerCase().includes("contactus")&&zr(n,e,"Could not find form",t?{id:t.id}:void 0))}for(let e=0;e<o.elements.length;e++){const t=o.elements[e];if("button"===t.tagName.toLowerCase()&&"fakebutton"===t.getAttribute("data-selenium-id")){a=t;break}}if(!a)return zr(n,e,"Could not find submit button");const s=()=>({firstName:Hr(["firstname","txtName"]),lastName:Hr(["lastname","txtName2"]),email:Hr(["email","txtEmail"]),phone:Hr(["phonenumber","txtPhone"]),message:Hr(["message","txtComments"])});if(Object.values(s()).some((e=>null===e))){const t=Object.entries(s()).filter((([,e])=>null===e)).map((([e])=>e));return zr(n,e,"Missing the following form elements: "+t.join(", "))}const u=a.textContent,l=a.cloneNode(!0);null===(i=a.parentNode)||void 0===i||i.replaceChild(l,a),l.onclick=async function(t){if(Object.values(s()).forEach((e=>{"true"!==(null==e?void 0:e.getAttribute("aria-required"))||e.value||(e.className="form-control required is-invalid")})),!Object.values(s()).every((e=>null!==e&&!("true"===e.getAttribute("aria-required")&&!e.value)&&("email"!==e.id&&"phonenumber"!==e.id||"true"!==e.getAttribute("aria-invalid")))))return;t.preventDefault(),l.textContent="Processing request...",l.disabled=!0;const i={};Object.entries(s()).forEach((([e,t])=>i[e]=null==t?void 0:t.value));const r=await li(e,n),a=await fi(n,document.referrer);if(!r)return zr(n,e,"Could not find building"),null;const d={email_address:i.email,first_name:i.firstName,last_name:i.lastName,phone_number:i.phone,first_message:i.message,building_id:r.id,is_external_form:!0,lead_sources:[...new Set(a?[a,"property-website"]:["property-website"])]},c=JSON.stringify(d);fetch("https://app.meetelise.com/platformApi/state/create/contactMe",{method:"POST",headers:{"Content-Type":"application/json","building-slug":n,"org-slug":e},body:c}).then((e=>{if(!e.ok)throw new Error(`HTTP error ${e.status}`);return o&&o.reset(),Object.values(s()).forEach((e=>{e&&(e.disabled=!0)})),l.textContent="Submitted",l.disabled=!0,e.json()})).catch((()=>{l.textContent=u}))}},zr=(e,t,n,i)=>{const r=JSON.stringify({orgSlug:t,buildingSlug:e,reason:n,url:window.location.href,formIdInfo:i});fetch("https://app.meetelise.com/platformApi/webchat/form-override-error",{method:"POST",headers:{"Content-Type":"application/json","building-slug":e,"org-slug":t},body:r})},Wr=u`
3927
3926
  .chat-launcher {
3928
3927
  position: fixed;
3929
- bottom: 72px;
3930
- right: 18px;
3931
3928
  }
3932
3929
  .close-chat-bttn,
3933
3930
  .open-chat-bttn {
@@ -3956,8 +3953,11 @@ otherwise there's some empty space at the bottom of the button, which interferes
3956
3953
  filter: brightness(1.1);
3957
3954
  }
3958
3955
  }
3959
- `;var Qr=function(e,t,n,i){var r,o=arguments.length,a=o<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,n,i);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(o<3?r(a):o>3?r(t,n,a):r(t,n))||a);return o>3&&a&&Object.defineProperty(t,n,a),a};let Vr=class extends re{constructor(){super(...arguments),this.isChatOpen=!1,this.onClickCloseChat=()=>({}),this.onClickOpenChat=()=>({})}render(){return this.isChatOpen?U`
3960
- <div class="chat-launcher">
3956
+ `;var Qr=function(e,t,n,i){var r,o=arguments.length,a=o<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,n,i);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(o<3?r(a):o>3?r(t,n,a):r(t,n))||a);return o>3&&a&&Object.defineProperty(t,n,a),a};let Vr=class extends re{constructor(){super(...arguments),this.right=0,this.bottom=0,this.top=0,this.left=0,this.isChatOpen=!1,this.onClickCloseChat=()=>({}),this.onClickOpenChat=()=>({})}render(){return this.isChatOpen?U`
3957
+ <div
3958
+ class="chat-launcher"
3959
+ style=${Pe({top:un()||isNaN(this.top)?void 0:`${this.top+432}px`,bottom:un()||isNaN(this.bottom)?"72px":this.bottom-60+"px",left:un()||isNaN(this.left)?void 0:`${this.left}px`,right:un()||isNaN(this.right)?"18px":`${this.right}px`})}
3960
+ >
3961
3961
  <button class="close-chat-bttn" @click=${this.onClickCloseChat}>
3962
3962
  <svg
3963
3963
  width="16"
@@ -3975,7 +3975,10 @@ otherwise there's some empty space at the bottom of the button, which interferes
3975
3975
  </svg>
3976
3976
  </button>
3977
3977
  </div>
3978
- `:U` <div class="chat-launcher">
3978
+ `:U` <div
3979
+ class="chat-launcher"
3980
+ style=${Pe({top:un()||isNaN(this.top)?void 0:`${this.top+432}px`,bottom:un()||isNaN(this.bottom)?"72px":this.bottom-60+"px",left:un()||isNaN(this.left)?void 0:`${this.left}px`,right:un()||isNaN(this.right)?"18px":`${this.right}px`})}
3981
+ >
3979
3982
  <button class="open-chat-bttn" @click=${this.onClickOpenChat}>
3980
3983
  <svg
3981
3984
  width="24"
@@ -3992,7 +3995,7 @@ otherwise there's some empty space at the bottom of the button, which interferes
3992
3995
  />
3993
3996
  </svg>
3994
3997
  </button>
3995
- </div>`}};Vr.styles=[Wr],Qr([ue({attribute:!0})],Vr.prototype,"isChatOpen",void 0),Qr([ue({attribute:!0})],Vr.prototype,"onClickCloseChat",void 0),Qr([ue({attribute:!0})],Vr.prototype,"onClickOpenChat",void 0),Vr=Qr([ae("healthcare-launcher")],Vr);var Kr=function(e,t,n,i){var r,o=arguments.length,a=o<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,n,i);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(o<3?r(a):o>3?r(t,n,a):r(t,n))||a);return o>3&&a&&Object.defineProperty(t,n,a),a};let Xr=class extends re{constructor(){super(...arguments),this.healthcareId="",this.launcher=null,this.currentLeadSource=null,this.displayPubnubChat=!1,this.myPubnub=null,this.requiresConsent=!1,this.privacyPolicyUrl="http://bit.ly/me_privacy_policy",this.isLoading=!0,this.launcherRef=xe(),this.firstUpdated=async()=>{await this.initializeChatVariables()},this.initializeChatVariables=async()=>{this.isLoading=!0;const e=Or(this.healthcareId),t=Cr(this.healthcareId,e)?e:Ar(this.healthcareId,!1);if(!t.leadId)throw new Error("Lead ID is null");this.myPubnub=new Nr(this.healthcareId,null,"",this.currentLeadSource,t.leadId),t.initiatedChat&&await this.myPubnub.initializePubnub(e),un()||(this.displayPubnubChat=!0),this.attachOnClickToLauncher(),this.isLoading=!1},this.attachOnClickToLauncher=()=>{const e=this.launcherRef.value;e&&(e.onChatTapped=async()=>{this.displayPubnubChat=!0})}}async restartConversation(){var e;null===(e=this.myPubnub)||void 0===e||e.handleDisconnect(),xr(this.healthcareId),this.myPubnub=null,this.displayPubnubChat=!1,await this.initializeChatVariables()}show(){this.launcher&&(this.launcher.style.display="")}hide(){this.launcher&&(this.launcher.style.display="none")}disconnectedCallback(){var e;null===(e=this.myPubnub)||void 0===e||e.handleDisconnect(),super.disconnectedCallback()}render(){var e;return Ki(),this.isLoading?U``:U`
3998
+ </div>`}};Vr.styles=[Wr],Qr([ue({type:Number})],Vr.prototype,"right",void 0),Qr([ue({type:Number})],Vr.prototype,"bottom",void 0),Qr([ue({type:Number})],Vr.prototype,"top",void 0),Qr([ue({type:Number})],Vr.prototype,"left",void 0),Qr([ue({attribute:!0})],Vr.prototype,"isChatOpen",void 0),Qr([ue({attribute:!0})],Vr.prototype,"onClickCloseChat",void 0),Qr([ue({attribute:!0})],Vr.prototype,"onClickOpenChat",void 0),Vr=Qr([ae("healthcare-launcher")],Vr);var Kr=function(e,t,n,i){var r,o=arguments.length,a=o<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,n,i);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(o<3?r(a):o>3?r(t,n,a):r(t,n))||a);return o>3&&a&&Object.defineProperty(t,n,a),a};let Xr=class extends re{constructor(){super(...arguments),this.healthcareId="",this.right=0,this.bottom=0,this.top=0,this.left=0,this.launcher=null,this.currentLeadSource=null,this.displayPubnubChat=!1,this.myPubnub=null,this.requiresConsent=!1,this.privacyPolicyUrl="http://bit.ly/me_privacy_policy",this.isLoading=!0,this.launcherRef=xe(),this.firstUpdated=async()=>{await this.initializeChatVariables()},this.initializeChatVariables=async()=>{this.isLoading=!0;const e=Or(this.healthcareId),t=Cr(this.healthcareId,e)?e:Ar(this.healthcareId,!1);if(!t.leadId)throw new Error("Lead ID is null");this.myPubnub=new Nr(this.healthcareId,null,"",this.currentLeadSource,t.leadId),t.initiatedChat&&await this.myPubnub.initializePubnub(e),un()||(this.displayPubnubChat=!0),this.attachOnClickToLauncher(),this.isLoading=!1},this.attachOnClickToLauncher=()=>{const e=this.launcherRef.value;e&&(e.onChatTapped=async()=>{this.displayPubnubChat=!0})}}async restartConversation(){var e;null===(e=this.myPubnub)||void 0===e||e.handleDisconnect(),xr(this.healthcareId),this.myPubnub=null,this.displayPubnubChat=!1,await this.initializeChatVariables()}show(){this.launcher&&(this.launcher.style.display="")}hide(){this.launcher&&(this.launcher.style.display="none")}disconnectedCallback(){var e;null===(e=this.myPubnub)||void 0===e||e.handleDisconnect(),super.disconnectedCallback()}render(){var e;return Ki(),this.isLoading?U``:U`
3996
3999
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
3997
4000
  <div id="aria-describe-info" style="display: none;">
3998
4001
  EliseAI widget that allows you to chat with a virtual assistant, book
@@ -4008,13 +4011,22 @@ otherwise there's some empty space at the bottom of the button, which interferes
4008
4011
  .onClickExit=${()=>{this.displayPubnubChat=!1}}
4009
4012
  .requiresConsent=${this.requiresConsent}
4010
4013
  .privacyPolicyUrl=${this.privacyPolicyUrl}
4014
+ .top=${this.top}
4015
+ .bottom=${this.bottom}
4016
+ .left=${this.left}
4017
+ .right=${this.right}
4011
4018
  ></pubnub-chat>
4012
4019
  `:U``}
4013
4020
  <healthcare-launcher
4014
4021
  id="healthcare-launcher"
4022
+ .top=${this.top}
4023
+ .bottom=${this.bottom}
4024
+ .left=${this.left}
4025
+ .right=${this.right}
4015
4026
  .isChatOpen=${this.displayPubnubChat}
4016
4027
  .onClickCloseChat=${()=>{this.displayPubnubChat=!1}}
4017
4028
  .onClickOpenChat=${()=>{this.displayPubnubChat=!0}}
4029
+
4018
4030
  ></healthcare-launcher>
4019
4031
 
4020
4032
  </meta>
@@ -4071,4 +4083,4 @@ otherwise there's some empty space at the bottom of the button, which interferes
4071
4083
  line-height: 150%;
4072
4084
  font-size: 16px;
4073
4085
  }
4074
- `,Kr([ue({type:String})],Xr.prototype,"healthcareId",void 0),Kr([le()],Xr.prototype,"launcher",void 0),Kr([le()],Xr.prototype,"currentLeadSource",void 0),Kr([le()],Xr.prototype,"displayPubnubChat",void 0),Kr([le()],Xr.prototype,"myPubnub",void 0),Kr([le()],Xr.prototype,"requiresConsent",void 0),Kr([le()],Xr.prototype,"privacyPolicyUrl",void 0),Kr([le()],Xr.prototype,"isLoading",void 0),Xr=Kr([ae("health-chat")],Xr);class Yr{static healthcareStart(e,t=!0){t&&(this.healthcareId=e.id),Zr();const n=document.createElement("health-chat");n.setAttribute("class","health-chat"),n.setAttribute("role","dialog"),n.setAttribute("aria-label","EliseAI Healthcare Widget"),n.setAttribute("aria-describedby","aria-describe-info"),n.setAttribute("aria-modal","true"),n.setAttribute("healthcareId",e.id),document.body.appendChild(n),Yr.healthChat=n}static start(e,t=!0){if(window.location.pathname.includes("residentservices")||window.location.pathname.includes("onlineleasing"))return;t&&(this.orgSlug=e.organization,this.hasBuildingSlug=!!e.building),Zr();const n=document.createElement("me-chat");n.setAttribute("orgSlug",e.organization),this.handleBuildingslug(n,e.building),n.setAttribute("class","meetelise-chat"),n.setAttribute("role","dialog"),n.setAttribute("aria-label","EliseAI Widget"),n.setAttribute("aria-describedby","aria-describe-info"),n.setAttribute("aria-modal","true"),e.launcherStyles&&(n.launcherStyles=e.launcherStyles),e.mobileStyles&&(n.mobileStyles=e.mobileStyles),e.brandColor&&(this.brandColor=e.brandColor,n.setAttribute("brandColor",((e,t)=>{const n=(r=e,{r:parseInt(r.substring(1,3),16),g:parseInt(r.substring(3,5),16),b:parseInt(r.substring(5,7),16)}),i={r:n.r+Math.round(.3*(0-n.r)),g:n.g+Math.round(.3*(0-n.g)),b:n.b+Math.round(.3*(0-n.b))};var r;return((e,t,n)=>"#"+[e,t,n].map((e=>{const t=e.toString(16);return 1===t.length?"0"+t:t})).join(""))(i.r,i.g,i.b)})(e.brandColor))),document.body.appendChild(n),Yr.meChat=n}static async restartConversation(){this.meChat&&await this.meChat.restartConversation()}static async remove(){this.meChat&&(await this.meChat.remove(),document.body.removeChild(this.meChat),Yr.meChat=null)}static async handleBuildingslug(e,t){t?e.setAttribute("buildingSlug",t):this.mutationObserver||(this.handleSingleFamilyUrl(),this.previousUrl=window.location.href,document.body.addEventListener("click",(()=>{requestAnimationFrame((()=>{this.previousUrl===window.location.href||this.hasBuildingSlug||(this.previousUrl=window.location.href,this.handleSingleFamilyUrl())}))}),!0))}static async handleSingleFamilyUrl(){if(this.hasBuildingSlug)return;this.remove();const e=window.location.href,n=`https://app.meetelise.com/platformApi/webchat/microsite_slug?uri=${encodeURIComponent(e)}`,i=await t().get(n,{headers:{"org-slug":this.orgSlug}});if(!i||!i.data)return;const r={organization:this.orgSlug,building:i.data,brandColor:this.brandColor};this.start(r,!1)}}Yr.meChat=null,Yr.healthChat=null,Yr.orgSlug="",Yr.mutationObserver=null,Yr.previousUrl="",Yr.hasBuildingSlug=null,Yr.brandColor="",Yr.healthcareId="";const Zr=()=>{const e=document.createElement("link");e.setAttribute("rel","stylesheet"),e.setAttribute("type","text/css"),document.head.appendChild(e)}})();var r=i.Z;export{r as default};
4086
+ `,Kr([ue({type:String})],Xr.prototype,"healthcareId",void 0),Kr([ue({type:Number})],Xr.prototype,"right",void 0),Kr([ue({type:Number})],Xr.prototype,"bottom",void 0),Kr([ue({type:Number})],Xr.prototype,"top",void 0),Kr([ue({type:Number})],Xr.prototype,"left",void 0),Kr([le()],Xr.prototype,"launcher",void 0),Kr([le()],Xr.prototype,"currentLeadSource",void 0),Kr([le()],Xr.prototype,"displayPubnubChat",void 0),Kr([le()],Xr.prototype,"myPubnub",void 0),Kr([le()],Xr.prototype,"requiresConsent",void 0),Kr([le()],Xr.prototype,"privacyPolicyUrl",void 0),Kr([le()],Xr.prototype,"isLoading",void 0),Xr=Kr([ae("health-chat")],Xr);class Yr{static healthcareStart(e,t=!0){var n,i,r,o;t&&(this.healthcareId=e.id,this.overridePlacement={right:e.right,bottom:e.bottom,top:e.top,left:e.left}),Zr();const a=document.createElement("health-chat");a.setAttribute("class","health-chat"),a.setAttribute("role","dialog"),a.setAttribute("aria-label","EliseAI Healthcare Widget"),a.setAttribute("aria-describedby","aria-describe-info"),a.setAttribute("aria-modal","true"),a.setAttribute("healthcareId",e.id),a.setAttribute("right",(null===(n=e.right)||void 0===n?void 0:n.toString())||"unset"),a.setAttribute("bottom",(null===(i=e.bottom)||void 0===i?void 0:i.toString())||"unset"),a.setAttribute("top",(null===(r=e.top)||void 0===r?void 0:r.toString())||"unset"),a.setAttribute("left",(null===(o=e.left)||void 0===o?void 0:o.toString())||"unset"),document.body.appendChild(a),Yr.healthChat=a}static start(e,t=!0){if(window.location.pathname.includes("residentservices")||window.location.pathname.includes("onlineleasing"))return;t&&(this.orgSlug=e.organization,this.hasBuildingSlug=!!e.building),Zr();const n=document.createElement("me-chat");n.setAttribute("orgSlug",e.organization),this.handleBuildingslug(n,e.building),n.setAttribute("class","meetelise-chat"),n.setAttribute("role","dialog"),n.setAttribute("aria-label","EliseAI Widget"),n.setAttribute("aria-describedby","aria-describe-info"),n.setAttribute("aria-modal","true"),e.launcherStyles&&(n.launcherStyles=e.launcherStyles),e.mobileStyles&&(n.mobileStyles=e.mobileStyles),e.brandColor&&(this.brandColor=e.brandColor,n.setAttribute("brandColor",((e,t)=>{const n=(r=e,{r:parseInt(r.substring(1,3),16),g:parseInt(r.substring(3,5),16),b:parseInt(r.substring(5,7),16)}),i={r:n.r+Math.round(.3*(0-n.r)),g:n.g+Math.round(.3*(0-n.g)),b:n.b+Math.round(.3*(0-n.b))};var r;return((e,t,n)=>"#"+[e,t,n].map((e=>{const t=e.toString(16);return 1===t.length?"0"+t:t})).join(""))(i.r,i.g,i.b)})(e.brandColor))),document.body.appendChild(n),Yr.meChat=n}static async restartConversation(){this.meChat&&await this.meChat.restartConversation()}static async remove(){this.meChat&&(await this.meChat.remove(),document.body.removeChild(this.meChat),Yr.meChat=null)}static async handleBuildingslug(e,t){t?e.setAttribute("buildingSlug",t):this.mutationObserver||(this.handleSingleFamilyUrl(),this.previousUrl=window.location.href,document.body.addEventListener("click",(()=>{requestAnimationFrame((()=>{this.previousUrl===window.location.href||this.hasBuildingSlug||(this.previousUrl=window.location.href,this.handleSingleFamilyUrl())}))}),!0))}static async handleSingleFamilyUrl(){if(this.hasBuildingSlug)return;this.remove();const e=window.location.href,n=`https://app.meetelise.com/platformApi/webchat/microsite_slug?uri=${encodeURIComponent(e)}`,i=await t().get(n,{headers:{"org-slug":this.orgSlug}});if(!i||!i.data)return;const r={organization:this.orgSlug,building:i.data,brandColor:this.brandColor};this.start(r,!1)}}Yr.meChat=null,Yr.healthChat=null,Yr.orgSlug="",Yr.mutationObserver=null,Yr.previousUrl="",Yr.hasBuildingSlug=null,Yr.brandColor="",Yr.healthcareId="",Yr.overridePlacement={};const Zr=()=>{const e=document.createElement("link");e.setAttribute("rel","stylesheet"),e.setAttribute("type","text/css"),document.head.appendChild(e)}})();var r=i.Z;export{r as default};
package/public/index.html CHANGED
@@ -90,7 +90,6 @@
90
90
  const chat = MEChat.start({
91
91
  organization: "test-company",
92
92
  building: "e2e-test-yardi-building",
93
- mini: false,
94
93
  });
95
94
  //////////////////////////////////////////////////////////////////
96
95
  // The above code is all a client would need. //
package/src/MEChat.ts CHANGED
@@ -22,6 +22,10 @@ import { tintColor } from "./themes";
22
22
 
23
23
  export interface HealthcareOptions {
24
24
  id: string;
25
+ right?: number;
26
+ bottom?: number;
27
+ top?: number;
28
+ left?: number;
25
29
  }
26
30
  export default class MEChat {
27
31
  static meChat: MEChatLitElement | null = null;
@@ -32,10 +36,22 @@ export default class MEChat {
32
36
  static hasBuildingSlug: boolean | null = null;
33
37
  static brandColor = "";
34
38
  static healthcareId = "";
39
+ static overridePlacement: {
40
+ right?: number;
41
+ bottom?: number;
42
+ top?: number;
43
+ left?: number;
44
+ } = {};
35
45
 
36
46
  static healthcareStart(opts: HealthcareOptions, isInitialStart = true): void {
37
47
  if (isInitialStart) {
38
48
  this.healthcareId = opts.id;
49
+ this.overridePlacement = {
50
+ right: opts.right,
51
+ bottom: opts.bottom,
52
+ top: opts.top,
53
+ left: opts.left,
54
+ };
39
55
  }
40
56
  installFont();
41
57
  const healthChat = document.createElement("health-chat");
@@ -46,6 +62,11 @@ export default class MEChat {
46
62
  healthChat.setAttribute("aria-modal", "true");
47
63
  healthChat.setAttribute("healthcareId", opts.id);
48
64
 
65
+ healthChat.setAttribute("right", opts.right?.toString() || "unset");
66
+ healthChat.setAttribute("bottom", opts.bottom?.toString() || "unset");
67
+ healthChat.setAttribute("top", opts.top?.toString() || "unset");
68
+ healthChat.setAttribute("left", opts.left?.toString() || "unset");
69
+
49
70
  document.body.appendChild(healthChat);
50
71
  MEChat.healthChat = healthChat;
51
72
  }
@@ -80,6 +80,18 @@ export class HealthChat extends LitElement {
80
80
  @property({ type: String })
81
81
  private healthcareId = "";
82
82
 
83
+ @property({ type: Number })
84
+ private right = 0;
85
+
86
+ @property({ type: Number })
87
+ private bottom = 0;
88
+
89
+ @property({ type: Number })
90
+ private top = 0;
91
+
92
+ @property({ type: Number })
93
+ private left = 0;
94
+
83
95
  @state()
84
96
  private launcher: HTMLElement | null = null;
85
97
 
@@ -207,12 +219,20 @@ export class HealthChat extends LitElement {
207
219
  }}
208
220
  .requiresConsent=${this.requiresConsent}
209
221
  .privacyPolicyUrl=${this.privacyPolicyUrl}
222
+ .top=${this.top}
223
+ .bottom=${this.bottom}
224
+ .left=${this.left}
225
+ .right=${this.right}
210
226
  ></pubnub-chat>
211
227
  `
212
228
  : html``
213
229
  }
214
230
  <healthcare-launcher
215
231
  id="healthcare-launcher"
232
+ .top=${this.top}
233
+ .bottom=${this.bottom}
234
+ .left=${this.left}
235
+ .right=${this.right}
216
236
  .isChatOpen=${this.displayPubnubChat}
217
237
  .onClickCloseChat=${() => {
218
238
  this.displayPubnubChat = false;
@@ -220,6 +240,7 @@ export class HealthChat extends LitElement {
220
240
  .onClickOpenChat=${() => {
221
241
  this.displayPubnubChat = true;
222
242
  }}
243
+
223
244
  ></healthcare-launcher>
224
245
 
225
246
  </meta>
@@ -3,8 +3,6 @@ import { css } from "lit";
3
3
  export const healthcareLauncherStyles = css`
4
4
  .chat-launcher {
5
5
  position: fixed;
6
- bottom: 72px;
7
- right: 18px;
8
6
  }
9
7
  .close-chat-bttn,
10
8
  .open-chat-bttn {
@@ -1,11 +1,25 @@
1
1
  import { html, LitElement, TemplateResult } from "lit";
2
2
  import { customElement, property } from "lit/decorators.js";
3
+ import { styleMap } from "lit/directives/style-map.js";
4
+ import { isMobile } from "../../utils";
3
5
  import { healthcareLauncherStyles } from "./healthcare-launcher-styles";
4
6
 
5
7
  @customElement("healthcare-launcher")
6
8
  export class HealthcareLauncher extends LitElement {
7
9
  static styles = [healthcareLauncherStyles];
8
10
 
11
+ @property({ type: Number })
12
+ private right = 0;
13
+
14
+ @property({ type: Number })
15
+ private bottom = 0;
16
+
17
+ @property({ type: Number })
18
+ private top = 0;
19
+
20
+ @property({ type: Number })
21
+ private left = 0;
22
+
9
23
  @property({ attribute: true })
10
24
  isChatOpen = false;
11
25
 
@@ -18,7 +32,23 @@ export class HealthcareLauncher extends LitElement {
18
32
  render(): TemplateResult {
19
33
  if (this.isChatOpen) {
20
34
  return html`
21
- <div class="chat-launcher">
35
+ <div
36
+ class="chat-launcher"
37
+ style=${styleMap({
38
+ top:
39
+ !isMobile() && !isNaN(this.top)
40
+ ? `${this.top + 432}px`
41
+ : undefined,
42
+ bottom:
43
+ !isMobile() && !isNaN(this.bottom)
44
+ ? `${this.bottom - 60}px`
45
+ : "72px",
46
+ left:
47
+ !isMobile() && !isNaN(this.left) ? `${this.left}px` : undefined,
48
+ right:
49
+ !isMobile() && !isNaN(this.right) ? `${this.right}px` : "18px",
50
+ })}
51
+ >
22
52
  <button class="close-chat-bttn" @click=${this.onClickCloseChat}>
23
53
  <svg
24
54
  width="16"
@@ -38,7 +68,17 @@ export class HealthcareLauncher extends LitElement {
38
68
  </div>
39
69
  `;
40
70
  }
41
- return html` <div class="chat-launcher">
71
+ return html` <div
72
+ class="chat-launcher"
73
+ style=${styleMap({
74
+ top:
75
+ !isMobile() && !isNaN(this.top) ? `${this.top + 432}px` : undefined,
76
+ bottom:
77
+ !isMobile() && !isNaN(this.bottom) ? `${this.bottom - 60}px` : "72px",
78
+ left: !isMobile() && !isNaN(this.left) ? `${this.left}px` : undefined,
79
+ right: !isMobile() && !isNaN(this.right) ? `${this.right}px` : "18px",
80
+ })}
81
+ >
42
82
  <button class="open-chat-bttn" @click=${this.onClickOpenChat}>
43
83
  <svg
44
84
  width="24"
@@ -18,8 +18,6 @@ export const healthChatStyles = css`
18
18
  font-family: Poppins, "Open Sans", "Helvetica", sans-serif;
19
19
  }
20
20
  .healthchat-container__desktop {
21
- right: 18px;
22
- bottom: 130px;
23
21
  width: 300px;
24
22
  height: 420px;
25
23
  border-radius: 10px;
@@ -29,6 +29,18 @@ export class PubnubChat extends LitElement {
29
29
  healthChatStyles,
30
30
  ];
31
31
 
32
+ @property({ type: Number })
33
+ private right = 0;
34
+
35
+ @property({ type: Number })
36
+ private bottom = 0;
37
+
38
+ @property({ type: Number })
39
+ private top = 0;
40
+
41
+ @property({ type: Number })
42
+ private left = 0;
43
+
32
44
  @property({ attribute: true })
33
45
  onMount: () => void = () => ({});
34
46
 
@@ -135,6 +147,23 @@ export class PubnubChat extends LitElement {
135
147
  return html``; // error should be here
136
148
  }
137
149
 
150
+ let styles = {};
151
+ if (isMobile()) {
152
+ styles = {
153
+ top: undefined,
154
+ bottom: 0,
155
+ left: undefined,
156
+ right: 0,
157
+ };
158
+ } else {
159
+ styles = {
160
+ top: !isNaN(this.top) ? `${this.top}px` : undefined,
161
+ bottom: !isNaN(this.bottom) ? `${this.bottom}px` : "130px",
162
+ left: !isNaN(this.left) ? `${this.left}px` : undefined,
163
+ right: !isNaN(this.right) ? `${this.right}px` : "18px",
164
+ };
165
+ }
166
+
138
167
  if (this.isHealthChat) {
139
168
  return html`
140
169
  <div
@@ -143,6 +172,7 @@ export class PubnubChat extends LitElement {
143
172
  ["pubnub-container__mobile"]: isMobile(),
144
173
  ["healthchat-container__desktop"]: !isMobile(),
145
174
  })}
175
+ style=${styleMap(styles)}
146
176
  >
147
177
  <div id="healthchat-header">
148
178
  ${this.buildingSlug === "6a9e65e5-9699-4c96-af75-1741d0df79aa"