refactor: exclude default theme for core-foundations

[nmerget]

Proposed changes

exclude default theme for core-foundations

Types of changes

• Bugfix (non-breaking change that fixes an issue)
• New feature (non-breaking change which adds functionality)
• Refactoring (improvements to existing components or architectural decisions)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Documentation Update (if none of the other choices apply)

Further comments

🔭🐙🐈 Test this branch here: https://design-system.deutschebahn.com/core-web/review/refactor-exclude-default-theme

[changeset-bot]

🦋 Changeset detected

Latest commit: 16f867a

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 10 packages

Name	Type
@db-ux/core-foundations	Minor
@db-ux/core-components	Minor
@db-ux/ngx-core-components	Minor
@db-ux/react-core-components	Minor
@db-ux/wc-core-components	Minor
@db-ux/v-core-components	Minor
@db-ux/core-stylelint	Minor
@db-ux/core-migration	Minor
@db-ux/agent-cli	Minor
@db-ux/core-eslint-plugin	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[mfranzke]

Suggested change

	**No!** The `@db-ux/core-components` package **automatically includes** all the foundations (`@db-ux/core-foundations`) you need. You only need to include one package:
	**No!** The `@db-ux/core-components` package **automatically includes** all the foundations (`@db-ux/core-foundations`) you need. You only need to install one package:

I think "install" was perfectly fine here, as it even also referes to the question ("✅ Do I need foundations if I install components?") above.

[nmerget]

No it wasn't. If you use pnpm you have to install both packages otherwise it would fail. You only need to include one of them

[mfranzke]

Suggested change

	/* You may want to include another theme here, this is a whitelabel theme! */
	/* You may want to include another theme here, this is a whitelabel theme! So instead of including the following line of code, please have a look at the DB Theme section */

I'm still struggling whether we should mention this at all (for now) in our docs as it doesn't provide any value to our current consumers.

[Copilot]

Pull request overview

Refactors how the design system’s styles are consumed by splitting “theme tokens” from “bundle/defaults” in @db-ux/core-foundations, adjusting component/style entrypoints, and updating showcases to use a single layered CSS import while removing sa11y from the showcases.

Changes:

• Introduces theme/* SCSS/CSS entrypoints and moves asset-path configuration into packages/foundations/scss/theme/*.
• Adds a consolidated showcases/db-ux.css that layers DB Theme and Core Components, and updates showcases to import it (removing sa11y usage/deps).
• Updates docs and visual regression snapshot baselines to reflect the new style composition.

Reviewed changes

Copilot reviewed 28 out of 221 changed files in this pull request and generated 7 comments.

Show a summary per file

File	Description
showcases/vue-showcase/src/main.ts	Switches showcase styling import to shared db-ux.css; removes sa11y init.
showcases/vue-showcase/package.json	Removes sa11y dependency.
showcases/stencil-showcase/src/styles.css	Imports shared db-ux.css instead of per-package rollup CSS imports.
showcases/react-showcase/src/main.tsx	Switches to shared db-ux.css; removes sa11y and env bootstrap snippet.
showcases/react-showcase/package.json	Removes sa11y dependency.
showcases/patternhub/styles/globals.scss	Switches forwarded core-components styles from webpack to bundle.
showcases/db-ux.css	Adds layered, single-entry import for db-theme + core-components bundle.
showcases/angular-showcase/src/styles.css	Imports shared db-ux.css; removes sa11y CSS import.
showcases/angular-showcase/src/sa11y.d.ts	Removes sa11y module declarations.
showcases/angular-showcase/src/main.ts	Removes sa11y init and isDevMode usage.
showcases/angular-showcase/package.json	Removes sa11y dependency block.
packages/foundations/scss/theme/webpack.scss	Adds new theme entrypoint for webpack asset paths + relative theme forwarding.
packages/foundations/scss/theme/rollup.scss	Adds new theme entrypoint for rollup asset paths + relative theme forwarding.
packages/foundations/scss/theme/relative.scss	Refactors theme to forward default properties + fonts/icons; removes [data-mode] default.
packages/foundations/scss/theme/absolute.scss	Adds new theme entrypoint for absolute asset paths + relative theme forwarding.
packages/foundations/scss/theme/_webpack.assets-paths.scss	Adds webpack asset path configuration module.
packages/foundations/scss/theme/_rollup.assets-paths.scss	Adds rollup asset path configuration module.
packages/foundations/scss/theme/_default.assets-paths.scss	Adds default asset path variables used by fonts/icons.
packages/foundations/scss/theme/_absolute.assets-paths.scss	Adds absolute asset path configuration module.
packages/foundations/scss/relative.scss	Removes old “relative” aggregator entrypoint.
packages/foundations/scss/icons/webpack.scss	Points icons webpack entrypoint to new theme asset-path module.
packages/foundations/scss/icons/rollup.scss	Points icons rollup entrypoint to new theme asset-path module.
packages/foundations/scss/icons/relative.scss	Uses new theme/default.assets-paths module for icon URLs.
packages/foundations/scss/icons/absolute.scss	Points icons absolute entrypoint to new theme asset-path module.
packages/foundations/scss/fonts/webpack.scss	Points fonts webpack entrypoint to new theme asset-path module.
packages/foundations/scss/fonts/rollup.scss	Points fonts rollup entrypoint to new theme asset-path module.
packages/foundations/scss/fonts/relative.scss	Uses new theme/default.assets-paths module for font URLs.
packages/foundations/scss/fonts/absolute.scss	Points fonts absolute entrypoint to new theme asset-path module.
packages/foundations/scss/bundle.scss	Adds default container properties + [data-mode] default background extend into bundle.
packages/foundations/README.md	Updates documentation to new “theme + bundle” import model (needs follow-up fixes).
packages/components/src/styles/webpack.scss	Deprecates and forwards to bundle (behavior change).
packages/components/src/styles/rollup.scss	Deprecates and forwards to bundle (behavior change).
packages/components/src/styles/relative.scss	Deprecates and forwards to bundle (behavior change).
packages/components/src/styles/bundle.scss	Adds new SCSS bundle entrypoint forwarding foundations bundle + optionals.
packages/components/src/styles/absolute.scss	Deprecates and forwards to bundle (behavior change).
packages/components/README.md	Updates docs to new import model (optimize snippet needs correction).
package-lock.json	Removes sa11y (and transitive deps) from lockfile; updates lock metadata.
snapshots/icon/showcase/mobile-chrome/DBIcon-should-match-screenshot-1/DBIcon-should-match-screenshot.png	Updates visual regression baseline.
snapshots/icon/showcase/chromium/DBIcon-should-match-screenshot-1/DBIcon-should-match-screenshot.png	Updates visual regression baseline.
snapshots/icon/showcase/chromium-highContrast/DBIcon-should-match-screenshot-1/DBIcon-should-match-screenshot.png	Updates visual regression baseline.
snapshots/foundations/chromium/Fonts-should-match-screenshot-1/Fonts-should-match-screenshot.png	Updates visual regression baseline.
snapshots/brand/showcase/mobile-chrome/DBBrand-should-match-screenshot-1/DBBrand-should-match-screenshot.png	Updates visual regression baseline.
snapshots/brand/showcase/chromium-highContrast/DBBrand-should-match-screenshot-1/DBBrand-should-match-screenshot.png	Updates visual regression baseline.

Comments suppressed due to low confidence (1)

packages/components/README.md:81

• In the “Optimize dependencies” example, the comment says “The theme contains all props required…”, but the code imports @db-ux/core-foundations/build/styles/bundle.css. A theme should come from build/styles/theme/<variant>.css; otherwise the tokens (CSS custom properties) are missing and components won’t render correctly. Please update the snippet/comment accordingly.

[mfranzke]

towards how those have been included previously, you've switched the order (from core-components, than db-theme to db-theme, than core) and added @layer. Is it because the order doesn't matter anymore? Even though that we've removed a lot of CSS Custom Properties, I would have expected that the DB Theme should still overwrite Core Components declarations.

[nmerget]

Before we include the whitelabel-theme inside the db-ux layer, that was the reason we had to overwrite it. But we removed the whitelabel-theme so we don't need to overwrite anything anymore.

Using a theme as the first layer makes more sense in general

[mfranzke]

why do we still keep this screenshot included, when will it ever change ?

[mfranzke]

why do we still keep this screenshot included, when will it ever change ?