import { truncate } from 'lodash';
import * as React from 'react';
import { queryIndexOfScope } from './helpers';
export class FilterChip extends React.PureComponent {
    constructor() {
        super(...arguments);
        this.onMouseDown = event => {
            // prevent clicking on chips from taking focus away from the search input.
            event.preventDefault();
        };
        this.onClick = event => {
            event.preventDefault();
            this.props.onFilterChosen(event.currentTarget.value);
        };
    }
    render() {
        const truncatedValue = truncate(this.props.value, { length: 50 });
        return (React.createElement("button", { className: `btn btn-sm filter-chip ${!!this.props.count ? 'filter-chip-repo' : ''}` +
                (this.isScopeSelected(this.props.query, this.props.value) ? ' filter-chip--selected' : ''), value: this.props.value, title: this.renderTooltip(this.props.value !== truncatedValue), onMouseDown: this.onMouseDown, onClick: this.onClick },
            React.createElement("div", null,
                this.props.name || truncatedValue,
                !!this.props.count && (React.createElement("span", { className: `filter-chip__count ${this.isScopeSelected(this.props.query, this.props.value)
                        ? ' filter-chip__count--selected'
                        : ''}` },
                    this.props.count,
                    this.props.limitHit ? '+' : '')))));
    }
    renderTooltip(valueIsTruncated) {
        if (this.isScopeSelected(this.props.query, this.props.value)) {
            return 'Already added to query';
        }
        // Show filter value in tooltip if chip shows truncated value or scope name
        if (this.props.name || valueIsTruncated) {
            return this.props.value;
        }
        return undefined;
    }
    isScopeSelected(query, scope) {
        return queryIndexOfScope(query, scope) !== -1;
    }
}
//# sourceMappingURL=FilterChip.js.map