<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M7.5 1.75a.75.75 0 0 0-.75.75v.833c0 .415.336.75.75.75h1.75v1H6.79A2.75 2.75 0 0 0 4.057 7.53l-.562 5.053H2.5a.75.75 0 0 0-.75.75V17.5c0 .414.336.75.75.75h15a.75.75 0 0 0 .75-.75v-4.167a.75.75 0 0 0-.75-.75h-.995l-.562-5.053a2.75 2.75 0 0 0-2.733-2.447h-2.46v-1h1.75a.75.75 0 0 0 .75-.75V2.5a.75.75 0 0 0-.75-.75zm-.71 4.833h6.42a1.25 1.25 0 0 1 1.242 1.112l.543 4.888h-9.99l.543-4.888A1.25 1.25 0 0 1 6.79 6.583m-2.632 7.5H16.75v2.667H3.25v-2.667zm9.175-5.75V10H6.667V8.333zm-5 6.584a.5.5 0 1 0 0 1h3.334a.5.5 0 0 0 0-1z"/></svg></template>
<script setup lang="ts">
/**
 * CheckoutAlt20 is an SVG icon wrapped in a Vue component to make it easier to use.
 */
withDefaults(
  defineProps<{
    /**
     * Define the color of the icon.
     */
    color?: string;
  }>(),
  {
    color: 'currentColor',
  },
);
</script>
