@unicity/design-system
Version:
A comprehensive React component library built on Material-UI with advanced theming capabilities including neumorphism design support
22 lines • 1.47 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from 'react';
import { ListItemButton, ListItemIcon, ListItemText, ListItemAvatar, Divider, } from '@mui/material';
import { StyledList, StyledListItem } from './List.style';
export const List = ({ items, dense = false, disablePadding = false, selectedId, onItemClick, children, ...props }) => {
const handleItemClick = (item) => {
if (item.onClick) {
item.onClick();
}
if (onItemClick) {
onItemClick(item.id, item);
}
};
if (children) {
return (_jsx(StyledList, { dense: dense, disablePadding: disablePadding, ...props, children: children }));
}
if (!items) {
return null;
}
return (_jsx(StyledList, { dense: dense, disablePadding: disablePadding, ...props, children: items.map((item, index) => (_jsxs(React.Fragment, { children: [_jsx(StyledListItem, { disablePadding: !item.icon && !item.avatar, children: _jsxs(ListItemButton, { selected: selectedId === item.id || item.selected, disabled: item.disabled, onClick: () => handleItemClick(item), dense: dense, children: [item.icon && (_jsx(ListItemIcon, { children: item.icon })), item.avatar && (_jsx(ListItemAvatar, { children: item.avatar })), _jsx(ListItemText, { primary: item.primary, secondary: item.secondary })] }) }), item.divider && index < items.length - 1 && _jsx(Divider, {})] }, item.id))) }));
};
//# sourceMappingURL=List.js.map