# give/4.16.9/src/Views/Components/Select/index.js

GiveWP – Donation Plugin and Fundraising Platform, version 4.16.9. 32 lines.

- Page: https://pluginprobe.com/plugins/give/4.16.9/code/src/Views/Components/Select/index.js
- Raw: https://pluginprobe.com/plugins/give/4.16.9/raw/src/Views/Components/Select/index.js
- Modified: 2021-11-23T23:55:18+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/give/4.16.9/code/src/Views/Components/Select/index.js#L10-L20`.

```javascript
import PropTypes from 'prop-types';
import classNames from 'classnames';

import style from './style.module.scss';

const Select = ({options, onChange, defaultValue, className, ...rest}) => {
    const optionElements = options.map((option) => (
        <option key={option.value} value={option.value}>
            {option.label}
        </option>
    ));
    return (
        <div key={defaultValue} className={classNames(style.select, className)}>
            <select onChange={onChange} defaultValue={defaultValue} {...rest}>
                {optionElements}
            </select>
        </div>
    );
};

Select.propTypes = {
    // Array of objects with labels and values defining select options (ex: {label: Option A, value: option-a})
    options: PropTypes.array.isRequired,
    // Fired on select change event
    onChange: PropTypes.func,
    // Default value of select element
    defaultValue: PropTypes.string.isRequired,
    // Additional class
    className: PropTypes.string,
};
export default Select;

```
