@meetelise/chat 1.20.67 → 1.20.69
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/.github/pull_request_template.md +61 -0
- package/package.json +1 -1
- package/public/dist/index.js +1 -1
- package/src/WebComponent/me-chat.ts +2 -16
- package/src/utils.ts +0 -4
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
# Issue Checklist
|
|
2
|
+
|
|
3
|
+
**this is important because webchat goes down far too frequently from a variety of sources (i.e. bad merges, chat provider issues, backend changes)**
|
|
4
|
+
|
|
5
|
+
## Basic Popup Checks
|
|
6
|
+
|
|
7
|
+
- [ ] On click 'Chat with us', talkjs popup opens
|
|
8
|
+
- [ ] On click 'Email an Agent', email form pops up
|
|
9
|
+
- [ ] On click 'Call or text us', call and/or text us popup opens
|
|
10
|
+
- [ ] On click 'Book a tour', booking tour popup with calendar view opens
|
|
11
|
+
|
|
12
|
+
## Email an Agent Form
|
|
13
|
+
|
|
14
|
+
**Applies only if Email widget is enabled for building**
|
|
15
|
+
|
|
16
|
+
- [ ] The form should require the lead's name, email address, and phone number. Message is optional.
|
|
17
|
+
- [ ] Upon submission, the form should create a Guest Card (GC) with the lead's information.
|
|
18
|
+
- [ ] The marketing source should be correctly logged on the GC (the source should ‘property-website’ AND whatever attribute the lead selected in the dropdown)
|
|
19
|
+
|
|
20
|
+
## Web conversation
|
|
21
|
+
|
|
22
|
+
**Applies only if webchat applied to building**
|
|
23
|
+
|
|
24
|
+
- [ ] Chat widget should be responsive to questions asked
|
|
25
|
+
- [ ] Chat widget should accept a text input
|
|
26
|
+
- [ ] AI should provide appropiate responses based on the user's message
|
|
27
|
+
- [ ] Typing indicator should appear while lead is waiting back for response
|
|
28
|
+
|
|
29
|
+
## Booking a Tour
|
|
30
|
+
|
|
31
|
+
**Applies only if scheduling widget is enabled for the building**
|
|
32
|
+
|
|
33
|
+
- [ ] Chat widget should provide an option to book a tour
|
|
34
|
+
- [ ] The available tour types should be displayed based on the community offerings.
|
|
35
|
+
- [ ] If there is only a single tour type offered, then that should be automatically selected
|
|
36
|
+
- [ ] The lead should be able to select a tour type, date, and time.
|
|
37
|
+
- [ ] The lead's layout and unit preferences should be recorded and passed through on the GC.
|
|
38
|
+
|
|
39
|
+
## Marketing Source Attribution
|
|
40
|
+
|
|
41
|
+
**Behavior depends on this flag: https://app.launchdarkly.com/default/production/features/webchat-marketing-source-dropdown-configuration/targeting**
|
|
42
|
+
|
|
43
|
+
- [ ] We grab the source from `utm_source` in the url’s query parameters. So if you want it to be “Zillow” add `utm_source=zillow` to query parameters
|
|
44
|
+
- [ ] If flag set to “never”, marketing source dropdown should never appear
|
|
45
|
+
- [ ] If flag set to “always”, marketing source dropdown should always appear
|
|
46
|
+
- [ ] If flag set to “on-attribution-failure”, marketing source dropdown should appear if we fail to attribute the originating source.
|
|
47
|
+
|
|
48
|
+
## Dynamic Number Insertion
|
|
49
|
+
|
|
50
|
+
**Behavior depends on this flag: https://app.launchdarkly.com/default/production/features/webchat-marketing-source-dropdown-configuration/targeting**
|
|
51
|
+
|
|
52
|
+
- [ ] We grab the source from `utm_source` in the url’s query parameters. So if you want it to be “Zillow” add `utm_source=zillow` to query parameters
|
|
53
|
+
- [ ] If flag set to “never”, marketing source dropdown should never appear
|
|
54
|
+
- [ ] If flag set to “always”, marketing source dropdown should always appear
|
|
55
|
+
- [ ] If flag set to “on-attribution-failure”, marketing source dropdown should appear if we fail to attribute the originating source.
|
|
56
|
+
|
|
57
|
+
## Misc Checks
|
|
58
|
+
|
|
59
|
+
- [ ] The chat widget should adapt to various screen sizes and devices without compromising functionality or user experience.
|
|
60
|
+
- [ ] The chat widget should follow web accessibility guidelines (WCAG and ADA) to ensure that users with disabilities can interact with it effectively.
|
|
61
|
+
- [ ] The widget should support customization to match the company's branding and website design.
|
package/package.json
CHANGED
package/public/dist/index.js
CHANGED
|
@@ -2837,7 +2837,7 @@ var e={8005:function(e,t,n){var i,r=this&&this.__extends||(i=function(e,t){retur
|
|
|
2837
2837
|
cursor: pointer;
|
|
2838
2838
|
filter: brightness(90%);
|
|
2839
2839
|
}
|
|
2840
|
-
`],pr([de({attribute:!0})],fr.prototype,"onClick",void 0),pr([de({attribute:!0})],fr.prototype,"brandColor",void 0),pr([de({attribute:!0})],fr.prototype,"toExpand",void 0),fr=pr([ue("minimize-expand-button")],fr);var hr,mr=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=hr=class extends ae{constructor(){super(...arguments),this.buildingSlug="",this.orgSlug="",this.themeId="Glass",this.useMiniWidget=!0,this.launcherStyles={},this.isMinimized=!1,this.brandColor=null,this.popup=null,this.theme=ui({themeId:this.themeId,brandColor:this.brandColor}),this.chatId="",this.analytics=null,this.isMobile=r(),this.launcher=null,this.building=null,this.buildingABTestType=null,this.leadSources=null,this.currentLeadSource=null,this.featureFlagShowDropdown=Mn.always,this.phoneNumberForSource=null,this.hasMounted=!1,this.hideLauncher=!1,this.isLoading=!0,this.talkjsPopupElement=null,this.yardiDNIScriptInterval=null,this.launcherRef=Oe(),this.initializeInstanceVariables=async()=>{await this.setBuildingDerivedInfo(),await this.initializeLaunchJS(),this.attachOnClickToLauncher(),this.isLoading=!1,"true"===localStorage.getItem("overrideContactUsForm")&&this.overrideContactUsForm()},this.setBuildingDerivedInfo=async()=>{var e,n,i,r;if(!this.buildingSlug||!this.orgSlug)return;const
|
|
2840
|
+
`],pr([de({attribute:!0})],fr.prototype,"onClick",void 0),pr([de({attribute:!0})],fr.prototype,"brandColor",void 0),pr([de({attribute:!0})],fr.prototype,"toExpand",void 0),fr=pr([ue("minimize-expand-button")],fr);var hr,mr=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=hr=class extends ae{constructor(){super(...arguments),this.buildingSlug="",this.orgSlug="",this.themeId="Glass",this.useMiniWidget=!0,this.launcherStyles={},this.isMinimized=!1,this.brandColor=null,this.popup=null,this.theme=ui({themeId:this.themeId,brandColor:this.brandColor}),this.chatId="",this.analytics=null,this.isMobile=r(),this.launcher=null,this.building=null,this.buildingABTestType=null,this.leadSources=null,this.currentLeadSource=null,this.featureFlagShowDropdown=Mn.always,this.phoneNumberForSource=null,this.hasMounted=!1,this.hideLauncher=!1,this.isLoading=!0,this.talkjsPopupElement=null,this.yardiDNIScriptInterval=null,this.launcherRef=Oe(),this.initializeInstanceVariables=async()=>{await this.setBuildingDerivedInfo(),await this.initializeLaunchJS(),this.attachOnClickToLauncher(),this.isLoading=!1,"true"===localStorage.getItem("overrideContactUsForm")&&this.overrideContactUsForm()},this.setBuildingDerivedInfo=async()=>{var e,n,i,r;if(!this.buildingSlug||!this.orgSlug)return;const[o,a,s,u,l,d,c]=await Promise.all([di(this.orgSlug,this.buildingSlug),fi(this.buildingSlug),cr(this.buildingSlug),hi(this.buildingSlug,document.referrer),Pn(this.buildingSlug),Dn(this.buildingSlug),ci(this.buildingSlug)]);o.phoneNumber=Fe(o.phoneNumber),this.building=o,this.buildingABTestType=null!==(e=null==a?void 0:a.abTestType)&&void 0!==e?e:"",this.leadSources=s,this.currentLeadSource=u,this.featureFlagShowDropdown=l,c&&(null===this.brandColor&&(this.brandColor=null!==(n=c.primaryColor)&&void 0!==n?n:null),null===this.buildingABTestType&&(this.buildingABTestType=null!==(i=c.designConcept)&&void 0!==i?i:null)),null===this.brandColor&&(this.brandColor=ri);let p=null;d&&(p=await async function(e,n){try{const i=await t().get(`https://app.meetelise.com/platformApi/webchat/${e}/phone-number-by-source?source=${n}`);return i.data?{number:Fe(i.data.number),isMatch:i.data.isMatch,isPropertyWebsiteCatchall:i.data.isPropertyWebsiteCatchall}:null}catch(e){return null}}(this.buildingSlug,this.currentLeadSource)),this.phoneNumberForSource=p||{number:this.building.phoneNumber,isMatch:!1,isPropertyWebsiteCatchall:!0},this.currentLeadSource&&(this.leadSources.includes(this.currentLeadSource)||this.leadSources.push(this.currentLeadSource)),An(this.building.id),this.chatId=function(e,t){const n=ei(e,t),i=localStorage.getItem(n);return i&&!function(e,t){const n=ti(e,t),i=localStorage.getItem(n)||$n(e,t),r=new Date(new Date(i).getTime()+216e5);return new Date>r}(e,t)?i:Zn(e,t)}(this.orgSlug,this.buildingSlug),this.avatarSrc=this.avatarSrc||this.building.avatarSrc,this.theme=ui({themeId:null!==(r=this.themeId)&&void 0!==r?r:this.building.themeId,brandColor:this.brandColor}),this.analytics=new jn(this.orgSlug,this.buildingSlug,this.chatId),this.analytics.ping("webchat_heartbeat")},this.initializeLaunchJS=async()=>{var e;if(!this.building||!this.theme)return;if(this.popup&&this.launcher)return;const[t,n,i,r]=await Promise.all([this.building,this.theme,this.avatarSrc,hr.session]);if(t.conversationMaintenanceMode)return new Promise((()=>{console.warn("MeetElise Chat is in maintenance mode. Chat icon will not appear.")}));await this.configureTalkJSPopup(t,n,r,i),this.configureLauncherElement(),null===(e=this.analytics)||void 0===e||e.ping("load"),this.yardiDNIScriptInterval=setInterval((()=>this.pollForYardiCampaignSource()),1e3),setTimeout(clearInterval,15e3,this.yardiDNIScriptInterval)},this.configureLauncherElement=()=>{this.popup&&this.launcherRef.value&&(this.launcher=this.launcherRef.value)},this.configureTalkJSPopup=async(e,t,n,i)=>{var o;const a=n.createPopup(li(n,e,t,i||e.avatarSrc,this.chatId,this.isMobile),{launcher:"never",showCloseInHeader:!0,messageField:{placeholder:"Ask a question..."}});await a.mount({show:!1}),a.on("close",(()=>{this.hideLauncher=!1}));const s=document.querySelector(".__talkjs_popup");if(this.talkjsPopupElement=s,!s)throw new Error("Failed to find chat window");s.classList.add("meetelise-chat","pane"),this.isMobile||s.classList.add("launcher__desktop"),s.style.zIndex="99999999999",this.popup=a;const u=sessionStorage.getItem("autoOpenedTimestamp"),l=!u||u&&an(un(u));e.autoOpenChatWidget&&l&&!r()&&(this.popup.show(),this.hideLauncher=!0,this.hasMounted=!0,sessionStorage.setItem("autoOpenedTimestamp",tn(function(e,t){Ue(2,arguments);var n=et(t);return tt(e,6e4*n)}(new Date,15))),null===(o=this.analytics)||void 0===o||o.ping("autoOpen"))},this.firstUpdated=()=>{this.initializeInstanceVariables()},this.handleContactClicked=e=>{var t,n;null===(t=this.popup)||void 0===t||t.hide(),this.hideLauncher=!1,null===(n=this.launcherRef.value)||void 0===n||n.onClickEmailOption(e)},this.handleTourClicked=e=>{var t,n;null===(t=this.popup)||void 0===t||t.hide(),this.hideLauncher=!1,null===(n=this.launcherRef.value)||void 0===n||n.onClickSSTOption(e)},this.handleContactTabClicked=e=>{var t,n;null===(t=this.popup)||void 0===t||t.hide(),this.hideLauncher=!1,null===(n=this.launcherRef.value)||void 0===n||n.onClickPhoneOption(e)},this.adjustTopHeaderContactCoords=()=>{var e;if(this.talkjsPopupElement){const t=this.talkjsPopupElement.getBoundingClientRect(),n=null===(e=this.shadowRoot)||void 0===e?void 0:e.getElementById("chatAdditionalActions");if(!n)return;n.style.left=`${t.left+20}px`,n.style.top=t.bottom-24+"px"}},this.onClickMinimize=e=>{e.preventDefault(),e.stopPropagation(),this.isMinimized=!this.isMinimized},this.attachOnClickToLauncher=()=>{const e=this.launcherRef.value;e&&(e.onChatTapped=async()=>{var e;this.popup&&(this.popup.show(),null===(e=this.analytics)||void 0===e||e.ping("open"),this.hideLauncher=!0,this.hasMounted=!0)})},this.overrideContactUsForm=()=>{var e;const t=document.getElementById("myContactForm");let n;if(!(t&&t instanceof HTMLFormElement))return;for(let e=0;e<t.elements.length;e++){const i=t.elements[e];if("button"===i.tagName.toLowerCase()&&"fakebutton"===i.getAttribute("data-selenium-id")){n=i;break}}if(!n)return;const i=n.cloneNode(!0);null===(e=n.parentNode)||void 0===e||e.replaceChild(i,n),i.textContent="Elise Submit";const r=()=>{const e={firstName:document.getElementById("firstname"),lastName:document.getElementById("lastname"),email:document.getElementById("email"),phone:document.getElementById("phonenumber"),message:document.getElementById("message")};return Object.values(e).some((e=>null===e)),e};i.onclick=function(e){if(!Object.values(r()).every((e=>null!==e&&"true"!==e.getAttribute("aria-invalid"))))return;e.preventDefault();const n=(()=>{const e={};return Object.entries(r()).forEach((([t,n])=>e[t]=null==n?void 0:n.value)),e})(),i={email_address:n.email,first_name:n.firstName,last_name:n.lastName,phone_number:n.phone,first_message:n.message,building_id:3660},o=JSON.stringify(i);fetch("https://app.meetelise.com/platformApi/state/create/contactMe",{method:"POST",headers:{"Content-Type":"application/json","building-slug":"e2e-test-yardi-building","org-slug":"test-company"},body:o}).then((e=>{if(!e.ok)throw new Error(`HTTP error ${e.status}`);return t.reset(),e.json()}))}}}pollForYardiCampaignSource(){var e,t,n;(null===(t=null===(e=window.RCTPCampaign)||void 0===e?void 0:e.CampaignDetails)||void 0===t?void 0:t.Source)&&(null===(n=this.analytics)||void 0===n||n.ping("yardi-DNI-init"),this.yardiDNIScriptInterval&&clearInterval(this.yardiDNIScriptInterval))}async restartConversation(){if(!(this.analytics&&this.analytics.chatId&&this.building&&this.popup&&hr.session))return;this.chatId=Zn(this.orgSlug,this.buildingSlug);const e=await hr.session;this.analytics.chatId=this.chatId,this.popup.select(li(e,this.building,this.theme,this.avatarSrc||this.building.avatarSrc,this.chatId,this.isMobile))}remove(){var e;null===(e=this.popup)||void 0===e||e.destroy()}open(){var e;null===(e=this.popup)||void 0===e||e.show()}close(){var e;null===(e=this.popup)||void 0===e||e.hide()}show(){this.launcher&&(this.launcher.style.display="")}hide(){this.launcher&&(this.launcher.style.display="none")}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this.adjustTopHeaderContactCoords)}disconnectedCallback(){window.removeEventListener("resize",this.adjustTopHeaderContactCoords),super.disconnectedCallback()}updated(){this.adjustTopHeaderContactCoords()}render(){var e,t,n,i,r,o,a,s,u,l,d,c,p,f,h,m,v,g,y,b,w,S,T,A,x,O,C,I,N,R,E,F,_,M;window.customElements.get("meetelise-launcher")||window.customElements.define("meetelise-launcher",Yi);const P=this.hideLauncher&&!this.isLoading&&!this.isMobile;return J`
|
|
2841
2841
|
<meta name="viewport" content="width=device-width, initial-scale=1 user-scalable=1">
|
|
2842
2842
|
<div id="aria-describe-info" style="display: none;">
|
|
2843
2843
|
EliseAI widget that allows you to chat with a virtual assistant, book
|
|
@@ -21,7 +21,7 @@ import fetchPhoneNumberFromSource, {
|
|
|
21
21
|
NumberForSelectedSource,
|
|
22
22
|
} from "../fetchPhoneNumberFromSource";
|
|
23
23
|
import { defaultBrandColor, getTheme, Theme } from "../themes";
|
|
24
|
-
import { isMobile
|
|
24
|
+
import { isMobile } from "../utils";
|
|
25
25
|
import { installLauncher } from "./launcher/Launcher";
|
|
26
26
|
import parseISO from "date-fns/parseISO";
|
|
27
27
|
import isPast from "date-fns/isPast";
|
|
@@ -177,7 +177,6 @@ export class MEChat extends LitElement {
|
|
|
177
177
|
if (!this.buildingSlug || !this.orgSlug) {
|
|
178
178
|
return;
|
|
179
179
|
}
|
|
180
|
-
const beginTime = Date.now(); // used for widget delay
|
|
181
180
|
const [
|
|
182
181
|
building,
|
|
183
182
|
buildingABTest,
|
|
@@ -210,15 +209,6 @@ export class MEChat extends LitElement {
|
|
|
210
209
|
if (this.buildingABTestType === null) {
|
|
211
210
|
this.buildingABTestType = webchatPreferences.designConcept ?? null;
|
|
212
211
|
}
|
|
213
|
-
if (webchatPreferences.delayOpen) {
|
|
214
|
-
// We take into account the time it took to fetch the building info
|
|
215
|
-
const secondsAlreadyPassed = (Date.now() - beginTime) / 1000;
|
|
216
|
-
if (secondsAlreadyPassed < webchatPreferences.delayOpen) {
|
|
217
|
-
await sleep(
|
|
218
|
-
(webchatPreferences.delayOpen - secondsAlreadyPassed) * 1000
|
|
219
|
-
); // delayOpen is in seconds
|
|
220
|
-
}
|
|
221
|
-
}
|
|
222
212
|
}
|
|
223
213
|
|
|
224
214
|
if (this.brandColor === null) {
|
|
@@ -233,7 +223,7 @@ export class MEChat extends LitElement {
|
|
|
233
223
|
);
|
|
234
224
|
}
|
|
235
225
|
|
|
236
|
-
// if the building does NOT have IVR setup, we want to use the building's phone
|
|
226
|
+
// if the building does NOT have IVR setup, we want to use the building's phone numbr
|
|
237
227
|
if (!phoneNumberForSource) {
|
|
238
228
|
this.phoneNumberForSource = {
|
|
239
229
|
number: this.building.phoneNumber,
|
|
@@ -494,10 +484,6 @@ export class MEChat extends LitElement {
|
|
|
494
484
|
const showChatAdditionalActions =
|
|
495
485
|
this.hideLauncher && !this.isLoading && !this.isMobile;
|
|
496
486
|
|
|
497
|
-
if (this.isLoading) {
|
|
498
|
-
return html``;
|
|
499
|
-
}
|
|
500
|
-
|
|
501
487
|
return html`
|
|
502
488
|
<meta name="viewport" content="width=device-width, initial-scale=1 user-scalable=1">
|
|
503
489
|
<div id="aria-describe-info" style="display: none;">
|
package/src/utils.ts
CHANGED