<?php

namespace Wetail\Shipping\Engine;

defined( 'ABSPATH' ) or die();
?>

<script type="text/html" id="tmpl-wetail-portal-order-item">
	<li class="order-item" data-product_id="{{{data.product_id}}}">
		<div class="checkbox-wrapper">
					<span class="checkbox">
						<input aria-label="<?php echo esc_html__( 'Check if want to return product', 'wetail-shipping' ) ?>"
							type="checkbox" name="product-checkbox"/>
					<svg>
						<use xlink:href="#checkbox-30" class="checkbox"></use>
					</svg>
					</span>
			<svg xmlns="http://www.w3.org/2000/svg" style="display:none">
				<symbol id="checkbox-30" viewBox="0 0 22 22">
					<path fill="none" stroke="currentColor"
					      d="M5.5,11.3L9,14.8L20.2,3.3l0,0c-0.5-1-1.5-1.8-2.7-1.8h-13c-1.7,0-3,1.3-3,3v13c0,1.7,1.3,3,3,3h13 c1.7,0,3-1.3,3-3v-13c0-0.4-0.1-0.8-0.3-1.2"/>
				</symbol>
			</svg>
		</div>
		<div class="image">
			<# if ( data.product_src ) { #>
				<img src="{{{data.product_src}}}" alt="{{{data.product_name}}}" />
			<# } #>
		</div>
		<div class="title-and-sku">
			<h3>{{{data.product_name}}}</h3>
			<# if ( data.product_sku ) { #>
				<span>{{{data.product_sku}}}</span>
			<# } #>
		</div>
		<div class="quantity">
			<input aria-label="<?php echo esc_html__( 'Choose quantity to return', 'wetail-shipping' ) ?>" type="number"
			       min="1" pattern="[0-9]{2}" max="{{{data.product_quantity}}}" value="{{{data.product_quantity}}}"/>
		</div>
	</li>
</script>
