import type { JSX } from "solid-js";
import { splitProps } from "solid-js";

/** Props for a breadcrumbs link anchor element. */
export interface BreadcrumbsLinkProps extends JSX.AnchorHTMLAttributes<HTMLAnchorElement> {
	/** The URL the breadcrumb link navigates to. */
	href: string;
	children?: JSX.Element | undefined;
}

/** An anchor link inside a breadcrumbs item. */
export function BreadcrumbsLink(props: BreadcrumbsLinkProps): JSX.Element {
	const [local, rest] = splitProps(props, ["href", "children"]);

	return (
		<a href={local.href} {...rest}>
			{local.children}
		</a>
	);
}
