diff --git a/packages/main/src/components/ObjectPage/ObjectPage.cy.tsx b/packages/main/src/components/ObjectPage/ObjectPage.cy.tsx
index 29a84ee29a4..2e97a0a2c1b 100644
--- a/packages/main/src/components/ObjectPage/ObjectPage.cy.tsx
+++ b/packages/main/src/components/ObjectPage/ObjectPage.cy.tsx
@@ -242,7 +242,7 @@ describe('ObjectPage', () => {
it('scroll to sections - default mode', () => {
document.body.style.margin = '0px';
cy.mount(
-
+
{OPContent}
);
@@ -267,7 +267,12 @@ describe('ObjectPage', () => {
cy.findByText('Job Relationship').should('be.visible');
cy.mount(
-
+
{OPContent}
);
@@ -311,7 +316,7 @@ describe('ObjectPage', () => {
headerTitle={DPTitle}
headerContent={DPContent}
mode={ObjectPageMode.IconTabBar}
- style={{ height: '100vh' }}
+ style={{ height: '100vh', scrollBehavior: 'auto' }}
>
{OPContent}
@@ -341,7 +346,7 @@ describe('ObjectPage', () => {
headerContent={DPContent}
footer={Footer}
mode={ObjectPageMode.IconTabBar}
- style={{ height: '100vh' }}
+ style={{ height: '100vh', scrollBehavior: 'auto' }}
>
{OPContent}
diff --git a/packages/main/src/components/ObjectPage/ObjectPage.mdx b/packages/main/src/components/ObjectPage/ObjectPage.mdx
index e6400250598..7706f62a297 100644
--- a/packages/main/src/components/ObjectPage/ObjectPage.mdx
+++ b/packages/main/src/components/ObjectPage/ObjectPage.mdx
@@ -6,11 +6,14 @@ import { DynamicPageTitle } from '../DynamicPageTitle';
import { DynamicPageHeader } from '../DynamicPageHeader';
import { ObjectPageSection } from '../ObjectPageSection';
import { ObjectPageSubSection } from '../ObjectPageSubSection';
+import { MessageStrip } from '@ui5/webcomponents-react';
+
+
## Example
diff --git a/packages/main/src/components/ObjectPage/ObjectPage.module.css b/packages/main/src/components/ObjectPage/ObjectPage.module.css
index 872df8c3c53..5e7411f6390 100644
--- a/packages/main/src/components/ObjectPage/ObjectPage.module.css
+++ b/packages/main/src/components/ObjectPage/ObjectPage.module.css
@@ -16,6 +16,9 @@
overflow-x: hidden;
overflow-y: auto;
scroll-behavior: smooth;
+ &[data-in-iframe='true'] {
+ scroll-behavior: auto;
+ }
section[id*='ObjectPageSection-'] > div[role='heading'] {
display: none;
}
diff --git a/packages/main/src/components/ObjectPage/index.tsx b/packages/main/src/components/ObjectPage/index.tsx
index 1b82925d9e9..74b5a0fc5bc 100644
--- a/packages/main/src/components/ObjectPage/index.tsx
+++ b/packages/main/src/components/ObjectPage/index.tsx
@@ -319,8 +319,10 @@ const ObjectPage = forwardRef((props, ref)
TAB_CONTAINER_HEADER_HEIGHT +
(headerPinned && !headerCollapsed ? headerContentHeight : 0) +
'px';
- section.focus();
- section.scrollIntoView({ behavior: 'smooth' });
+ if (isSubSection) {
+ section.focus();
+ }
+ section.scrollIntoView();
section.style.scrollMarginBlockStart = '0px';
}
};
@@ -330,7 +332,7 @@ const ObjectPage = forwardRef((props, ref)
return;
}
if (firstSectionId === sectionId) {
- objectPageRef.current?.scrollTo({ top: 0, behavior: 'smooth' });
+ objectPageRef.current?.scrollTo({ top: 0 });
} else {
scrollToSectionById(sectionId);
}
@@ -766,6 +768,7 @@ const ObjectPage = forwardRef((props, ref)
style={objectPageStyles}
ref={componentRef}
onScroll={onObjectPageScroll}
+ data-in-iframe={window && window.self !== window.top}
{...propsWithoutOmitted}
>