Releases: vaadin/web-components
Releases · vaadin/web-components
v22.0.2
API Documentation →
🐛 Bug Fixes
date-picker
- ⧉ Enable input into autoOpenDisabled date picker on mobile (#3165) (CP: 22.0) (#3190)
field-base
- ⧉ Prevent duplicate error message announcement (#3182) (#3184)
upload
- ⧉ Hide upload drop files area from screen readers (#3174) (#3177)
💅 Polish
component-base
- ⧉ Add observer logic to SlotController (#3193) (#3194)
- ⧉ Add missing SlotController logic and tests (#3179) (#3186)
component-base,field-base
- ⧉ Move SlotController to component-base (#3178) (#3183)
v23.0.0-alpha2
API Documentation →
💥 Breaking Changes
confirm-dialog
- ⧉ Update confirm-dialog to make styling easier (#3135)
crud
- ⧉ Make vaadin-crud-edit extend vaadin-button (#3146)
- ⧉ Use fullscreen attribute to apply styles (#3109)
- ⧉ Move header, form and buttons to slots (#3106)
- ⧉ Split the crud filter/sorter cell on separate rows (#3032)
- ⧉ Simplify internal structure to make styling easier (#3108)
password-field
- ⧉ Make reveal button extend vaadin-button (#3167)
🚀 New Features
app-layout
- ⧉ Add i18n property to app-layout (#3192)
- ⧉ Prevent focusing drawer by keyboard when it is closed (#3168)
- ⧉ Trap focus in drawer when opening in overlay (#2395)
charts
- ⧉ Add Lumo/Material theme on Charts (#3006)
component-base
- ⧉ Add default slot support to SlotMixin (#3130)
custom-field
- ⧉ Add whitespace theme for fixing label bottom padding (#3164)
scroller
- ⧉ Make scroller focusable by default (#3107)
upload
- ⧉ Add focus-ring attribute to vaadin-upload-file (#3156)
vaadin-themable-mixin
- ⧉ Vaadin-themable-mixin LitElement support (#3093)
🐛 Bug Fixes
combo-box
- ⧉ Restore focus to combo box on outside click (#3138)
component-base
- ⧉ Don't use unsupported forEach on HTMLCollection (#3155)
context-menu
- ⧉ Workaround Safari/VoiceOver menu navigation (#3158)
date-picker
- ⧉ Enable input into autoOpenDisabled date picker on mobile (#3165)
date-picker
- ⧉ Restore focus on date picker outside click (#3097)
date-time-picker
- ⧉ Remove generated pickers when adding custom pickers (#3153)
field-base
- ⧉ Prevent duplicate error message announcement (#3182)
- ⧉ Set hidden attribute on the error message when field is valid (#3143)
field-highlighter
- ⧉ Update date-picker observer to mind the new structure (#3142)
form-layout
- ⧉ Link form-item label to field via aria-labelledby (#3088)
menu-bar
- ⧉ Add theme to SubMenuItem interface (#3127)
select
- ⧉ Restore select focus on fullscreen dropdown close (#3120)
text-area
- ⧉ Add pattern mixin to typings (#3126)
upload
- ⧉ Hide upload drop files button from assistive technologies (#3174)
vaadin-themable-mixin
- ⧉ Skip undefined LitElement styles (#3123)
💅 Polish
- All components
- ⧉ Add more rules to ESLint config, fix warnings (#3090)
- ⧉ Add more rules to ESLint config, fix warnings (#3148)
- ⧉ Add more rules to ESLint config, fix warnings (#3151)
- ⧉ Add more rules to ESLint config, fix warnings (#3152)
app-layout
- ⧉ Remove use of
constant() as no longer required (#3113)
- ⧉ Remove no longer needed CSS property (#3115)
avatar-group
- ⧉ Remove iron-resizable-behavior from avatar-group (#3150)
combo-box
- ⧉ Remove iron-resizable-behavior from combo-box (#3195)
component-base
- ⧉ Add observer logic to SlotController (#3193)
- ⧉ Add missing SlotController logic and tests (#3179)
- ⧉ Add FocusTrapController for trapping focus within a node (#3140)
- ⧉ Use a local copy of gestures (#3092)
- ⧉ Move SlotController to component-base (#3178)
- ⧉ Move focus utils to component-base (#3141)
field-base
- ⧉ Use attribute utils in FieldAriaController (#3187)
menu-bar
- ⧉ Remove iron-resizable-behavior from menu-bar (#3196)
tabs
- ⧉ Remove iron-resizable-behavior from tabs (#3197)
upload
- ⧉ Stop click event propagation, improve tests (#3086)
vaadin-overlay
- ⧉ Make overlay use FocusTrapController (#3159)
- ⧉ Add overlay.restoreFocusNode and vaadin-overlay-closing event (#3144)
📝 Documentation
app-layout
- ⧉ Remove incorrectly documented content part (#3114)
vaadin-overlay
- ⧉ Document missing over...
v22.0.1
API Documentation →
🐛 Bug Fixes
context-menu
- ⧉ Workaround Safari/VoiceOver menu navigation (#3158) (#3160)
date-time-picker
- ⧉ Remove generated pickers when adding custom pickers (#3153) (#3157)
field-base
- ⧉ Set hidden attribute on the error message when field is valid (#3143) (#3147)
v22.0.0
API Documentation →
Changes in Vaadin 22
Vaadin 22 contains many improvements. Some of them affect the DOM structure and styling of components.
The most important changes are noted below. Check out the following links to learn more:
See also the release notes for alpha and beta releases for more details.
♿ Accessibility Improvements
See GitHub Project Board for the comprehensive list of accessibility issues addressed in Vaadin 22.
Accessibility fixes have caused a couple of breaking changes listed in the Upgrading Guide.
Special thanks to @knoobie, for the invaluable help with testing, feedback, and guidance with the accessibility work!
⚠️ Moved Packages
All the public web components packages have been moved. Old packages are preserved for backwards compatibility.
Before (Vaadin 14 - 21)
import { GridElement } from '@vaadin/vaadin-grid';After (Vaadin 22)
import { Grid } from '@vaadin/grid';💥 Breaking Changes
- All components
- ⧉ Simplify typings, drop interfaces files (#2813)
- ⧉ Remove element suffix from component classes (#2765)
button
- ⧉ Use role attribute instead of native button (#2394)
charts
- ⧉ Drop update() method support (#2825)
combo-box
- ⧉ Move combo-box items to light DOM (#2467)
combo-box,context-menu,dialog,grid,menu-bar,notification,select,vaadin-overlay
- ⧉ Drop render() method support (#2819)
select
- ⧉ Update select to use new structure (#2282)
upload
- ⧉ Change box-sizing to work in form-layout (#2907)
- ⧉ Rename clear button to remove button (#2809)
🚀 New Features
charts
- ⧉ Update to latest Highcharts (#2433)
combo-box, item
- ⧉ Add checkmark part to item components (#2879)
crud
- ⧉ Add method to control disabled state of save button (#2461)
- ⧉ Expose editor buttons with slots (#2377)
- ⧉ Add no-toolbar attribute to hide toolbar (#2417)
grid
- ⧉ Add row focus mode to convey treegrid structure (#2434)
- ⧉ Add context to event data and update relevant types (#2165)
grid-pro
- ⧉ Indicate editable and read-only cells visually (#2309)
icons
- ⧉ Update main entrypoint to use Vaadin iconset (#2853)
login
- ⧉ Add autocomplete attribute to login-form password field (#2847)
menu-bar
- ⧉ Add i18n property to menu bar (#2384)
- ⧉ Theme property for individual menu items (#2401)
notification
- ⧉ Add a static "show" method to Notification class (#2322)
- ⧉ Add theme support to notification static helper (#2849)
upload
- ⧉ Use semantic HTML tags for the upload (#2316)
vaadin-lumo-styles
- ⧉ Allow easy customizing of required indicator's color (#2810)
virtual-list
- ⧉ Add requestContentUpdate API to virtual list (#2556)
🐛 Bug Fixes
date-picker,grid-pro
- ⧉ Restore focus on date picker outside click (#3097) (#3103)
menu-bar
select
- ⧉ Restore select focus on fullscreen dropdown close (#3120) (#3121)
💅 Polish
app-layout
- ⧉ Remove use of
constant() as no longer required (#3113) (#3119)
- ⧉ Remove no longer needed CSS property (#3115) (#3118)
upload
- ⧉ Stop click event propagation, improve tests (#3086) (#3094)
📝 Documentation
app-layout
- ⧉ Remove incorrectly documented content part (#3114) (#3116)
🏠 Internal
grid
- ⧉ Update JSDoc to use fetch in the data provider (#3098) (#3099)
v23.0.0-alpha1
API Documentation →
🚀 New Features
avatar-group,avatar,message-list,vaadin-lumo-styles,vaadin-material-styles
- ⧉ Add user colors to Lumo and Material styles (#3025)
component-base
- ⧉ Add common browser detection utils (#3062)
- ⧉ Add helpers to detect iOS devices and touch (#3070)
combo-box,custom-field,date-picker,date-time-picker,email-field,integer-field,number-field,password-field,rich-text-editor,select,text-area,text-field,time-picker
- ⧉ Add type definitions for change event (#3085)
field-highlighter
- ⧉ Move field-highlighter package from Collaboration Engine (#3031)
form-layout
- ⧉ Add a required indicator to form item (#3057)
select
- ⧉ Support creating select items using items property (#2990)
text-area
- ⧉ Add pattern and preventInvalidInput properties (#2784)
🐛 Bug Fixes
combo-box
- ⧉ Add missing combo-box mixin classes (#3082)
- ⧉ Stop Escape keydown propagation if the event was handled (#3039)
component-base
- ⧉ Ensure virtualizer re-renders unhidden items (#3081)
field-base
- ⧉ Allow null and undefined for errorMessage (#3066)
grid
- ⧉ Consider all headers and footers when calculating column width (#2964)
- ⧉ Regenerate cell class names after column tree update (#3033)
- ⧉ Make sure each grid section has a tabbable element (#2998)
- ⧉ Get filtered grid root items from the data provider (#3021)
- ⧉ Apply proper focus highlight for multiple header rows (#3016)
polymer-legacy-adapter
- ⧉ Include model reference in declaratively bound events (#3078)
upload
- ⧉ Set tabindex on the vaadin-upload-file element (#3068)
💅 Polish
component-base
- ⧉ Move controllers logic to ControllerMixin (#3069)
checkbox-group
- ⧉ Use ElementMixin instead of DirMixin (#3034)
field-base
- ⧉ Move ARIA attributes logic to FieldAriaController (#3048)
radio-group
- ⧉ Use ElementMixin instead of DirMixin (#3035)
vaadin-overlay
- ⧉ Drop support for setting instanceProps (#3050)
📝 Documentation
combo-box
- ⧉ Improve JSDoc, remove Polymer-specific parts (#3049)
🔬 Tests
- All components
- ⧉ Update testing helpers, use browser utils (#3052)
field-highlighter
- ⧉ Add mouseenter event to reduce flakiness (#3089)
🏠 Internal
- All components
- ⧉ Update master branch to Vaadin 23 (#3018)
component-base
- ⧉ Use relative imports for virtualizer (#3056)
- Other
- ⧉ Update status badges in README (#3045)
- ⧉ Update dev dependencies versions (#3042)
- ⧉ Dev pages improvements (#3027)
- ⧉ Add crud dev page (#3028)
- ⧉ Update root README with renamed packages (#3020)
v22.0.0-rc1
API Documentation →
🚀 New Features
component-base
- ⧉ Add common browser detection utils (#3062) (#3063)
- ⧉ Add helpers to detect iOS devices and touch (#3070) (#3074)
🐛 Bug Fixes
combo-box
- ⧉ Add missing combo-box mixin classes (#3082) (#3091)
- ⧉ Stop Escape keydown propagation if the event was handled (#3039) (#3046)
component-base
- ⧉ Ensure virtualizer re-renders unhidden items (#3081) (#3083)
field-base
- ⧉ Allow null and undefined for errorMessage (#3066) (#3067)
grid
- ⧉ Consider all headers and footers when calculating column width (#2964) (#3044)
- ⧉ Regenerate cell class names after column tree update (#3033) (#3037)
- ⧉ Make sure each grid section has a tabbable element (#2998) (#3026)
- ⧉ Get filtered grid root items from the data provider (#3021) (#3023)
- ⧉ Apply proper focus highlight for multiple header rows (#3016) (#3022)
polymer-legacy-adapter
- ⧉ Include model reference in declaratively bound events (#3078) (#3079)
upload
- ⧉ Set tabindex on the vaadin-upload-file element (#3068) (#3073)
💅 Polish
component-base
- ⧉ Use relative imports for virtualizer (#3056) (#3058)
- ⧉ Move controllers logic to ControllerMixin (#3069) (#3075)
field-base
- ⧉ Move ARIA attributes logic to FieldAriaController (#3048) (#3076)
📝 Documentation
combo-box
- ⧉ Improve JSDoc, remove Polymer-specific parts (#3049) (#3051)
🔬 Tests
- All components
- ⧉ Update testing helpers, use browser utils (#3052) (#3053)
🏠 Internal
- Other
- ⧉ Update dev dependencies versions (#3042) (#3043)
- ⧉ Update change detection branch to 22.0 (#3017)
v21.0.5
API Documentation →
🐛 Bug Fixes
vaadin-grid
- ⧉ Consider all headers and footers when calculating column width (#2964) (#3055)
- ⧉ Regenerate cell class names after column tree update (#3033) (#3038)
vaadin-template-renderer
- ⧉ Include model reference in declaratively bound events (#3078) (#3080)
vaadin-virtual-list
- ⧉ Ensure virtualizer re-renders unhidden items (#3081) (#3084)
v21.0.4
API Documentation →
🐛 Bug Fixes
vaadin-combo-box
- ⧉ Remove tabindex from combo-box overlay (#2948) (#2952)
vaadin-grid
- ⧉ Get filtered grid root items from the data provider (#3021) (#3024)
- ⧉ Disable row drag and drop while loading (#2957) (#2973)
vaadin-list-mixin
- ⧉ Prevent disabled items from being focusable (#2921) (#2926)
vaadin-radio-button
- ⧉ Set has-value attribute on radio button click (#2874)
vaadin-select
vaadin-text-field
- ⧉ Workaround disabled textarea freezing Firefox (#2981) (#2984)
- ⧉ Hide the native reveal password icon on edge (#2876)
vaadin-virtual-list
- ⧉ Workaround scrollToIndex issue (#2922) (#2923)
- ⧉ Don't update element for the same index more than once (#2910) (#2913)
- ⧉ Limit the requested pages to a given threshold (#2886)
💅 Polish
vaadin-grid,vaadin-virtual-list
- ⧉ Reduce virtualizer physical element count (#2912) (#2916)
v22.0.0-beta2
API Documentation →
🐛 Bug Fixes
combo-box
- ⧉ Reset focusedIndex when value is reset (#2935)
context-menu
- ⧉ Show checkmark for checked menu item (#3004)
grid
- ⧉ Disable row drag and drop while loading (#2957)
menu-bar
- ⧉ Reset background for menu-bar item in button (#2967)
password-field
- ⧉ Do not set focus-ring on mousedown focus (#2963)
select
- ⧉ Don't throw on requestContentUpdate before attaching (#2995)
- ⧉ Use --lumo-clickable-cursor, refactor styles (#2977)
text-area
- ⧉ Workaround disabled textarea freezing Firefox (#2981)
💅 Polish
- All components
- ⧉ Sort import statements in src files (#2915)
- ⧉ Hide internal API from TS definitions (#2960)
- ⧉ Align type definitions for all mixins (#2971)
- ⧉ Remove private API from TS definitions (#2974)
- ⧉ Sort import statements in themes (#2989)
- ⧉ Simplify themable-mixin imports in src (#3009)
- ⧉ Simplify themable-mixin imports in themes (#3011)
- ⧉ Align remaining themable-mixin imports (#3014)
avatar
- ⧉ Use FocusMixin instead of custom logic (#2966)
combo-box
- ⧉ Cleanup duplicate combo-box item styles (#3000)
context-menu,menu-bar
- ⧉ Use overlay-position-mixin with context-menu and menu-bar (#2917)
date-picker
- ⧉ Remove IronA11yKeysBehavior dependency (#3005)
item, select
- ⧉ Use new mixins, simplify keyboard handling (#2976)
message-list
- ⧉ Use FocusMixin instead of custom logic (#2970)
🔬 Tests
- All components
- ⧉ Sort import statements in test files (#2983)
- ⧉ Simplify themable-mixin imports in tests (#3012)
confirm-dialog,split-layout
- ⧉ Import root entrypoints in typings tests (#2958)
🏠 Internal
- All components
- ⧉ Align README for non-prefixed packages (#2994)
- ⧉ Remove vaadin-directory-description files (#2997)
- ⧉ Update README for deprecated packages (#2996)
grid
- ⧉ Bump Playwright to 1.16.3, fix grid keyboard test (#3002)
vaadin-themable-mixin
- ⧉ Remove no longer used docs-images folder (#2972)
- Other
- ⧉ Update dev dependencies versions (#2999)
- ⧉ Add dev page for context-menu (#2982)
- ⧉ Add dev page for grid-pro (#2980)
v22.0.0-beta1
API Documentation →
💥 Breaking Changes
upload
- ⧉ Change box-sizing to work in form-layout (#2907)
🚀 New Features
combo-box,item
- ⧉ Add checkmark part to item components (#2879)
🐛 Bug Fixes
checkbox-group,custom-field,field-base,radio-group
- ⧉ Set aria-required attribute when field group is required (#2946)
checkbox-group,radio-group
- ⧉ Restore 100% width on group field container (#2887)
combo-box
- ⧉ Remove tabindex from combo-box overlay (#2948)
component-base
- ⧉ Workaround scrollToIndex issue (#2922)
date-time-picker
- ⧉ Label date-time-picker by label and helper (#2941)
email-field,field-base,integer-field,message-input,number-field,password-field,select,text-area,text-field
- ⧉ Use role alert on the error message (#2940)
field-base
- ⧉ Add has-label attribute when mutating text node (#2900)
- ⧉ Set unique id attribute for every textarea (#2898)
icon
- ⧉ Set aria-hidden attribute on the svg element (#2936)
input-container
- ⧉ Focus the input on input-container click (#2878)
input-container,select
- ⧉ Inherit input field font from the host (#2933)
menu-bar
- ⧉ Use active attribute on a root level button while it's expanded (#2889)
select
- ⧉ Ensure correct menuElement reference (#2956)
- ⧉ Add aria-live on the select value button (#2903)
- ⧉ Open select overlay on label click (#2902)
vaadin-list-mixin
- ⧉ Prevent disabled items from being focusable (#2921)
virtual-list
- ⧉ Don't update element for the same index more than once (#2910)
- ⧉ Limit the requested pages to a given threshold (#2801)
💅 Polish
component-base
- ⧉ Reduce virtualizer physical element count (#2912)
- ⧉ Move virtualizer to component-base (#2905)
form-layout
- ⧉ Move form-item custom property defaults to form-layout (#2893)
input-container
- ⧉ Remove duplicate CSS props (#2901)
item,list-box,select
- ⧉ Move item styles from list-box to item (#2955)
📝 Documentation
- All components
- ⧉ Improve styling JSDoc for field components (#2949)
checkbox
- ⧉ Don't mention non-existing CSS parts in JSDoc (#2918)
checkbox-group,checkbox,radio-group
- ⧉ Prefer label attribute for checkbox and radio-button (#2944)
radio-group
- ⧉ Don't mention non-existing CSS parts in JSDoc (#2919)
🔬 Tests
polymer-legacy-adapter
- ⧉ Remove self-closing tags from tests (#2951)
select
- ⧉ Assert that list-box receives focus when opening overlay (#2909)
🏠 Internal
combo-box
- ⧉ Update vaadin-combo-box theming docs (#2920)
icons,rich-text-editor,vaadin-lumo-styles,vaadin-material-styles
- ⧉ Update dev dependencies, regenerate icons (#2950)
polymer-legacy-adapter
- ⧉ Add polymer-legacy-adapter devDependencies (#2953)
- Other
- ⧉ Update GitHub Actions to use Node 16 (#2945)
- ⧉ Add dev page for checkbox-group (#2943)
- ⧉ Update bug report issue template to not use tasks (#2892)
