|
| 1 | +<!-- Copyright 2020 Adobe. All rights reserved. |
| 2 | +This file is licensed to you under the Apache License, Version 2.0 (the "License"); |
| 3 | +you may not use this file except in compliance with the License. You may obtain a copy |
| 4 | +of the License at http://www.apache.org/licenses/LICENSE-2.0 |
| 5 | +Unless required by applicable law or agreed to in writing, software distributed under |
| 6 | +the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS |
| 7 | +OF ANY KIND, either express or implied. See the License for the specific language |
| 8 | +governing permissions and limitations under the License. --> |
| 9 | + |
| 10 | +import {BlogPostLayout, Hero} from '@react-spectrum/docs'; |
| 11 | +export default BlogPostLayout; |
| 12 | + |
| 13 | +--- |
| 14 | +description: This release includes the new `Tooltip`, `TooltipTrigger`, and `DialogContainer` components, a new light theme, and mono-packages for react-aria and react-stately. Thanks to all of the contributors! |
| 15 | +date: 2020-10-01 |
| 16 | +--- |
| 17 | + |
| 18 | +# October 1, 2020 Release |
| 19 | + |
| 20 | +Another exciting set of releases have dropped! 🎤 |
| 21 | + |
| 22 | +We have released the `Tooltip` and `TooltipTrigger` components! We’ve put a lot of effort into making our tooltips fully accessible and as native-like as possible, including matching the delay behavior when hovering over multiple elements with tooltips. See the documentation for [React Spectrum](https://react-spectrum.adobe.com/react-spectrum/Tooltip.html) and [React Aria](https://react-spectrum.adobe.com/react-aria/useTooltipTrigger.html) for more details. |
| 23 | + |
| 24 | +The much requested `DialogContainer` component has been also added to this release. This allows you to have more control over where your `Dialog` is rendered, and support triggers that unmount (e.g. dialogs in menus). Visit our [docs](https://react-spectrum.adobe.com/react-spectrum/DialogContainer.html) for more details. |
| 25 | + |
| 26 | +We have also added a new light theme to React Spectrum thanks to [@evargast](https://github.com/evargast). You can find out more in our [theming](https://react-spectrum.adobe.com/react-spectrum/theming.html#how-themes-are-defined) guide. |
| 27 | + |
| 28 | +As an additional convenience for those using multiple React Aria or React Stately hooks, we now offer a single package each for `react-aria` and `react-stately`. This allows you to install a single package instead of many individual packages. See our getting started guides for [React Aria](https://react-spectrum.adobe.com/react-aria/getting-started.html#mono-package) and [React Stately](https://react-spectrum.adobe.com/react-stately/getting-started.html#mono-package) to find out how you can take advantage of them. |
| 29 | + |
| 30 | +Finally, make sure you check out the [last blog post](https://react-spectrum.adobe.com/blog/building-a-button-part-3.html) of the series on Building a Button which was added to our [blog](https://react-spectrum.adobe.com/blog/index.html). As always, a huge thank you to all our contributors for the new features, fixes and updates. 🤩 |
| 31 | + |
| 32 | +## New components |
| 33 | + |
| 34 | +- **DialogContainer** - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/1082) - [documentation](https://react-spectrum.adobe.com/react-spectrum/ToggleButton.html) |
| 35 | + - `@react-spectrum/dialog` |
| 36 | +- **Tooltip** - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/843) - [documentation](https://react-spectrum.adobe.com/react-spectrum/Tooltip.html) |
| 37 | + - `@react-spectrum/tooltip` |
| 38 | + - `@react-aria/tooltip` |
| 39 | + - `@react-stately/tooltip` |
| 40 | + |
| 41 | +## New features |
| 42 | + |
| 43 | +- Support for upcoming React 17 - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/1040) |
| 44 | +- Allow `usePreventScroll` to be disabled - [@McZenith](https://github.com/McZenith) - [PR](https://github.com/adobe/react-spectrum/pull/972) |
| 45 | +- Update `ScrollView` to implement `useResizeObserver` - [@snowystinger](https://github.com/snowystinger) - [PR](https://github.com/adobe/react-spectrum/pull/910) |
| 46 | +- Add `CheckboxGroup` to `@adobe/react-spectrum` package - [@royalbhati](https://github.com/royalbhati) - [PR](https://github.com/adobe/react-spectrum/pull/1102) |
| 47 | +- Add ability to prevent focus in `usePress` - [@LFDanLu](https://github.com/LFDanLu) - [PR](https://github.com/adobe/react-spectrum/pull/1073) |
| 48 | +- Added new `NoSearchResults` illustration for `IllustratedMessage` - [@evargast](https://github.com/evargast) - [PR](https://github.com/adobe/react-spectrum/pull/1086) |
| 49 | +- Add `@react-spectrum/theme-light` package - [@evargast](https://github.com/evargast) - [PR](https://github.com/adobe/react-spectrum/pull/1046/) |
| 50 | +## Fixed |
| 51 | +- Fix .editorconfig for indent_style - [@alexey-yunoshev](https://github.com/alexey-yunoshev) - [PR](https://github.com/adobe/react-spectrum/pull/1036) |
| 52 | +- `Flex` passes Id to top level element - [@LucianRadu](https://github.com/LucianRadu) - [PR](https://github.com/adobe/react-spectrum/pull/1041) |
| 53 | +- Skip in-scope elements when restoring Focus in `useSelect` - [@devongovett](https://github.com/devongovett) - [PR](https://github.com/adobe/react-spectrum/pull/1049) |
| 54 | +- Allow falsy keys in `Picker` - [@kamal](https://github.com/kamal) - [PR](https://github.com/adobe/react-spectrum/pull/1015) |
| 55 | +- Fix transition events breaking SSR - [@HipsterBrown](https://github.com/HipsterBrown) - [PR](https://github.com/adobe/react-spectrum/pull/1052) |
| 56 | +- Fix inputRef type for `useSearchField` & `useTextField` - [@RafalFilipek](https://github.com/RafalFilipek) - [PR](https://github.com/adobe/react-spectrum/pull/1027) |
| 57 | +- Reset box-sizing in `ActionButton` - [@deloreyj](https://github.com/deloreyj) - [PR](https://github.com/adobe/react-spectrum/pull/1058) |
| 58 | +- Fix scrolling in `Menu` trays [@ktabors](https://github.com/ktabors) - [PR](https://github.com/adobe/react-spectrum/pull/958) |
| 59 | +- Adjust positioning code for `useOverlayPosition` when placement=”top” - [@chungwu](https://github.com/chungwu) - [PR](https://github.com/adobe/react-spectrum/pull/1005) |
| 60 | +- Hide unsupported functionality in full screen `Dialog` - [@ktabors](https://github.com/ktabors) - [PR](https://github.com/adobe/react-spectrum/pull/1062) |
| 61 | +- Fix types of workflow icons - [@clentfort](https://github.com/clentfort) - [PR](https://github.com/adobe/react-spectrum/pull/1028) |
| 62 | +- Make sure user-select is removed on HTML elements - [@zidian257](https://github.com/zidian257) - [PR](https://github.com/adobe/react-spectrum/pull/926) |
| 63 | +- Fix prop types for `useListBox` - [@mischnic](https://github.com/mischnic) - [PR](https://github.com/adobe/react-spectrum/pull/1107) |
| 64 | + |
| 65 | +## Docs |
| 66 | + |
| 67 | +- Update case in IllustratedMessage - [@evargast](https://github.com/evargast) - [PR](https://github.com/adobe/react-spectrum/pull/1086) |
| 68 | + |
| 69 | + |
| 70 | +## Released packages |
| 71 | + |
| 72 | +``` |
| 73 | + - @adobe/react-spectrum@3.4.0 |
| 74 | + - react-aria@3.0.0 |
| 75 | + - react-stately@3.0.0 |
| 76 | + - @react-aria/actiongroup@3.1.1 |
| 77 | + - @react-aria/aria-modal-polyfill@3.2.1 |
| 78 | + - @react-aria/breadcrumbs@3.1.1 |
| 79 | + - @react-aria/button@3.2.2 |
| 80 | + - @react-aria/checkbox@3.2.1 |
| 81 | + - @react-aria/dialog@3.1.2 |
| 82 | + - @react-aria/focus@3.2.2 |
| 83 | + - @react-aria/i18n@3.1.2 |
| 84 | + - @react-aria/interactions@3.2.1 |
| 85 | + - @react-aria/label@3.1.1 |
| 86 | + - @react-aria/link@3.1.2 |
| 87 | + - @react-aria/listbox@3.2.1 |
| 88 | + - @react-aria/menu@3.1.2 |
| 89 | + - @react-aria/meter@3.1.1 |
| 90 | + - @react-aria/overlays@3.4.0 |
| 91 | + - @react-aria/progress@3.1.1 |
| 92 | + - @react-aria/radio@3.1.2 |
| 93 | + - @react-aria/searchfield@3.1.1 |
| 94 | + - @react-aria/select@3.2.1 |
| 95 | + - @react-aria/selection@3.2.1 |
| 96 | + - @react-aria/separator@3.1.1 |
| 97 | + - @react-aria/slider@3.0.0-alpha.2 |
| 98 | + - @react-aria/ssr@3.0.1 |
| 99 | + - @react-aria/switch@3.1.1 |
| 100 | + - @react-aria/table@3.0.0-alpha.7 |
| 101 | + - @react-aria/tabs@3.0.0-alpha.1 |
| 102 | + - @react-aria/textfield@3.2.1 |
| 103 | + - @react-aria/toggle@3.1.1 |
| 104 | + - @react-aria/tooltip@3.0.0 |
| 105 | + - @react-aria/utils@3.3.0 |
| 106 | + - @react-aria/virtualizer@3.2.0 |
| 107 | + - @react-aria/visually-hidden@3.2.1 |
| 108 | + - @react-spectrum/actiongroup@3.1.1 |
| 109 | + - @react-spectrum/breadcrumbs@3.1.3 |
| 110 | + - @react-spectrum/button@3.2.1 |
| 111 | + - @react-spectrum/buttongroup@3.1.2 |
| 112 | + - @react-spectrum/checkbox@3.2.1 |
| 113 | + - @react-spectrum/dialog@3.3.0 |
| 114 | + - @react-spectrum/divider@3.1.1 |
| 115 | + - @react-spectrum/form@3.2.1 |
| 116 | + - @react-spectrum/icon@3.2.0 |
| 117 | + - @react-spectrum/illustratedmessage@3.1.1 |
| 118 | + - @react-spectrum/image@3.1.1 |
| 119 | + - @react-spectrum/label@3.2.1 |
| 120 | + - @react-spectrum/layout@3.1.3 |
| 121 | + - @react-spectrum/link@3.1.1 |
| 122 | + - @react-spectrum/listbox@3.2.1 |
| 123 | + - @react-spectrum/menu@3.2.1 |
| 124 | + - @react-spectrum/meter@3.1.1 |
| 125 | + - @react-spectrum/overlays@3.2.2 |
| 126 | + - @react-spectrum/picker@3.2.1 |
| 127 | + - @react-spectrum/progress@3.1.1 |
| 128 | + - @react-spectrum/provider@3.1.2 |
| 129 | + - @react-spectrum/radio@3.1.1 |
| 130 | + - @react-spectrum/searchfield@3.1.1 |
| 131 | + - @react-spectrum/statuslight@3.1.1 |
| 132 | + - @react-spectrum/switch@3.1.1 |
| 133 | + - @react-spectrum/table@3.0.0-alpha.7 |
| 134 | + - @react-spectrum/tabs@3.0.0-alpha.2 |
| 135 | + - @react-spectrum/text@3.1.1 |
| 136 | + - @react-spectrum/textfield@3.1.3 |
| 137 | + - @react-spectrum/theme-light@3.0.0 |
| 138 | + - @react-spectrum/tooltip@3.0.0 |
| 139 | + - @react-spectrum/utils@3.3.0 |
| 140 | + - @react-spectrum/view@3.1.1 |
| 141 | + - @react-spectrum/well@3.1.1 |
| 142 | + - @react-stately/checkbox@3.0.1 |
| 143 | + - @react-stately/collections@3.2.1 |
| 144 | + - @react-stately/data@3.1.1 |
| 145 | + - @react-stately/layout@3.1.2 |
| 146 | + - @react-stately/list@3.2.1 |
| 147 | + - @react-stately/menu@3.2.1 |
| 148 | + - @react-stately/overlays@3.1.1 |
| 149 | + - @react-stately/radio@3.2.1 |
| 150 | + - @react-stately/searchfield@3.1.1 |
| 151 | + - @react-stately/select@3.1.1 |
| 152 | + - @react-stately/selection@3.2.1 |
| 153 | + - @react-stately/slider@3.0.0-alpha.2 |
| 154 | + - @react-stately/table@3.0.0-alpha.6 |
| 155 | + - @react-stately/toggle@3.2.1 |
| 156 | + - @react-stately/tooltip@3.0.0 |
| 157 | + - @react-stately/tree@3.1.2 |
| 158 | + - @react-stately/utils@3.1.1 |
| 159 | + - @react-stately/virtualizer@3.1.2 |
| 160 | + - @react-types/actiongroup@3.1.1 |
| 161 | + - @react-types/breadcrumbs@3.1.1 |
| 162 | + - @react-types/button@3.2.1 |
| 163 | + - @react-types/buttongroup@3.1.1 |
| 164 | + - @react-types/checkbox@3.2.1 |
| 165 | + - @react-types/dialog@3.3.0 |
| 166 | + - @react-types/divider@3.1.1 |
| 167 | + - @react-types/form@3.2.1 |
| 168 | + - @react-types/illustratedmessage@3.1.1 |
| 169 | + - @react-types/image@3.1.1 |
| 170 | + - @react-types/label@3.2.1 |
| 171 | + - @react-types/layout@3.1.1 |
| 172 | + - @react-types/link@3.1.1 |
| 173 | + - @react-types/listbox@3.1.1 |
| 174 | + - @react-types/menu@3.1.1 |
| 175 | + - @react-types/meter@3.1.1 |
| 176 | + - @react-types/overlays@3.2.1 |
| 177 | + - @react-types/progress@3.1.1 |
| 178 | + - @react-types/provider@3.1.1 |
| 179 | + - @react-types/radio@3.1.1 |
| 180 | + - @react-types/searchfield@3.1.1 |
| 181 | + - @react-types/select@3.1.1 |
| 182 | + - @react-types/shared@3.2.1 |
| 183 | + - @react-types/slider@3.0.0-alpha.1 |
| 184 | + - @react-types/statuslight@3.1.1 |
| 185 | + - @react-types/switch@3.1.1 |
| 186 | + - @react-types/table@3.0.0-rc.5 |
| 187 | + - @react-types/tabs@3.0.0-alpha.1 |
| 188 | + - @react-types/text@3.1.1 |
| 189 | + - @react-types/textfield@3.2.1 |
| 190 | + - @react-types/tooltip@3.0.0 |
| 191 | + - @react-types/view@3.1.1 |
| 192 | + - @react-types/well@3.1.1 |
| 193 | + - @spectrum-icons/color@3.2.0 |
| 194 | + - @spectrum-icons/illustrations@3.2.0 |
| 195 | + - @spectrum-icons/ui@3.2.0 |
| 196 | + - @spectrum-icons/workflow@3.2.0 |
| 197 | + ``` |
0 commit comments