| ☝️ | From now on we'll only document our changes within the repositories releases page. |
|---|
All notable changes to this project will be documented in this file.
The format is based on Keep a Changelog and this project adheres to Semantic Versioning. And the commit guidelines from Conventional Commits are being used.
Regarding BREAKING CHANGES in between, please have a look into the migration guide.
And we're still hosting the CHANGELOG for any changes up until version 2.0.0 within our internal Git: https://db.de/lwfv2o (you need to be logged in to our Deutsche Bahn VPN for these informations)
This part includes all of the changes from @db-ui/db-ui-core@1.x to @db-ui/core@2.0.0 – this summarizes the changes out of the previous prereleases, and is especially only including the relevant aspects for consumers of our package (so we've left out the DB UI Core contributors relevant aspects).
All of the breaking changes and relevant changes are listed in the migration guide.
- Checkbox:
indeterminatestate - Select: Variants, adapted from the new input variants
- Tables: Possibility to define
densities, the header to stay "sticky", borders around the cells, the content alignment within the cells, and control the font-size with a CSS variable (--table---fontSize). - DB Screen Head webfont
- Cards: Added first variant type
banner - Possibility to differentiate on which fonts to reference locally
- Enabled full width display of content on load within the pattern lab UI
- Enabled all patterns to build as CSS partials via
sass - SCSS mixin wrappers for the SCSS placeholders
%a11y-visually-hiddenand%clearfix, mainly for being able to both provide CSS partials as well as the concenated files - Possibility to provide an icons path as a CSS variable for selected SVG references
- Textarea and input: variants (
semitransparent,white,solidandoutline) - Tags: Added the possibility to set
sizeandvariantviadata-attributes
In general we've introduced the possibility to control variants and configurations on elements and components with HTML data-attributes, that we're previously only available via SCSS mixins or @extends.
- BREAKING CHANGE: All remaining brand colors have been removed from DB UI Core and will be used from the consumed DB UI Base product. This mainly means a breaking change to you if you've imported the colors
SCSSfiles directly in your codebase. - BREAKING CHANGE: Removed the two older colors SCSS variables
$red-500and$DBred - BREAKING CHANGE: Removed odd / "in-between" colors, as those have been removed from the guidelines (and that for from DB UI Base as well)
$color-secondary-red-380$color-secondary-cool-gray-133$color-secondary-cool-gray-166$color-secondary-cool-gray-250$color-secondary-cool-gray-350$color-secondary-cool-gray-450$color-secondary-cool-gray-550
- BREAKING CHANGE:
to-remandto-emhelper SCSS functions parameter expect values by type number - BREAKING CHANGE: Some sizes and variants of the button element have changed or been removed
- BREAKING CHANGE: The two alternative colors of the radio element have been removed
- BREAKING CHANGE: The seven alternative colors of the checkbox element have been removed
- BREAKING CHANGE: The two alternative colors of the toggle element have been removed
- BREAKING CHANGE: The thiner height of the progress element has been removed this element has now two variants
- BREAKING CHANGE: Some variants values of the notification element have changed or been removed and changed from class to
data-attributes - BREAKING CHANGE: The two classes on button elements within the dialog component should be migrated to the new
data-variantattribute for buttons - BREAKING CHANGE: The cards components HTML code has changed
- BREAKING CHANGE: We've switched from the deprecated
node-sassdependency tosass, which is officially its successor. We suggest that if you're still usingnode-sassin your projects to even also do the move, which should be in general quite easy, compare to e.g. the instructions by the stackblitz team: https://developer.stackblitz.com/docs/platform/turbo/#how-do-i-migrate-to-dart-sass Please keep in mind, that you would need to provide yournode_modulesfolder as a load path or include path (e.g.--load-path=node_moduleson thesassCLI usage), see the migration guide Your builds should most likely still work withnode-sass(at least if you're resolving the load path ofnode_modulesby yourself, e.g. with--include-path=node_moduleswhen using the CLI), but the support might break the sooner the later. - BREAKING CHANGE: The colors CSS variables will get provided by
DB UI Basedirectly, so there's nothing we could deliver by our product for this. If you were referencing those files previously, please consume them fromDB UI Basefrom now on. - BREAKING CHANGE: Removed the already deprecated enterprise specific as well as the seperate transporation icon set. These have been integrated into the general DBUX iconset.
- BREAKING CHANGE: All Design Tokens are now being rendered with a
db-prefix. (see the migration guide) - BREAKING CHANGE: All
primary,secondary,feedback,poiandtransportationcolors got this category (primary,secondaryandtransportation) removed from their name, so e.g.$color-secondary-red-500became$db-color-red-500. (see the migration guide) - BREAKING CHANGE (Fonts):
--font-family-sans-serifCSS variable has been moved to DB UI Base and is now called--db-font-family-base - BREAKING CHANGE (Icons, see the migration guide):
- Moved all icon assets from
dist/images/iconstodist/iconsand even a better subfolder structure in there, and as well retrieving those by DB UI Base package, pathnode_modules/@db-ui/base/build/assets/icons/. - And in case you're referencing those directly as SVG files, you need to change the select from the icon specific name to the id
#icon. - As well as change the CSS variable names to control the line and pulse color within the icons from
--iconColorto--db-icon-colorand from--iconPulseColorto--db-icon-pulse-color.
- Moved all icon assets from
- BREAKING CHANGE:
source/_patterns/01-elements/link/link.scsshas been renamed tosource/_patterns/01-elements/link/_links.scss- you most likely haven't included this file directly, but the file within theenterprisesubdirectory, so this shouldn't be relevant for most of you - BREAKING CHANGE: The stateful
tagtypes (a.elm-tagandinput.elm-tag) have been moved to a new pattern, as defined within the DB UX Design System specification:chips(see the migration guide) - Introduced SCSS variable
$icons-pathin addition to$images-pathand$fonts-path, as we might need to differentiate here DB UI Baseto be an optional config, as it wouldn't get installed and people might want to use the SASS source files for compilation- A lot of elements and components got their new styling: buttons, checkbox, headlines, input, links, progress, radio, select, textarea, toggle switch, breadcrumb, cards, dialog, dropdown, links, notification, overflow menu, pagination, table
- BREAKING CHANGE Expander: This component got renamed to "Accordion" and could include one or more content elements
- BREAKING CHANGE / Polyfills: As both
details/summaryanddialogelements reached great support in modern browsers these days, we're only including those for demo purposes from now on, but not as regulardependenciesany more. - The DB Webfonts files have been updated
- refactor: removing last
bulmaremains. While this is still a great framework, our codebase is now mature enough to even also work without it. [!350] - The DB Webfonts files have been updated
- Spinner: Removed obsolete box-shadow
- icons in buttons aren't supposed to get styled in
font-weightbold
- BREAKING CHANGE / Icons: Changed undocumented CSS Variables
--icon-margin-leftand--icon-margin-rightto--icon-margin-beforeand--icon-margin-after - refactor: icon margins
- Button border styling
- Further hints regarding SCSS consumption (especially on migrating from DB UI Core version 1 to 2)
- Hardening the font size calculation functions
- Checkbox & Radio: Incorrect space in between these elements and their labels
- Ensuring correct execution of SCSS functions, that would elsewhere get rendered to the CSS output directly
- updated files & folders documentation
- removed undocumented and obsolete component
Toasts, that is included in the new DB UX Design System asNotificationcomponent anyhow - further optimized the general projects files definitions within
package.json
- Integrating the
dialog-polyfillCSS only for demo purposes [#288], but not including it in the CSS anymore