Skip to content

feat: shell #4639

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

Draft
wants to merge 65 commits into
base: main
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
65 commits
Select commit Hold shift + click to select a range
6fb9a77
feat: shell, control-panel, navigation
nmerget May 15, 2025
0ba1ee7
test: rename page to shell
nmerget May 15, 2025
c3c0ffb
test: rename page to shell
nmerget May 15, 2025
d640fe7
test: save WIP
nmerget May 15, 2025
d86d4f3
test: save WIP
nmerget May 15, 2025
407be04
test: save WIP
nmerget May 16, 2025
de2258a
Merge branch 'refs/heads/main' into feat-shell
nmerget May 19, 2025
4e5aa3b
test: save WIP
nmerget May 19, 2025
96844d9
test: save WIP
nmerget May 20, 2025
f14863a
feat: add scroll arrows for horizontal desktop navigation
nmerget May 26, 2025
77f235e
fix: issue with scroll buttons
nmerget May 27, 2025
8afcb59
Merge remote-tracking branch 'origin/main' into feat-shell
nmerget May 27, 2025
aabf408
feat: add mobile control panel
nmerget May 27, 2025
84fa3b6
Merge remote-tracking branch 'origin/main' into feat-shell
nmerget May 30, 2025
1f588b5
chore: update from main
nmerget Jun 2, 2025
f888ede
chore: update layout to match for scrollable container with meta-navi…
nmerget Jun 2, 2025
60ed312
feat: add sub navigation for shell
nmerget Jun 2, 2025
9874857
fix: remaining issues for sub-navigation
nmerget Jun 2, 2025
1305c3e
feat: add tree navigation
nmerget Jun 3, 2025
d1ed2cf
feat: add tree navigation
nmerget Jun 3, 2025
d218f49
chore: update scss
nmerget Jun 3, 2025
109d5f2
Merge remote-tracking branch 'origin/main' into feat-shell
nmerget Jun 3, 2025
1b8e053
fix: remaining issues with unallowed combinations
nmerget Jun 3, 2025
ef8f0bc
chore: add settings for shell+navigation
nmerget Jun 3, 2025
4f44cfa
chore: add configuration as query
nmerget Jun 4, 2025
910ce69
fix: building issues for react
nmerget Jun 4, 2025
de9fd39
chore: update shell for vue
nmerget Jun 4, 2025
a359541
feat: start supporting stencil and angulr shell
nmerget Jun 10, 2025
97177ac
chore: update from main
nmerget Jun 12, 2025
6af5577
chore: add new popovers for navigation
nmerget Jun 18, 2025
26d2e7c
chore: update control panel mobile
nmerget Jun 26, 2025
b13c428
chore: update navigation-item
nmerget Jun 30, 2025
76f46b7
feat: add shell-sub-navigation
nmerget Jul 15, 2025
cca3bf4
chore: rename ControlPanelProps
nmerget Jul 15, 2025
ed6550d
feat: add expanded prop for control panel
nmerget Jul 15, 2025
c20dd9a
chore: update floating components if they aren't absolute or fixed
nmerget Jul 17, 2025
e6397da
fix: issues for mobile shell
nmerget Jul 21, 2025
391e65b
refactor: rename db-puls to indicator
nmerget Jul 21, 2025
ba5edfa
Merge remote-tracking branch 'origin/main' into feat-shell
nmerget Jul 21, 2025
c3917a7
fix: merge issues from main
nmerget Jul 21, 2025
abf92c2
Merge remote-tracking branch 'origin/main' into feat-shell
nmerget Jul 21, 2025
1b63c7e
fix: remaining issues for all frameworks
nmerget Jul 21, 2025
562940f
Merge remote-tracking branch 'origin/main' into feat-shell
nmerget Jul 25, 2025
c482b31
fix: desktop issues
nmerget Jul 25, 2025
7f7d1b0
fix: navigation-item issues
nmerget Jul 25, 2025
ec3a851
refactor: renamed groupTitle to text for navigation-item
nmerget Jul 28, 2025
9be52e9
refactor: tree navigation
nmerget Jul 28, 2025
e3b0f30
feat: add flat icon navigation for control-panel-mobile
nmerget Jul 29, 2025
3e60793
Merge remote-tracking branch 'origin/main' into feat-shell
nmerget Jul 29, 2025
f67b7cd
fix: issue with patternhub build
nmerget Jul 29, 2025
b13452d
chore: update package-lock.json
nmerget Jul 29, 2025
8d5ba38
fix: issue with patternhub
nmerget Jul 29, 2025
ed0ed7c
fix: issue with patternhub
nmerget Jul 29, 2025
badc28f
chore: update whitelabel icon font
nmerget Jul 29, 2025
f02f005
fix: issue with drawer and sub-navigation
nmerget Jul 29, 2025
36ecdef
fix: issue with drawer and flat-icon-navigation
nmerget Jul 29, 2025
bdb351c
auto update snapshots (#4644)
github-actions[bot] Jul 29, 2025
a1c8aa4
docs: add migration for shell
nmerget Jul 30, 2025
5e4b990
Merge remote-tracking branch 'origin/feat-shell' into feat-shell
nmerget Jul 30, 2025
7579f06
docs: update playgrounds
nmerget Jul 30, 2025
0abf86e
chore: update tap-highlight
nmerget Jul 30, 2025
656f3d7
auto update snapshots (#4654)
github-actions[bot] Jul 30, 2025
7ef105b
fix: issues for SSR in NextJS
nmerget Jul 30, 2025
be320d9
Merge remote-tracking branch 'origin/feat-shell' into feat-shell
nmerget Jul 30, 2025
ee99579
fix: issues for SSR in NextJS
nmerget Jul 30, 2025
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
  •  
  •  
  •  
7 changes: 5 additions & 2 deletions .config/.jscpd.json
Original file line number Diff line number Diff line change
Expand Up @@ -48,17 +48,20 @@
"showcases/**/results/**",
"showcases/angular-showcase/.angular/cache",
"showcases/angular-showcase/.angular/cache/**",
"showcases/angular-showcase/src/app/app.component.html",
"showcases/angular-ssr-showcase/.angular/cache/**",
"showcases/next-showcase/pages/_app.tsx",
"showcases/nuxt-showcase/**",
"showcases/patternhub/out/**",
"showcases/react-showcase/src/components/checkbox/index.tsx",
"showcases/react-showcase/src/components/notification/index.tsx",
"showcases/react-showcase/src/components/notification/index.tsx",
"showcases/react-showcase/src/components/radio/index.tsx",
"showcases/react-showcase/src/components/radio/index.tsx",
"showcases/react-showcase/src/components/control-panel-desktop/index.tsx",
"showcases/shared/*.json",
"showcases/vue-showcase/src/components/form/Form.vue"
"showcases/vue-showcase/src/components/form/Form.vue",
"showcases/vue-showcase/src/App.vue",
"showcases/**/control-panel-desktop/**"
],
"absolute": true
}
94 changes: 4 additions & 90 deletions .github/workflows/release.yml
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
---
name: Test and publish to package registries after new GitHub release

# TODO: Revert this file before mergin to main

on:
release:
types: [published]
Expand All @@ -10,10 +12,6 @@ jobs:
uses: ./.github/workflows/00-init.yml
secrets: inherit

get-playwright-version:
uses: ./.github/workflows/01-get-playwright-version.yml
needs: [init]

get-publish-version:
uses: ./.github/workflows/01-get-publish-version.yml
needs: [init]
Expand All @@ -30,28 +28,10 @@ jobs:
uses: ./.github/workflows/01-build-packages.yml
needs: [init]

init-playwright:
uses: ./.github/workflows/01-init-playwright.yml
needs: [get-playwright-version]
with:
version: ${{ needs.get-playwright-version.outputs.version }}

build-outputs:
uses: ./.github/workflows/01-build-outputs.yml
needs: [build-packages]

test-components:
uses: ./.github/workflows/02-e2e.yml
needs: [build-packages, get-playwright-version]
with:
version: ${{ needs.get-playwright-version.outputs.version }}

test-foundations:
uses: ./.github/workflows/02-e2e-foundations.yml
needs: [build-packages, get-playwright-version]
with:
version: ${{ needs.get-playwright-version.outputs.version }}

build-showcase-stencil:
uses: ./.github/workflows/01-build-showcases.yml
needs: [build-packages]
Expand Down Expand Up @@ -101,48 +81,6 @@ jobs:
release: ${{ needs.get-publish-version.outputs.release }}
preRelease: ${{ needs.get-publish-version.outputs.preRelease }}

test-showcase-stencil:
uses: ./.github/workflows/02-e2e-showcases.yml
needs: [build-showcase-stencil, get-playwright-version]
with:
version: ${{ needs.get-playwright-version.outputs.version }}
showcase: stencil-showcase

test-showcase-angular:
uses: ./.github/workflows/02-e2e-showcases.yml
needs: [build-showcase-angular, get-playwright-version]
with:
version: ${{ needs.get-playwright-version.outputs.version }}
showcase: angular-showcase

test-showcase-react:
uses: ./.github/workflows/02-e2e-showcases.yml
needs: [build-showcase-react, get-playwright-version]
with:
version: ${{ needs.get-playwright-version.outputs.version }}
showcase: react-showcase

test-showcase-vue:
uses: ./.github/workflows/02-e2e-showcases.yml
needs: [build-showcase-vue, get-playwright-version]
with:
version: ${{ needs.get-playwright-version.outputs.version }}
showcase: vue-showcase

test-showcase-patternhub:
uses: ./.github/workflows/02-e2e-showcases.yml
needs: [build-showcase-patternhub, get-playwright-version]
with:
path: ${{ needs.build-showcase-patternhub.outputs.path }}
version: ${{ needs.get-playwright-version.outputs.version }}
showcase: patternhub

test-screen-reader:
uses: ./.github/workflows/02-e2e-screen-reader.yml
needs: [build-showcase-react, init-playwright, get-playwright-version]
with:
version: ${{ needs.get-playwright-version.outputs.version }}

checks-done:
if: ${{ always() }}
runs-on: ubuntu-24.04 # Use Ubuntu 24.04 explicitly
Expand All @@ -158,23 +96,7 @@ jobs:
resultBuildShowcaseNuxt="${{ needs.build-showcase-nuxt.result }}"
resultBuildShowcasePatternhub="${{ needs.build-showcase-patternhub.result }}"
resultBuildOutputs="${{ needs.build-outputs.result }}"
resultTestPackages="${{ needs.test-components.result }}"
resultTestFoundations="${{ needs.test-foundations.result }}"
resultTestShowcaseStencil="${{ needs.test-showcase-stencil.result }}"
resultTestShowcaseAngular="${{ needs.test-showcase-angular.result }}"
resultTestShowcaseReact="${{ needs.test-showcase-react.result }}"
resultTestShowcaseVue="${{ needs.test-showcase-vue.result }}"
resultTestShowcasePatternhub="${{ needs.test-showcase-patternhub.result }}"
resultTestScreenReader="${{ needs.test-screen-reader.result }}"
if [[ $resultTestFoundations == "success" ]] && \
[[ $resultTestScreenReader == "success" ]] && \
[[ $resultTestShowcaseStencil == "success" ]] && \
[[ $resultTestShowcaseAngular == "success" ]] && \
[[ $resultTestShowcaseReact == "success" ]] && \
[[ $resultTestShowcaseVue == "success" ]] && \
[[ $resultTestShowcasePatternhub == "success" ]] && \
[[ $resultTestPackages == "success" ]] && \
[[ $resultBuildOutputs == "success" ]] && \
if [[ $resultBuildOutputs == "success" ]] && \
[[ $resultBuildShowcaseStencil == "success" ]] && \
[[ $resultBuildShowcaseAngular == "success" ]] && \
[[ $resultBuildShowcaseAngularSSR == "success" ]] && \
Expand All @@ -199,15 +121,7 @@ jobs:
build-showcase-vue,
build-showcase-nuxt,
build-showcase-patternhub,
build-outputs,
test-components,
test-showcase-stencil,
test-showcase-angular,
test-showcase-react,
test-showcase-vue,
test-showcase-patternhub,
test-foundations,
test-screen-reader
build-outputs
]

deploy:
Expand Down
2 changes: 1 addition & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ showcases/patternhub/public/iframe-resizer/*
/__snapshots__/**/*-win32.png
/packages/foundations/scss/_normalize.scss
/packages/foundations/assets/icons/tmp/
/packages/foundations/assets/icons/fonts/**/index.html
/packages/foundations/assets/icons/fonts/**/*.html
/packages/foundations/assets/icons/fonts/**/index.css
/packages/foundations/assets/icons/fonts/**/font-face.css
/packages/foundations/assets/icons/fonts/**/info.json
Expand Down
1 change: 1 addition & 0 deletions .stylelintignore
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ output/
source/_patterns/**
showcases/patternhub/**
showcases/**/public/**
packages/foundations/assets/**
packages/foundations/scripts/generate-icon-fonts/styles/**
packages/foundations/scss/_normalize.scss
packages/stylelint/test/**
Expand Down
4 changes: 2 additions & 2 deletions LICENSE
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
The DB source code is licensed under the Apache License, Version 2.0, January 2004;
you may not use this file except in compliance with the License. You may obtain a copy
of the Apache License at https://apache.org/licenses/LICENSE-2.0. The DB source code
does not include any DB specific design assets like fonts, icons, trademarks, brandings, etc.
does not include any DB specific design assets like fonts, icons, trademarks, control-panel-brandings, etc.

All Deutsche Bahn AG (hereinafter “DB”) specific design assets like fonts, icons,
trademarks, brandings, etc. (hereinafter “DB Designs”) are licensed under the following
trademarks, control-panel-brandings, etc. (hereinafter “DB Designs”) are licensed under the following
license agreement (the “DB Designs License”):

- The DB Designs may only be used by external users who are acting as contractors or
Expand Down
6 changes: 3 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,7 @@ Check our migration docs for breaking changes:

> We've updated to the stable version of DB UX Design System (v3) version >= 1.x, and now the colors that were supposed to be red, are colored in blue (`514ec7`).

Please have a look at the [migration guide from version 0.6.x to version 0.7.x](https://github.com/db-ux-design-system/core-web/blob/main/docs/migration/v0.6.x-to-v0.7.x.md#removed-brand-assets), you need to install and reference the DB Theme, if you're building a website or web application for Deutsche Bahn.
Please have a look at the [migration guide from version 0.6.x to version 0.7.x](https://github.com/db-ux-design-system/core-web/blob/main/docs/migration/v0.6.x-to-v0.7.x.md#removed-control-panel-brand-assets), you need to install and reference the DB Theme, if you're building a website or web application for Deutsche Bahn.

## Things to keep in mind

Expand Down Expand Up @@ -136,7 +136,7 @@ Microsoft Teams (only available DB internally)</a>, or directly
at [[email protected]](mailto:[email protected]). <!-- markdownlint-disable MD033 -->
We're particularly keen to add as many examples to the behaviours as possible, to further clarify them.

## Deutsche Bahn brand
## Deutsche Bahn control-panel-brand

To perfectly support our users and customers on their digital journey, the use of the Deutsche Bahn brand and trademarks is subject
to clear guidelines and restrictions even when used with the code provided by this product. Deutsche Bahn fully reserves all
Expand All @@ -148,7 +148,7 @@ Marketingportal, you'll agree with
the ["Allgemeine Nutzungsbedingungen für das DB-Marketingportal" (german)](https://marketingportal.extranet.deutschebahn.com/marketingportal/Nutzungsbedingungen-9702684#)
in case of using them.

For any usage outside of Deutsche Bahn websites and applications you aren't allowed to use any Deutsche Bahn brand and
For any usage outside of Deutsche Bahn websites and applications you aren't allowed to use any Deutsche Bahn control-panel-brand and
design assets as well as protected characteristics and trademarks, that for not including the DB Theme.

## Contributions
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Loading