/**
 * Internal icon set — minimal inline SVGs with shared Hugeicons status glyphs.
 * Items and actions supply their own icons; these only cover the chrome
 * (search field, popover, dropdowns…).
 */

import type { SVGProps } from "react";
import { CheckIcon as CheckIconData, LoaderCircleIcon } from "@hugeicons/core-free-icons";
import { AppIcon } from "@/components/icon";

type P = SVGProps<SVGSVGElement>;

const base = {
  width: 16,
  height: 16,
  viewBox: "0 0 24 24",
  fill: "none",
  stroke: "currentColor",
  strokeWidth: 2,
  strokeLinecap: "round" as const,
  strokeLinejoin: "round" as const,
};

export function SearchIcon(props: P) {
  return (
    <svg {...base} {...props}>
      <circle cx="11" cy="11" r="7" />
      <path d="m21 21-4.35-4.35" />
    </svg>
  );
}

export function ChevronLeftIcon(props: P) {
  return (
    <svg {...base} {...props}>
      <path d="m15 18-6-6 6-6" />
    </svg>
  );
}

export function ChevronDownIcon(props: P) {
  return (
    <svg {...base} {...props}>
      <path d="m6 9 6 6 6-6" />
    </svg>
  );
}

export function ArrowRightIcon(props: P) {
  return (
    <svg {...base} {...props}>
      <path d="M5 12h14M13 6l6 6-6 6" />
    </svg>
  );
}

export function LoaderIcon(props: P) {
  return (
    <AppIcon icon={LoaderCircleIcon} width={16} height={16} {...props} />
  );
}

export function CheckIcon(props: P) {
  return (
    <AppIcon icon={CheckIconData} width={16} height={16} {...props} />
  );
}