feat(Tooltip): add omit_portal property

dnbexperience · Aug 25, 2022 · 1c2d8bf · 1c2d8bf
1 parent f835651
commit 1c2d8bf
Show file tree

Hide file tree

Showing 6 changed files with 26 additions and 10 deletions.
diff --git a/packages/dnb-eufemia/src/components/dialog/__tests__/__snapshots__/Dialog.test.tsx.snap b/packages/dnb-eufemia/src/components/dialog/__tests__/__snapshots__/Dialog.test.tsx.snap
@@ -437,6 +437,7 @@ exports[`Dialog component snapshot should match component snapshot 1`] = `
             hide_delay={500}
             id="dialog_id-tooltip"
             no_animation={false}
+            omit_portal={null}
             position="top"
             show_delay={300}
             size="basis"
@@ -502,6 +503,7 @@ exports[`Dialog component snapshot should match component snapshot 1`] = `
               id="dialog_id-tooltip"
               internal_id="dialog_id-tooltip"
               no_animation={false}
+              omit_portal={null}
               position="top"
               show_delay={300}
               size="basis"
@@ -610,6 +612,7 @@ exports[`Dialog component snapshot should match component snapshot 1`] = `
                 internal_id="dialog_id-tooltip"
                 key="tooltip"
                 no_animation={false}
+                omit_portal={null}
                 position="top"
                 show_delay={300}
                 size="basis"

diff --git a/packages/dnb-eufemia/src/components/drawer/__tests__/__snapshots__/Drawer.test.tsx.snap b/packages/dnb-eufemia/src/components/drawer/__tests__/__snapshots__/Drawer.test.tsx.snap
@@ -435,6 +435,7 @@ exports[`Drawer component snapshot should match component snapshot 1`] = `
             hide_delay={500}
             id="drawer_id-tooltip"
             no_animation={false}
+            omit_portal={null}
             position="top"
             show_delay={300}
             size="basis"
@@ -500,6 +501,7 @@ exports[`Drawer component snapshot should match component snapshot 1`] = `
               id="drawer_id-tooltip"
               internal_id="drawer_id-tooltip"
               no_animation={false}
+              omit_portal={null}
               position="top"
               show_delay={300}
               size="basis"
@@ -608,6 +610,7 @@ exports[`Drawer component snapshot should match component snapshot 1`] = `
                 internal_id="drawer_id-tooltip"
                 key="tooltip"
                 no_animation={false}
+                omit_portal={null}
                 position="top"
                 show_delay={300}
                 size="basis"

diff --git a/packages/dnb-eufemia/src/components/modal/__tests__/__snapshots__/Modal.test.tsx.snap b/packages/dnb-eufemia/src/components/modal/__tests__/__snapshots__/Modal.test.tsx.snap
@@ -426,6 +426,7 @@ exports[`Modal component have to match snapshot 1`] = `
           hide_delay={500}
           id="modal_id-tooltip"
           no_animation={false}
+          omit_portal={null}
           position="top"
           show_delay={300}
           size="basis"
@@ -491,6 +492,7 @@ exports[`Modal component have to match snapshot 1`] = `
             id="modal_id-tooltip"
             internal_id="modal_id-tooltip"
             no_animation={false}
+            omit_portal={null}
             position="top"
             show_delay={300}
             size="basis"
@@ -599,6 +601,7 @@ exports[`Modal component have to match snapshot 1`] = `
               internal_id="modal_id-tooltip"
               key="tooltip"
               no_animation={false}
+              omit_portal={null}
               position="top"
               show_delay={300}
               size="basis"

diff --git a/packages/dnb-eufemia/src/components/tooltip/Tooltip.js b/packages/dnb-eufemia/src/components/tooltip/Tooltip.js
@@ -18,6 +18,7 @@ import {
   spacingPropTypes,
   createSpacingClasses,
 } from '../space/SpacingHelper'
+import TooltipContainer from './TooltipContainer'
 import TooltipWithEvents from './TooltipWithEvents'
 import TooltipPortal from './TooltipPortal'
 import { injectTooltipSemantic } from './TooltipHelpers'
@@ -51,6 +52,7 @@ export default class Tooltip extends React.PureComponent {
       PropTypes.string,
       PropTypes.bool,
     ]),
+    omit_portal: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
     no_animation: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
     show_delay: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     hide_delay: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
@@ -82,6 +84,7 @@ export default class Tooltip extends React.PureComponent {
     align: null,
     animate_position: false,
     fixed_position: false,
+    omit_portal: null,
     no_animation: false,
     show_delay: 300,
     hide_delay: 500,
@@ -140,6 +143,7 @@ export default class Tooltip extends React.PureComponent {
       size,
       animate_position, // eslint-disable-line
       fixed_position, // eslint-disable-line
+      omit_portal,
       no_animation, // eslint-disable-line
       show_delay, // eslint-disable-line
       hide_delay, // eslint-disable-line
@@ -178,13 +182,17 @@ export default class Tooltip extends React.PureComponent {
       delete newProps.active
     }
 
-    // React.isValidElement(target) ||
-    // (typeof target === 'object' &&
-    //   Object.prototype.hasOwnProperty.call(target, 'current'))
-
     return (
       <>
-        {target_element ? (
+        {omit_portal ? (
+          <TooltipContainer
+            target={target_element}
+            attributes={attributes}
+            {...newProps}
+          >
+            {content}
+          </TooltipContainer>
+        ) : target_element ? (
           <TooltipWithEvents
             target={target_element}
             attributes={attributes}

diff --git a/packages/dnb-eufemia/src/components/tooltip/TooltipContainer.js b/packages/dnb-eufemia/src/components/tooltip/TooltipContainer.js
@@ -130,10 +130,6 @@ export default class TooltipContainer extends React.PureComponent {
   }
 
   getGlobalStyle() {
-    if (!this.props.targetElement) {
-      return { display: 'none' }
-    }
-
     return this.makeStyle(this.props.position, this.props.arrow)
   }
 
@@ -332,7 +328,7 @@ export default class TooltipContainer extends React.PureComponent {
         onMouseLeave={this.handleMouseLeave}
         {...attributes}
         className={classnames(
-          attributes.className,
+          attributes?.className,
           isTrue(animate_position) && 'dnb-tooltip--animate_position',
           isTrue(no_animation) && 'dnb-tooltip--no-animation',
           isTrue(fixed_position) && 'dnb-tooltip--fixed',

diff --git a/packages/dnb-eufemia/src/components/tooltip/__tests__/__snapshots__/Tooltip.test.js.snap b/packages/dnb-eufemia/src/components/tooltip/__tests__/__snapshots__/Tooltip.test.js.snap
@@ -14,6 +14,7 @@ exports[`Tooltip component with target_element have to match default tooltip sna
     hide_delay={500}
     id="tooltip"
     no_animation={false}
+    omit_portal={null}
     position="top"
     show_delay={300}
     size="basis"
@@ -43,6 +44,7 @@ exports[`Tooltip component with target_element have to match default tooltip sna
       id="tooltip"
       internal_id="tooltip"
       no_animation={false}
+      omit_portal={null}
       position="top"
       show_delay={300}
       size="basis"
@@ -84,6 +86,7 @@ exports[`Tooltip component with target_element have to match default tooltip sna
         internal_id="tooltip"
         key="tooltip"
         no_animation={false}
+        omit_portal={null}
         position="top"
         show_delay={300}
         size="basis"