28 lines
869 B
TypeScript
28 lines
869 B
TypeScript
import React from 'react';
|
|
import { BubbleItemProps } from '../../../types/list/types';
|
|
import styles from './bubbleItem.module.scss';
|
|
|
|
const BubbleItem: React.FC<BubbleItemProps> = ({
|
|
option,
|
|
isSelected,
|
|
size,
|
|
disabled,
|
|
onClick,
|
|
itemClassName
|
|
}) => {
|
|
return (
|
|
<button
|
|
className={`${styles.bubbleOption} ${size} ${isSelected ? styles.selected : ''} ${
|
|
option.disabled || disabled ? styles.disabled : ''
|
|
} ${itemClassName ? itemClassName : ''}`}
|
|
onClick={() => onClick(option)}
|
|
disabled={option.disabled || disabled}
|
|
>
|
|
{option.icon && <span className={ styles.bubbleIcon}>{option.icon}</span>}
|
|
<span className={styles.bubbleLabel}>{option.label}</span>
|
|
{option.description && <span className={ styles.bubbleDescription}>{option.description}</span>}
|
|
</button>
|
|
);
|
|
};
|
|
|
|
export default BubbleItem; |