- added;
inputRenderer
prop, allows you to override the input component, thanks Sean Burke - added;
openOnFocus
prop, causes the menu to always open when the select control is focused, thanks HuysentruytRuben - added;
react-virtualised-select
HOC example, thanks Brian Vaughn - added;
tabSelectsValue
prop can be set to false to prevent selection of focused option when tab is pressed, thanks Byron Anderson - added; ability to override
resetValue
when clearing the control, thanks Alexander Luberg - added; input can be updated with
onInputChange
, thanks Brett DeWoody - added; Styles for .is-selected class, thanks Danny Herran
- fixed;
noResultsText
prop type is nowstringOrNode
for Async component, thanks Michael Groeneman - fixed;
onInputChange
is wrapped by Async component, thanks Eric O'Connell - fixed;
scrollMenuIntoView
behaviour in IE10, thanks Ivan Jager - fixed; isEqualNode replaced with strict equality check, thanks Alexandre Balhier
- fixed; issue with value object not being passed to
handleRequired
, thanks Andrew Hite - fixed; the menu-outer container is no longer rendered when it does not contain anything, thanks Kuan
- improved; better support for IE8 in styles, thanks Rockallite Wulf
- added;
menuRenderer
method and example for effeciently rendering thousands of options, thanks Brian Vaughn - added;
optionClassName
prop, thanks Max Tyler
- updated dependencies to allow use with React 15.x
- changed; multiple selected values are now submitted using multiple inputs, thanks Trinh Hoang Nhu
- added;
joinValues
prop to revert the above change and submit multiple values in a single field with the delimiter
- fixed build issues with v1.0.0-beta9
- added; onBlurResetsInput prop, thanks Sly Bridges
- changed; Enter selects and retains focus, Tab selects and shifts focus, thanks RDX
- fixed; Hide noResultsText when value is falsy, thanks Fernando Alex Helwanger
- added;
required
prop, adds HTML5 required attribute, thanks Domenico Matteo - fixed; Touch drag behaviour, thanks Pavel Tarnopolsky
- added;
onOpen
andonClose
event props, thanks Jacob Page - fixed; Pressing Enter on open Select should stop propagation, thanks Jeremy Liberman
- fixed; Missing handleMouseDownOnMenu, thanks Jeremy Liberman
- added; Ensures the selected option is immediately visible when the menu is open, thanks Martin Jujou
- added;
autoBlur
prop, blurs the input when a value is selected, thanks Pavel Tarnopolsky - fixed; Several isFocused checks weren't working properly
- fixed; input focus bug when toggling
disabled
prop, thanks Davide Curletti - fixed;
focus()
is now exposed on theAsync
component, thanks AugustinLF
- You can now use React elements for placeholders and the text props, thanks kromit and Alyssa Biasi
- Fixed a problem where the border doesn't show when the element is inside a table, thanks Rodrigo Boratto
- New prop
scrollMenuIntoView
scrolls the viewport to display the menu, thanks Alexander Zaharakis - New LESS / SCSS variable
select-option-bg
lets you control the menu option background color, thanks Evan Goldenberg - Fixed an error in the blur handler on IE when the menu is not visible, thanks Gaston Sanchez
- Added support for a
clearableValue
option property inmulti
mode, thanks Sly Bridges
- Test suite complete and passing, with a couple of minor fixes thanks to @bruderstein
- Fixes issues relating to serializing simple values into the hidden field
- New default styles that match Elemental UI and look right at home in the new KeystoneJS Admin UI
We're potentially going to ship some theme stylesheets in the future, shout out on GitHub if this interests you.
- The selected value populated in the hidden field has been fixed (was
"[object Object]"
before) - Added new
autofocus
prop - Fixed duplicate key error for options and values with duplicate
value
properties - SCSS variables now have
!default
so you can override them
Changed since beta 1:
- Async options cache works again
- New style props for custom styling the component without modifying css classes:
style
wrapperStyle
menuStyle
menuContainerStyle
- The menu opens and closes correctly when
searchable={false}
, there is still some work to do on this use-case
This is a complete rewrite. Major changes include:
- Everything is simpler (I'm nearly done and the source code is only 60% of the size of the last version)
- No more timeouts or weird handlers, the restructuring has let me make everything more straight-forward
- The options array is no longer preprocessed into state, just retrieved from props
- The values array is now initialised in the Options array during render, and not stored in state, which along with the change to options makes the component more reliable and fixes issues with props not updating correctly
- The component no longer stores its own value in state (ever) - it needs to be passed as a prop and handled with
onChange
. - Complex values are now enabled by default (so you're passed the option object, not its value); you can enable the legacy mode with a prop
- The Value and Option components have been cleaned up as well for consistency
- The hidden
<input>
field is now optional and the component is better suited to use in a rich React.js app than it was - You can disable options filtering to do the filtering externally with
onInputChange
- Accents on characters can now be ignored
- The
asyncOptions
prop has been replaced by a new wrapper component:Select.Async
Note that "Tag mode" (creating options on the fly) isn't reimplemented yet.
A full guide to the breaking changes and new features will be written up soon. In the meantime please see the new examples.
- added; new Contributors example w/ async options loading and custom value / label keys
- fixed; several issues with custom
valueKey
andlabelKey
props - fixed; autoload now loads options with no search input
- added; SCSS stylesheets!
- improved; Options rendering should be more performant
- breaking change; Custom
Option
components now need to pass theiroption
prop to event handlers; see this commit for an example of the required change.
- fixed; LESS math operations now work with --strict-math=on, thanks Vincent Fretin
- fixed; IE issue where clicking the scrollbar would close the menu, thanks Pete Nykänen
- added; Promise support for
loadAsyncOptions
, thanks Domenico Matteo
- fixed;
loadAsyncOptions
raises TypeError in setup, see #439 for details, thanks Pancham Mehrunkar
This release contains significant DOM structure and CSS improvements by @jossmac, including:
- no more
position: absolute
for inner controls display: table
is used for layout, which works in IE8 and above, and all other modern browsers- less "magic numbers" used for layout, should fix various browser-specific alignment issues
- clear "x" control now animates in
- clearer
.Select--multi
className replaces.Select.is-multi
- new height & theme variables
- "dropdown" indicator chevron is no longer displayed for multi-select controls
There are no functional changes, but if you've forked the LESS / CSS to create your own theme you'll want to pay close attention to PR #527 when upgrading to this version.
React Select is updated for React 0.14. If you're still using React 0.13, please continue to use [email protected]
. There are no functional differences between v0.7.0 and v0.6.12.
Additionally, our tests now require Node.js 4.x. If you are developing react-select
, please make sure you are running the latest version of node.
Thanks to @bruderstein, @dmatteo and @hull for their help getting these updates shipped!
- added;
labelKey
andvalueKey
props, so you can now use different keys inoption
objects for the label and value - fixed; additional
isMounted()
checks in timeouts - fixed; componentDidUpdate timeout is reset correctly, see #208 and #434, thanks Petr Gladkikh
- fixed; mousedown event on scrollbar in menu no longer hides it, thanks Yishai Burt
- added;
isLoading
prop, allows indication of async options loading in situations where more control is required, thanks Jon Gautsch
- fixed; a build issue with the previous release that prevented the stylesheet being generated / included
- fixed; a LESS syntax issue, thanks Bob Cardenas
- added;
style
key for package.json, thanks Stephen Wan - added;
onInputChange
handler that returns the current input value, thanks Tom Leslie - fixed; simplifying handleKey function & preventDefault behaviour, thanks davidpene
- fixed; Display spinner while auto-loading initial data, thanks Ben Jenkinson
- fixed; better support for touch events, thanks Montlouis-Calixte Stéphane
- fixed; prevent value splitting on non-multi-value select, thanks Alan R. Soares
- fixed; broader range of allowed prereleases for React 0.14, including rc1
- fixed; preventing backspace from navigating back in the browser history, thanks davidpene
- fixed; missing styles for
.Select-search-prompt
and.Select-searching
issues, thanks Jaak Erisalu and davidpene
- fixed; issue in Chrome where clicking the scrollbar would close the menu, thanks Vladimir Matsola
- fixed; completely ignores clicks on disabled items, unless the target of the click is a link, thanks Ben Stahl
This release includes a huge improvement to the examples / website thanks to @jossmac. Also:
- added; support for React 0.14 beta3
- fixed; disabled options after searching, thanks @bruderstein
- added; support for "Searching..." text (w/ prop) while loading async results, thanks @bruderstein and @johnomalley
- added;
className
,style
andtitle
keys are now supported in option properties, thanks @bruderstein
Otherwise known as "the real 0.6.2" this includes the updated build for the last version; sorry about that!
- changed; if the
searchable
prop isfalse
, the menu is opened or closed on click, more like a standard Select input. thanks MaaikeB
- added; Support for options with numeric values, thanks Dave Brotherstone
- changed; Disabled options now appear in the search results , thanks Dave Brotherstone
- fixed; asyncOptions are reloaded on componentWillReceiveProps when the value has changed, thanks Francis Cote
- added;
cacheAsyncResults
prop (defaulttrue
) now controls whether the internal cache is used forasyncOptions
- improved; option, value and single value have been split out into their own components, and can be customised with props. see #328 for more details.
- improved; Near-complete test coverage thanks to the awesome work of Dave Brotherstone
- improved; Support all alpha/beta/rc's of React 0.14.0, thanks Sébastien Lorber
- fixed; Close multi-select menu when tabbing away, thanks Ben Alpert
- fixed; Bug where Select shows the value instead of the label (reapplying fix)
- fixed;
valueRenderer
now works whenmulti={false}
, thanks Chris Portela - added; New property
backspaceRemoves
(defaulttrue
), allows the default behaviour of removing values with backspace whenmulti={true}
, thanks Leo Lehikoinen
- fixed; Allow entering of commas when allowCreate is on but multi is off, thanks Angelo DiNardi
- fixed; Times (clear) character is now rendered from string unicode character for consistent output, thanks Nibbles
- fixed; allowCreate bug, thanks goodzsq
- fixed; changes to props.placeholder weren't being reflected correctly, thanks alesn
- fixed; error when escape is pressedn where
clearValue
was not passed the event, thanks Mikhail Kotelnikov - added; More tests, thanks Dave Brotherstone
- fixed; replaced usage of
component.getDOMNode()
withReact.findDOMNode(component)
for compatibility with React 0.14
- fixed; regression in 0.5.3 that broke componentWillMount, sorry everyone!
- added;
addLabelText
prop for customising the "add {label}?" text when in tags mode, thanks Fenn
- fixed; autoload issues, thanks Maxime Tyler
- fixed; style incompatibilities with Foundation framework, thanks Timothy Kempf
- fixed; bug where Select shows the value instead of the label, thanks Stephen Demjanenko
- added; 'is-selected' classname is added to the selected option, thanks Alexey Volodkin
- fixed; async options are now loaded with the initial value, thanks Pokai Chang
- fixed;
react-input-autosize
now correctly escapes ampersands (&), not actually a fix in react-select but worth noting here because it would have been causing a problem inreact-select
as well.
- added; custom option and value rendering capability, thanks Brian Reavis
- fixed; collapsing issue when single-select or empty multi-select fields are disabled
- fixed; issue where an empty value would be left after clearing all values in a multi-select field
- fixed;
esc
key incorrectly created empty options, thanks rgrzelak - adeed; New feature to allow option creation ("tags mode"), enable with
allowCreate
prop, thanks Florent Vilmart and Brian Reavis - fixed; IE8 compatibility fallback for
addEventListener/removeEventListener
, which don't exist in IE8, thanks Stefan Billiet - fixed; Undefined values when using asyncOptions, thanks bannaN
- fixed; Prevent add the last focused value when the drop down menu is closed / Pushing enter without dropdown open adds a value, thanks Giuseppe
- fixed; Callback context is undefined, thanks Giuseppe
- fixed; Issue with event being swallowed on Enter
keydown
, thanks Kevin Burke - added; Support for case-insensitive filtering when
matchPos="start"
, thanks wesrage - added; Support for customizable background color, thanks John Morales
- fixed; Updated ESLint and cleared up warnings, thanks Alexander Shemetovsky
- fixed; Close dropdown when clicking on select, thanks Nik Butenko
- added; Tests, and mocha test framework, thanks Craig Dallimore
- fixed; You can now start the example server and watch for changes with
npm start
- fixed; focus was being grabbed by the select when
autoload
andasyncOptions
were set - added;
focus
method on the component - added; support for disabled options, thanks Pasha Palangpour
- improved; more closures, less binds, for better performance, thanks Daniel Cousens
- fixed; restored
dist/default.css
- fixed; standalone example works again
- fixed; clarified dependency documentation and added dependencies for Bower
- fixed; Scoping issues in
_bindCloseMenuIfClickedOutside
, thanks bannaN - fixed; Doesnt try to set focus afterupdate if component is disabled, thanks bannaN
- improved; lodash is no longer a dependency, thanks Daniel Lo Nigro
- updated; dependencies, build process and input-autosize component
- fixed; issue with long options overlapping arrow and clear icons, thanks Rohit Kalkur
- fixed; error handling click events when the menu is closed, thanks Ilya Petrov
- fixed; issue where options will not be filtered in certain conditions, thanks G. Kay Lee
- added tests and updated dependencies
- added; ESLint and contributing guide
- fixed; incorrect
classnames
variable assignment in window scope - fixed; all ESLint errors and warnings (except invalid JSX undefined/unused vars due to ESLint bug)
- fixed; first option is now focused correctly, thanks Eivind Siqveland Larsen
- fixed; IE11 issue: clicking on scrollbar within menu no longer closes menu, thanks Rohit Kalkur
- updated; compatible with React 0.13
- improved; less/no repaint on scroll for performance wins, thanks jsmunich
- added;
onBlur
andonFocus
event handlers, thanks Jonas Budelmann - added; support for
inputProps
prop, passed to the<input>
component, thanks Yann Plantevin - changed; now using react-component-gulp-tasks for build
- fixed; issue w/ remote callbacks overriding cached options, thanks Corey McMahon
- fixed; if not
this.props.multi
, menu doesn't need handleMouseDown, thanks wenbing
- fixed; issues with the underscore/lodash dependency change, thanks Aaron Powell
- added;
disabled
prop, thanks Danny Shaw - added;
searchable
prop - set tofalse
to disable the search box, thanks Julen Ruiz Aizpuru - added;
onOptionLabelClick
prop - see #66 for docs, thanks Dmitry Smirnov - fixed;
text-overflow: ellipsis;
typo, thanks Andru Vallance
- fixed; issue adding undefined values to multiselect, thanks Tejas Dinkar
- fixed; missing
var
statement
- added; node compatible build now available in
/lib
- added;
searchPromptText
property that is displayed whenasyncOptions
is set and there are (a) no options loaded, and (b) no input entered to search on, thanks Anton Fedchenko - added;
clearable
property (defaults totrue
) to control whether the "clear" control is available, thanks Anton Fedchenko
- fixed; height issues in Safari, thanks Joss Mackison
- added; Option to specify "Clear value" label as prop for i18n
- fixed; UI now responds to touch events, and works on mobile devices! thanks Fraser Xu
- fixed; Options in the dropdown now scroll into view when they are focused, thanks Adam
- improved; Example dist is now excluded from the npm package
- fixed; More specific mixin name to avoid conflicts (css)
- fixed; Example CSS now correctly rebuilds on changes in development
- fixed; Values are now expanded correctly when options change (see #28)
- added; Option to specify "No results found" label as prop for i18n, thanks Julen Ruiz Aizpuru
- added;
filterOption
andfilterOptions
props for more control over filtering
- added;
matchPos
option to control whether to match thestart
orany
position in the string when filtering options (default:any
) - added;
matchProp
option to control whether to match thevalue
,label
orany
property of each option when filtering (default:any
)
- fixed; screen-readers will now read "clear value" instead of "times" for the clear button
- fixed; non-left-click mousedown events aren't blocked by the control
- improved; better comparison of changes to [options] in
willReceiveProps
- fixed; now focuses the first option correctly when in multiselect mode
- fixed; fixed focused option behaviour on value change
- fixed; when filtering, there is always a focused option (#19)
- changed; using ^ in package.json to compare dependencies
- fixed; compatibility with case-sensitive file systems
- fixed; package.json pointed at the right file
- fixed; Updating state correctly when props change
- improved; Build tasks and docs
- added; Working standalone build
- added; Minified dist version
- added; Publised to Bower
- fixed; backspace event being incorrectly cancelled
- fixed; issue where backspace incorrectly clears the value (#14)
- changed; Major rewrite to improve focus handling and internal state management
- added; Support for
multi
prop, enable multiselect mode
- added; Support for
onChange
event - added;
propTypes
are defined by theSelect
component now - added;
className
property, sets theclassName
on the outerdiv
element - fixed; Removed deprecated
React.DOM.x
calls
- updated; React to 0.12.0
- fixed; Error keeping value when using Async Options