@lunit/oui/dist/components/List/ListItem.js

Lunit Oncology UI components

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useContext } from 'react';
import { ListContext } from '../List/List';
import { StyledListItem, StyledListItemButton, StyledListItemText, StyledListItemStartSlot, StyledListItemEndSlot, CheckIcon, EmptyIcon, } from './ListItem.styled';
const ListItem = (({ 
// Root props
rootProps, className, classes, style, sx, 
// Button props
label, startElement, endElement, selected, ...props }) => {
    const { size, showCheck } = useContext(ListContext);
    const checkElement = (() => {
        if (showCheck) {
            if (selected) {
                return _jsx(CheckIcon, {});
            }
            return _jsx(EmptyIcon, {});
        }
        return null;
    })();
    return (_jsx(StyledListItem, { ...rootProps, disablePadding: true, className: className, classes: classes, style: style, sx: sx, children: _jsxs(StyledListItemButton, { ...props, disableRipple: true, component: props.component ?? 'span', size: size, selected: selected, children: [checkElement && _jsx(StyledListItemStartSlot, { children: checkElement }), startElement && _jsx(StyledListItemStartSlot, { children: startElement }), _jsx(StyledListItemText, { primary: label }), endElement && _jsx(StyledListItemEndSlot, { children: endElement })] }) }));
});
export default ListItem;