-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(deps): update dependency react-select to v5 #578
Open
renovate
wants to merge
1
commit into
master
Choose a base branch
from
renovate/react-select-5.x
base: master
Could not load branches
Branch not found: {{ refName }}
Loading
Could not load tags
Nothing to show
Loading
Are you sure you want to change the base?
Some commits from the old base branch may be removed from the timeline,
and old review comments may become outdated.
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
a95f56d
to
f644e66
Compare
12389a8
to
23a69c9
Compare
5740eb1
to
68fb331
Compare
68fb331
to
b411c6b
Compare
c53bce5
to
6e053e2
Compare
861d8d7
to
798d846
Compare
6e053e2
to
2cb8738
Compare
45228cb
to
974caf0
Compare
694cec1
to
1571397
Compare
1571397
to
16bb497
Compare
06acead
to
07d0157
Compare
7ba5688
to
5148f26
Compare
34891fc
to
9b14b58
Compare
072c2f0
to
7439a6b
Compare
7439a6b
to
a8ee628
Compare
a8ee628
to
69a0637
Compare
058dd10
to
c2941af
Compare
c2941af
to
1458b7b
Compare
1458b7b
to
79b014b
Compare
79b014b
to
41de3d0
Compare
41de3d0
to
634872a
Compare
e7beb1a
to
7d1bb5f
Compare
7d1bb5f
to
647aed9
Compare
647aed9
to
2b6d6d0
Compare
2b6d6d0
to
552122c
Compare
552122c
to
e978dcd
Compare
e978dcd
to
f0aa1a9
Compare
f0aa1a9
to
c3fec50
Compare
c3fec50
to
85d6579
Compare
85d6579
to
32a77df
Compare
32a77df
to
53ce5c3
Compare
53ce5c3
to
b72abe7
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Labels
None yet
0 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR contains the following updates:
4.3.1
->5.10.0
Release Notes
JedWatson/react-select (react-select)
v5.10.0
Compare Source
Minor Changes
6d28ed76
#5993 Thanks @onihani! - Export theFilterOptionOption
typev5.9.0
Compare Source
Minor Changes
01206c33
#5984 Thanks @Thris3n! - Add React 19 to peer dependency rangev5.8.3
Compare Source
Patch Changes
111efad1
#5974 Thanks @j2ghz! - Fix types compatibility with React 19v5.8.2
Compare Source
Patch Changes
781284a9
#5771 Thanks @tu4mo! - Fix for calling non-cancellable scroll eventsv5.8.1
Compare Source
v5.8.0
Compare Source
Minor Changes
884f1c42
#5758 Thanks @Ke1sy! - 1. Added 'aria-activedescendant' for input and functionality to calculate it;v5.7.7
Compare Source
Patch Changes
224a8f0d
#5666 Thanks @yhy-1! - Add aria-disabled to select's control component.v5.7.6
Compare Source
Patch Changes
f6315cd5
#5672 Thanks @tu4mo! - Fix for calling non-cancellable scroll eventsv5.7.5
Compare Source
Patch Changes
9d1730ba
#5347 Thanks @aszmyd! - Make scroll lock div work on a document context it belongs tov5.7.4
Compare Source
Patch Changes
16414bb5
#5689 Thanks @Rall3n! - ResolvedefaultProps
deprecation warning for React v18+.v5.7.3
Compare Source
Patch Changes
59513d00
#5626 Thanks @emmatown! - Fix importingreact-select
in Node ESMv5.7.2
Compare Source
Patch Changes
925cd4a2
#5536 Thanks @Rall3n! -required
prop accessibiltiy and functionality improvementsv5.7.1
Compare Source
Patch Changes
597143ee
#5559 Thanks @gdiazdelaserna! - Addexports
field in package.jsonv5.7.0
Compare Source
Minor Changes
0773095f
#5457 Thanks @nderkim! - Add classNames API and unstyled propv5.6.1
Compare Source
Patch Changes
cda16826
#5482 Thanks @nderkim! - Fix unstable theme rerendering menuv5.6.0
Compare Source
Minor Changes
c37e86d8
#4882 Thanks @Rall3n! - Addrequired
propv5.5.9
Compare Source
Patch Changes
851ed2b8
#5430 Thanks @Rall3n! - Fix focused option ifdefaultMenuIsOpen
is setv5.5.8
Compare Source
Patch Changes
1ad6de4e
#5084 Thanks @kosciolek! - When focusing a dropdown option, the numbers included in the aria live region take filtering into consideration.v5.5.7
Compare Source
Patch Changes
0ca2d5ba
#5431 Thanks @nderkim! - Changeclass
components tofunctional
componentsv5.5.6
Compare Source
Patch Changes
92398939
#5409 Thanks @lukebennett88! - Move files around to as to be compatible with version 2 of@preconstruct/cli
v5.5.5
Compare Source
Patch Changes
0dd38029
#5246 Thanks @Rall3n! - Fix re-focus of component in Firefox if being disabled while focusedv5.5.4
Compare Source
Patch Changes
ebb0a17a
#5404 Thanks @Methuselah96! - Use ResizeObserver to auto-update menu position if availablev5.5.3
Compare Source
Patch Changes
07656aaa
#5399 Thanks @dependabot! - Update memoize-onev5.5.2
Compare Source
Patch Changes
00238f1a
#5376 Thanks @lukebennett88! - Fix bug with animated multi-value select width being too widev5.5.1
Compare Source
Patch Changes
0f6ef093
#5381 Thanks @Methuselah96! - Disable use of ResizeObserver for menu position auto-updating to avoid potential breaking changes.v5.5.0
Compare Source
Minor Changes
598f9ee0
#5256 Thanks @Methuselah96! - Auto-update menu position when using menu portallingv5.4.0
Compare Source
Minor Changes
5d49f70a
#5249 Thanks @Methuselah96! - ExportformatOptionLabel
types (i.e.,FormatOptionLabelMeta
andFormatOptionLabelContext
).v5.3.2
Compare Source
Patch Changes
1f140e42
#5177 Thanks @Methuselah96! - Fix view height used for menu positioning to be the scroll parent instead of the windowv5.3.1
Compare Source
Patch Changes
03bf7351
#5164 Thanks @Methuselah96! - Bump @emotion/react to ^11.8.1 to avoiduseInsertionEffect
bugv5.3.0
Compare Source
Minor Changes
c7d8d4b3
#5133 Thanks @nil4! - UpdatepeerDependencies
to include React 18Patch Changes
0aaa9575
#5134 Thanks @rkulinski! - Use defaultPrevented to skip duplicate event handler for clicking select.87e14431
#5131 Thanks @pcorpet! - Avoid referencing an ID that is not in the DOM7184d538
#5082 Thanks @Methuselah96! - Fix type inference for Async's loadOptions propbd4ee8ae
#5057 Thanks @Rall3n! - Prevent transition props from being forwarded to<input>
element inDummyInput
componentv5.2.2
Compare Source
Patch Changes
940a50b1
#4928 Thanks @Methuselah96! - Fix usage with esModuleInterop disabled54f9538e
#4941 Thanks @prichey! - Use React's AriaAttributes type directly rather than recreatinge97d45c0
#4908 Thanks @vjee! - Make 3rd argument of CommonProps['setValue'] optional.v5.2.1
Compare Source
Patch Changes
f172d7f9
#4886 Thanks @Akridian! - Hooks for creation of custom Selects are now exported from main entryv5.2.0
Compare Source
Minor Changes
6c7a3d1e
#4785 Thanks @Rall3n! - AddprevInputValue
to action metab522ac65
#4860 Thanks @ebonow! - Fix animated MultiValue transitions when being removed and change method used to generate unqiue keys for Option components. Closes #4844 , closes #4602Patch Changes
417e7217
#4842 Thanks @Methuselah96! - Remove src directory from published package480ea85b
#4846 Thanks @Methuselah96! - Add missing index to MultiValue props typeb8e34472
#4854 Thanks @mikunpham! - Make input container css re-compute whenever input value changes due to a bug from@emotion/react
in development env.v5.1.0
Compare Source
Minor Changes
8b38d49b #4807 Thanks @hcharley! - Export AsyncCreatableProps from creatable entrypoint
46eeda1a #4801 Thanks @Methuselah96! - Export more types from main entry point
Patch Changes
fdd01e66 #4833 Thanks @ebonow! - Value container display property should be grid when isMulti and has no value so the Placeholder component is positioned correctly with the Input
0937604f #4823 Thanks @mikunpham! - Fix the issue where input contents are moved to the left due to multiple space characters.
ec80b577 #4803 Thanks @Methuselah96! - Import CSSObject from @emotion/react instead of @emotion/serialize
v5.0.0
Compare Source
Upgrade Guide
Summary
react-select
so you no longer need to have@types/react-select
installed; we no longer include Flow typesforwardRef
for all wrapped components (#4489) - this means that if you were accessing anything on theSelect
instance using aref
, theref
will now reference the internalSelect
directly (see below for how to upgrade)Select
s (i.e.,makeCreatableSelect
,mangeState
,makeAsyncSelect
) these have now been replaced by hooks (i.e.,useCreatable
,useStateManager
,useAsync
).prefix__input
now targets the input and NOT the containerSelect
sreadonly
attribute on ourDummyInput
(#4634) - this results in better accessibility but usescaret-color
which is not available on IE11Details
Convert to TypeScript
We've rewritten
react-select
in TypeScript which means you can remove any dependencies on@types/react-select
. If you were using the Flow types than look into contributing types for v5 toflow-typed
.Here are the most notable changes when replacing
@types/react-select
with our packaged types:OptinTypeBase
getOptionValue
andgetOptionLabel
) so there's no longer a base type for optionsOptionsType
Options
GroupTypeBase
GroupBase
GroupedOptionsType
ReadonlyArray<Group>
ValueType
OnChangeValue
InputActionTypes
InputAction
NamedProps
Props
Select
(theref
type)SelectInstance
forwardRef
for all wrapped components" for more detailsAsyncSelect
(theref
type)SelectInstance
forwardRef
for all wrapped components" for more detailsCreatableSelect
(theref
type)SelectInstance
forwardRef
for all wrapped components" for more detailsAsyncCreatableSelect
(theref
type)SelectInstance
forwardRef
for all wrapped components" for more detailsIf you were previously importing a type from the
src
directory when using@types/react-select
:These should now be imported from the
dist/declarations/src
directory:We export any types from the main entry point that we think might be useful to the user. If you are using a type that is not exported from the main entry point please open a PR or issue so that we can add it.
If you are using custom props for the
Select
component you can use module augmentation to add them to theSelect
prop types:Drop IE11 support
This allows us to use modern CSS in order to improve the quality of
react-select
and remove excessive JavaScript code to work around not having the ability to use modern CSS. If you need IE11 support either:readonly
attribute on ourDummyInput
" since you can't override theDummyInput
component with the Styles or Components API.react-select
compatible with IE11, open a PR. We are unlikely to provide official support for IE11 since supporting IE11 makes maintainingreact-select
a lot more difficult and holds us back from changes we want to make, but we also are glad to accept simple changes if they make your life easier.Use
forwardRef
for all wrapped componentsNOTE: Accessing any of the internals of the
Select
component usingref
s is not part of our public API. The internals of theSelect
component can change at any time (including in minor and patch releases). The only methods on theSelect
component that are part of the public API are thefocus()
andblur()
methods.react-select
exports five components:BaseSelect
,CreatableSelect
,Select
(the default export),AsyncSelect
,AsyncCreatableSelect
. The last four components are wrappers around theBaseSelect
. Previously theref
for each of these components was pointing to itself, but now we useforwardRef
which means that theref
s for all five components now point toBaseSelect
.The
focus()
andblur()
methods are untouched by this change. However if you were accessing the internals of theBaseSelect
component, you will need to update how you were accessing theBaseSelect
. Here is how to update access to theBaseSelect
component:BaseSelect
ref
ref
CreatableSelect
ref.select.select
ref
Select
ref.select
ref
AsyncSelect
ref.select.select
ref
AsyncCreatableSelect
ref.select.select.select
ref
Replace HOCs with hooks
The primary reason for this change is that hooks combined with generic components are easier to type in TypeScript than HOCs combined with generic components. These HOCs/hooks are considered advanced usage.
If you were using the HOCs, it shouldn't be too hard to replace them with its corresponding hook (i.e.,
useStateManager
,useCreatable
, oruseAsync
). As an example, here is how the state managed Select (the default export) used to be constructed with themangeState
HOC:With hooks it is now constructed like this:
Consult the source code for how the other components are constructed.
Remove dependency on AutosizeInput
This is an exciting change because we get to drop our dependency on
react-input-autosize
. We now use a pure CSS solution to auto-size the input, however this means that we have to drop support for IE11 since IE11 does not fully support CSS grid. As part of this refactor the.prefix__input
CSS class now targets the input itself and NOT the container. See #4625 for more details.Improve screen reader experience
The following improvements have been made for screen reader users:
Also we've added the role of combobox and the required ARIA attributes to the
Input
andDummyInput
components to allow JAWS support and a better screen reader experience overall. See #4695 for more details.Use CSS grid for single value layout
Previously the absolution positioning of both the value and the placeholder pulled them out of the flow, and thus the component itself collapsed down when used as a flex child. To solve this we are now using CSS grid for the single value layout.
Remove
readonly
attribute on ourDummyInput
Previously we added the
readonly
attribute to theDummyInput
(whenisSearchable
is set tofalse
) in order to hide the flashing cursor and prevent devices from showing a virtual keyboard. However thereadonly
attribute causes theDummyInput
to be removed from the tab order in iOS Safari. In order to solve this we're replacing thereadonly
attribute with setting thecaret-color
CSS prop (which IE11 does not support) totransparent
and setting theinputMode
attribute on the<input>
tonone
.Changelog
Major Changes
ef87c3ac #4683 Thanks @Methuselah96! - React-Select has been converted from Flow to TypeScript.
Other changes for v5 include usage of
forwardRef
, new hooks forstateManager
,async
andcreatable
components, and more reliable filtering implementaion with new options in the creatable variant.Patch Changes
10225290 #4720 - Updated the layout for the singleValue input/placeholder/container so that it works better when used in flex layouts.
53f1972b #4731 Thanks @JedWatson! - MultiValue key now includes a hyphen between the value and the index to prevent edge cases where you could get a duplicate key error
b41f4ceb #4704 Thanks @Rall3n! - Fix findDOMNode deprecation by adding refs to transition components
4b028829 #4634 - The readonly attribute has been removed from the DummyInput to improve accessibility
7fcec537 #4697 - Add the role of combobox and the required ARIA attributes to the Input and DummyInput components to allow JAWS support and a better screen reader experience overall.
ca2c0e5b #4756 Thanks @fdcds! - Add
option
field to type ofCreateOptionActionMeta
9e82aadc #4676 - The following improvements have been made for screen reader users:
638f5455 #4702 Thanks @Methuselah96! - The Option generic is no longer required to extend the OptionBase type
23cea0b5 #4782 Thanks @Methuselah96! - Fix type of loadingMessage prop to allow it to return any ReactNode
Configuration
📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).
🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.
♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.
🔕 Ignore: Close this PR and you won't be reminded about this update again.
This PR was generated by Mend Renovate. View the repository job log.