<script lang="ts">
	interface Props {
		icon: 'had' | 'own' | 'price-alert' | 'review' | 'want';
		className?: string;
	}

	let { icon, className = 'size-4' }: Props = $props();
</script>

{#if icon === 'review'}
	<svg
		class={className}
		viewBox="181 668 14 14"
		fill="none"
		aria-hidden="true"
	>
		<path
			d="M187.999 675.274L189.108 675.945C189.215 676.013 189.322 676.011 189.429 675.938C189.535 675.865 189.574 675.765 189.545 675.639L189.254 674.37L190.245 673.51C190.342 673.422 190.372 673.318 190.333 673.196C190.294 673.075 190.206 673.009 190.07 672.999L188.772 672.897L188.262 671.702C188.213 671.585 188.126 671.527 187.999 671.527C187.873 671.527 187.785 671.585 187.737 671.702L187.226 672.897L185.929 672.999C185.792 673.009 185.705 673.075 185.666 673.196C185.627 673.318 185.656 673.422 185.754 673.51L186.745 674.37L186.454 675.639C186.424 675.765 186.463 675.865 186.57 675.938C186.677 676.011 186.784 676.013 186.891 675.945L187.999 675.274ZM184.499 678.497L183.158 679.839C182.973 680.024 182.762 680.065 182.523 679.963C182.285 679.861 182.166 679.679 182.166 679.416V670.331C182.166 670.01 182.28 669.735 182.509 669.507C182.737 669.278 183.012 669.164 183.333 669.164H192.666C192.987 669.164 193.262 669.278 193.49 669.507C193.718 669.735 193.833 670.01 193.833 670.331V677.331C193.833 677.652 193.718 677.926 193.49 678.155C193.262 678.383 192.987 678.497 192.666 678.497H184.499ZM184.004 677.331H192.666V670.331H183.333V677.987L184.004 677.331Z"
			fill="currentColor"
		/>
	</svg>
{:else if icon === 'price-alert'}
	<svg
		class={className}
		viewBox="329 700 14 14"
		fill="none"
		aria-hidden="true"
	>
		<path
			d="M331.917 711.081C331.752 711.081 331.613 711.025 331.502 710.913C331.39 710.801 331.334 710.663 331.334 710.497C331.334 710.332 331.39 710.194 331.502 710.082C331.613 709.97 331.752 709.914 331.917 709.914H332.501V705.831C332.501 705.024 332.744 704.307 333.23 703.68C333.716 703.053 334.348 702.642 335.126 702.447V702.039C335.126 701.796 335.211 701.589 335.381 701.419C335.551 701.249 335.758 701.164 336.001 701.164C336.244 701.164 336.45 701.249 336.62 701.419C336.791 701.589 336.876 701.796 336.876 702.039V702.447C337.653 702.642 338.285 703.053 338.771 703.68C339.258 704.307 339.501 705.024 339.501 705.831V709.914H340.084C340.249 709.914 340.388 709.97 340.5 710.082C340.611 710.194 340.667 710.332 340.667 710.497C340.667 710.663 340.611 710.801 340.5 710.913C340.388 711.025 340.249 711.081 340.084 711.081H331.917ZM336.001 712.831C335.68 712.831 335.405 712.716 335.177 712.488C334.948 712.26 334.834 711.985 334.834 711.664H337.167C337.167 711.985 337.053 712.26 336.825 712.488C336.596 712.716 336.321 712.831 336.001 712.831ZM333.667 709.914H338.334V705.831C338.334 705.189 338.106 704.64 337.649 704.183C337.192 703.726 336.642 703.497 336.001 703.497C335.359 703.497 334.81 703.726 334.353 704.183C333.896 704.64 333.667 705.189 333.667 705.831V709.914ZM335.417 707.581V708.164C335.417 708.329 335.473 708.468 335.585 708.58C335.697 708.691 335.835 708.747 336.001 708.747C336.166 708.747 336.304 708.691 336.416 708.58C336.528 708.468 336.584 708.329 336.584 708.164V707.581H337.167C337.333 707.581 337.471 707.525 337.583 707.413C337.695 707.301 337.751 707.163 337.751 706.997C337.751 706.832 337.695 706.694 337.583 706.582C337.471 706.47 337.333 706.414 337.167 706.414H336.584V705.831C336.584 705.665 336.528 705.527 336.416 705.415C336.304 705.303 336.166 705.247 336.001 705.247C335.835 705.247 335.697 705.303 335.585 705.415C335.473 705.527 335.417 705.665 335.417 705.831V706.414H334.834C334.669 706.414 334.53 706.47 334.418 706.582C334.307 706.694 334.251 706.832 334.251 706.997C334.251 707.163 334.307 707.301 334.418 707.413C334.53 707.525 334.669 707.581 334.834 707.581H335.417Z"
			fill="currentColor"
		/>
	</svg>
{:else if icon === 'want'}
	<svg
		class={className}
		viewBox="181 700 14 14"
		fill="none"
		aria-hidden="true"
	>
		<path
			d="M187.999 711.857C187.863 711.857 187.725 711.833 187.584 711.784C187.443 711.736 187.319 711.658 187.212 711.551L186.206 710.632C185.175 709.689 184.244 708.753 183.413 707.825C182.582 706.897 182.166 705.873 182.166 704.755C182.166 703.841 182.472 703.078 183.085 702.466C183.697 701.853 184.46 701.547 185.374 701.547C185.89 701.547 186.376 701.656 186.833 701.875C187.29 702.094 187.679 702.393 187.999 702.772C188.32 702.393 188.709 702.094 189.166 701.875C189.623 701.656 190.109 701.547 190.624 701.547C191.538 701.547 192.301 701.853 192.914 702.466C193.526 703.078 193.833 703.841 193.833 704.755C193.833 705.873 193.419 706.899 192.593 707.832C191.767 708.766 190.829 709.704 189.779 710.647L188.787 711.551C188.68 711.658 188.556 711.736 188.415 711.784C188.274 711.833 188.135 711.857 187.999 711.857ZM187.445 703.939C187.163 703.54 186.862 703.236 186.541 703.027C186.22 702.818 185.831 702.714 185.374 702.714C184.791 702.714 184.305 702.908 183.916 703.297C183.527 703.686 183.333 704.172 183.333 704.755C183.333 705.261 183.513 705.798 183.872 706.367C184.232 706.935 184.662 707.487 185.163 708.022C185.664 708.557 186.179 709.057 186.709 709.524C187.239 709.991 187.669 710.375 187.999 710.676C188.33 710.375 188.76 709.991 189.29 709.524C189.82 709.057 190.335 708.557 190.836 708.022C191.337 707.487 191.767 706.935 192.126 706.367C192.486 705.798 192.666 705.261 192.666 704.755C192.666 704.172 192.472 703.686 192.083 703.297C191.694 702.908 191.208 702.714 190.624 702.714C190.167 702.714 189.779 702.818 189.458 703.027C189.137 703.236 188.835 703.54 188.554 703.939C188.485 704.036 188.403 704.109 188.306 704.157C188.208 704.206 188.106 704.23 187.999 704.23C187.892 704.23 187.79 704.206 187.693 704.157C187.596 704.109 187.513 704.036 187.445 703.939Z"
			fill="currentColor"
		/>
	</svg>
{:else if icon === 'own'}
	<svg
		class={className}
		viewBox="218 700 14 14"
		fill="none"
		aria-hidden="true"
	>
		<path
			d="M228.209 709.625V710.792C228.209 710.869 228.238 710.937 228.296 710.996C228.355 711.054 228.423 711.083 228.501 711.083C228.578 711.083 228.646 711.054 228.705 710.996C228.763 710.937 228.792 710.869 228.792 710.792V709.625H229.959C230.037 709.625 230.105 709.596 230.163 709.537C230.221 709.479 230.251 709.411 230.251 709.333C230.251 709.256 230.221 709.188 230.163 709.129C230.105 709.071 230.037 709.042 229.959 709.042H228.792V707.875C228.792 707.797 228.763 707.729 228.705 707.671C228.646 707.613 228.578 707.583 228.501 707.583C228.423 707.583 228.355 707.613 228.296 707.671C228.238 707.729 228.209 707.797 228.209 707.875V709.042H227.042C226.965 709.042 226.896 709.071 226.838 709.129C226.78 709.188 226.751 709.256 226.751 709.333C226.751 709.411 226.78 709.479 226.838 709.537C226.896 709.596 226.965 709.625 227.042 709.625H228.209ZM228.501 712.25C227.694 712.25 227.006 711.966 226.437 711.397C225.868 710.828 225.584 710.14 225.584 709.333C225.584 708.526 225.868 707.839 226.437 707.27C227.006 706.701 227.694 706.417 228.501 706.417C229.308 706.417 229.995 706.701 230.564 707.27C231.133 707.839 231.417 708.526 231.417 709.333C231.417 710.14 231.133 710.828 230.564 711.397C229.995 711.966 229.308 712.25 228.501 712.25ZM220.334 709.917V704.667C220.334 704.482 220.375 704.307 220.458 704.142C220.541 703.976 220.655 703.84 220.801 703.733L224.301 701.108C224.408 701.031 224.519 700.972 224.636 700.933C224.753 700.894 224.874 700.875 225.001 700.875C225.127 700.875 225.249 700.894 225.365 700.933C225.482 700.972 225.594 701.031 225.701 701.108L229.23 703.763C229.298 703.811 229.349 703.874 229.383 703.952C229.417 704.03 229.434 704.113 229.434 704.2C229.434 704.365 229.378 704.504 229.266 704.616C229.154 704.727 229.016 704.783 228.851 704.783C228.783 704.783 228.719 704.774 228.661 704.754C228.603 704.735 228.549 704.706 228.501 704.667L225.001 702.042L221.501 704.667V709.917H223.834C223.999 709.917 224.138 709.973 224.25 710.084C224.361 710.196 224.417 710.335 224.417 710.5C224.417 710.665 224.361 710.804 224.25 710.916C224.138 711.027 223.999 711.083 223.834 711.083H221.501C221.18 711.083 220.905 710.969 220.677 710.741C220.448 710.512 220.334 710.237 220.334 709.917Z"
			fill="currentColor"
		/>
	</svg>
{:else}
	<svg
		class={className}
		viewBox="255 700 14 14"
		fill="none"
		aria-hidden="true"
	>
		<path
			d="M260.672 704.868L261.664 703.22L260.804 701.791C260.687 701.597 260.519 701.499 260.3 701.499C260.082 701.499 259.914 701.597 259.797 701.791L258.674 703.672C258.597 703.809 258.575 703.957 258.609 704.117C258.643 704.278 258.728 704.397 258.864 704.474L259.87 705.072C260.006 705.15 260.155 705.17 260.315 705.131C260.475 705.092 260.595 705.004 260.672 704.868ZM266.01 709.331L265.018 707.683C264.931 707.547 264.909 707.398 264.953 707.238C264.996 707.078 265.086 706.959 265.222 706.881L266.243 706.297C266.379 706.22 266.525 706.2 266.681 706.239C266.836 706.278 266.953 706.365 267.031 706.502L267.672 707.566C267.779 707.731 267.838 707.916 267.847 708.12C267.857 708.324 267.813 708.514 267.716 708.689C267.619 708.884 267.475 709.039 267.286 709.156C267.096 709.272 266.89 709.331 266.666 709.331H266.01ZM263.837 712.918L262.408 711.489C262.291 711.372 262.233 711.236 262.233 711.081C262.233 710.925 262.291 710.789 262.408 710.672L263.837 709.243C263.934 709.146 264.041 709.122 264.158 709.17C264.274 709.219 264.333 709.311 264.333 709.447V709.914H267.104L266.258 711.606C266.151 711.8 266.005 711.956 265.82 712.072C265.636 712.189 265.431 712.247 265.208 712.247H264.333V712.714C264.333 712.85 264.274 712.943 264.158 712.991C264.041 713.04 263.934 713.015 263.837 712.918ZM258.689 712.247C258.495 712.247 258.317 712.196 258.157 712.094C257.996 711.992 257.877 711.859 257.799 711.693C257.722 711.538 257.685 711.375 257.69 711.205C257.695 711.035 257.741 710.877 257.829 710.731L258.324 709.914H260.249C260.415 709.914 260.553 709.97 260.665 710.082C260.777 710.194 260.833 710.332 260.833 710.497V711.664C260.833 711.829 260.777 711.968 260.665 712.08C260.553 712.191 260.415 712.247 260.249 712.247H258.689ZM257.245 710.585L256.297 708.689C256.21 708.514 256.169 708.327 256.173 708.128C256.178 707.928 256.234 707.741 256.341 707.566L256.574 707.172L256.181 706.939C256.074 706.871 256.03 706.771 256.049 706.64C256.069 706.509 256.142 706.429 256.268 706.399L258.208 705.918C258.363 705.879 258.512 705.901 258.653 705.984C258.794 706.066 258.883 706.186 258.922 706.341L259.404 708.295C259.433 708.422 259.394 708.524 259.287 708.602C259.18 708.679 259.073 708.684 258.966 708.616L258.572 708.368L257.245 710.585ZM264.551 705.452L262.612 704.97C262.486 704.941 262.415 704.861 262.4 704.73C262.386 704.598 262.432 704.499 262.539 704.431L262.933 704.197L261.11 701.164H263.166C263.37 701.164 263.562 701.215 263.742 701.317C263.922 701.419 264.065 701.558 264.172 701.733L264.931 703.002L265.31 702.768C265.417 702.7 265.524 702.705 265.631 702.783C265.738 702.861 265.776 702.963 265.747 703.089L265.266 705.029C265.227 705.184 265.137 705.303 264.996 705.386C264.855 705.469 264.707 705.49 264.551 705.452Z"
			fill="currentColor"
		/>
	</svg>
{/if}