@adaptabletools/adaptable/src/components/Tag/Tag.js

Powerful AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements

import { jsx as _jsx } from "react/jsx-runtime";
import * as React from 'react';
import { cn } from '../../lib/utils';
import { twMerge } from '../../twMerge';
import { Box, Flex } from '../Flex';
const COLUMN_TAG_CLASS = 'ab-Tag--column';
export const Tag = React.forwardRef(({ variant = 'default', className, ...props }, ref) => (_jsx(Flex, { ...props, ref: ref, className: twMerge(`ab-Tag twa:text-2 twa:py-2 twa:px-2 twa:inline-flex twa:w-fit twa:rounded-standard`, variant === 'column' ? COLUMN_TAG_CLASS : 'twa:bg-primary', className), style: props.style })));
export const ColumnTag = React.forwardRef((props, ref) => _jsx(Tag, { ...props, ref: ref, variant: "column" }));
export const TagBox = (props) => {
    return (_jsx(Box, { className: cn('twa:flex twa:flex-wrap twa:flex-row twa:gap-1', props.className), children: props.children }));
};
export const TagList = (props) => {
    const TagComponent = props.variant === 'column' ? ColumnTag : Tag;
    return (_jsx(TagBox, { className: props.className, children: props.tags.map((tag, index) => (_jsx(TagComponent, { children: tag }, index))) }));
};
export function renderColumnTags(columnIds, getFriendlyName, options) {
    if (!columnIds.length) {
        return null;
    }
    return (_jsx(Flex, { flexWrap: "wrap", className: cn('twa:gap-1', options?.className), children: columnIds.map((columnId) => (_jsx(ColumnTag, { className: options?.tagClassName, children: getFriendlyName(columnId) }, columnId))) }));
}