@abbl/material-calendar
Version:
Calendar component build with React and Material-UI
48 lines • 1.82 kB
JavaScript
import { FormControl, MenuItem, Select } from '@material-ui/core';
import find from 'lodash/find';
import React, { useEffect, useState } from 'react';
function SelectInput(props) {
var _a = useState([]), options = _a[0], setOptions = _a[1];
var _b = useState(0), optionId = _b[0], setOptionId = _b[1];
useEffect(function () {
assignItemsId();
}, [props.options]);
useEffect(function () {
if (props.overrideOption) {
var option = getOptionBySource(props.overrideOption);
if (option && option.id !== optionId) {
setOptionId(option.id);
}
}
}, [props.overrideOption]);
function assignItemsId() {
setOptions(props.options.map(function (inputItem, index) {
inputItem.id = index;
return inputItem;
}));
}
function handleChange(event) {
var id = event.target.value;
setOptionId(id);
if (props.onInputChange) {
var selectInputValue = find(options, { id: id });
if (selectInputValue) {
props.onInputChange(selectInputValue.source);
}
}
}
function getOptionBySource(source) {
var option = find(options, { source: source });
if (option) {
return option;
}
return undefined;
}
function renderMenuOptions() {
return options.map(function (inputItem) { return (React.createElement(MenuItem, { key: inputItem.id, value: inputItem.id }, inputItem.name)); });
}
return (React.createElement(FormControl, null,
React.createElement(Select, { value: optionId, margin: "dense", onChange: handleChange, variant: props.variant }, renderMenuOptions())));
}
export default SelectInput;
//# sourceMappingURL=SelectInput.js.map