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

Lunit Oncology UI components

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { createContext, useMemo } from 'react';
import { ArrowDownSm, ArrowUpSm } from '../../icons';
import { Collapse } from '@mui/material';
import { MuiList, MuiListSubheader } from './List.styled';
export const ListContext = createContext({
    size: 'small',
    showCheck: false,
});
const List = ({ size = 'small', showCheck = false, subheader, subheaderType = 'bold', open = 'visible', children, onOpen, onClose, ...props }) => {
    const contextValue = useMemo(() => ({ size, showCheck }), [size, showCheck]);
    const collapsible = open !== 'visible';
    const onSubheaderClick = ((event) => {
        if (open === 'visible') {
            return;
        }
        const handler = open ? onClose : onOpen;
        handler?.(event);
    });
    return (_jsx(ListContext.Provider, { value: contextValue, children: _jsx(MuiList, { ...props, subheader: subheader ? (_jsxs(MuiListSubheader, { type: subheaderType, clickable: collapsible, tabIndex: collapsible ? 0 : undefined, onClick: onSubheaderClick, children: [subheader, collapsible && (open ? _jsx(ArrowDownSm, {}) : _jsx(ArrowUpSm, {}))] })) : null, children: collapsible ? (_jsx(Collapse, { in: open, timeout: "auto", unmountOnExit: true, children: children })) : (children) }) }));
};
export default List;