fix: popover first time scroll (#1481)

* fix: css override import * fix: css override import * fix: search input styles * fix: popover styles * fix: upgrade readme * fix: upgrade readme * fix: storybook pr deployment lack theming css * fix: popover first insert scroll
SAP · Feb 8, 2023 · 68e5c8c · 68e5c8c
1 parent 23e6ed5
commit 68e5c8c
Showing 1 changed file with 15 additions and 17 deletions.
diff --git a/src/utils/_Popper.js b/src/utils/_Popper.js
@@ -294,27 +294,25 @@ class Popper extends React.Component {
                     }
                     // TODO: Temporary overrides to support popper-2
                     const fundamentalStyleOverrides = {
-                        visibility: isReferenceHidden ? 'hidden' : 'visible'
+                        visibility: isReferenceHidden ? 'hidden' : 'visible',
+                        '--fdPopover_Offset': '0px'
                     };
                     return (
-                        <div className={cssBlock} style={{ position: 'absolute' }}>
-                            <div
-                                {...popperProps}
-                                className={classnames(`${cssBlock}__body`, popperClassName, getPopperClasses2(cssBlock, placement, noArrow), {
-                                    [`${cssBlock}__body--no-arrow`]: !!noArrow
-                                })}
-                                ref={ref}
-                                style={{ ...style, ...popperProps.style, ...fundamentalStyleOverrides }}
-                                // eslint-disable-next-line no-undefined
-                                x-out-of-boundaries={isReferenceHidden ? 'true' : undefined}
-                                // This is needed for fundamental-styles even though popper-2 uses data-placement as well
-                                x-placement={placement}>
-                                <div className={classnames(`${cssBlock}__wrapper`, innerRefClassName)} ref={innerRef}>
-                                    {children}
-                                </div>
+                        <div
+                            {...popperProps}
+                            className={classnames(`${cssBlock}__body`, popperClassName, getPopperClasses2(cssBlock, placement, noArrow), {
+                                [`${cssBlock}__body--no-arrow`]: !!noArrow
+                            })}
+                            ref={ref}
+                            style={{ ...style, ...popperProps.style, ...fundamentalStyleOverrides }}
+                            // eslint-disable-next-line no-undefined
+                            x-out-of-boundaries={isReferenceHidden ? 'true' : undefined}
+                            // This is needed for fundamental-styles even though popper-2 uses data-placement as well
+                            x-placement={placement}>
+                            <div className={classnames(`${cssBlock}__wrapper`, innerRefClassName)} ref={innerRef}>
+                                {children}
                             </div>
                         </div>
-
                     );
                 }}
             </ReactPopper>