UNPKG

lucid-ui

Version:

A UI component library from AppNexus.

26 lines (25 loc) 1.64 kB
import React from 'react'; import _ from 'lodash'; import { SearchableSelect, Underline } from '../../../index'; // eslint-disable-next-line react/prop-types const OptionCols = ({ col1, col2, textMatch }) => (React.createElement("div", { style: { display: 'flex' } }, React.createElement("div", { style: { width: 100 } }, React.createElement(Underline, { match: textMatch }, col1)), React.createElement("div", null, React.createElement(Underline, { match: textMatch }, col2)))); const optionFilter = (searchText, { filterText }) => { if (filterText) { return new RegExp(_.escapeRegExp(searchText), 'i').test(filterText); } return true; }; export default class extends React.Component { render() { return (React.createElement(SearchableSelect, { optionFilter: optionFilter }, React.createElement(SearchableSelect.OptionGroup, null, React.createElement(OptionCols, { col1: 'ID', col2: 'NAME' }), React.createElement(SearchableSelect.Option, { filterText: 'Foo', Selected: 'Foo (1234)' }, ({ searchText }) => (React.createElement(OptionCols, { col1: '1234', col2: 'Foo', textMatch: searchText }))), React.createElement(SearchableSelect.Option, { filterText: 'Bar', Selected: 'Bar (2345)' }, ({ searchText }) => (React.createElement(OptionCols, { col1: '2345', col2: 'Bar', textMatch: searchText }))), React.createElement(SearchableSelect.Option, { filterText: 'Baz', Selected: 'Baz (3456)' }, ({ searchText }) => (React.createElement(OptionCols, { col1: '3456', col2: 'Baz', textMatch: searchText })))))); } }