plane/apps/app/components/ui/label-list.tsx
2023-03-02 13:29:55 +05:30

33 lines
756 B
TypeScript

import React from "react";
type IssueLabelListProps = {
labels?: (string | undefined)[];
length?: number;
showLength?: boolean;
};
export const IssueLabelList: React.FC<IssueLabelListProps> = ({
labels,
length = 5,
showLength = true,
}) => (
<>
{labels && (
<>
{labels.map((color, index) => (
<div className={`flex h-4 w-4 rounded-full ${index ? "-ml-3.5" : ""}`}>
<span
className={`h-4 w-4 flex-shrink-0 rounded-full border border-white
`}
style={{
backgroundColor: color,
}}
/>
</div>
))}
{labels.length > length ? <span>+{labels.length - length}</span> : null}
</>
)}
</>
);