JSFiddle - React, Tailwind, and code Playground

HTML

<div class="line-board">
		<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="200" height="130">
		<text x="5" y="15">Замена деталей</text>
		<polyline class="path" points="200,130, 150,20, 0,20"
				  stroke="#000000" stroke-width="3" fill="none" />
		</svg>
	</div>

CSS

.path {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  animation: dash 1.5s linear forwards;
  animation-delay: 2.5s;
}

@keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}
.line-board text {
	fill: #000000;
    font-size: 20px;
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.3s, visibility 0s linear 0.3s;
}
.line-board.absolut text {    
	visibility: visible;
	transition-delay: 3s;
	opacity: 1;
}

JavaScript

$(function(){
    setTimeout(function() {
        $('.line-board').addClass("absolut")
    }, 200);
});