@meetelise/chat 1.20.33 → 1.20.35

package/src/WebComponent/Launcher.ts

@@ -20,7 +20,6 @@ import {
   OutlinedChatIcon,
   OutlinedEmailIcon,
   OutlinedPhoneIcon,
-  OutlinedTextIcon,
   OutlinedTourIcon,
 } from "../svgIcons";
 
@@ -312,7 +311,7 @@ export class Launcher extends LitElement {
               html`
                 <div class="vertical-pill-icon">${FilledChatIcon}</div>
                 <div class="vertical-pill-title">
-                  <span class="vertical-pill-bold">Ask</span> a question
+                  <span class="vertical-pill-bold">Chat</span> with us
                 </div>
               `,
               this.onChatTapped
@@ -370,13 +369,6 @@ export class Launcher extends LitElement {
             true
           )
         : ""}
-      ${this.hasTextUsEnabled && !this.isCallToActionWindowOpen()
-        ? this.renderMiniOption(
-            OutlinedTextIcon,
-            this.onClickTextUsOption,
-            true
-          )
-        : ""}
     `;
   };
 

package/src/WebComponent/launcherStyles.ts

@@ -310,7 +310,7 @@ export const launcherStyles = css`
   }
   .inner-pill-wrapper {
     background: #353535;
-    border-width: 2px 0px 2px 2px;
+    border-width: 4px 0px 4px 4px;
     border-style: solid;
     border-color: #ffffff;
     box-shadow: 0px 34px 34px 14px rgba(0, 0, 0, 0.35);
@@ -326,10 +326,10 @@ export const launcherStyles = css`
     font-size: 15px;
     line-height: 18px;
 
-    /* White/Dark */
-
     color: #ffffff;
-    padding: 12px;
+    width: 164px;
+    height: 44px;
+    padding-left: 10px;
   }
   .inner-pill-wrapper:hover {
     cursor: pointer;
@@ -350,12 +350,8 @@ export const launcherStyles = css`
   }
   @media screen and (min-width: 1000px) {
     .inner-pill-wrapper {
-      font-size: 24px;
-      line-height: 28px;
-    }
-    .vertical-pill-icon {
-      transform: scale(1.5);
-      width: 42px;
+      height: 50px;
+      width: 164px;
     }
   }
 `;

package/src/WebComponent/me-chat.ts

@@ -387,13 +387,17 @@ export class MEChat extends LitElement {
 
   render(): TemplateResult {
     installLauncher();
+    const hideTopContactTab =
+      !this.hideLauncher ||
+      this.isLoading ||
+      this.buildingABTestType === "close";
     return html`
       <div>
         <div
           id="contactTabPopup"
           class=${classMap({
-            ["showTab"]: this.hideLauncher,
-            ["hideTab"]: !this.hideLauncher || this.isLoading,
+            ["showTab"]: !hideTopContactTab,
+            ["hideTab"]: hideTopContactTab,
           })}
         >
           <button class="actionTabBttn" @click=${this.handleContactClicked}>
@@ -450,7 +454,9 @@ export class MEChat extends LitElement {
                 ?hasEmailEnabled=${!this.building?.chatWidgets
                   ? true
                   : this.building?.chatWidgets.includes("EMAIL")}
-                ?hasTextUsEnabled=${!this.building?.chatWidgets ? true : true}
+                ?hasTextUsEnabled=${!this.building?.chatWidgets
+                  ? true
+                  : this.building?.chatWidgets.includes("SMS")}
                 ?hasSSTEnabled=${!this.building?.chatWidgets
                   ? true
                   : this.building?.chatWidgets.includes("SST")}

package/src/svgIcons.ts

@@ -18,15 +18,7 @@ export const FilledEmailIcon = svg`<svg width="20" height="16" viewBox="0 0 20 1
 </svg>
 `;
 
-export const FilledChatIcon = svg`<svg width="22" height="20" viewBox="0 0 22 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M12.0024 5.43884H2.49877C1.11874 5.43884 0 6.55758 0 7.93761V17.4413C0 18.8213 1.11874 19.94 2.49877 19.94H12.0024C13.3824 19.94 14.5012 18.8213 14.5012 17.4413V7.93761C14.5012 6.55758 13.3824 5.43884 12.0024 5.43884Z" fill="#B6C2FE"/>
-<path d="M19.2489 0H9.74523C8.3652 0 7.24646 1.11874 7.24646 2.49877V12.0024C7.24646 13.3824 8.3652 14.5011 9.74523 14.5011H19.2489C20.6289 14.5011 21.7477 13.3824 21.7477 12.0024V2.49877C21.7477 1.11874 20.6289 0 19.2489 0Z" fill="#B6C2FE"/>
-<path d="M15.6255 2.72363H6.12193C4.7419 2.72363 3.62317 3.84237 3.62317 5.2224V14.726C3.62317 16.106 4.7419 17.2248 6.12193 17.2248H15.6255C17.0056 17.2248 18.1243 16.106 18.1243 14.726V5.2224C18.1243 3.84237 17.0056 2.72363 15.6255 2.72363Z" fill="white" stroke="#404040" stroke-miterlimit="10"/>
-<path d="M9.94854 12.1785V13.6327H11.4027V12.1785H9.94854ZM8.17957 8.4072L9.60608 8.69294C9.64657 8.4904 9.74373 8.30352 9.88627 8.15404C10.0288 8.00457 10.2109 7.89864 10.4113 7.84859C10.6117 7.79854 10.8221 7.80642 11.0182 7.87132C11.2143 7.93622 11.3879 8.05547 11.5189 8.21519C11.6499 8.3749 11.7328 8.56853 11.758 8.77353C11.7832 8.97853 11.7497 9.18648 11.6614 9.37318C11.573 9.55987 11.4335 9.71765 11.259 9.82814C11.0845 9.93863 10.8822 9.99729 10.6756 9.99731H9.94854V11.4515H10.6756C11.1575 11.4513 11.6294 11.3143 12.0365 11.0565C12.4436 10.7986 12.7691 10.4305 12.9752 9.99489C13.1812 9.55929 13.2594 9.07413 13.2005 8.59586C13.1417 8.11758 12.9482 7.66585 12.6427 7.29321C12.3371 6.92057 11.9321 6.64235 11.4746 6.49089C11.0172 6.33944 10.5261 6.32099 10.0586 6.43769C9.59102 6.55438 9.16623 6.80143 8.83359 7.15009C8.50095 7.49875 8.27415 7.93469 8.17957 8.4072Z" fill="#404040"/>
-</svg>
-`;
-
-export const FilledPhoneIcon = svg`<svg width="23" height="18" viewBox="0 0 23 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+export const FilledChatIcon = svg`<svg width="23" height="18" viewBox="0 0 23 18" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M7.32634 4.79272H19.2517C20.5911 4.79272 21.6723 5.87391 21.6723 7.2133V16.71H7.32634C5.98695 16.71 4.90576 15.6288 4.90576 14.2895V7.2133C4.90576 5.87391 5.98695 4.79272 7.32634 4.79272Z" fill="#404040" stroke="#B6C2FE" stroke-miterlimit="10"/>
 <path d="M0.403442 11.9657V3.22745C0.403442 1.67021 1.67021 0.403442 3.22745 0.403442H14.5235C16.0807 0.403442 17.3475 1.67021 17.3475 3.22745V9.14172C17.3475 10.699 16.0807 11.9657 14.5235 11.9657H0.403442Z" fill="white"/>
 <path d="M14.5235 0.806859C15.8628 0.806859 16.944 1.88805 16.944 3.22744V9.14171C16.944 10.4811 15.8628 11.5623 14.5235 11.5623H0.806859V3.22744C0.806859 1.88805 1.88805 0.806859 3.22744 0.806859H14.5235ZM14.5235 0H3.22744C1.44428 0 0 1.44428 0 3.22744V12.3691H14.5235C16.3066 12.3691 17.7509 10.9249 17.7509 9.14171V3.22744C17.7509 1.44428 16.3066 0 14.5235 0Z" fill="white"/>
@@ -36,6 +28,15 @@ export const FilledPhoneIcon = svg`<svg width="23" height="18" viewBox="0 0 23 1
 </svg>
 `;
 
+export const FilledPhoneIcon = svg`<svg width="16" height="24" viewBox="0 0 16 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M5 0H2C0.895431 0 0 0.89543 0 2V22C0 23.1046 0.895431 24 2 24H14C15.1046 24 16 23.1046 16 22V2C16 0.895431 15.1046 0 14 0H11C11 0.552285 10.5523 1 10 1H6C5.44772 1 5 0.552285 5 0Z" fill="white"/>
+<rect x="2" y="3" width="12" height="16" rx="1" fill="#B6C2FE"/>
+<rect x="3" y="13" width="7" height="3" rx="1" fill="#353535"/>
+<rect x="7" y="22" width="2" height="1" rx="0.5" fill="#353535"/>
+</svg>
+
+`;
+
 export const ChevronIcon = svg`<svg width="5" height="8" viewBox="0 0 5 8" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M1 7L4 4L1 1" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>