@moveo-ai/web-widget/src/templates/emptyMessages.js

Client side library to load the moveo chat widget and connect it with your agent

const emptyMessages = () => {
  return `<div class="moveo__messages__empty" >
  <svg width="50%" viewBox="0 0 186 194" fill="none" xmlns="http://www.w3.org/2000/svg"><g filter="url(#filter0_ddd)"><path fill-rule="evenodd" clip-rule="evenodd" d="M141.406 111.325C150.518 100.398 156 86.339 156 71c0-34.794-28.206-63-63-63S30 36.206 30 71s28.206 63 63 63c11.415 0 22.12-3.036 31.353-8.344 10.718 6.108 22.318 7.747 28.038 8.185 1.012.077 1.437-1.279.632-1.897-3.738-2.866-9.814-8.569-11.062-16.1a62.755 62.755 0 01-.555-4.519z" fill="#fff"/><rect x="53.625" y="81.5" width="13.125" height="21" rx="6.563" transform="rotate(-90 53.625 81.5)" fill="#8499A8"/><rect x="79.875" y="81.5" width="13.125" height="21" rx="6.563" transform="rotate(-90 79.875 81.5)" fill="#8499A8"/><rect x="106.125" y="81.5" width="13.125" height="21" rx="6.563" transform="rotate(-90 106.125 81.5)" fill="#8499A8"/><rect x="53.625" y="60.5" width="13.125" height="26.25" rx="6.563" transform="rotate(-90 53.625 60.5)" fill="#8499A8"/><rect x="53.625" y="99.875" width="13.125" height="26.25" rx="6.563" transform="rotate(-90 53.625 99.875)" fill="#8499A8"/><circle cx="107.992" cy="55.25" r="7.875" fill="#8499A8"/><circle cx="90.375" cy="55.25" r="5.25" fill="#8499A8"/><circle cx="126.367" cy="55.25" r="5.25" fill="#8499A8"/></g><defs><filter id="filter0_ddd" x="0" y="0" width="186" height="194" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="30"/><feGaussianBlur stdDeviation="15"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/><feBlend in2="BackgroundImageFix" result="effect1_dropShadow"/><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset/><feGaussianBlur stdDeviation="4"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/><feBlend in2="effect1_dropShadow" result="effect2_dropShadow"/><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="1"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0"/><feBlend in2="effect2_dropShadow" result="effect3_dropShadow"/><feBlend in="SourceGraphic" in2="effect3_dropShadow" result="shape"/></filter></defs></svg>
  <p>This conversation </br> hasn’t started yet.</p>
</div>`;
};

export default emptyMessages;