diff --git a/packages/components/src/components/telekom/telekom-profile-menu/telekom-profile-menu.css b/packages/components/src/components/telekom/telekom-profile-menu/telekom-profile-menu.css
index 880e05a2a8..c5f71e4817 100644
--- a/packages/components/src/components/telekom/telekom-profile-menu/telekom-profile-menu.css
+++ b/packages/components/src/components/telekom/telekom-profile-menu/telekom-profile-menu.css
@@ -68,7 +68,7 @@ scale-telekom-profile-menu scale-menu-flyout {
height: 12px;
}
-.scale-telekom-nav-item > button {
+scale-telekom-profile-menu .scale-telekom-nav-item > button {
padding-bottom: var(--_spacing-bottom-slotted-bottom);
}
diff --git a/packages/components/src/components/telekom/telekom-profile-menu/telekom-profile-menu.tsx b/packages/components/src/components/telekom/telekom-profile-menu/telekom-profile-menu.tsx
index 598db4e56e..ca72410d3c 100644
--- a/packages/components/src/components/telekom/telekom-profile-menu/telekom-profile-menu.tsx
+++ b/packages/components/src/components/telekom/telekom-profile-menu/telekom-profile-menu.tsx
@@ -165,7 +165,7 @@ export class TelekomProfileMenu {
buildLogoutButton() {
return {
type: 'button',
- name: this.logoutLabel,
+ name: this.logoutLabel || 'Logout',
href: this.logoutUrl || LOGOUT_DEFAULT,
variant: 'secondary',
onClick: this.logoutHandler,
@@ -176,17 +176,11 @@ export class TelekomProfileMenu {
const divider = [{ type: 'divider' }];
const userInfo = readData(this.userInfo);
- if (!userInfo) {
- // console.error("userInfo missing");
- }
- userInfo.type = 'userInfo';
-
- let serviceLinks = readData(this.serviceLinks);
- if (!serviceLinks) {
- // console.error("serviceLinks missing");
- serviceLinks = [];
+ if (userInfo) {
+ userInfo.type = 'userInfo';
}
+ const serviceLinks = readData(this.serviceLinks) || [];
for (const el of serviceLinks) {
el.type = 'item';
}
@@ -200,9 +194,11 @@ export class TelekomProfileMenu {
let menu = [];
- menu = menu.concat(userInfo);
+ if (userInfo) {
+ menu = menu.concat(userInfo);
+ }
- if (!this.serviceLinksEmpty()) {
+ if (userInfo && !this.serviceLinksEmpty()) {
menu = menu.concat(divider);
}
@@ -221,7 +217,10 @@ export class TelekomProfileMenu {
}
serviceLinksEmpty() {
- return (this.hideLoginSettings && this.serviceLinks.length < 1) === true;
+ return (
+ this.hideLoginSettings &&
+ (!this.serviceLinks || this.serviceLinks.length < 1)
+ );
}
buildDesktopMenuStyles() {
diff --git a/packages/components/src/html/telekom-header-profile-menu.html b/packages/components/src/html/telekom-header-profile-menu.html
new file mode 100644
index 0000000000..22c169c62f
--- /dev/null
+++ b/packages/components/src/html/telekom-header-profile-menu.html
@@ -0,0 +1,601 @@
+
+
+
+
+
+ Telekom Header
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ My heading
+
+
+
+
+ My heading
+
+
+
+
+ My heading
+
+
+
+
+ My heading
+
+
+
+
+ My heading
+
+
+
+
+
+
+
+
+
+
+ Tarife
+
+
+
+ Geräte
+
+
+
+ Vernetztes Zuhause
+
+
+
+ Netz
+
+
+
+
+
+
+ Topic Three
+
+
+ Topic Four
+
+
+ Topic Five
+
+
+
+
+
+ Metalink ext 1
+
+
+
+
+
+ Metalink ext 2
+
+
+
+
+
+
+ Metalink 1
+
+
+ Metalink 2
+
+
+
+
+ MK
+
+
+ SO
+
+
+ DE
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 1
+ 2
+ 3
+ 4
+ 5
+
+
+