text: import React from 'react';
  
  import { speechBubbleVariant } from '../../types';
  import { SPEECH, THOUGHT } from '../../constants/speechBubbleVariant';
  
  function BubbleTailArtwork({ variant = SPEECH, ...props }) {
    return (
      <svg xmlns="http://www.w3.org/2000/svg" width="68" height="42" viewBox="0 0 68 42" {...props}>
        {variant === THOUGHT && (
          <g>
            <path
              id="top-blob"
              opacity="0"
              fill="#fff"
              d="M23.949 19.915c.114.043.21.112.285.207-.019.169-.008.34.033.505.043.103.384.536.296.1.381.323.302.744.732 1.008.441.271.761.419 1.106.743.197.185.417.405.672.494.259.091.968-.049 1.185.113l-.087.007c.364.123.659.362.996.53.4-.097.803-.188 1.216-.256.768-.126 1.6-.043 2.352-.189.339-.066 1.694-.26 2.038-.476.92-.578 1.614-.85 2.051-1.828.117-.261.226-.529.325-.8a3.048 3.048 0 0 1 .213-2.59c.111-.205.226-.408.345-.609.099-.231-.843-.448-.718-.653.02-.194.058-.375.106-.549.021-.826-.095-1.7-.389-2.472.294.299.588.439.803.765.102.154.169.328.232.503.231-.259.254-.473.553-.643-.016-.348-.019-.725-.061-.929-.156-.762-.194-1.498-.588-2.174-.669-1.146-1.629-1.905-2.781-2.57-1.321-.763-2.765-1.141-4.308-1.03-.8.057-1.542.436-2.315.501-.46.039-.649-.025-1.102.181-.284.129-.567.269-.84.42-2.293 1.272-3.869 3.224-3.897 5.932-.013 1.314-.672 2.536.082 3.838.181.312.497 1.003.74 1.29.215.258.507.401.725.631z"
            />
            <path
              id="mid-blob"
              opacity="0"
              fill="#fff"
              d="M24.215 29.149c.004-.072.107-.654.075-.703-.036-.331-.145-.468-.173-.635a5.387 5.387 0 0 0-.541-1.599c-.553-1.061-1.46-1.727-2.507-2.27a5.115 5.115 0 0 0-3.669-.394c-.26.068-.546.25-.811.273-.229.02-.42-.052-.641-.015-.529.089-1.254.631-1.664.969-.598.493-1.266 1.117-1.614 1.793-.497.965-.407 1.869-.43 2.94-.02.936-.381 1.892-.1 2.838.159.535.575.539.874.885a.391.391 0 0 1 .233.142c-.014.104-.092.219-.042.311.348.648 1.186 1.369 1.709 1.613.151.071.461.206.607.279.04.02.099.026.165.027.086-.025.174-.044.263-.054.675-.075 1.371-.091 1.993.208.222-.127.431-.276.599-.105.146.148 2.216-.324 3.849-1.16 1.033-1.341 1.304-1.347 1.833-2.914.15-.444-.003-2.412 0-2.416l-.008-.013z"
            />
            <path
              id="bottom-blob"
              opacity="0"
              fill="#fff"
              d="M5.307 33.994l-1.364-.217c-1.211.426-1.55.209-2.821 1.364-.068.062-.171.048-.251.057C.38 35.914 0 37.034 0 37.966c0 1.372.623 2.596 1.599 3.411.793.492 1.501.372 2.236.623.466-.171 1.262-.075 1.75-.193.913-.222 1.639-.603 2.419-1.168a4.425 4.425 0 0 0 .898-2.673c.001-2.458-1.301-3.786-3.595-3.972z"
            />
          </g>
        )}
        {variant === SPEECH && (
          <path
            fill="#fff"
            d="M44.817 0a71.092 71.092 0 0 1-1.342 7.254c-.371 1.534-1.815 5.595-2.153 6.465a28.132 28.132 0 0 1-2.056 4.185c-.831 1.398-1.772 2.73-2.742 4.034-.968 1.301-2.059 2.209-3.227 3.312-4.614 4.359-10.072 8.851-16.207 10.867-1.98.65-6.776 2.03-12.689 2.913.493 1.173 2.708 1.861 3.871 2.018 1.958.264 3.967.459 5.938.608 3.402.256 6.806-.342 10.172-.761 3.584-.445 6.977-.856 10.397-2.019 1.453-.494 3.38-.922 4.64-1.772 1.367-.923 2.756-1.71 4.222-2.497 1.836-.986 3.649-2.053 5.287-3.346.431-.34 3.934-3.246 3.557-3.773-.099-.138-.771.434-.795.453 1.318-1.261 2.792-2.285 3.926-3.727l-.405.94c.827-.786 1.741-1.552 2.307-2.557.287-.509.44-1.013.787-1.48.302-.407.636-.788.916-1.212 1.313-1.998 4.01-5.706 3.884-5.708.101.002.348-1.498.391-1.654.069-.248.301-.687.443-1.005.067-.148 2.629-5.257 3.553-11.538H44.817z"
          />
        )}
      </svg>
    );
  }
  
  BubbleTailArtwork.propTypes = {
    variant: speechBubbleVariant
  };
  
  export default BubbleTailArtwork;
  