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.
🤖 I have created a release beep boop
1.0.0 (2024-06-25)
⚠ BREAKING CHANGES
sbb-teaser-hero
andsbb-teaser-paid
are now part of the@sbb-esta/lyne-elements-experimental
package.sbb-tab-title
component has been renamed tosbb-tab-label
. A new component namedsbb-tab
has been created, and it is now the only supported tag for the tab's content;article
,section
anddiv
are not supported anymore. To solve the issue [Feature request]: Add details to tab click event #1351, thedidChange
event onsbb-tab-group
now includes an object which contains the currently selected tab index, thesbb-tab-label
component and relatedsbb-tab
component, plus, if available, the previous ones.sbb-selection-panel
has been renamed tosbb-selection-expansion-panel
. Thesbb-checkbox
andsbb-radio-button
components cannot be used anymore withsbb-selection-expansion-panel
(does not apply for cases where they are slotted inside thecontent
slot). As a replacement, we introduce the new componentssbb-checkbox-panel
andsbb-radio-button-panel
, which could also be used standalone in cases where there is no content.sbb-checkbox-group
andsbb-radio-button-group
also support the panel variants. How to migrate?sbb-selection-panel
tosbb-selection-expansion-panel
.sbb-selection-expansion-panel
, replacesbb-checkbox
withsbb-checkbox-panel
andsbb-radio-button
withsbb-radio-button-panel
(does not apply for cases where they are slotted inside thecontent
slot of thesbb-selection-expansion-panel
)sbb-selection-panel
/sbb-selection-expansion-panel
anymore, but directly usesbb-checkbox-panel
orsbb-radio-button-panel
.sbb-selection-panel
has been renamed tosbb-selection-expansion-panel
. Thesbb-checkbox
andsbb-radio-button
components cannot be used anymore withsbb-selection-expansion-panel
(does not apply for cases where they are slotted inside thecontent
slot). As a replacement, we introduce the new componentssbb-checkbox-panel
andsbb-radio-button-panel
, which could also be used standalone in cases where there is no content.sbb-checkbox-group
andsbb-radio-button-group
also support the panel variants. How to migrate?sbb-selection-panel
tosbb-selection-expansion-panel
.sbb-selection-expansion-panel
, replacesbb-checkbox
withsbb-checkbox-panel
andsbb-radio-button
withsbb-radio-button-panel
(does not apply for cases where they are slotted inside thecontent
slot of thesbb-selection-expansion-panel
)sbb-selection-panel
/sbb-selection-expansion-panel
anymore, but directly usesbb-checkbox-panel
orsbb-radio-button-panel
.now
property that can be used to set time or date-based components into a specific state, especially for testing purposes.sbb-calendar
,sbb-datepicker
,sbb-timetable-row
,sbb-journey-summary
,sbb-pearl-chain
,sbb-pearl-chain-time
: change the attributedata-now
tonow
. The propertynow
can be a Date or Unix timestamp. If you had a timestamp in milliseconds before, please divide by 1000 to get seconds.sbb-clock
: change the attributedata-now
tonow
. The propertynow
has to be in the format "HH:MM:SS".Lyne components
andLyne components react
libraries have been renamed, please update imports accordingly.@sbb-esta/lyne-components
=>@sbb-esta/lyne-elements
@sbb-esta/lyne-components-react
=>@sbb-esta/lyne-react
The following components, and their react wrappers, have been moved into
@sbb-esta/lyne-elements-experimental
and@sbb-esta/lyne-react-experimental
respectively:link
role inside the Shadow DOM. Therefore, for the following components, replace the[aria-label]
usages with[accessibility-label]
attribute oraccessibilityLabel
property:sbb-breadcrumb
sbb-button-link
,sbb-secondary-button-link
,sbb-tertiary-button-link
,sbb-transparent-button-link
sbb-card-link
sbb-header-link
sbb-link
,sbb-block-link
sbb-menu-link
sbb-navigation-link
sbb-teaser
,sbb-teaser-hero
,sbb-teaser-paid
typography.css
into smaller consumable modules, we had to change the names of some files.typography.css
tostandard-theme.css
. Notice: there is still a file calledtypography.css
that contains only a few typography-related outputs. Therefore, import adaption fromtypography.css
tostandard-theme.css
is mandatory.fullfont.css
tofont-characters-extension.css
.Roman
,Bold
, andLight
font-face variants with the singleSBB
font. Using CSSfont-weight
property automatically selects the correct font family. Migration guide:font-family: "SBBWeb Roman", ...
withfont-family: "SBB", ...
and usefont-weight: normal
(potentially not necessary asnormal
is the default).font-family: "SBBWeb Bold", ...
withfont-family: "SBB", ...
and usefont-weight: bold
or CSS classsbb-text--bold
.font-family: "SBBWeb Light", ...
withfont-family: "SBB", ...
and usefont-weight: 300
.--sbb-typo-type-face-sbb-roman
with--sbb-typo-font-family
and usefont-weight: normal
(potentially not necessary asnormal
is the default).--sbb-typo-type-face-sbb-bold
with--sbb-typo-font-family
and usefont-weight: bold
.--sbb-typo-type-face-sbb-light
with--sbb-typo-font-family
and usefont-weight: 300
.disable-animation
property. Useanimation='none'
instead.disable-animation
property. Useanimation='none'
instead or depending on the case 'open' or 'close'.sbb-disable-animation
CSS class to disable animations for the element and all its children. Consequently, alldisable-animation
properties of the following components have been removed.disable-animation
property fromsbb-accordion
disable-animation
property fromsbb-alert
disable-animation
property fromsbb-autocomplete
disable-animation
property fromsbb-datepicker-toggle
disable-animation
property fromsbb-dialog
disable-animation
property fromsbb-expansion-panel
disable-animation
property fromsbb-image
disable-animation
property fromsbb-loading-indicator
disable-animation
property fromsbb-menu
disable-animation
property fromsbb-navigation
disable-animation
property fromsbb-navigation-section
disable-animation
property fromsbb-notification
disable-animation
property fromsbb-overlay
disable-animation
property fromsbb-popover
disable-animation
property fromsbb-select
disable-animation
property fromsbb-selection-panel
disable-animation
property fromsbb-sticky-bar
disable-animation
property fromsbb-toast
disable-animation
property fromsbb-toggle
@sbb-esta/lyne-components
have changed from extension-less to including the extension (e.g.@sbb-esta/lyne-components/button
to@sbb-esta/lyne-components/button.js
).sbb-dialog
component now needs the dedicated inner elementssbb-dialog-title
,sbb-dialog-content
, andsbb-dialog-actions
. Use these components to respectively provide a title, a content and, optionally, a footer with an action group. Moreover, the full-screen variant (which occurred when no title was provided to the dialog) has been removed. To achieve a full-screen overlay, please use the newsbb-overlay
component. As a migration help, consider the following example. Old:<sbb-dialog title-content="Title"><p>Dialog content.</p><sbb-action-group slot="action-group">...</sbb-action-group></sbb-dialog>
. New:<sbb-dialog><sbb-dialog-title>Title</sbb-dialog-title><sbb-dialog-content><p>Dialog content</p></sbb-dialog-content><sbb-dialog-actions>...</sbb-dialog-actions></sbb-dialog>
. Previously, a full-screen dialog was displayed if no title was provided to the dialog component:<sbb-dialog><p>Dialog content.</p></sbb-dialog>
. To achieve the same, it is now mandatory to use thesbb-overlay
component:<sbb-overlay><p>Overlay content.</p></sbb-overlay>
.--sbb-form-field-height
has been renamed to--sbb-form-field-min-height
.label
property and attribute of<sbb-form-field>
was removed. Use<label>
tag inside<sbb-form-field>
to provide the label information. E.g.<sbb-form-field label="Example">...</sbb-form-field>
becomes<sbb-form-field><label>Example</label>...</sbb-form-field>
sbb-screenreader-only
tosbb-screeen-reader-only
.active
property of<sbb-navigation-button>
/<sbb-navigation-link>
(former<sbb-navigation-action>
) has been removed. Add the CSS classsbb-active
to the corresponding button/link, to mark it as active. Additionally, wheneversbb-active
class is set in navigation, the corresponding navigation section, if one is connected, automatically opens.sbb-card-action
: split insbb-card-button
andsbb-card-link
sbb-header-action
: split insbb-header-button
andsbb-header-link
sbb-menu-action
: split insbb-menu-button
andsbb-menu-link
sbb-navigation-action
: split insbb-navigation-button
andsbb-navigation-link
isStatic
flag has been removed from buttons and links; since the static case was automatically detected when action elements were nested in other action elements, now you need to check for usage of nested buttons/links in other action elements and possibly fix them using the new static variants.sbb-button
: thevariant
property has been removed and for each value, a new component has been created (e.g.sbb-button
,sbb-secondary-button
,sbb-tertiary-button
,sbb-transparent-button
); each of them has been further divided considering the behavior:href
set), replace it with<sbb{-variant}-button>
href
set), replace it with<sbb{-variant}-button-link>
isStatic
set), replace it with<sbb{-variant}-button-static>
sbb-button
in asbb-form-field
is not supported anymore; a new component namedsbb-mini-button
has been created to handle this specific casesbb-button
insbb-toast
with the newsbb-transparent-button
/sbb-transparent-button-link
, since the variant is not automatically set anymoresbb-link
has been split into nine components, based on type and variant:sbb-link
had an[href="..."]
, it migrates to<sbb{-variant}-link>
:<sbb-link href="...">
should be replaced with<sbb-block-link href="...">
<sbb-link href="..." variant="block">
should be replaced with<sbb-block-link href="...">
<sbb-link href="..." variant="inline" >
should be replaced with<sbb-link href="...">
sbb-link
did not have an[href="..."]
, it migrates to<sbb{-variant}-link-button>
<sbb-link>
should be replaced with<sbb-block-link-button>
<sbb-link variant="block">
should be replaced with<sbb-block-link-button>
<sbb-link variant="inline">
should be replaced with<sbb-link-button>
sbb-link
had an[is-static]
, it migrates to<sbb{-variant}-link-static>
<sbb-link is-static>
should be replaced with<sbb-block-link-static>
<sbb-link is-static variant="block">
should be replaced with<sbb-block-link-static>
<sbb-link is-static variant="inline">
should be replaced with<sbb-link-static>
sbb-action-group
now only acceptssbb-block-link | sbb-block-link-button
besides any<sbb-button>
variantsbb-link-list
now only acceptssbb-block-link | sbb-block-link-button
sbb-skiplink-list
now only acceptssbb-block-link | sbb-block-link-button
sbb-toast
now only acceptssbb-link | sbb-link-button | sbb-transparent-button | sbb-transparent-button-link
link-variables
SASS mixin renamed toblock-link-variables
,link-variables--negative
SASS mixin renamed toblock-link-variables--negative
,link-variables--inline
SASS mixin renamed tolink-variables
,link-variables--inline-negative
SASS mixin renamed tolink-variables--negative
link-inline-consolidation
SASS mixin renamed tolink-consolidation
,link-inline
SASS mixin renamed tolink
,link-inline-negative
SASS mixin renamed tolink-negative
Features
animation
property (#2507) (8b91eb8)animation
property (#2507) (8b91eb8)<sbb-form-field>
(#2506) (f8316f0), closes #2497sbb-overlay
component from dialog (#2477) (5ea4fb7), closes #2476 #2470sbb-stepper
component (#2491) (d389572)Bug Fixes
sbb-active
initializes correctly (#2493) (baede50)Miscellaneous Chores
Code Refactoring
lyne-components
intolyne-elements
and createlyne-elements-experimental
(edd3a73)sbb-screenreader-only
tosbb-screeen-reader-only
(#2520) (6fbf085)@sbb-esta/lyne-elements-experimental
(#2782) (1032e76)This PR was generated with Release Please. See documentation.