<commit_before>import React, { Component } from "react";
import Downshift from "downshift";

import types from "@appbaseio/reactivecore/lib/utils/types";

import { suggestionsContainer, suggestions } from "../../styles/Input";
import Select from "../../styles/Select";
import Chevron from "../../styles/Chevron";

class Dropdown extends Component {
	constructor(props) {
		super(props);

		this.state = {
			isOpen: false
		};
	}

	toggle = () => {
		this.setState({
			isOpen: !this.state.isOpen
		});
	};

	close = () => {
		this.setState({
			isOpen: false
		});
	};

	onChange = (item) => {
		this.props.onChange(item.key);

		if (!this.props.multi) {
			this.setState({
				isOpen: false
			});
		}
	};

	handleStateChange = (changes) => {
		const { isOpen, type } = changes;
		if (type === Downshift.stateChangeTypes.mouseUp) {
			this.setState({
				isOpen
			});
		}
	};

	render() {
		const { items, selectedItem, placeholder } = this.props;

		return (<Downshift
			selectedItem={selectedItem}
			onChange={this.onChange}
			onOuterClick={this.close}
			onStateChange={this.handleStateChange}
			isOpen={this.state.isOpen}
			render={({
				getRootProps,
				getButtonProps,
				getItemProps,
				isOpen,
				highlightedIndex
			}) => {
				let selected = selectedItem;

				if (this.props.multi) {
					selected = Object.keys(selectedItem)
						.filter(item => !!selectedItem[item])
						.join(", ");
				}

				return (<div {...getRootProps()} className={suggestionsContainer}>
					<Select
						{...getButtonProps()}
						onClick={this.toggle}
					>
						{selected ? selected : placeholder}
						<Chevron open={isOpen} />
					</Select>
					{
						isOpen && items.length
							? (<div className={suggestions}>
								<ul>
									{
										items
											.map((item, index) => (
												<li
													{...getItemProps({ item })}
													key={item.key}
													style={{
														backgroundColor: highlightedIndex === index ? "#eee" : "#fff"
													}}
												>
													{item.key}
												</li>
											))
									}
								</ul>
							</div>)
							: null
					}
				</div>);
			}}
		/>);
	}
}

Dropdown.propTypes = {
	items: types.data,
	selectedItem: types.any,
	onChange: types.func,
	placeholder: types.placeholder,
	multi: types.multiSelect
}

export default Dropdown;<commit_msg>update proptype for selectedItem in drodown<commit_after>import React, { Component } from "react";
import Downshift from "downshift";

import types from "@appbaseio/reactivecore/lib/utils/types";

import { suggestionsContainer, suggestions } from "../../styles/Input";
import Select from "../../styles/Select";
import Chevron from "../../styles/Chevron";

class Dropdown extends Component {
	constructor(props) {
		super(props);

		this.state = {
			isOpen: false
		};
	}

	toggle = () => {
		this.setState({
			isOpen: !this.state.isOpen
		});
	};

	close = () => {
		this.setState({
			isOpen: false
		});
	};

	onChange = (item) => {
		this.props.onChange(item.key);

		if (!this.props.multi) {
			this.setState({
				isOpen: false
			});
		}
	};

	handleStateChange = (changes) => {
		const { isOpen, type } = changes;
		if (type === Downshift.stateChangeTypes.mouseUp) {
			this.setState({
				isOpen
			});
		}
	};

	render() {
		const { items, selectedItem, placeholder } = this.props;

		return (<Downshift
			selectedItem={selectedItem}
			onChange={this.onChange}
			onOuterClick={this.close}
			onStateChange={this.handleStateChange}
			isOpen={this.state.isOpen}
			render={({
				getRootProps,
				getButtonProps,
				getItemProps,
				isOpen,
				highlightedIndex
			}) => {
				let selected = selectedItem;

				if (this.props.multi) {
					selected = Object.keys(selectedItem)
						.filter(item => !!selectedItem[item])
						.join(", ");
				}

				return (<div {...getRootProps()} className={suggestionsContainer}>
					<Select
						{...getButtonProps()}
						onClick={this.toggle}
					>
						{selected ? selected : placeholder}
						<Chevron open={isOpen} />
					</Select>
					{
						isOpen && items.length
							? (<div className={suggestions}>
								<ul>
									{
										items
											.map((item, index) => (
												<li
													{...getItemProps({ item })}
													key={item.key}
													style={{
														backgroundColor: highlightedIndex === index ? "#eee" : "#fff"
													}}
												>
													{item.key}
												</li>
											))
									}
								</ul>
							</div>)
							: null
					}
				</div>);
			}}
		/>);
	}
}

Dropdown.propTypes = {
	items: types.data,
	selectedItem: types.selectedValue,
	onChange: types.func,
	placeholder: types.placeholder,
	multi: types.multiSelect
}

export default Dropdown;
{'fraction_non_alphanumeric': 0.15630252100840336, 'fraction_numerical': 0.0, 'mean_word_length': 2.252049180327869, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 41, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2881963', 'n_tokens_mistral': 2163, 'n_tokens_neox': 1525, 'n_words': 288}