uniforms-react-semantic/src/SelectField.js

Semantic React UI components for uniforms.

/**
 * Created by cesar on 4/9/17.
 */
import React        from 'react';
import PropTypes        from 'prop-types';
import connectField from 'uniforms/connectField';
import {Select as SelectInput}  from 'semantic-ui-react'
import filterSemanticProps from './filterSemanticProps'
import Wrapper from "./Wrapper";


const Select = ({
                    additionLabel,
                    additionPosition,
                    allowAdditions,
                    as,
                    basic,
                    button,
                    children,
                    className,
                    closeOnBlur,
                    closeOnChange,
                    compact,
                    defaultOpen,
                    defaultSelectedLabel,
                    defaultValue,
                    disabled,
                    error,
                    floating,
                    fluid,
                    header,
                    icon,
                    inline,
                    item,
                    labeled,
                    loading,
                    minCharacters,
                    multiple,
                    noResultsMessage,
                    onAddItem,
                    onBlur,
                    onChange,
                    onClick,
                    onClose,
                    onFocus,
                    onLabelClick,
                    onMouseDown,
                    onOpen,
                    onSearchChange,
                    open,
                    openOnFocus,
                    options,
                    placeholder,
                    pointing,
                    renderLabel,
                    scrolling,
                    search,
                    searchInput,
                    selectOnBlur,
                    selectedLabel,
                    selection,
                    simple,
                    tabIndex,
                    text,
                    trigger,
                    upward,
                    value,

                    label,
                    errorMessage,
                    showInlineError,

                    ...props,
                }) => (
    <Wrapper showInlineError={showInlineError} errorMessage={errorMessage} error={error} label={label}>
        <SelectInput
            {...filterSemanticProps(props)}

            additionLabel={additionLabel}
            additionPosition={additionPosition}
            allowAdditions={allowAdditions}
            as={as}
            basic={basic}
            button={button}
            children={children}
            className={className}
            closeOnBlur={closeOnBlur}
            closeOnChange={closeOnChange}
            compact={compact}
            defaultOpen={defaultOpen}
            defaultSelectedLabel={defaultSelectedLabel}
            defaultValue={!value ? defaultValue : undefined}
            disabled={disabled}
            error={!!error}
            floating={floating}
            fluid={fluid}
            header={header}
            icon={icon}
            inline={inline}
            item={item}
            labeled={labeled}
            loading={loading}
            minCharacters={minCharacters}
            multiple={multiple}
            noResultsMessage={noResultsMessage}
            onAddItem={onAddItem}
            onBlur={onBlur}
            onClick={onClick}
            onClose={onClose}
            onFocus={onFocus}
            onLabelClick={onLabelClick}
            onMouseDown={onMouseDown}
            onOpen={onOpen}
            onSearchChange={onSearchChange}
            open={open}
            openOnFocus={openOnFocus}
            options={options}
            placeholder={placeholder}
            pointing={pointing}
            renderLabel={renderLabel}
            scrolling={scrolling}
            search={search}
            searchInput={searchInput}
            selectOnBlur={selectOnBlur}
            selectedLabel={selectedLabel}
            selection={selection}
            simple={simple}
            tabIndex={tabIndex}
            text={text}
            trigger={trigger}
            upward={upward}
            value={value}

            onChange={(event, data) => {
                onChange(data.value)
            }}
        />
    </Wrapper>
)


Select.propTypes = {
    errorMessage: PropTypes.string,
    showInlineError: PropTypes.bool,
    errorLabel: PropTypes.element,
    ...SelectInput.propTypes

}


export default connectField(Select, {
    includeInChain: false,
});