+ {this._selectedCustomTab.title && (
+
{this._selectedCustomTab.title}
+ )}
+
+
+ )}
+
);
}
diff --git a/packages/fiori/src/bundle.esm.ts b/packages/fiori/src/bundle.esm.ts
index 9ccfbb26b1af..7c3d50df4db9 100644
--- a/packages/fiori/src/bundle.esm.ts
+++ b/packages/fiori/src/bundle.esm.ts
@@ -64,6 +64,7 @@ import UserMenuAccount from "./UserMenuAccount.js";
import UserMenuItem from "./UserMenuItem.js";
import UserMenuItemGroup from "./UserMenuItemGroup.js";
import ViewSettingsDialog from "./ViewSettingsDialog.js";
+import ViewSettingsCustomTab from "./ViewSettingsCustomTab.js";
import Wizard from "./Wizard.js";
testAssets.defaultTexts = { ...testAssets.defaultTexts, ...defaultFioriTexts };
diff --git a/packages/fiori/src/themes/ViewSettingsDialog.css b/packages/fiori/src/themes/ViewSettingsDialog.css
index f56c85e57ee6..0fd6387ff10b 100644
--- a/packages/fiori/src/themes/ViewSettingsDialog.css
+++ b/packages/fiori/src/themes/ViewSettingsDialog.css
@@ -65,6 +65,35 @@
height: 100%;
}
+.ui5-vsd-custom-tab-content {
+ width: 100%;
+ height: 100%;
+ box-sizing: border-box;
+ padding: 0.5rem 1rem;
+ overflow: auto;
+ min-width: 0;
+}
+
+.ui5-vsd-custom-tab-title {
+ color: var(--sapList_TableGroupHeaderTextColor);
+ font-family: var(--sapFontHeaderFamily);
+ font-size: var(--sapFontHeader6Size);
+ font-weight: bold;
+ line-height: 2rem;
+ min-height: 2rem;
+ margin: 0;
+}
+
+.ui5-vsd-custom-tab-slot::slotted([ui5-view-settings-custom-tab]) {
+ display: block;
+ width: 100%;
+ max-width: 100%;
+ min-width: 0;
+ box-sizing: border-box;
+ font-family: var(--sapFontFamily);
+ color: var(--sapTextColor);
+}
+
[ui5-li-group]::part(header) {
overflow: hidden;
}
diff --git a/packages/fiori/test/pages/ViewSettingsDialog.html b/packages/fiori/test/pages/ViewSettingsDialog.html
index f3efd0fbc425..22440366e36e 100644
--- a/packages/fiori/test/pages/ViewSettingsDialog.html
+++ b/packages/fiori/test/pages/ViewSettingsDialog.html
@@ -128,6 +128,108 @@