React

Import the List and ListItem components from @tmedxp/react-components.

Properties

ListProperties extends PropsWithChildren<...>.

Prop	Type	Description	Optional
hasDivider	boolean	Whether to display a divider.	✅
type	'simple' | 'multiselect'	Defines the component behavior.	✅
className	string	Additional CSS class names for styling.	✅

ListItemProperties extends AnchorHTMLAttributes<HTMLAnchorElement>.

Prop	Type	Description	Optional
iconName	IconProperties['name']	Icon name to display from the library.	✅
isSelected	boolean	Whether the list item is currently selected.	✅
label	string	The text label displayed in the anchor.	✅
showTrailingIcon	boolean	Icon displayed after the anchor label.	✅

Example

import { List, ListItem } from '@tmedxp/react-components';

const SimpleList = () => {
  return (
    <List>
      <ListItem
        key={1}
        label="FR"
        iconName="settings"
        showTrailingIcon={true}
        href="https://www.toyota.fr"
      />
      <ListItem
        key={2}
        label="BE"
        iconName="profile"
        showTrailingIcon={true}
        href="https://www.toyota.be"
      />
    </List>
  );
};

export { SimpleList };