import React from 'react';
import { Icon } from '../Icon';
import type { IconProps } from '../.types/IconPropsType';

export function TypingIcon(props: IconProps) {
  return (
    <Icon {...props}>
      <svg
        width="24"
        height="24"
        viewBox="0 0 24 24"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path d="M19 18C17.897 18 17 17.103 17 16H18C18.552 16 19 15.552 19 15C19 14.448 18.552 14 18 14H17V8C17 6.897 17.897 6 19 6C19.552 6 20 5.552 20 5C20 4.448 19.552 4 19 4C17.8 4 16.734 4.542 16 5.382C15.266 4.542 14.2 4 13 4C12.448 4 12 4.448 12 5C12 5.552 12.448 6 13 6C14.103 6 15 6.897 15 8V14H14C13.448 14 13 14.448 13 15C13 15.552 13.448 16 14 16H15C15 17.103 14.103 18 13 18C12.448 18 12 18.448 12 19C12 19.552 12.448 20 13 20C14.2 20 15.266 19.458 16 18.618C16.734 19.458 17.8 20 19 20C19.552 20 20 19.552 20 19C20 18.448 19.552 18 19 18Z" />
        <path d="M10 14H6V10H12C12.552 10 13 9.552 13 9C13 8.448 12.552 8 12 8H5C4.448 8 4 8.448 4 9V15C4 15.552 4.448 16 5 16H10C10.552 16 11 15.552 11 15C11 14.448 10.552 14 10 14Z" />
      </svg>
    </Icon>
  );
}
