azure-devops-ui/Components/TextFilterBarItem/KeywordFilterBarItem.js

React components for building web UI in Azure DevOps

import "../../CommonImports";
import "../../Core/core.css";
import * as React from "react";
import * as Resources from '../../Resources.Input';
import { TextFieldStyle, TextFieldWidth } from '../../TextField';
import { TextFilterBarItem } from "./TextFilterBarItem";
export class KeywordFilterBarItem extends TextFilterBarItem {
    getExtraTextFieldProps() {
        const placeholder = this.props.placeholder || Resources.KeywordFilterBarItemPlaceholderText;
        const label = this.props.ariaLabel || placeholder;
        return {
            prefixIconProps: { className: "keyword-filter-icon", iconName: "Filter" },
            placeholder: placeholder,
            ariaLabel: label,
            role: "searchbox"
        };
    }
}
export const InlineKeywordFilterBarItem = (props) => {
    return (React.createElement("div", { className: "flex-noshrink flex-row bolt-inline-keyword-filter-bar" },
        React.createElement(KeywordFilterBarItem, Object.assign({ clearable: true }, props, { style: TextFieldStyle.inline, width: TextFieldWidth.tabBar }))));
};