968a3eefde
* ui: migrating old components -> ant * ui: moving input, tooltip, toggler, checkbox... -> Toggler\s*(.)? from 'UI * ui: more components moved * ui: move popover to ant
39 lines
976 B
JavaScript
39 lines
976 B
JavaScript
import React from 'react';
|
|
import cn from 'classnames';
|
|
import { Icon } from 'UI';
|
|
import { Tooltip } from 'antd';
|
|
import styles from './textLabel.module.css';
|
|
|
|
export default function TextLabel({
|
|
icon,
|
|
label,
|
|
minWidth = 0,
|
|
maxWidth = false,
|
|
popupLabel = false,
|
|
textTransform = '',
|
|
color = 'gray-medium',
|
|
iconColor = color,
|
|
}) {
|
|
return (
|
|
<div
|
|
className={cn('flex items-center', styles.sessionLabel)}
|
|
style={{ minWidth: `${minWidth}` }}
|
|
>
|
|
<Icon name={icon} size="16" color={iconColor} />
|
|
{popupLabel ? (
|
|
<Tooltip title={popupLabel}>
|
|
<div style={{ maxWidth: `${maxWidth}px` }} className={textTransform}>
|
|
{label}
|
|
</div>
|
|
</Tooltip>
|
|
) : (
|
|
<div
|
|
style={{ maxWidth: `${maxWidth}px`, lineHeight: '16px' }}
|
|
className={cn(`color-${color}`, textTransform)} // textTransform by tailwind
|
|
>
|
|
{label}
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|