List components #31

Open
stne3960 wants to merge 57 commits from list_item into main
Showing only changes of commit 57e895ac99 - Show all commits

View File

@ -4,6 +4,7 @@ export interface ListItemProps extends HTMLAttributes<HTMLDivElement> {
title: string;
subtitle?: string;
selected?: boolean;
focused?: boolean;
}
const iconStyles: CSSProperties = {
@ -34,16 +35,23 @@ const defaultStateClasses = 'bg-base-canvas text-base-ink-strong hover:bg-sky-10
const selectedStateClasses = 'bg-base-canvas text-base-ink-placeholder';
const focusedStateClasses = 'bg-sky-100 text-primary';
export default function ListItem({
title,
subtitle,
selected = false,
focused = false,
className = '',
...props
}: ListItemProps) {
const stateClasses = selected ? selectedStateClasses : defaultStateClasses;
const getStateClasses = () => {
if (selected) return selectedStateClasses;
if (focused) return focusedStateClasses;
return defaultStateClasses;
};
const classes = [baseClasses, stateClasses, className].filter(Boolean).join(' ');
const classes = [baseClasses, getStateClasses(), className].filter(Boolean).join(' ');
return (
<div