25 lines
No EOL
938 B
TypeScript
25 lines
No EOL
938 B
TypeScript
import React from 'react';
|
|
|
|
interface Props {
|
|
filter: any;
|
|
isHorizontal?: boolean;
|
|
}
|
|
function FunnelStepText(props: Props) {
|
|
const { filter } = props;
|
|
const total = filter.value.length;
|
|
const additionalStyle = props.isHorizontal ? { whiteSpace: 'nowrap', maxWidth: 210, textOverflow: 'ellipsis', overflow: 'hidden' } : {};
|
|
return (
|
|
<div className="color-gray-medium" style={additionalStyle}>
|
|
<span className="color-gray-darkest">{filter.label}</span>
|
|
<span className="mx-1">{filter.operator}</span>
|
|
{filter.value.map((value: any, index: number) => (
|
|
<span key={index}>
|
|
<span key={index} className="font-medium color-gray-darkest">{value}</span>
|
|
{index < total - 1 && <span className="mx-1 color-gray-medium">or</span>}
|
|
</span>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default FunnelStepText; |