@ui5/webcomponents-theme-base - npm Package Versions

a11y: introduce "accessibleName" property for multiple components (#3449) (f4f5864)
a11y: introduce "accessibleNameRef" property for multiple components (#3442) (42d3ed5), closes #3107
ui5-avatar: implement default slot for image (#3237) (9646c3e)
ui5-avatar-group: implement accessibility specification (#3154) (baec15b), closes #2745
ui5-badge: apply latest Fiori 3 design (#3389) (a58a1a4)
ui5-busy-indicator: add "delay" property (#3419) (cc8acc7)
ui5-button: introduce "Attention" type (#3481) (2c9393c), closes #3446
ui5-carousel: add "hidePageIndicator" property (#3268) (e13a4c9), closes #3158
ui5-checkbox: add "indeterminate" state (#3309) (42a1326), closes #3217
ui5-checkbox: add "Success" value state (#3278) (580e289), closes #3198 #3198
ui5-combobox: enable setting value programatically (#3253) (d85561a)
ui5-combobox: add suggestions grouping (#3469) (5e3f391), closes #3371
ui5-dialog: add keyboard support for "draggable" and "resizable" (#3483) (8580fd8)
ui5-dialog: enable labeling of custom header (#3155) (9943ee7), closes #2838
ui5-icon: support ARIA "role" attribute (#3407) (4bb84e1)
ui5-input: introduce new "SuggestionGroupItem" (#3248) (39ccf7b)
ui5-li: support HTML "title" attribute (#3385) (2f67084)
ui5-li-custom, ui5-li, ui5-li-groupheader: add "accessibleName" property (#3269) (2f88da0)
ui5-list: support pressing DELETE key (#3226) (db04d08), closes #3089
ui5-list: add "accessibleRole"" property (99a25be)
ui5-page: implement responsive paddings (#3412) (b720393)
ui5-panel: expose "content" CSS shadow part (#3211) (267fc02)
ui5-product-switch: implement accessibility specification (#2865) (8c0225c), closes #2707
ui5-segmented-button-item: introduce new component (#3258) (9bd9ce4), closes #3191 #3191
ui5-select: support angular reactive forms (#3323) (e369aef)
ui5-select: move focus to option upon typing (#3538) (4657395)
ui5-switch: add "design" property (#3257) (998be76), closes #3107
ui5-table: add "Single" and "Multi" selection (#2848) (cc31280)
ui5-table-group-row: introduce new component (#3470) (d5ab16a), closes #3319
ui5-timeline: introduce "layout" property (#3520) (b28e104)
ui5-wizard: support auto focus when step is changed (#3310) (70f5563)
framework: introduce InvisibleMessage util (#3192) (0a33c40)
framework: expose dist paths as root paths via package.json export field (#3274) (bd34a5e)
framework: support sap-* config URL params (#3138) (5d9cdb9), closes #3114

Bug Fixes

a11y: keep invisible texts out of the view port (#3085) (de47520), closes #2723 #2723
inputs: use base CSS param for border-radius (#3430) (4a4c5bc)
ui5-avatar-group: fire "click" event only once (#3196) (95986e2)
ui5-avatar-group: deprecate "avatarSize" property (#3229) (fd60e90)
ui5-avatar-group: fix visual design deviations (#3252) (49639e5), closes #3197
ui5-bar: add "aria-label" based on the used "design" (#3161) (7ffb575), closes #3020
ui5-busyindicator: fix aria-labelledby value (#3266) (ef2d332), closes #3256
ui5-busyindicator: fix typo in styles (#3178) (023945a)
ui5-busyindicator: improve focus handling (#3189) (1ab4e77), closes #3171
ui5-button: add "Belize" theme parameters to bundle (#3485) (97a8713), closes #3482
ui5-button: improve use of Theme Designer CSS Variables (#3445) (baec4d4)
ui5-button: fix line-height (#3416) (e679b51), closes #3401 #3401
ui5-calendar: correct enable/disable of prev and next buttons (#3249) (8c66d5a), closes #3201
ui5-calendar:: fix opening pf month/year pickers with SPACE (#3561) (6d99461), closes #3555
ui5-card: fix internal content's HTML tag (#3464) (9832843), closes #3439 #3439
ui5-card: fix styles for slotted images (#3301) (1683134)
ui5-card: update "border-width" and "box-shadow" styles (#3509) (76dcdbf)
ui5-carousel: hide navigation arrows on mouse out (#3174) (655ec49)
ui5-checkbox: add "aria-hidden" attribute to icon (#3511) (18de8a1), closes #3433
ui5-checkbox: prevent jumping of elements aligned with baseline when checking/unchecking (#3408) (b458b80)
ui5-combobox: announce selected item (#3358) (941a414)
ui5-combobox: fix focusing the inner input (#3243) (790c02e)
ui5-date-*: fix components accessibility (#3163) (fe06f84), closes #3002
ui5-date-picker: prevent value verification upon typing(#2922) (f5e92e0), closes #2827
ui5-date-picker: fix alignment of day names (#3095) (b6c1a0a)
ui5-daterange-picker: stop returning back to the start of the range when user closes the range in another month (#3255) (290b60b), closes #3129
ui5-datetime-picker: fix selection of date value (without time) only (#3294) (0a112ea)
ui5-dialog: fix text selection on Chrome (#3532) (1abd40d)
ui5-file-uploader: fix button's hover styles (#3148) (a0ce732)
ui5-flexible-column-layout: fix column borders in high contrast themes (#3328) (bd18bb9), closes #3320
ui5-flexible-column-layout: fix columns display (#3444) (62977d0), closes #3425
ui5-input: announce suggestions count when expected (#3127) (76ec379), closes #3051
ui5-label: fix required label appearance in Safari (#3182) (921ac5a)
ui5-li: fix "info" text width (#3184) (3b930af)
ui5-li: remove “delete” button from tab chain(#3290) (5176954), closes #2964
ui5-li-tree: fix arrow flickering (#3293) (eca59f5), closes #3238
ui5-li-tree: fix selection background (#3072) (bb5d65f), closes #2978
ui5-li-tree: fix incorrect display of the text (#3086) (684ccbf)
ui5-li-tree: hfix hover and active visual state (#3298) (4ac6d23)
ui5-li-tree: fix "info" text visual appearance (#3280) (1523e25), closes #3130
ui5-link: fire "click" event on SAPCE and ENTER (#3374) (ffa2c4c), closes #3007 #3007
ui5-list: fixed keyboard navigation when List is used inside another List (#3314) (15e235e)
ui5-list: fix focus handling on TAB key pressed (#3220) (32a4148)
ui5-list: prevent "load-more" on initial rendering (#3105) (ef52f2b)
ui5-list: prevent scrolling with SPACE (#3272) (0c7e58b), closes #3089
ui5-popover: fix content's max-height (#3386) (8cba688)
ui5-popup: fix default header height (#3506) (ab11001)
ui5-popup: fix scroll handle in input components' dropdowns (#3414) (c5e00c4)
ui5-rating-indicator: fix "aria-readonly" attr when not editable (#3219) (b90933c)
ui5-responsive-popover: fix header styles (#3176) (83a88af), closes #3173
ui5-responsive-popover: fix position of downward pointing arrow (#3508) (e0744d6), closes #3500
ui5-select: display the selected option's icon (#3348) (dac8183), closes #3344
ui5-select: support HOME and END keyboard keys (#3372) (b12a30b)
ui5-shellbar: fix search field width (#3296) (51fb1a3)
ui5-shellbar: fix unnecessary cutting space on left side (#3513) (c7e6f07), closes #3501
ui5-shellbar: fix notification bubble visibility (#3123) (33fde82), closes #3121
ui5-shellbar: fix menu button's arrow position (#3285) (18ea76d), closes #3199
ui5-side-navigation: fire "click" on items inside the popup menu (#3468) (658328a)
ui5-slider, ui5-range-slider: fix templates to render one top level element only (#3115) (c03f211)
ui5-step-input: fire "input" once when value is deleted (#3474) (a5f27f2), closes #3457
ui5-step-input: fix "min-width" is now correct (#3398) (a8af480), closes #3377 #3377
ui5-tabcontainer: scroll tabs into view with keyboard navigation (#3354) (d61a9b2) fix(ui5-table-cell):
ui5-table-cell: allow selection of text nodes (#3568) (e4770b3)
ui5-table-row: prevent SPACE only when event target is the TableRow (#3393) (d48b4c6)
ui5-textarea: restore value on ESCAPE key (#3261) (7b60885)
ui5-time-picker: fix accessibility (#3162) (927abf6), closes #3010
ui5-tree: fix alignment of items (#3424) (788d25d)
ui5-upload-collection-item: fix keyboard navigation (#3327) (aad0c32)
ui5-wizard: fix step's alignment of number and title texts (#3370) (2cd97ec), closes #3251 #3251
ui5-wizard: correct step icons vertical alignment (#3566) (2584341)
ui5-wizard: correct "aria-controls" value (#3180) (d449812)
ui5-wizard: implement revised accessibility spec (#2990) (99cb6b1)
playground: fix links (#3295) (62a0cc3)

BREAKING CHANGES

a11y: deprecate "aria-label" support in favour of "accessible-name" (#3449) (f4f5864)
- The support of "aria-label" has been deprecated in favor of new property "accessibleName" for the following components: Button, Wizard, WizardStep, ComboBox, DatePicker, Dialog, Input, List, Panel, Popover, Popup, RatingIndicator, Select, StepInput and TextArea.
- The support of "aria-label" has been removed for the following components: Card, CheckBox and Link.

<ui5-date-picker accessible-name="Hello World"></ui5-date-picker>

a11y: deprecate "aria-labelledby" support in favour of "accessible-name-ref" (#3442) (42d3ed5), closes #3107
- The support for "aria-labelledby" have been deprecated in favour of new property "accessibleNameRef" for the following components: ComboBox, DatePicker, Input, List, Rating Indicator, Select, StepInput, TextArea, WizardStep.
- The support for "aria-labelledby"` has been removed for the following component: Button, Card and CheckBox.

<ui5-label id="infoText">info text</ui5-label>
<ui5-date-picker  accessible-name-ref="infoText"></ui5-date-picker>

all list items: rename "info" and "infoState" properties (#3259) (ca42531), closes #3107 StandardListItem's "info" and "infoState" properties have been renamed to "additionalText" and "additionalTextState". SuggestionItem's "info" and "infoState" properties have been renamed to "additionalText" and "additionalTextState". TreeItem's: "info" and "infoState" properties have been renamed to "additionalText" and "additionalTextState".
ui5-avatar: rename "backgroundColor" property to "colorScheme" (#3237) (a3a3a11) The property "backgroundColor" has been renamed to "colorScheme".
ui5-avatar: implement default slot for image (#3237) (9646c3e) The properties "image" and "imageFitType" have been deprecated in favour of default slot:

<ui5-avatar>
	<img src="./avatar.jpg" style="object-fit: cover;">
</ui5-avatar>

ui5-avatar-group: deprecate "avatarSize" property (#3107) (fd60e90) The property "avatarSize" property has been deprecated. You can set the "size" property to every avatar that you pass in the default slot.
ui5-bar: replace "middleContent" slot with the default slot (#3107) (e235d7d) The middleContent slot is deprecated in favour of default slot.
ui5-busy-indicator: change tag name (#3107) (d43de85) The component tag name is renamed from "ui5-busyindicator" to "ui5-busy-indicator".
ui5-button: remove "iconSize" property (#3107) (ff9d7dd) The "iconSize" property has been removed.
ui5-card: refactor API (#3107) (86f0333) The Card's "header", "subheading", "status", "headerInteractive" properties, "action" and "avatar" slots, and "header-click" events are not available anymore. Instead, use the newly created "CardHeader" component, which provides the same API with a bit of change in the names as follows: the "headerInteractive", "heading" and "subheading" properties have been renamed to "interactive, "titleText" and "subtitleText", the "header-click" event has been renamed to "click". In addition, the Card now has a "header" slot, for which you can use the CardHeader:

<ui5-card>
	<ui5-card-header
		slot="header"
		status="4 of 10"
		title-text="Quick Links"
		subtitle-text="quick links">
	</ui5-card-header>
</ui5-card>

ui5-carousel: refactor API (#3107) (351d289) The "selectedIndex" property is deprecated. The "infiniteScrollOffset" property and "load-more" event are deprecated, use the "navigate" event to load more items.
ui5-carousel: change "hideNavigation" to "hideNavigationArrows" (#3107) (2adee01) The property "hideNavigation" has been replaced by "hideNavigationArrows". The new property shows/hides the arrows only (previously - both the arrows and the dots in the bottom).
ui5-checkbox: replace "wrap" with "wrappingType" (#3107) (85143e9) The boolean property "wrap" has been removed in favour of string prop "wrappingType". If you previously used "wrap", now set wrappingType="Normal" instead.
ui5-color-palette: rename "change" event (#3107) (b1e2eaf) The "change" event has been renamed to "item-click".
ui5-color-palette: change API (#3107) (12ce9fd) The "showMoreColors" and "showRecentColors" property have been removed - ColorPalettePopover component will be introduced in future to provide this functionality. In addition, the "value" property has been also removed.
ui5-color-palette-item: remove "stableDomRef" as not needed (#3107) (862a452) The "stableDomRef" property has been removed. If previously used, just call "getDomRef" on the ColorPaletteItem to get its DOM reference.
ui5-combobox: enable setting value programatically (#3107) ([d85561a]d85561a(https://github.com/SAP/ui5-webcomponents/commit/d85561a)) The "filterValue" property has been removed. The "value" property should be used as now it represents the "live" value of the component.
ui5-dialog: rename the "open" method to "show" (#3107) (0ecc508) The public method "open" has been renamed to "show".
ui5-daterange-picker: rename first/lastDateValue (#3107) (ad365f4) The readonly attributes "firstDateValue" and "lastDateValue" have been renamed to "startDateValue" and "endDateValue".
ui5-duration-picker: remove component (#3107) (8801e55) The DurationPicker is now private component and no longer supported. It may continue working, but it's not guaranteed.
ui5-flexible-column-layout: rename "noArrows" property to "hideArrows" (#3107) (8660d11) The "noArrows" property has been renamed to "hideArrows".
ui5-input: (#3237) (6630c2a) The "highlight" property has been removed and the feature is enabled by default.
ui5-input: remove public method (#3224) (1166fb4), closes #3107 The "isOpen method" (that used to return if the value state popover is open or closed) has been removed.
ui5-input: introduce new "SuggestionGroupItem" (#3248) (39ccf7b) The "group" property of the SuggestionItem is removed, use the SuggestionGroupItem component to create grouping as follows:

<ui5-input show-suggestions>
  <ui5-suggestion-group-item text="Group #1"></ui5-suggestion-group-item>
  <ui5-suggestion-item text="Item #1"></ui5-suggestion-item>
  <ui5-suggestion-item text="Item #2"></ui5-suggestion-item>
</ui5-input>

ui5-label: replace "wrap" with "wrappingType" (#3107) (e591e04) The boolean property "wrap" has been removed in favour of string prop "wrappingType". If you previously used "wrap", now set wrappingType="Normal" instead.
ui5-link: replace "wrap" with "wrappingType" (#3107) (cff8fd4) The boolean property "wrap" has been removed in favour of string prop "wrappingType". If you previously used "wrap", now set wrappingType="Normal" instead.
ui5-li-notification: replace "wrap" with "wrappingType" (#3565) (6701ab5) The boolean property "wrap" has been removed in favour of string prop "wrappingType". If you previously used "wrap", now set wrappingType="Normal" instead.
ui5-list: rename "inset" property to "indent" (#3107) (eba1e64) The property "inset" has been renamed to "indent".
ui5-li-notification: rename "heading" property to "titleText" (#3586) (4f17a31) The property "heading" property has been renamed to "titleText".
ui5-li-notification-group: rename "heading" property to "titleText" (#3586) (4f17a31) The property "heading" property has been renamed to "titleText".
ui5-messagestrip: refactor API (#3237) (1cb43f2) The properties "noIcon" and "noCloseButton" have been renamed to "hideIcon" and "hideCloseButton".
ui5-messagestrip: rename property "type" to "design" (#3237) (4208d19) The property "type" has been renamed to "design".
ui5-popover: rename "noArrow" property to "hideArrow" (#3107) (39cc473) The property "noArrow" has been renamed to "hideArrow".
ui5-popover: rename "openBy" method to "showAt" (#3107) (59f5354) The public method "openBy" has been renamed to "showAt".
ui5-product-switch-item: rename "heading" and "subtitle" properties (#3107) (2461b73) The properties "heading" and "subtitle" have been renamed to "titleText" and "subtitleText".
ui5-radio-button: change tag name bca726e), closes #3107 The component's tag name has been renamed from "ui5-radiobutton" to "ui5-radio-button".
ui5-radio-button: replace "wrap" with "wrappingType" (#3107) (724025b) The boolean property "wrap" has been removed in favour of string prop "wrappingType". If you previously used "wrap", now set wrappingType="Normal" instead.
ui5-radio-button: change "selected" proerty to "checked" (#3107) (677d5be) The "selected" property has been renamed to "checked" and the "select" event to "change".
ui5-rating-indicator: rename "maxValue" property to "max" (#3107) (8aaf99b) The "maxValue" property has been deprecated in favour of "max" property.
ui5-responsive-popover: rename "openBy" method to "showAt" (#3107) (59f5354) The public method "open" has been renamed to "showAt".
ui5-segmented-button: change tag name (b3b42f6), closes #3107 The component's tag name has been renamed from "ui5-segmentedbutton" to "ui5-segmented-button".
ui5-segmented-button-item: introduce new component (#3258) (9bd9ce4), closes #3191 #3191 SegmentedButton no longer accepts ToggleButton, you have to use the newly created component, called SegmentedButtonItem as follows:

<ui5-segmentedbutton>
   <ui5-segmentedbutton-item pressed>One</ui5-segmentedbutton-item>
   <ui5-segmentedbutton-item>Two</ui5-segmentedbutton-item>
   <ui5-segmentedbutton-item>Three</ui5-segmentedbutton-item>
</ui5-segmentedbutton>

ui5-shellbar: rename "notificationCount" property to "notificationsCount" (6495028), closes #3107 The property "notificationCount" has been renamed to "notificationsCount".
ui5-switch: implement "design" property (998be76), closes #3107 The booloean "graphical" property has been deprecated in favour of enum "design" property.
ui5-tab: rename "semanticColor" property to "design" (#3107) (a7a0da1) The property :semanticColor" has been renamed to "design".
ui5-tabcontainer: deprecate "tabsPlacement" (#3107) (4343100) The property "tabsPlacement" has been removed as it is not specified in SAP Fiori 3 design system.
ui5-table: introduce "hideNoData" property (#3107) (d2d4397) The property "showNoData" has been renamed to "hideNoData".
ui5-table: rename "more(sub)Text" to "growingButton(sub)Text" (#3107) (a3dd305) The properties "moreText" and "moreSubtext" have been removed, use "growingButtonText" and "growingButtonSubtext" instead.
ui5-timeline-item: change API (#3107) (3b1c0b5) The properties "itemName" and "itemNameClickable" are renamed to renamed to "name" and "nameClickable" and the event "item-name-click" is renamed to "name-click".
ui5-title: replace "wrap" with "wrappingType" (#3107) (448c726) The boolean property "wrap" has been removed in favour of string prop "wrappingType". If you previously used "wrap", now set wrappingType="Normal" instead.
ui5-toggle-button: change tag name (4347195), closes #3107
ui5-toggle-button: remove "iconSize" property (#3107) (ff9d7dd) The "iconSize" property has been removed.
ui5-upload-collection: change "file-deleted" event name (#3107) (5898eb8) The "file-deleted" event has been renamed to "item-delete".
ui5-upload-collection: rename "noDnd" property to "hideDragOverlay" (#3107) (c360443) The property "noDnd" has been renamed to "hideDragOverlay".
ui5-upload-collection-item: change API (#3107) (09e9d2a) The properties "noDelete", "noRetry" and "noTerminate" have been renamed to "disableDeleteButton", "hideRetryButton" and "hideTerminateButton".
ui5-wizard: rename "selection-change" event to "step-change" (#3107) (eec4ba3) The “selection-change” event has been renamed to "step-change". In addition, the event param "selectedStep" has been renamed to "step" and the event param "previouslySelectedStep" has been renamed to "previousStep".
ui5-wizard-step: rename "heading" and "subheading" properties (#3107) (b0e73ad) The properties "heading" and "subheading" have been renamed to "titleText" and "subtitleText".

Code Refactoring

all list items: rename "info" and "infoState" properties (#3259) (ca42531), closes #3107
ui5-avatar: rename "backgroundColor" property to "colorScheme" (#3237) (a3a3a11)
ui5-avatar-group: deprecate "avatarSize" property (#3107) (fd60e90)
ui5-bar: remove "middleContent" slot (#3107) (e235d7d)
ui5-busy-indicator: change tag name (#3107) (d43de85)
ui5-button: remove "iconSize" property (#3107) (ff9d7dd)
ui5-card: refactor API (#3107) (86f0333)
ui5-carousel: refactor API (#3107) (351d289)
ui5-carousel: change "hideNavigation" to "hideNavigationArrows" (#3107) (2adee01)
ui5-checkbox: replace "wrap" with "wrappingType" (#3107) (85143e9)
ui5-color-palette: rename "change" event (#3107) (b1e2eaf)
ui5-color-palette: change API (#3107) (12ce9fd)
ui5-color-palette-item: remove "stableDomRef" as not needed (#3107) (862a452)
ui5-dialog: rename the "open" method to "show" (#3107) (0ecc508)
ui5-daterange-picker: rename first/lastDateValue (#3107) (ad365f4)
ui5-duration-picker: remove component (#3107) (8801e55)
ui5-flexible-column-layout: rename "noArrows" property to "hideArrows" (#3107) (8660d11)
ui5-input: remove "highlight" property (#3350) (6630c2a)
ui5-input: change public method to private (#3224) (1166fb4), closes #3107
ui5-label: replace "wrap" with "wrappingType" (#3107) (e591e04)
ui5-link: replace "wrap" with "wrappingType" (#3107) (cff8fd4)
ui5-list: rename "inset" property to "indent" (#3107) (eba1e64)
ui5-li-notification: replace "wrap" with "wrappingType" (#3565) (6701ab5)
ui5-li-notification: rename "heading" property to "titleText" (#3586) (4f17a31)
ui5-li-notification-group: rename "heading" property to "titleText" (#3586) (4f17a31)
ui5-messagestrip: refactor API (#3237) (1cb43f2)
ui5-messagestrip: rename property "type" to "design" (#3237) (4208d19)
ui5-popover: rename "noArrow" property to "hideArrow" (#3107) (39cc473)
ui5-popover: rename "openBy" method to "showAt" (#3107) (59f5354)
ui5-product-switch-item: rename "heading" and "subtitle" properties (#3107) (2461b73)
ui5-radio-button: change tag name (bca726e), closes #3107
ui5-radio-button: replace "wrap" with "wrappingType" (#3107) (724025b)
ui5-radio-button: change "selected" proerty to "checked" (#3107) (677d5be)
ui5-rating-indicator: rename "maxValue" property to "max" (#3107) (8aaf99b)
ui5-responsive-popover: rename "openBy" method to "showAt" (#3107) (59f5354)
ui5-segmented-button: change tag name (b3b42f6), closes #3107
ui5-shellbar: rename "notificationCount" property to "notificationsCount" (6495028), closes #3107
ui5-switch: implement "design" property (998be76), closes #3107
ui5-tab: rename "semanticColor" property to "design" (#3107) (a7a0da1)
ui5-tabcontainer: deprecate "tabsPlacement" (#3107) (4343100)
ui5-table: rename "showNoDate" to "hideNoData" (#3107) (d2d4397)
ui5-table: rename "more(sub)Text" to "growingButton(sub)Text" (#3107) (a3dd305)
ui5-timeline-item: change API (#3107) (3b1c0b5)
ui5-title: replace "wrap" with "wrappingType" (#3107) (448c726)
ui5-toggle-button: change tag name (4347195), closes #3107
ui5-toggle-button: remove "iconSize" property (#3107) (ff9d7dd)
ui5-upload-collection: rename "noDnd" property to "hideDragOverlay" (#3107) (c360443)
ui5-upload-collection: change "file-deleted" event name (#3107) (5898eb8)
ui5-upload-collection-item: change API (#3107) (09e9d2a)
ui5-wizard: rename "selection-change" event to "step-change" (#3107) (eec4ba3)
ui5-wizard-step: rename "heading" and "subheading" properties (#3107) (b0e73ad)