Repeater Fields Blocks Like ACF

repeaterfield.php

<table class="arvtable-repeater">
	<tbody id="mother" class="ui-sortable">
		<tr class="ui-state-default">
			<td class="action count"></td>
			<td class="contnet">
				<div class="field">
					Lorem ipsum dolor sit amet, consectetur adipisicing elit. Distinctio odio porro dolorem eum quaerat! Iusto animi tenetur dicta officia earum facere, consectetur excepturi id, recusandae reprehenderit doloremque necessitatibus deleniti nostrum!
				</div>
				<div class="field">
					<table>
						<thead>
							<tr>
								<td class="action"></td>
								<td>TEST</td>
								<td>TEST</td>
								<td class="action"></td>
							</tr>
						</thead>
						<tbody id="thiscontent" class="ui-sortable">
							<tr>
								<td class="action count"></td>
								<td><input type="text" value="TEST" class="regular-text"></td>
								<td><input type="text" value="TEST" class="regular-text"></td>
								<td class="action"><a href="#" class="remove">-</a></td>
							</tr>
						</tbody>
					</table>
					<p style="margin-bottom:0"><button type="button" class="button button-primary arvtable-button" data-arvandrepeater="<?php echo esc_attr('<td><input type="text" class="regular-text"></td><td><input type="text" class="regular-text"></td>'); ?>" data-arvandrepeater-target="#thiscontent">سطر جدید</button></p>
				</div>
			</td>
			<td class="action"><a href="#" class="remove">-</a></td>
		</tr>
	</tbody>
</table>
<p style="margin-bottom:0"><button type="button" class="button button-primary arvtable-button" data-arvandrepeater="<?php echo esc_attr('<div class="field"><label for="#">TEST</label><input type="text" class="regular-text"></div>'); ?>" data-arvandrepeater-target="#mother" data-arvandrepeater-block="yes">سطر جدید</button></p>
<script>
	jQuery(document).ready(function($){
		$(".ui-sortable").sortable({items: "> tr",dropOnEmpty: false}).disableSelection();
		$(document).on('click', '.arvtable-button', function(e){
			e.preventDefault();
			const $content = $(this).data('arvandrepeater'), $target = $(this).data('arvandrepeater-target'), $block = $(this).data('arvandrepeater-block') ? true : false;
			if( $block ){
				$(`<tr><td class="action count"></td><td class="contnet">${$content}</td><td class="action"><a href="#" class="remove">-</a></td></tr>`).appendTo($target);
			} else {
				$(`<tr><td class="action count"></td>${$content}<td class="action"><a href="#" class="remove">-</a></td></tr>`).appendTo($target);
			}
		});
		$(document).on('click', '.arvtable-repeater .remove', function(e){
			e.preventDefault();
			const message = $(this).attr('title') && '' != $(this).attr('title') ? $(this).attr('title') : 'Are you sure?';
			if( confirm( message ) ){
				$(this).closest('tr').fadeOut(function(){
					$(this).remove();
				});
			}
		});
	});
</script>