diff --git a/src/atoms/Dropdown/DropdownBody.js b/src/atoms/Dropdown/DropdownBody.js index 07bf1842..96452a0f 100644 --- a/src/atoms/Dropdown/DropdownBody.js +++ b/src/atoms/Dropdown/DropdownBody.js @@ -9,6 +9,7 @@ import { Portal } from 'react-portal'; import { withDropdownContext } from './DropdownContext'; import { offsetSizes, defaultTheme, DropdownBodyTag } from './DropdownBody.theme'; import type { PropSizes } from '../../types'; +import { Z_INDEX } from '../../theme/zIndex'; /** * @prop {*} background options for background color @@ -70,7 +71,7 @@ const dropdownBodyEnhancer: HOC<*, DropdownBodyProps> = compose( type DropdownBodyEnhancedProps = HOCBase; class DropdownBodyBase extends PureComponent { - static zIndex = 2000; + static zIndex = Z_INDEX.DROPDOWN; static defaultProps = { ...defaultTheme, diff --git a/src/theme/zIndex.js b/src/theme/zIndex.js index 42ab2cc7..2affb7f1 100644 --- a/src/theme/zIndex.js +++ b/src/theme/zIndex.js @@ -2,6 +2,7 @@ const Z_INDEX = { MODAL: 10000, + DROPDOWN: 20000, FIXED_NAV: 1000, }; diff --git a/storybook/__tests__/__snapshots__/storyshots.test.js.snap b/storybook/__tests__/__snapshots__/storyshots.test.js.snap index 67d96bda..e4a09b8d 100644 --- a/storybook/__tests__/__snapshots__/storyshots.test.js.snap +++ b/storybook/__tests__/__snapshots__/storyshots.test.js.snap @@ -8537,7 +8537,7 @@ exports[`Storyshots ATOMS/Dropdown default 1`] = ` "pointerEvents": "none", "position": "absolute", "width": undefined, - "zIndex": 2000, + "zIndex": 20000, } } > @@ -8655,7 +8655,7 @@ exports[`Storyshots ATOMS/Dropdown with custom body width 1`] = ` "pointerEvents": "none", "position": "absolute", "width": "40rem", - "zIndex": 2000, + "zIndex": 20000, } } > @@ -8773,7 +8773,7 @@ exports[`Storyshots ATOMS/Dropdown with custom offset 1`] = ` "pointerEvents": "none", "position": "absolute", "width": undefined, - "zIndex": 2000, + "zIndex": 20000, } } > @@ -8892,7 +8892,7 @@ exports[`Storyshots ATOMS/Dropdown with dark background 1`] = ` "pointerEvents": "none", "position": "absolute", "width": undefined, - "zIndex": 2000, + "zIndex": 20000, } } > @@ -9010,7 +9010,7 @@ exports[`Storyshots ATOMS/Dropdown with force render 1`] = ` "pointerEvents": "none", "position": "absolute", "width": undefined, - "zIndex": 2000, + "zIndex": 20000, } } > @@ -9128,7 +9128,7 @@ exports[`Storyshots ATOMS/Dropdown with pin to right 1`] = ` "pointerEvents": "none", "position": "absolute", "width": undefined, - "zIndex": 2000, + "zIndex": 20000, } } > @@ -9340,7 +9340,7 @@ exports[`Storyshots ATOMS/Dropdown with stretch target 1`] = ` "pointerEvents": "none", "position": "absolute", "width": undefined, - "zIndex": 2000, + "zIndex": 20000, } } > @@ -9458,7 +9458,7 @@ exports[`Storyshots ATOMS/Dropdown without background 1`] = ` "pointerEvents": "none", "position": "absolute", "width": undefined, - "zIndex": 2000, + "zIndex": 20000, } } > @@ -9576,7 +9576,7 @@ exports[`Storyshots ATOMS/Dropdown without close on outside click 1`] = ` "pointerEvents": "none", "position": "absolute", "width": undefined, - "zIndex": 2000, + "zIndex": 20000, } } >