<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 }">
      <g clip-path="url(#clip0_1295_32514)">
        <path
          d="M0.00390625 3.75C0.00390625 3.08696 0.267298 2.45107 0.736139 1.98223C1.20498 1.51339 1.84087 1.25 2.50391 1.25H17.5039C18.1669 1.25 18.8028 1.51339 19.2717 1.98223C19.7405 2.45107 20.0039 3.08696 20.0039 3.75V16.25C20.0039 16.913 19.7405 17.5489 19.2717 18.0178C18.8028 18.4866 18.1669 18.75 17.5039 18.75H2.50391C1.84087 18.75 1.20498 18.4866 0.736139 18.0178C0.267298 17.5489 0.00390625 16.913 0.00390625 16.25V3.75ZM1.25391 15V16.25C1.25391 16.5815 1.3856 16.8995 1.62002 17.1339C1.85444 17.3683 2.17239 17.5 2.50391 17.5H17.5039C17.8354 17.5 18.1534 17.3683 18.3878 17.1339C18.6222 16.8995 18.7539 16.5815 18.7539 16.25V11.875L14.0327 9.44125C13.9154 9.38253 13.7827 9.36216 13.6533 9.38302C13.5238 9.40388 13.4042 9.46492 13.3114 9.5575L8.67391 14.195L5.34891 11.98C5.22886 11.9001 5.08486 11.8641 4.94133 11.8783C4.7978 11.8924 4.66357 11.9557 4.56141 12.0575L1.25391 15ZM7.50391 6.875C7.50391 6.37772 7.30636 5.90081 6.95473 5.54917C6.6031 5.19754 6.12619 5 5.62891 5C5.13163 5 4.65471 5.19754 4.30308 5.54917C3.95145 5.90081 3.75391 6.37772 3.75391 6.875C3.75391 7.37228 3.95145 7.84919 4.30308 8.20083C4.65471 8.55246 5.13163 8.75 5.62891 8.75C6.12619 8.75 6.6031 8.55246 6.95473 8.20083C7.30636 7.84919 7.50391 7.37228 7.50391 6.875Z"
          :fill="fill"
        />
      </g>
      <defs>
        <clipPath id="clip0_1295_32514">
          <rect width="20" height="20" fill="white"/>
        </clipPath>
      </defs>
    </template>
  </BaseIcon>
</template>

<style scoped></style>
