All files / src/components/ui/icons ChevronDownIcon.tsx

100% Statements 35/35
100% Branches 1/1
100% Functions 1/1
100% Lines 35/35

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 361x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x 839x  
/**
 * ChevronDownIcon - Downward chevron/arrow icon
 * Commonly used for dropdown menus, expandable sections, and sorting indicators
 *
 * @example
 * ```tsx
 * <ChevronDownIcon /> // Default 16x16
 * <ChevronDownIcon width={24} height={24} />
 * <ChevronDownIcon className="rotate-180" /> // Points up
 * ```
 */
export default function ChevronDownIcon({
  width = 16,
  height = 16,
  className = '',
  ...props
}: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      {...props}
      className={className}
      width={width}
      height={height}
      viewBox="0 0 16 16"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      stroke="currentColor"
      strokeWidth={1.5}
      strokeLinecap="round"
      strokeLinejoin="round"
    >
      <path d="M3.5 6L8 10.5L12.5 6" fill="none" />
    </svg>
  );
}