Skip to content
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

chore(main): release 1.0.0 #2828

Conversation

github-actions[bot]
Copy link
Contributor

🤖 I have created a release beep boop

1.0.0 (2024-06-25)

⚠ BREAKING CHANGES

  • sbb-teaser-hero, sbb-teaser-paid: sbb-teaser-hero and sbb-teaser-paid are now part of the @sbb-esta/lyne-elements-experimental package.
  • sbb-tab: the sbb-tab-title component has been renamed to sbb-tab-label. A new component named sbb-tab has been created, and it is now the only supported tag for the tab's content; article, section and div are not supported anymore. To solve the issue [Feature request]: Add details to tab click event #1351, the didChange event on sbb-tab-group now includes an object which contains the currently selected tab index, the sbb-tab-label component and related sbb-tab component, plus, if available, the previous ones.
  • sbb-selection-panel, sbb-checkbox, sbb-radio-button: sbb-selection-panel has been renamed to sbb-selection-expansion-panel. The sbb-checkbox and sbb-radio-button components cannot be used anymore with sbb-selection-expansion-panel (does not apply for cases where they are slotted inside the content slot). As a replacement, we introduce the new components sbb-checkbox-panel and sbb-radio-button-panel, which could also be used standalone in cases where there is no content. sbb-checkbox-group and sbb-radio-button-group also support the panel variants. How to migrate?
    • Rename usages of sbb-selection-panel to sbb-selection-expansion-panel.
    • Inside the sbb-selection-expansion-panel, replace sbb-checkbox with sbb-checkbox-panel and sbb-radio-button with sbb-radio-button-panel (does not apply for cases where they are slotted inside the content slot of the sbb-selection-expansion-panel)
    • In cases where there was no content (slot), don't use sbb-selection-panel/sbb-selection-expansion-panel anymore, but directly use sbb-checkbox-panel or sbb-radio-button-panel.
  • sbb-checkbox, sbb-radio-button: sbb-selection-panel has been renamed to sbb-selection-expansion-panel. The sbb-checkbox and sbb-radio-button components cannot be used anymore with sbb-selection-expansion-panel (does not apply for cases where they are slotted inside the content slot). As a replacement, we introduce the new components sbb-checkbox-panel and sbb-radio-button-panel, which could also be used standalone in cases where there is no content. sbb-checkbox-group and sbb-radio-button-group also support the panel variants. How to migrate?
    • Rename usages of sbb-selection-panel to sbb-selection-expansion-panel.
    • Inside the sbb-selection-expansion-panel, replace sbb-checkbox with sbb-checkbox-panel and sbb-radio-button with sbb-radio-button-panel (does not apply for cases where they are slotted inside the content slot of the sbb-selection-expansion-panel)
    • In cases where there was no content (slot), don't use sbb-selection-panel/sbb-selection-expansion-panel anymore, but directly use sbb-checkbox-panel or sbb-radio-button-panel.
  • type 'SbbDialogCloseEventDetails' has been renamed to 'SbbOverlayCloseEventDetails'
  • The half-public data-now attribute has become a public 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 attribute data-now to now. The property now 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 attribute data-now to now. The property now has to be in the format "HH:MM:SS".
  • Lyne components and Lyne 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:
    • sbb-journey-summary
    • sbb-pearl-chain
    • sbb-pearl-chain-time
    • sbb-pearl-chain-vertical
    • sbb-pearl-chain-vertical-item
    • sbb-timetable-duration
    • sbb-timetable-row
  • sbb-link: Due to screen reader limitations, we had to move the link role inside the Shadow DOM. Therefore, for the following components, replace the [aria-label] usages with [accessibility-label] attribute or accessibilityLabel 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
  • As we split up the former typography.css into smaller consumable modules, we had to change the names of some files.
    • Renamed typography.css to standard-theme.css. Notice: there is still a file called typography.css that contains only a few typography-related outputs. Therefore, import adaption from typography.css to standard-theme.css is mandatory.
    • Changed the name of fullfont.css to font-characters-extension.css.
  • Replaced Roman, Bold, and Light font-face variants with the single SBB font. Using CSS font-weight property automatically selects the correct font family. Migration guide:
    • Replace font-family: "SBBWeb Roman", ... with font-family: "SBB", ... and use font-weight: normal (potentially not necessary as normal is the default).
    • Replace font-family: "SBBWeb Bold", ... with font-family: "SBB", ... and use font-weight: bold or CSS class sbb-text--bold.
    • Replace font-family: "SBBWeb Light", ... with font-family: "SBB", ... and use font-weight: 300.
    • Replace CSS variable --sbb-typo-type-face-sbb-roman with --sbb-typo-font-family and use font-weight: normal (potentially not necessary as normal is the default).
    • Replace CSS variable --sbb-typo-type-face-sbb-bold with --sbb-typo-font-family and use font-weight: bold.
    • Replace CSS variable --sbb-typo-type-face-sbb-light with --sbb-typo-font-family and use font-weight: 300.
  • alert: Removed disable-animation property. Use animation='none' instead.
  • notification: Removed disable-animation property. Use animation='none' instead or depending on the case 'open' or 'close'.
  • disable-animation: Add the sbb-disable-animation CSS class to disable animations for the element and all its children. Consequently, all disable-animation properties of the following components have been removed.
    • Removed disable-animation property from sbb-accordion
    • Removed disable-animation property from sbb-alert
    • Removed disable-animation property from sbb-autocomplete
    • Removed disable-animation property from sbb-datepicker-toggle
    • Removed disable-animation property from sbb-dialog
    • Removed disable-animation property from sbb-expansion-panel
    • Removed disable-animation property from sbb-image
    • Removed disable-animation property from sbb-loading-indicator
    • Removed disable-animation property from sbb-menu
    • Removed disable-animation property from sbb-navigation
    • Removed disable-animation property from sbb-navigation-section
    • Removed disable-animation property from sbb-notification
    • Removed disable-animation property from sbb-overlay
    • Removed disable-animation property from sbb-popover
    • Removed disable-animation property from sbb-select
    • Removed disable-animation property from sbb-selection-panel
    • Removed disable-animation property from sbb-sticky-bar
    • Removed disable-animation property from sbb-toast
    • Removed disable-animation property from sbb-toggle
  • The entry points for the @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: The sbb-dialog component now needs the dedicated inner elements sbb-dialog-title, sbb-dialog-content, and sbb-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 new sbb-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 the sbb-overlay component: <sbb-overlay><p>Overlay content.</p></sbb-overlay>.
  • Changed several internal class names. Consumers shouldn't be affected.
  • sbb-form-field: The css var --sbb-form-field-height has been renamed to --sbb-form-field-min-height.
  • sbb-form-field: 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>
  • renamed component sbb-screenreader-only to sbb-screeen-reader-only.
  • sbb-calendar:
  • sbb-navigation: The active property of <sbb-navigation-button>/<sbb-navigation-link> (former <sbb-navigation-action>) has been removed. Add the CSS class sbb-active to the corresponding button/link, to mark it as active. Additionally, whenever sbb-active class is set in navigation, the corresponding navigation section, if one is connected, automatically opens.
  • The action element refactoring brings a couple of breaking changes:
    • The following components have been split into two components. One with pure button and one with pure link behavior:
      • sbb-card-action: split in sbb-card-button and sbb-card-link
      • sbb-header-action: split in sbb-header-button and sbb-header-link
      • sbb-menu-action: split in sbb-menu-button and sbb-menu-link
      • sbb-navigation-action: split in sbb-navigation-button and sbb-navigation-link
    • The 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: the variant 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:
      • If the component was used as a button (no href set), replace it with <sbb{-variant}-button>
      • If the component was used as a link (href set), replace it with <sbb{-variant}-button-link>
      • If the component was nested into another action element (isStatic set), replace it with <sbb{-variant}-button-static>
    • The usage of an icon-only sbb-button in a sbb-form-field is not supported anymore; a new component named sbb-mini-button has been created to handle this specific case
    • Check and replace any sbb-button in sbb-toast with the new sbb-transparent-button/sbb-transparent-button-link, since the variant is not automatically set anymore
    • sbb-link has been split into nine components, based on type and variant:
      • If 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="...">
      • If 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>
      • If 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 accepts sbb-block-link | sbb-block-link-button besides any <sbb-button> variant
    • sbb-link-list now only accepts sbb-block-link | sbb-block-link-button
    • sbb-skiplink-list now only accepts sbb-block-link | sbb-block-link-button
    • sbb-toast now only accepts sbb-link | sbb-link-button | sbb-transparent-button | sbb-transparent-button-link
    • SASS mixin renamings:
      • link-variables SASS mixin renamed to block-link-variables,
      • link-variables--negative SASS mixin renamed to block-link-variables--negative,
      • link-variables--inline SASS mixin renamed to link-variables,
      • link-variables--inline-negative SASS mixin renamed to link-variables--negative
      • link-inline-consolidation SASS mixin renamed to link-consolidation,
      • link-inline SASS mixin renamed to link,
      • link-inline-negative SASS mixin renamed to link-negative

Features

  • add 'now' property instead of data-now attribute (#2674) (94c25b1)
  • add default entries for style exports in package.json (#2643) (73271e2)
  • add root entry point with global component registration (#2641) (3572fa9)
  • alert: add animation property (#2507) (8b91eb8)
  • button variant refactoring (98ea7f5)
  • button: implemented size 'S' (#2544) (396d4dc)
  • file-selector: add size s (#2685) (6783621)
  • implement experimental support for server side rendering (SSR) (#2466) (3abcc68)
  • journey-header: add size s (#2656) (610ef3a)
  • notification: add animation property (#2507) (8b91eb8)
  • notification: add size 's' (#2606) (cf97ecd)
  • provide full font characters set as alternative (#2573) (4047883)
  • reduce font-faces to the single SBB variant (#2618) (679d9e9)
  • sbb-accordion, sbb-expansion-panel: add size s (#2603) (015201d)
  • sbb-alert: add size s (#2591) (3a82c67)
  • sbb-card: introduce new color for active state (#2462) (6553d6b)
  • sbb-checkbox, sbb-radio-button: split into regular and panel variants (#2552) (2ad13f4)
  • sbb-container: allow expanded background color (#2640) (2854e8e)
  • sbb-form-field: support the textarea inside the &lt;sbb-form-field&gt; (#2506) (f8316f0), closes #2497
  • sbb-image: provide load and error events (#2725) (56ae5b1)
  • sbb-lead-container: add support for sbb-alert-group (#2719) (3d556f9), closes #2714
  • sbb-lead-container: initial implementation (#2672) (bb1f3a8)
  • sbb-navigation: remove navigation section divider (#2473) (71c1412)
  • sbb-overlay: extract sbb-overlay component from dialog (#2477) (5ea4fb7), closes #2476 #2470
  • sbb-popover: change close button size (#2688) (1f259be)
  • sbb-selection-panel: increase border width for active state (#2463) (4c4bf5c), closes #2461
  • sbb-stepper: introduce sbb-stepper component (#2491) (d389572)
  • sbb-sticky-bar: allow configuration of z-index (#2566) (20a98b2)
  • sbb-sticky-bar: allow overlapping to the following content (#2459) (9518dfd)
  • sbb-tab-group: add size s variant (#2683) (c00aa58)
  • sbb-table-wrapper: initial implementation (#2715) (d6aaf68)
  • sbb-tag, sbb-tag-group: add size s variant (#2664) (6291bdc)
  • sbb-toggle-check: add size 'xs' (#2724) (7415aeb)
  • split CSS outputs into smaller modules (#2615) (646e5a4)
  • update size tokens (#2551) (74d8929)

Bug Fixes

  • adapt lyne tokens change (#2582) (94bf4f0)
  • adapt react package import paths missed during migration (#2589) (0781c6a)
  • avoid breaking type declarations due to alias resolution (#2776) (be72249)
  • disabled and focused state in mini-button mixin (#2799) (5797419)
  • enable next.js 14 support and add some upstream fixes (#2613) (341b7ce)
  • fix boolean handling in react wrapper (#2547) (e4ba04b)
  • fix button dts files (#2485) (2228a02)
  • fix imports of common styles (#2475) (fda1960)
  • fix lead container tests (d6355dd)
  • fix order of class decorators (#2489) (580b56f)
  • fix scrollbar styles for Chrome (#2524) (1266a21)
  • fix stacked overlays inert mechanism (#2736) (b611271)
  • fix unresolved sass imports (#2483) (964ab42)
  • prefix all css variable names (#2609) (788cef7)
  • prevent stack overflow with attribute changes (#2661) (4b382ed)
  • revert mangle configuration from build (239a6a1)
  • revert split of sbb-checkbox and sbb-radio-button (ebe391f)
  • sbb-alert: improve SSR hydration support (#2650) (1b09429)
  • sbb-block-link: always show underline except for footer links (#2705) (5fbedd2)
  • sbb-breadcrumb: avoid to collapse for two or fewer breadcrumbs (#2733) (ecdb355)
  • sbb-button: fix gap between icon and text for size s (#2678) (38efbd8)
  • sbb-button: remove gap for hidden icons in icon slot (#2526) (433c57c)
  • sbb-calendar: align month view label (#2564) (0215e00)
  • sbb-checkbox, sbb-toggle-check: enable attribute mutation after form reset (#2505) (6bd8924)
  • sbb-container: fix background color for nested containers (#2611) (c9f0e0e)
  • sbb-datepicker: handle hydration correctly (#2721) (058489a), closes #2691
  • sbb-dialog: fix accessibility with option to hide the header on scroll (159f536)
  • sbb-dialog: fix dialog-content z-index (#2722) (55b3446)
  • sbb-dialog: fix z-index (#2572) (374d7b7)
  • sbb-dialog: show all content if header is always present (#2637) (924fa37), closes #2635
  • sbb-form-error: fix internal css variable name (#2558) (cc275af)
  • sbb-form-field: remove label property and attribute (#2523) (602064c)
  • sbb-header: fix header shadow on keyboard navigation (#2508) (3eefbea)
  • sbb-image: fix alt attribute and provide css var for aspect-ratio (#2607) (54d3192)
  • sbb-image: render URL correctly with SSR (#2712) (fde1700)
  • sbb-link: fix accessibility by inlining link functionality into Shadow DOM (52344e9)
  • sbb-loading-indicator: fix sizes of loading indicator (#2630) (a1270b2)
  • sbb-navigation-section: ensure sbb-active initializes correctly (#2493) (baede50)
  • sbb-navigation: fix active and focus handling (#2471) (ea81790)
  • sbb-navigation: fix navigation actions contrast ratio (#2481) (f605a1e)
  • sbb-option: correctly determine highlight state with SSR (#2713) (d2d253c), closes #2689
  • sbb-overlay: consider sbb-overlay as overlay in inert mechanism (#2588) (4ecc125)
  • sbb-radio-button: fix checked initialization (#2692) (abdaf43)
  • sbb-selection-panel: fix transition of border-width (#2468) (8300b7f)
  • sbb-selection-panel: fix transition of border-width [second attempt] (#2469) (942bf45)
  • sbb-status: fix flex behavior in Firefox (#2479) (92d7492)
  • sbb-tab-group: avoid unwanted margin block spaces (#2628) (87d10d8)
  • sbb-tab-group: fix nested tab groups logic (#2816) (4674a61)
  • sbb-teaser-hero: use auto hyphens for title text to avoid overflow (#2581) (3b8844c)
  • sbb-toggle: fix event timing (#2646) (6da2d26)
  • sbb-train-formation: hide sectors row if no sectors were defined (#2779) (b011a92)
  • set colspan properly (0215e00)
  • stories with label bold for sbb-checkbox and sbb-radio-button (#2528) (9e85be5)
  • update import paths missed in the migration (#2579) (9c90fa8)
  • use valid import/export syntax (#2563) (585cfc5)
  • verify SSR functionality (#2805) (1095121)

Miscellaneous Chores

Code Refactoring

  • create base class for overlay functionality (#2599) (2059719)
  • disable-animation: migrate disable-animation mechanism (#2507) (8b91eb8)
  • re-structure common behaviors (#2533) (906d576), closes #2534
  • rename lyne-components into lyne-elements and create lyne-elements-experimental (edd3a73)
  • rename component name from sbb-screenreader-only to sbb-screeen-reader-only (#2520) (6fbf085)
  • restructure entry points (#2575) (3d4c8ab)
  • sbb-calendar: implement initial support for other date libraries (#2511) (6d4e9c2)
  • sbb-navigation: improve active handling and focus (4f8f309)
  • sbb-selection-panel, sbb-checkbox, sbb-radio-button: split into regular and panel variants (#2778) (d206926)
  • sbb-tab: align with sbb-stepper (#2744) (4305ca8)
  • sbb-teaser-hero, sbb-teaser-paid: move to @sbb-esta/lyne-elements-experimental (#2782) (1032e76)

This PR was generated with Release Please. See documentation.

@kyubisation kyubisation deleted the release-please--branches--main--components--lyne-elements branch June 25, 2024 15:57
@github-actions github-actions bot added the pr: peer review required A peer review is required for this pull request label Jun 25, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
autorelease: pending pr: peer review required A peer review is required for this pull request
Projects
None yet
1 participant