<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 fill-rule="evenodd" clip-rule="evenodd"
        d="M4.539 17.2389C4.89772 17.6263 5.32917 17.82 5.83333 17.82H11.3333C11.5931 17.82 11.8109 17.725 11.9869 17.5349C12.1623 17.3455 12.25 17.1105 12.25 16.83C12.25 16.5495 12.1623 16.3146 11.9869 16.1251C11.8109 15.9351 11.5931 15.84 11.3333 15.84H5.83333L5.83333 6.99001C5.83333 6.70951 5.74564 6.47422 5.57025 6.28414C5.39425 6.09472 5.17639 6.00001 4.91667 6.00001C4.65694 6.00001 4.43908 6.09472 4.26308 6.28414C4.08769 6.47422 4 6.70951 4 6.99001V15.84C4 16.3845 4.17967 16.8508 4.539 17.2389ZM13.4307 19.5149C13.6061 19.705 13.8236 19.8 14.0833 19.8C14.3431 19.8 14.5606 19.705 14.736 19.5149C14.912 19.3255 15 19.0905 15 18.81V13.86C15 13.3155 14.8206 12.8492 14.4619 12.4611C14.1026 12.0737 13.6708 11.88 13.1667 11.88H11.3333V8.47501C11.3333 7.78201 11.1118 7.19626 10.6687 6.71776C10.2257 6.23926 9.68333 6.00001 9.04167 6.00001C8.4 6.00001 7.85764 6.23926 7.41458 6.71776C6.97153 7.19626 6.75 7.78201 6.75 8.47501V12.87C6.75 13.4145 6.92967 13.8808 7.289 14.2689C7.64772 14.6563 8.07917 14.85 8.58333 14.85H13.1667V18.81C13.1667 19.0905 13.2547 19.3255 13.4307 19.5149Z"
        :fill="fill"/>
      <path
        d="M9.04167 4.96C8.5375 4.96 8.10606 4.76596 7.74733 4.37788C7.388 3.99046 7.20833 3.5245 7.20833 2.98C7.20833 2.4355 7.388 1.96921 7.74733 1.58113C8.10606 1.19371 8.5375 1 9.04167 1C9.54583 1 9.97758 1.19371 10.3369 1.58113C10.6956 1.96921 10.875 2.4355 10.875 2.98C10.875 3.5245 10.6956 3.99046 10.3369 4.37788C9.97758 4.76596 9.54583 4.96 9.04167 4.96Z"
        :fill="fill"
      />
    </template>
  </BaseIcon>
</template>

<style scoped></style>
