<script setup>
import { BaseIcon } from "@components/common/icons";
const props = defineProps({
  color: { type: String, default: 'text-neutrals-900' },
  active: { type: Boolean, default: false },
});
</script>

<template>
  <BaseIcon viewBox="0 0 21 20" :active="active" :className="props.color">
    <template #default="{ fill }">
      <path
        d="M13.5844 4H10.9C10.65 4 10.4094 4.09375 10.225 4.2625L7.15312 7.075C7.15 7.07812 7.14688 7.08438 7.14375 7.0875C6.625 7.575 6.63438 8.35313 7.07812 8.8375C7.475 9.27187 8.30937 9.3875 8.83125 8.92188C8.83438 8.91875 8.84062 8.91875 8.84375 8.91563L11.3406 6.62813C11.5437 6.44375 11.8625 6.45625 12.0469 6.65938C12.2344 6.8625 12.2188 7.17812 12.0156 7.36562L11.2 8.1125L15.75 11.8062C15.8406 11.8812 15.9219 11.9625 15.9969 12.0469V6L14.2906 4.29375C14.1062 4.10625 13.85 4 13.5844 4ZM17 6.00625V13.0031C17 13.5563 17.4469 14.0031 18 14.0031H20V6.00625H17ZM18.5 13.0031C18.225 13.0031 18 12.7781 18 12.5031C18 12.2281 18.225 12.0031 18.5 12.0031C18.775 12.0031 19 12.2281 19 12.5031C19 12.7781 18.775 13.0031 18.5 13.0031ZM0 14H2C2.55312 14 3 13.5531 3 13V6.00625H0V14ZM1.5 12.0031C1.775 12.0031 2 12.2281 2 12.5031C2 12.7781 1.775 13.0031 1.5 13.0031C1.225 13.0031 1 12.7781 1 12.5031C1 12.225 1.225 12.0031 1.5 12.0031ZM15.1219 12.5844L10.4563 8.79688L9.51875 9.65625C8.59062 10.5031 7.16875 10.4219 6.34062 9.51875C5.5 8.6 5.56563 7.17812 6.47813 6.34062L9.03438 4H6.41563C6.15 4 5.89687 4.10625 5.70937 4.29375L4 6V12.9969H4.57188L7.4 15.5562C8.25625 16.2531 9.51562 16.1219 10.2125 15.2656L10.2188 15.2594L10.7781 15.7437C11.275 16.15 12.0094 16.0719 12.4125 15.575L13.3938 14.3687L13.5625 14.5063C13.9906 14.8531 14.6219 14.7906 14.9688 14.3594L15.2656 13.9937C15.6156 13.5625 15.55 12.9344 15.1219 12.5844Z"
        :fill="fill"
      />
    </template>
  </BaseIcon>
</template>

<style scoped></style>
