@meetelise/chat 1.34.2 → 1.34.4

package/src/WebComponent/actions/minimize-expand-button.ts

@@ -1,93 +0,0 @@
-import { css, html, LitElement, TemplateResult } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import { styleMap } from "lit/directives/style-map.js";
-import { defaultPrimaryColor } from "../../themes";
-import { ChevronRightIcon } from "../icons/ChevronRightIcon";
-import { XOutlineIcon } from "../icons/XOutlineIcon";
-
-@customElement("minimize-expand-button")
-export class MinimizeExpandButton extends LitElement {
-  static styles = [
-    css`
-      .button-container {
-        width: 56px;
-        height: 56px;
-
-        background: #ffffff;
-        border: 1px solid rgba(95, 95, 95, 0.2);
-        border-radius: 1000px;
-
-        display: flex;
-        justify-content: center;
-        align-items: center;
-      }
-      .mini {
-        width: 36px;
-        height: 36px;
-      }
-      .inner-container {
-        width: 46px;
-        height: 46px;
-
-        border-radius: 1000px;
-        border: 1px solid rgba(255, 255, 255, 0.7);
-
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        text-align: center;
-      }
-      .mini > .inner-container {
-        width: 30px;
-        height: 30px;
-      }
-      .x-icon,
-      .chevron-up {
-        width: 100%;
-        height: 100%;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        border-radius: 1000px;
-      }
-      .chevron-up {
-        transform: rotate(-90deg);
-      }
-      .button-container:hover {
-        cursor: pointer;
-        filter: brightness(90%);
-      }
-    `,
-  ];
-
-  @property({ attribute: true })
-  onClick: () => void = () => {
-    return;
-  };
-
-  @property({ attribute: true })
-  primaryColor: string = defaultPrimaryColor;
-
-  @property({ attribute: true })
-  toExpand = false;
-
-  render(): TemplateResult {
-    return html`
-      <div
-        class=${this.toExpand ? "button-container mini" : "button-container"}
-        @click=${this.onClick}
-      >
-        <div
-          class="inner-container"
-          style=${styleMap({
-            background: this.primaryColor,
-          })}
-        >
-          ${this.toExpand
-            ? html`<div class="chevron-up">${ChevronRightIcon("white")}</div>`
-            : html` <div class="x-icon">${XOutlineIcon("white")}</div>`}
-        </div>
-      </div>
-    `;
-  }
-}

package/src/WebComponent/chat-additional-actions.ts

@@ -1,135 +0,0 @@
-import { css, html, LitElement, TemplateResult } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import { classMap } from "lit/directives/class-map.js";
-import { BuildingWebchatView } from "../fetchBuildingWebchatView";
-import {
-  shouldUsePrimaryColorForChatFooter,
-  hexToAlmostWhite,
-  defaultPrimaryColor,
-} from "../themes";
-
-@customElement("chat-additional-actions")
-export class ChatAdditionalActions extends LitElement {
-  static styles = css`
-    .hideTab {
-      display: none;
-    }
-    .showTab {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      gap: 32px;
-    }
-  `;
-
-  @property({ type: String })
-  id = "";
-
-  @property({ type: Boolean })
-  showChatAdditionalActions = false;
-
-  @property({ type: Object })
-  buildingWebchatView: BuildingWebchatView | null = null;
-
-  @property({ type: String })
-  primaryColor: string | null = null;
-
-  @property({ type: String })
-  backgroundColor: string | null = null;
-
-  @property({ type: Object })
-  enabledChatWidgets: {
-    callDesktop: boolean;
-    chatDesktop: boolean;
-    emailDesktop: boolean;
-    textDesktop: boolean;
-    sstDesktop: boolean;
-  } = {
-    callDesktop: false,
-    chatDesktop: false,
-    emailDesktop: false,
-    textDesktop: false,
-    sstDesktop: false,
-  };
-
-  @property({ attribute: true })
-  onClickMinimize: () => void = () => {
-    return;
-  };
-
-  @property({ attribute: true })
-  onClickEmailOption: (e: MouseEvent) => void = () => {
-    return;
-  };
-
-  @property({ attribute: true })
-  onClickPhoneOption: (e: MouseEvent) => void = () => {
-    return;
-  };
-
-  @property({ attribute: true })
-  onClickSSTOption: (e: MouseEvent) => void = () => {
-    return;
-  };
-
-  @property({ attribute: true })
-  onClose: (e: MouseEvent) => void = () => {
-    return;
-  };
-
-  render(): TemplateResult {
-    const primaryColorValue = this.primaryColor || defaultPrimaryColor;
-    const backgroundColorValue = this.backgroundColor || "#ffffff";
-
-    const triangleDivColor =
-      this.buildingWebchatView &&
-      shouldUsePrimaryColorForChatFooter(
-        this.buildingWebchatView.orgId,
-        this.buildingWebchatView.id
-      ) &&
-      primaryColorValue !== defaultPrimaryColor
-        ? hexToAlmostWhite(primaryColorValue, 0.6)
-        : "black";
-
-    return html`
-      <style>
-        #${this.id}::after {
-          border-right-color: ${triangleDivColor} !important;
-        }
-      </style>
-      <div
-        id=${this.id}
-        class=${classMap({
-          ["showTab"]: this.showChatAdditionalActions,
-          ["hideTab"]: !this.showChatAdditionalActions,
-        })}
-      >
-        <mobile-launcher
-          .onClickMinimize=${this.onClickMinimize}
-          .onClickEmailOption=${this.onClickEmailOption}
-          .onClickPhoneOption=${this.onClickPhoneOption}
-          .onClickSSTOption=${this.onClickSSTOption}
-          .primaryColor=${primaryColorValue}
-          .backgroundColor=${backgroundColorValue}
-          .hideChat=${true}
-          .hasCallUsEnabled=${this.enabledChatWidgets.callDesktop}
-          .hasChatEnabled=${this.enabledChatWidgets.chatDesktop}
-          .hasEmailEnabled=${this.enabledChatWidgets.emailDesktop}
-          .hasTextUsEnabled=${this.enabledChatWidgets.textDesktop}
-          .hasSSTEnabled=${this.enabledChatWidgets.sstDesktop}
-        ></mobile-launcher>
-        <minimize-expand-button
-          .primaryColor=${primaryColorValue}
-          .backgroundColor=${backgroundColorValue}
-          .onClick=${this.onClose}
-        ></minimize-expand-button>
-      </div>
-    `;
-  }
-}
-
-declare global {
-  interface HTMLElementTagNameMap {
-    "chat-additional-actions": ChatAdditionalActions;
-  }
-}

package/src/WebComponent/health-chat.ts

@@ -1,270 +0,0 @@
-import { css, html, LitElement, TemplateResult } from "lit";
-import { customElement, property, state } from "lit/decorators.js";
-import { createRef, Ref } from "lit/directives/ref.js";
-import { Launcher } from "./launcher/Launcher";
-import "./Scheduler/tour-scheduler";
-import { installLauncher } from "./launcher/Launcher";
-
-import "./MEChat.css";
-import MyPubnub from "../MyPubnub";
-
-import "./actions/minimize-expand-button";
-import "./launcher/mobile-launcher";
-import "./pubnub-chat";
-import {
-  clearChatStorageKey,
-  createChatStorageKey,
-  getChatStorageKey,
-  isChatKeyValid,
-} from "../handleChatId";
-import { isMobile } from "../utils";
-import "./simple-launcher/simple-launcher";
-import { WidgetType } from "../main/MEChat";
-
-@customElement("health-chat")
-export class HealthChat extends LitElement {
-  static styles = css`
-    :host {
-      all: initial;
-    }
-
-    #__talkjs_launcher:not(.shouldBeVisible) {
-      display: none;
-    }
-
-    .launcherContainer.launcher__mobile {
-      width: 100%;
-      height: 100px;
-    }
-
-    #typeMobile-bttn {
-      position: fixed;
-      right: 24px;
-      bottom: 24px;
-      width: 80px;
-      height: 80px;
-
-      border: 2px solid #f3f6fc;
-      border-radius: 1000px;
-
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      margin-right: 40px;
-    }
-    #typeMobile-bttn:hover > #typeMobile-inner {
-      background: #eaecf4;
-      cursor: pointer;
-    }
-    #typeMobile-bttn > #typeMobile-inner {
-      width: 72px;
-      height: 72px;
-
-      background: #ffffff;
-      border: 2px solid #f3f6fc;
-      border-radius: 1000px;
-
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      gap: 4px;
-    }
-    #typeMobile-txt {
-      font-family: Poppins, "Open Sans", "Helvetica", sans-serif;
-      box-sizing: border-box;
-      font-weight: 300;
-      line-height: 150%;
-      font-size: 16px;
-    }
-  `;
-
-  @property({ type: String })
-  private healthcareId = "";
-
-  @property({ type: Number })
-  private right = 0;
-
-  @property({ type: Number })
-  private bottom = 0;
-
-  @property({ type: Number })
-  private top = 0;
-
-  @property({ type: Number })
-  private left = 0;
-
-  @state()
-  private launcher: HTMLElement | null = null;
-
-  @state()
-  private currentLeadSource: string | null = null;
-
-  @state()
-  private displayPubnubChat = false;
-
-  @state()
-  private myPubnub: MyPubnub | null = null;
-
-  @state()
-  private requiresConsent = false;
-
-  @state()
-  private privacyPolicyUrl = "http://bit.ly/me_privacy_policy";
-
-  @state()
-  private isLoading = true;
-
-  launcherRef: Ref<Launcher> = createRef();
-
-  firstUpdated = async (): Promise<void> => {
-    const isInMaintenanceMode = false; // TODO: check
-    if (isInMaintenanceMode) {
-      // eslint-disable-next-line no-console
-      console.warn(
-        "MeetElise Chat is in maintenance mode. Chat icon will not appear."
-      );
-      return;
-    }
-    await this.initializeChatVariables();
-  };
-
-  private initializeChatVariables = async (): Promise<void> => {
-    this.isLoading = true;
-
-    // important to distinguish between a user who has never opened the chat and a user who has opened the chat but closed it
-    const currentChatStorageKey = getChatStorageKey(this.healthcareId);
-    const updatedChatStorageKey = isChatKeyValid(
-      this.healthcareId,
-      currentChatStorageKey
-    )
-      ? currentChatStorageKey
-      : createChatStorageKey(this.healthcareId, false);
-
-    if (!updatedChatStorageKey.leadId) {
-      throw new Error("Lead ID is null");
-    }
-
-    this.myPubnub = new MyPubnub(
-      this.healthcareId,
-      null,
-      "",
-      this.currentLeadSource,
-      updatedChatStorageKey.leadId,
-      null,
-      WidgetType.Healthcare
-    );
-
-    if (updatedChatStorageKey.initiatedChat) {
-      await this.myPubnub.initializePubnub(currentChatStorageKey);
-    }
-
-    if (!isMobile()) {
-      this.displayPubnubChat = true;
-    }
-
-    this.attachOnClickToLauncher();
-
-    this.isLoading = false;
-  };
-
-  public async restartConversation(): Promise<void> {
-    this.myPubnub?.handleDisconnect();
-    clearChatStorageKey(this.healthcareId);
-    this.myPubnub = null;
-    this.displayPubnubChat = false;
-    await this.initializeChatVariables();
-  }
-
-  /** Show the chat button on the screen if it was previously hidden. */
-  show(): void {
-    if (!this.launcher) {
-      return;
-    }
-    this.launcher.style.display = "";
-  }
-
-  /** Hide the chat button from the screen (but don't remove from the DOM). */
-  hide(): void {
-    if (!this.launcher) {
-      return;
-    }
-    this.launcher.style.display = "none";
-  }
-
-  disconnectedCallback(): void {
-    this.myPubnub?.handleDisconnect();
-    super.disconnectedCallback();
-  }
-
-  private attachOnClickToLauncher = () => {
-    const launcher = this.launcherRef.value;
-    if (!launcher) {
-      return;
-    }
-    launcher.onChatTapped = async () => {
-      this.displayPubnubChat = true;
-    };
-  };
-
-  render(): TemplateResult {
-    installLauncher();
-
-    if (this.isLoading) return html``;
-    return html`
-   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
-      <div id="aria-describe-info" style="display: none;">
-          EliseAI widget that allows you to chat with a virtual assistant, book
-          a tour, contact the leasing office, and more.
-      </div>
-        ${
-          this.displayPubnubChat
-            ? html`
-                <pubnub-chat
-                  id="pubnub-chat"
-                  .widgetType=${WidgetType.Healthcare}
-                  .channel=${this.myPubnub?.channel}
-                  .myPubnub=${this.myPubnub}
-                  .buildingSlug=${this.healthcareId}
-                  .onClickExit=${() => {
-                    this.displayPubnubChat = false;
-                  }}
-                  .requiresConsent=${this.requiresConsent}
-                  .privacyPolicyUrl=${this.privacyPolicyUrl}
-                  .top=${this.top}
-                  .bottom=${this.bottom}
-                  .left=${this.left}
-                  .right=${this.right}
-                ></pubnub-chat>
-              `
-            : html``
-        }
-        <simple-launcher
-          id="healthcare-launcher"
-          .top=${this.top}
-          .bottom=${this.bottom}
-          .left=${this.left}
-          .right=${this.right}
-          .isChatOpen=${this.displayPubnubChat}
-          .onClickCloseChat=${() => {
-            this.displayPubnubChat = false;
-          }}
-          .onClickOpenChat=${() => {
-            this.displayPubnubChat = true;
-          }}
-          
-        ></simple-launcher>
-
-      </meta>
-    `;
-  }
-}
-
-declare global {
-  interface HTMLElementTagNameMap {
-    "health-chat": HealthChat;
-  }
-
-  interface Window {
-    RCTPCampaign?: { CampaignDetails: { Source: string } };
-  }
-}

package/src/WebComponent/healthchat-styles.ts

@@ -1,119 +0,0 @@
-import { css } from "lit";
-
-export const healthChatStyles = css`
-  #healthchat-container {
-    position: fixed;
-
-    z-index: 100001;
-    display: flex;
-    align-items: center;
-
-    display: flex;
-    flex-direction: column;
-    overflow: hidden;
-    box-shadow: -10px 60px 60px 0px #bfbfbf4d;
-
-    box-shadow: 0px 1px 24px 0px #0000001a;
-
-    font-family: Poppins, "Open Sans", "Helvetica", sans-serif;
-  }
-  .healthchat-container__desktop {
-    width: 300px;
-    height: 420px;
-    border-radius: 10px;
-  }
-
-  #healthchat-header {
-    height: 60px;
-    width: 100%;
-    background: white;
-    overflow: hidden;
-
-    box-sizing: border-box;
-
-    display: flex;
-    align-items: center;
-    padding: 24px 16px;
-    justify-content: space-between;
-  }
-
-  #healthchat-header-subtext {
-    font-family: Helvetica;
-    font-size: 8px;
-    font-weight: 300;
-    line-height: 11px;
-    letter-spacing: 0em;
-    text-align: left;
-    color: #737373;
-  }
-
-  .healthcare-conversation-body-backdrop {
-    background: #f1f2f4;
-  }
-
-  @media screen and (max-width: 767px) {
-    #conversation-body {
-      background: #efefef;
-      backdrop-filter: none;
-    }
-  }
-
-  .healthcare-disclaimer-inner {
-    width: 190px;
-    margin: 0 auto;
-  }
-  .healthcare-disclaimer-message {
-    font-size: 10px;
-    color: #737373;
-    line-height: 12px;
-    font-weight: 400;
-    text-align: center;
-  }
-  .healthcare-disclaimer-inner > a {
-    color: #737373;
-  }
-
-  #healthcare-footer {
-    min-height: 60px;
-    width: 100%;
-    background: white;
-    z-index: 100001;
-  }
-  #healthcare-inner-footer {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    box-sizing: border-box;
-    padding: 16px;
-    gap: 0px;
-  }
-  #healthcare-inner-footer > #message-input {
-    width: 100%;
-    max-height: 100px;
-    overflowy: auto;
-
-    font-family: inherit;
-    box-sizing: border-box;
-    font-weight: light;
-    border: none;
-    color: black;
-    background: none;
-
-    padding-right: 6px; /* width of the scrollbar */
-    box-sizing: border-box;
-    z-index: 1000000000000000000000000001;
-  }
-  #healthcare-inner-footer > #message-input:focus {
-    outline: none;
-    -webkit-box-shadow: none;
-    box-shadow: none;
-  }
-  #healthcare-send-message-bttn {
-    background: none;
-    border: none;
-    cursor: pointer;
-  }
-  .health-bttn-allow-access {
-    padding-right: 28px;
-  }
-`;

package/src/WebComponent/icons/ApplyOutlineIcon.ts

@@ -1,22 +0,0 @@
-import { svg, SVGTemplateResult } from "lit";
-
-export const ApplyOutlineIcon = (
-  color = "white"
-): SVGTemplateResult => svg`<svg width="16" height="14" viewBox="0 0 16 14" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_18382_27345)">
-<g clip-path="url(#clip1_18382_27345)">
-<path d="M9.91666 0.625V3.45833C9.91666 3.6462 9.99128 3.82636 10.1241 3.9592C10.257 4.09204 10.4371 4.16667 10.625 4.16667H13.4583" stroke="${color}" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M12.0417 13.375H4.95832C4.5826 13.375 4.22227 13.2257 3.95659 12.9601C3.69091 12.6944 3.54166 12.3341 3.54166 11.9583V2.04167C3.54166 1.66594 3.69091 1.30561 3.95659 1.03993C4.22227 0.774255 4.5826 0.625 4.95832 0.625H9.91666L13.4583 4.16667V11.9583C13.4583 12.3341 13.3091 12.6944 13.0434 12.9601C12.7777 13.2257 12.4174 13.375 12.0417 13.375Z" stroke="${color}" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M6.375 9.125L7.79167 10.5417L10.625 7.70833" stroke="${color}" stroke-linecap="round" stroke-linejoin="round"/>
-</g>
-</g>
-<defs>
-<clipPath id="clip0_18382_27345">
-<rect width="16" height="14" fill="white"/>
-</clipPath>
-<clipPath id="clip1_18382_27345">
-<rect width="17" height="17" fill="white" transform="translate(0 -1.5)"/>
-</clipPath>
-</defs>
-</svg>
-`;

package/src/WebComponent/icons/BookTourOutlineIcon.ts

@@ -1,13 +0,0 @@
-import { svg, SVGTemplateResult } from "lit";
-
-export const BookTourOutlineIcon = (
-  color = "black"
-): SVGTemplateResult => svg`<svg xmlns="http://www.w3.org/2000/svg" width="16" height="18" viewBox="0 0 16 18" fill="none">
-<path d="M15.6825 6.11855H0.00653076C0.0588276 4.00052 1.79117 2.30087 3.92226 2.30087H4.41255V3.6083C4.41255 3.88285 4.63481 4.09858 4.90283 4.09858C5.17085 4.09858 5.39311 3.88285 5.39311 3.6083V2.30087H10.2959V3.6083C10.2959 3.88285 10.5182 4.09858 10.7862 4.09858C11.0542 4.09858 11.2765 3.88285 11.2765 3.6083V2.30087H11.7668C13.8979 2.30087 15.6302 4.00052 15.6825 6.11855Z" fill="${color}"/>
-<path d="M15.0641 7.39731V14.0677C15.0641 15.8922 13.5861 17.365 11.7668 17.365H3.92227C2.10298 17.365 0.625 15.8922 0.625 14.0677V7.39731H15.0641Z" fill="transparent" stroke="${color}" stroke-width="1.25"/>
-<path d="M4.90283 1V2.30742" stroke="${color}" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M10.7863 1V2.30742" stroke="${color}" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M0 6.11862H0.00653352C-3.5908e-06 6.15131 0 6.19053 0 6.22322V6.11862Z" fill="white"/>
-<path d="M15.689 6.11862V6.22322C15.689 6.19053 15.689 6.15131 15.6825 6.11862H15.689Z" fill="white"/>
-<path d="M4.74594 11.9562L6.56326 13.7735C6.8182 14.0285 7.23004 14.0285 7.48499 13.7735L10.9366 10.3219" stroke="${color}" stroke-miterlimit="10" stroke-linecap="round"/>
-</svg>`;

package/src/WebComponent/icons/CalculatorOutlineIcon.ts

@@ -1,22 +0,0 @@
-import { svg, SVGTemplateResult } from "lit";
-
-export const CalculatorOutlineIcon = (
-  color = "white"
-): SVGTemplateResult => svg`<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g id="Frame" clip-path="url(#clip0_14068_170001)">
-<path id="Vector" d="M3.33301 4.16667C3.33301 3.72464 3.5086 3.30072 3.82116 2.98816C4.13372 2.67559 4.55765 2.5 4.99967 2.5H14.9997C15.4417 2.5 15.8656 2.67559 16.1782 2.98816C16.4907 3.30072 16.6663 3.72464 16.6663 4.16667V15.8333C16.6663 16.2754 16.4907 16.6993 16.1782 17.0118C15.8656 17.3244 15.4417 17.5 14.9997 17.5H4.99967C4.55765 17.5 4.13372 17.3244 3.82116 17.0118C3.5086 16.6993 3.33301 16.2754 3.33301 15.8333V4.16667Z" stroke=${color} stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_2" d="M6.66699 6.66634C6.66699 6.44533 6.75479 6.23337 6.91107 6.07709C7.06735 5.92081 7.27931 5.83301 7.50033 5.83301H12.5003C12.7213 5.83301 12.9333 5.92081 13.0896 6.07709C13.2459 6.23337 13.3337 6.44533 13.3337 6.66634V7.49967C13.3337 7.72069 13.2459 7.93265 13.0896 8.08893C12.9333 8.24521 12.7213 8.33301 12.5003 8.33301H7.50033C7.27931 8.33301 7.06735 8.24521 6.91107 8.08893C6.75479 7.93265 6.66699 7.72069 6.66699 7.49967V6.66634Z" stroke=${color} stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_3" d="M6.66699 11.667V11.6753" stroke=${color} stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_4" d="M10 11.667V11.6753" stroke=${color} stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_5" d="M13.333 11.667V11.6753" stroke=${color} stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_6" d="M6.66699 14.167V14.1753" stroke=${color} stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_7" d="M10 14.167V14.1753" stroke=${color} stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_8" d="M13.333 14.167V14.1753" stroke=${color} stroke-linecap="round" stroke-linejoin="round"/>
-</g>
-<defs>
-<clipPath id="clip0_14068_170001">
-<rect width="20" height="20" fill="white"/>
-</clipPath>
-</defs>
-</svg>
-`;

package/src/WebComponent/icons/ChatOutlineIcon.ts

@@ -1,10 +0,0 @@
-import { svg, SVGTemplateResult } from "lit";
-
-export const ChatOutlineIcon = (color = "white"): SVGTemplateResult => svg`
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
-  <path 
-    fill-rule="evenodd" 
-    clip-rule="evenodd" 
-    d="M6.64026 0.25H8.8598C10.0157 0.249995 10.9219 0.249992 11.6459 0.318826C12.3838 0.388987 12.988 0.534458 13.5206 0.860861C14.0784 1.20267 14.5474 1.67164 14.8892 2.22942C15.2156 2.76206 15.3611 3.36627 15.4312 4.10419C15.5001 4.82813 15.5001 5.73432 15.5001 6.89025V7.65964C15.5001 8.48243 15.5001 9.12755 15.4645 9.64868C15.4283 10.1789 15.3535 10.6202 15.1845 11.0283C14.7638 12.044 13.9568 12.851 12.9411 13.2717C12.3607 13.5121 11.6997 13.5654 10.7947 13.581C10.4782 13.5865 10.2777 13.5905 10.1248 13.6074C9.98202 13.6232 9.92665 13.6464 9.89426 13.6652C9.86008 13.6851 9.81351 13.7213 9.73267 13.8323C9.64518 13.9523 9.54632 14.1182 9.38955 14.3831L8.99874 15.0433C8.44104 15.9856 7.05899 15.9856 6.5013 15.0433L6.11048 14.3831C5.95371 14.1182 5.85485 13.9523 5.76736 13.8323C5.68652 13.7213 5.63995 13.6851 5.60577 13.6652C5.57338 13.6464 5.51801 13.6232 5.37519 13.6074C5.22235 13.5905 5.02184 13.5865 4.70528 13.581C3.80031 13.5654 3.13933 13.5121 2.559 13.2717C1.54327 12.851 0.736277 12.044 0.315547 11.0283C0.146515 10.6202 0.0717299 10.1789 0.0355529 9.64868C-4.05001e-06 9.12754 -2.20251e-06 8.48243 1.60891e-07 7.65963L7.4949e-08 6.89026C-4.52294e-06 5.73432 -8.08928e-06 4.82814 0.0688256 4.10419C0.138987 3.36627 0.284458 2.76206 0.610861 2.22942C0.95267 1.67164 1.42164 1.20267 1.97942 0.860861C2.51206 0.534458 3.11627 0.388987 3.85419 0.318826C4.57814 0.249992 5.48432 0.249995 6.64026 0.25ZM3.95654 1.39537C3.29779 1.458 2.87862 1.57812 2.54445 1.78291C2.13217 2.03555 1.78555 2.38217 1.53291 2.79445C1.32812 3.12862 1.208 3.54779 1.14537 4.20654C1.08197 4.87334 1.0814 5.7282 1.0814 6.91863V7.63956C1.0814 8.48674 1.08169 9.09505 1.11444 9.57507C1.14686 10.0502 1.20927 10.3601 1.31463 10.6144C1.6256 11.3652 2.22208 11.9617 2.97284 12.2726C3.34458 12.4266 3.81883 12.4842 4.72391 12.4998L4.74685 12.5002C5.03378 12.5051 5.28522 12.5094 5.49421 12.5326C5.71878 12.5574 5.9384 12.6077 6.14946 12.7304C6.35874 12.8522 6.50969 13.0148 6.64128 13.1953C6.76287 13.3622 6.88783 13.5733 7.02936 13.8124L7.4319 14.4925C7.57086 14.7273 7.92917 14.7273 8.06813 14.4925L8.47067 13.8124C8.6122 13.5733 8.73716 13.3622 8.85875 13.1953C8.99034 13.0148 9.14129 12.8522 9.35057 12.7304C9.56163 12.6077 9.78126 12.5574 10.0058 12.5326C10.2148 12.5094 10.4662 12.5051 10.7532 12.5002L10.7761 12.4998C11.6812 12.4842 12.1555 12.4266 12.5272 12.2726C13.278 11.9617 13.8745 11.3652 14.1854 10.6144C14.2908 10.3601 14.3532 10.0502 14.3856 9.57507C14.4184 9.09505 14.4187 8.48674 14.4187 7.63956V6.91863C14.4187 5.7282 14.4181 4.87334 14.3547 4.20654C14.2921 3.54779 14.1719 3.12862 13.9672 2.79445C13.7145 2.38217 13.3679 2.03555 12.9556 1.78291C12.6214 1.57812 12.2023 1.458 11.5435 1.39537C10.8767 1.33197 10.0219 1.3314 8.83143 1.3314H6.66863C5.4782 1.3314 4.62334 1.33197 3.95654 1.39537ZM7.75003 3.85467C8.04865 3.85467 8.29073 4.09674 8.29073 4.39536V10.1628C8.29073 10.4614 8.04865 10.7035 7.75003 10.7035C7.45141 10.7035 7.20933 10.4614 7.20933 10.1628V4.39536C7.20933 4.09674 7.45141 3.85467 7.75003 3.85467ZM4.8663 5.29653C5.16492 5.29653 5.407 5.53861 5.407 5.83723V8.72096C5.407 9.01958 5.16492 9.26166 4.8663 9.26166C4.56768 9.26166 4.3256 9.01958 4.3256 8.72096V5.83723C4.3256 5.53861 4.56768 5.29653 4.8663 5.29653ZM10.6338 5.29653C10.9324 5.29653 11.1745 5.53861 11.1745 5.83723V8.72096C11.1745 9.01958 10.9324 9.26166 10.6338 9.26166C10.3351 9.26166 10.0931 9.01958 10.0931 8.72096V5.83723C10.0931 5.53861 10.3351 5.29653 10.6338 5.29653Z" 
-    fill="${color}"/>
-</svg>`;