lucid-ui
Version:
A UI component library from AppNexus.
77 lines • 3.23 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var lodash_1 = __importDefault(require("lodash"));
var react_1 = __importDefault(require("react"));
var create_react_class_1 = __importDefault(require("create-react-class"));
var index_1 = require("../../../index");
var Option = index_1.SearchableSingleSelect.Option;
var allData = {
100: { name: 'Rita Daniel' },
101: { name: 'Meghan Mcgowan' },
102: { name: 'Latisha Kent' },
103: { name: 'Jeannine Horton' },
104: { name: 'Noreen Joyner' },
105: { name: 'Angelique Head' },
106: { name: 'Kim Salinas' },
107: { name: 'Alexis Small' },
108: { name: 'Fernandez Singleton' },
109: { name: 'Jacqueline Alvarado' },
110: { name: 'Cornelia Roman' },
111: { name: 'John Gonzales' },
112: { name: 'Mcleod Hodge' },
113: { name: 'Fry Barrera' },
114: { name: 'Jannie Compton' },
115: { name: 'June Odom' },
116: { name: 'Rose Foster' },
117: { name: 'Kathryn Prince' },
118: { name: 'Hebert Bowman' },
119: { name: 'Shawn Burgess' },
};
exports.default = create_react_class_1.default({
getInitialState: function () {
return {
selectedId: null,
visibleIds: [],
isLoading: false,
};
},
componentDidMount: function () {
this.handleSearch('');
},
handleSearch: function (searchText) {
var _this = this;
this.setState({ isLoading: true });
// Fake an API call
setTimeout(function () {
var visibleIds = lodash_1.default.reduce(allData, function (acc, _a, id) {
var name = _a.name;
return lodash_1.default.includes(name.toLowerCase(), searchText.toLowerCase())
? acc.concat(id)
: acc;
}, []);
_this.setState({
visibleIds: visibleIds,
isLoading: false,
});
}, 750);
},
handleSelect: function (index, event) {
this.setState({
selectedId: lodash_1.default.get(event, 'props.callbackId', null),
});
},
render: function () {
var _a = this.state, isLoading = _a.isLoading, visibleIds = _a.visibleIds, selectedId = _a.selectedId;
var selectedIndex = lodash_1.default.indexOf(visibleIds, selectedId) === -1
? null
: lodash_1.default.indexOf(visibleIds, selectedId);
return (react_1.default.createElement("section", null,
react_1.default.createElement(index_1.SearchableSingleSelect, { hasSelections: false, isLoading: isLoading, onSelect: this.handleSelect, onSearch: this.handleSearch, selectedIndex: selectedIndex, optionFilter: lodash_1.default.constant(true), SearchField: {
placeholder: 'Type here to simulate an API backed search',
} }, lodash_1.default.map(visibleIds, function (id) { return (react_1.default.createElement(Option, { key: id, callbackId: id }, allData[id].name)); }))));
},
});
//# sourceMappingURL=03.asynchronous.js.map