DMC/studentportalen
1
1
Fork 0
Code Issues 24 Pull Requests 3 Actions Projects 1 Wiki Activity

List components #31

Open
stne3960 wants to merge 57 commits from list_item into main
pull from: list_item
merge into: DMC:main
Conversation 10 Commits 57 Files Changed 30 +10 -2
1 changed files with 10 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 57e895ac99 - Show all commits

12
frontend/src/components/ListItem/ListItem.tsx
View File

@ -4,6 +4,7 @@ export interface ListItemProps extends HTMLAttributes<HTMLDivElement> {
title: string; title: string;
subtitle?: string; subtitle?: string;
selected?: boolean; selected?: boolean;
focused?: boolean;
} }
const iconStyles: CSSProperties = { 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 selectedStateClasses = 'bg-base-canvas text-base-ink-placeholder';
const focusedStateClasses = 'bg-sky-100 text-primary';
export default function ListItem({ export default function ListItem({
title, title,
subtitle, subtitle,
selected = false, selected = false,
focused = false,
className = '', className = '',
...props ...props
}: ListItemProps) { }: 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 ( return (
<div <div