27 lines
649 B
TypeScript
27 lines
649 B
TypeScript
import { Accessor, Index, JSX } from "solid-js";
|
|
import css from "./list.module.css";
|
|
|
|
interface ListProps<T> {
|
|
label: string;
|
|
items: T[];
|
|
class?: string;
|
|
children: (item: Accessor<T>) => JSX.Element;
|
|
}
|
|
|
|
export function List<T>(props: ListProps<T>) {
|
|
return (
|
|
<section class={`${css.container} ${props.class ?? ""}`}>
|
|
<b role="heading" class={css.heading}>
|
|
{props.label}
|
|
</b>
|
|
|
|
<sub class={css.metadata}>{props.items.length} result(s)</sub>
|
|
|
|
<ul class={css.list}>
|
|
<Index each={props.items}>
|
|
{(item) => <li>{props.children(item)}</li>}
|
|
</Index>
|
|
</ul>
|
|
</section>
|
|
);
|
|
}
|