lucid-ui
Version:
A UI component library from AppNexus.
29 lines (28 loc) • 1.8 kB
JavaScript
import React from 'react';
import _ from 'lodash';
import { SearchableMultiSelect } from '../../../index';
function P({ children, ...rest }) {
return React.createElement("p", Object.assign({}, rest), children);
}
const OptionCols = ({ col1, col2, textMatch, }) => (React.createElement("div", { style: { display: 'flex' } },
React.createElement("div", { style: { width: 100 } },
React.createElement(P, { match: textMatch }, col1)),
React.createElement("div", null,
React.createElement(P, { 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(SearchableMultiSelect, { optionFilter: optionFilter },
React.createElement(SearchableMultiSelect.OptionGroup, { Selected: '' },
React.createElement("div", { style: { marginLeft: 27 } },
React.createElement(OptionCols, { col1: 'ID', col2: 'NAME' })),
React.createElement(SearchableMultiSelect.Option, { filterText: 'Foo', Selected: 'Foo (1234)' }, ({ searchText }) => (React.createElement(OptionCols, { col1: '1234', col2: 'Foo', textMatch: searchText }))),
React.createElement(SearchableMultiSelect.Option, { filterText: 'Bar', Selected: 'Bar (2345)' }, ({ searchText }) => (React.createElement(OptionCols, { col1: '2345', col2: 'Bar', textMatch: searchText }))),
React.createElement(SearchableMultiSelect.Option, { filterText: 'Baz', Selected: 'Baz (3456)' }, ({ searchText }) => (React.createElement(OptionCols, { col1: '3456', col2: 'Baz', textMatch: searchText }))))));
}
}