@adaptabletools/adaptable/src/View/Components/Selectors/ColumnSelector.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 { useAdaptable } from '../../AdaptableContext';
import { MultiCombobox, SingleCombobox, } from '../../../components/Combobox';
export const ColumnSelector = function (props) {
    const { api } = useAdaptable();
    const columns = React.useMemo(() => {
        return api.columnApi.getColumnsWithDataType(props.type);
    }, []);
    const getColumn = (columnId) => columns.find((c) => c.columnId === columnId);
    const options = columns
        .map((column) => {
        const textLabel = column.friendlyName ?? column.columnId;
        const label = props.renderOption ? props.renderOption(column) : textLabel;
        return {
            label,
            textLabel,
            tooltip: textLabel,
            value: column.columnId,
        };
    })
        .filter((option) => {
        if (props.filterColumn) {
            return props.filterColumn(getColumn(option.value));
        }
        return true;
    });
    const comboBoxProps = {
        ['data-name']: 'column-selector',
        disabled: props.disabled,
        className: props.className,
        virtualized: true,
        items: options,
        showClear: false,
        showItemTooltip: true,
        onValueChange: (colId) => {
            if (colId === null) {
                return;
            }
            props.onChange(colId);
        },
        value: props.value,
        placeholder: props.placeholder ?? 'Select Column',
    };
    if (props.isMulti) {
        return _jsx(MultiCombobox, { ...comboBoxProps });
    }
    return _jsx(SingleCombobox, { ...comboBoxProps });
};