import React, { ForwardedRef, useContext } from 'react';
import { OriginIconProps } from '../type';
import { Context } from '../context';

function IconUnpinComponent(props: OriginIconProps, ref: ForwardedRef<SVGSVGElement>) {
    const { prefix: prefixFromContext } = useContext(Context);
    const { className = '', prefix: prefixFromProps, width = '1em', height = '1em', useCurrentColor = true, spin, ...rest } = props;

    const prefix = prefixFromProps || prefixFromContext || 'hiagent';
    const loadingKls = spin ? ` ${prefix}-icon-loading` : '';
    return <svg className={`${prefix}-icon ${prefix}-icon-unpin${loadingKls} ${className}`} width={width} height={height} xmlns="http://www.w3.org/2000/svg" fill={useCurrentColor ? 'currentColor' : '#000'} viewBox="0 0 16 16" {...rest} ref={ref}><path d="M5.43756 6.78946C4.69696 6.85556 4.37482 7.02214 4.20905 7.22403C4.18988 7.24521 4.17468 7.27037 4.1651 7.29727C4.15568 7.3239 4.152 7.35207 4.15338 7.38028C4.15484 7.4088 4.16161 7.4375 4.17389 7.46329C4.18615 7.48894 4.20355 7.51164 4.22467 7.53067L8.46588 11.7699C8.56052 11.8638 8.70226 11.8805 8.80475 11.7699C9.05336 11.5033 9.16225 11.2166 9.20807 10.6928L10.2178 11.7377C10.0979 12.0853 9.92333 12.3667 9.67194 12.6176H9.65338C9.5201 12.7519 9.36125 12.8583 9.18658 12.9311C9.01186 13.0038 8.8241 13.0414 8.63483 13.0414C8.44576 13.0414 8.25859 13.0037 8.08405 12.9311C7.90944 12.8583 7.7505 12.7518 7.61725 12.6176L5.92487 10.933L3.03522 13.8227C2.79991 14.0585 2.40394 14.0585 2.16803 13.8227C1.93285 13.5875 1.95057 13.1937 2.18561 12.9584L5.06451 10.0805L3.37506 8.37833C3.24064 8.24517 3.13343 8.08616 3.06061 7.91153C2.9879 7.73704 2.95027 7.54978 2.95026 7.36075C2.95026 7.17155 2.98779 6.98362 3.06061 6.80899C3.13343 6.63447 3.24071 6.47626 3.37506 6.34317V6.32462C3.65635 6.04337 3.99932 5.85796 4.42291 5.73965L5.43756 6.78946ZM10.4522 9.53458C10.4492 9.61177 10.4454 9.69074 10.4454 9.77188C10.4454 10.3252 10.4208 10.7802 10.3585 11.1645L9.23639 10.0023C9.2371 9.92913 9.23932 9.85271 9.23932 9.77286C9.23932 9.28453 9.2778 8.84217 9.37897 8.42422L10.4522 9.53458ZM8.55084 3.24454C8.92919 2.39216 9.89922 1.82863 10.7842 2.12247C11.5032 2.36354 12.1557 2.77055 12.6885 3.30997C13.2282 3.84223 13.6357 4.49382 13.877 5.21231C14.1675 6.08755 13.6269 7.04819 12.7911 7.4379C12.3273 7.65406 11.8463 7.67311 11.2169 7.48868C10.838 7.94125 10.6266 8.37966 10.5245 8.88907L9.5528 7.88419C9.76493 7.35837 10.1034 6.85772 10.627 6.33438C10.8104 6.15104 11.1019 6.10777 11.3311 6.22891C11.7459 6.44714 12.0452 6.48594 12.3956 6.2836C12.6976 6.10908 12.8012 5.72317 12.668 5.40079C12.4677 4.9164 12.1638 4.51814 11.8223 4.17715C11.485 3.83983 11.0472 3.52096 10.585 3.32852C10.2775 3.20071 9.91315 3.30285 9.73834 3.58633C9.52387 3.93449 9.55907 4.23175 9.78619 4.68594C9.90204 4.9182 9.85693 5.19982 9.67291 5.38321C9.1556 5.8682 8.68697 6.2113 8.15143 6.43399L7.21783 5.46719C7.66217 5.36693 8.03891 5.16816 8.5235 4.7963C8.32978 4.21625 8.33799 3.72418 8.55084 3.24454ZM7.62311 6.60684C7.21796 6.70887 6.76417 6.75862 6.22272 6.75821C6.18222 6.75819 6.14251 6.7598 6.10358 6.76016L5.00787 5.6254C5.36584 5.57775 5.76984 5.55704 6.2276 5.55704C6.35968 5.55704 6.48307 5.55325 6.59967 5.54727L7.62311 6.60684Z"/><path d="M3.92575 4.50562L3.85004 4.41039C3.7004 4.1749 3.73187 3.8592 3.94036 3.65777C4.14885 3.45635 4.46545 3.43577 4.69564 3.59343L4.78821 3.67238L12.4312 11.5834C12.6615 11.8217 12.655 12.201 12.4166 12.4312C12.1783 12.6615 11.799 12.6549 11.5688 12.4166L3.92575 4.50562Z"/></svg>;
}

const IconUnpin = React.forwardRef(IconUnpinComponent);
export default IconUnpin;
