Skip to content

Commit

Permalink
Merge branch 'master' into feature-merge-master
Browse files Browse the repository at this point in the history
  • Loading branch information
MadCcc committed Nov 15, 2023
2 parents 0383234 + ab4863c commit 78a95cf
Show file tree
Hide file tree
Showing 9 changed files with 26 additions and 19 deletions.
25 changes: 18 additions & 7 deletions components/_util/__tests__/useZIndex.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -150,6 +150,7 @@ const consumerComponent: Record<ZIndexConsumer, React.FC<{ rootClassName: string
options={options}
open
/>
<ColorPicker {...props} open rootClassName={`${rootClassName} comp-item comp-ColorPicker`} />
</>
),
Dropdown: (props) => (
Expand All @@ -166,7 +167,6 @@ const consumerComponent: Record<ZIndexConsumer, React.FC<{ rootClassName: string
<button type="button">test</button>
</Dropdown>
),
ColorPicker: (props) => <ColorPicker {...props} open />,
DatePicker: ({ rootClassName, ...props }) => (
<>
<DatePicker {...props} rootClassName={`${rootClassName} comp-item comp-DatePicker`} open />
Expand All @@ -183,17 +183,19 @@ const consumerComponent: Record<ZIndexConsumer, React.FC<{ rootClassName: string
function getConsumerSelector(baseSelector: string, consumer: ZIndexConsumer): string {
let selector = baseSelector;
if (consumer === 'SelectLike') {
selector = ['Select', 'Cascader', 'TreeSelect', 'AutoComplete']
.map((item) => `${baseSelector}.comp-${item}.ant-slide-up`)
selector = ['Select', 'Cascader', 'TreeSelect', 'AutoComplete', 'ColorPicker']
.map((item) =>
item === 'ColorPicker'
? `${baseSelector}.ant-popover-placement-bottomLeft`
: `${baseSelector}.comp-${item}.ant-slide-up`,
)
.join(',');
} else if (consumer === 'DatePicker') {
selector = ['DatePicker', 'TimePicker']
.map((item) => `${baseSelector}.comp-${item}.ant-picker-dropdown`)
.join(',');
} else if (['Menu'].includes(consumer)) {
selector = `${baseSelector}.ant-menu-submenu-placement-rightTop`;
} else if (consumer === 'ColorPicker') {
selector = `${baseSelector}.ant-popover-placement-bottomLeft`;
}
return selector;
}
Expand Down Expand Up @@ -268,21 +270,29 @@ describe('Test useZIndex hooks', () => {
});
comps = document.querySelectorAll(selector2);
comps.forEach((comp) => {
const isColorPicker = (comp as HTMLDivElement).className.includes('comp-ColorPicker');
const consumerOffset = isColorPicker
? 1000 + containerBaseZIndexOffset.Popover
: consumerBaseZIndexOffset[key as ZIndexConsumer];
expect((comp as HTMLDivElement).style.zIndex).toBe(
String(
1000 +
containerBaseZIndexOffset[containerKey as ZIndexContainer] +
consumerBaseZIndexOffset[key as ZIndexConsumer],
consumerOffset,
),
);
});

comps = document.querySelectorAll(selector3);
comps.forEach((comp) => {
const isColorPicker = (comp as HTMLDivElement).className.includes('comp-ColorPicker');
const consumerOffset = isColorPicker
? 1000 + containerBaseZIndexOffset.Popover
: consumerBaseZIndexOffset[key as ZIndexConsumer];
expect((comp as HTMLDivElement).style.zIndex).toBe(
String(
(1000 + containerBaseZIndexOffset[containerKey as ZIndexContainer]) * 2 +
consumerBaseZIndexOffset[key as ZIndexConsumer],
consumerOffset,
),
);
});
Expand All @@ -296,6 +306,7 @@ describe('Test useZIndex hooks', () => {
(document.querySelector(selector1) as HTMLDivElement).style.zIndex,
).toBeFalsy();
}

expect((document.querySelector(selector2) as HTMLDivElement).style.zIndex).toBe(
String(
1000 +
Expand Down
3 changes: 1 addition & 2 deletions components/_util/hooks/useZIndex.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import zIndexContext from '../zindexContext';

export type ZIndexContainer = 'Modal' | 'Drawer' | 'Popover' | 'Popconfirm' | 'Tooltip' | 'Tour';

export type ZIndexConsumer = 'SelectLike' | 'Dropdown' | 'ColorPicker' | 'DatePicker' | 'Menu';
export type ZIndexConsumer = 'SelectLike' | 'Dropdown' | 'DatePicker' | 'Menu';

export const containerBaseZIndexOffset: Record<ZIndexContainer, number> = {
Modal: 0,
Expand All @@ -18,7 +18,6 @@ export const containerBaseZIndexOffset: Record<ZIndexContainer, number> = {
export const consumerBaseZIndexOffset: Record<ZIndexConsumer, number> = {
SelectLike: 50,
Dropdown: 50,
ColorPicker: 30,
DatePicker: 50,
Menu: 50,
};
Expand Down
3 changes: 0 additions & 3 deletions components/color-picker/ColorPicker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,6 @@ import type {
} from './interface';
import useStyle from './style/index';
import { customizePrefixCls, genAlphaColor, generateColor, getAlphaColor } from './util';
import { useZIndex } from '../_util/hooks/useZIndex';

export type ColorPickerProps = Omit<
RcColorPickerProps,
Expand Down Expand Up @@ -232,7 +231,6 @@ const ColorPicker: CompoundedComponent = (props) => {
const mergedStyle: React.CSSProperties = { ...colorPicker?.style, ...style };

// ============================ zIndex ============================
const [zIndex] = useZIndex('ColorPicker');

return wrapSSR(
<Popover
Expand All @@ -254,7 +252,6 @@ const ColorPicker: CompoundedComponent = (props) => {
</NoFormStyle>
}
overlayClassName={mergePopupCls}
zIndex={zIndex}
{...popoverProps}
>
{children || (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -813,7 +813,7 @@ Array [
</button>,
<div
class="ant-popover ant-zoom-big-appear ant-zoom-big-appear-prepare ant-zoom-big ant-popover-placement-top"
style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box;"
style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box; z-index: 2140;"
>
<div
class="ant-popover-arrow"
Expand Down
2 changes: 0 additions & 2 deletions components/popover/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -52,8 +52,6 @@ const Popover = React.forwardRef<TooltipRef, PopoverProps>((props, ref) => {

const overlayCls = classNames(overlayClassName, hashId);

// ============================ zIndex ============================

return wrapCSSVar(
<Tooltip
placement={placement}
Expand Down
1 change: 1 addition & 0 deletions components/tabs/index.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,7 @@ More option at [rc-tabs tabs](https://github.com/react-component/tabs#tabs)
| key | TabPane's key | string | - | |
| label | TabPane's head display text | ReactNode | - | |
| children | TabPane's head display content | ReactNode | - | |
| closable | Whether a close (x) button is visible, Only works while `type="editable-card"` | boolean | true | |

## Design Token

Expand Down
1 change: 1 addition & 0 deletions components/tabs/index.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,7 @@ Ant Design 依次提供了三级选项卡,分别用于不同的场景。
| key | 对应 activeKey | string | - | |
| label | 选项卡头显示文字 | ReactNode | - | |
| children | 选项卡头显示内容 | ReactNode | - | |
| closable | 是否显示选项卡的关闭按钮,在 `type="editable-card"` 时有效 | boolean | true | |

## 主题变量(Design Token)

Expand Down
2 changes: 1 addition & 1 deletion components/tooltip/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -302,7 +302,7 @@ const Tooltip = React.forwardRef<TooltipRef, TooltipProps>((props, ref) => {
const content = (
<RcTooltip
{...otherProps}
zIndex={injectFromPopover ? otherProps.zIndex : zIndex}
zIndex={zIndex}
showArrow={mergedShowArrow}
placement={placement}
mouseEnterDelay={mouseEnterDelay}
Expand Down
6 changes: 3 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -150,7 +150,7 @@
"rc-slider": "~10.4.0",
"rc-steps": "~6.0.1",
"rc-switch": "~4.1.0",
"rc-table": "~7.35.2",
"rc-table": "~7.36.0",
"rc-tabs": "~12.13.1",
"rc-textarea": "~1.5.3",
"rc-tooltip": "~6.1.2",
Expand Down Expand Up @@ -178,7 +178,7 @@
"@emotion/server": "^11.4.0",
"@ianvs/prettier-plugin-sort-imports": "^4.1.0",
"@qixian.cs/github-contributors-list": "^1.1.0",
"@size-limit/file": "^10.0.0",
"@size-limit/file": "^11.0.0",
"@stackblitz/sdk": "^1.3.0",
"@testing-library/dom": "^9.0.0",
"@testing-library/jest-dom": "^6.0.0",
Expand Down Expand Up @@ -299,7 +299,7 @@
"runes2": "^1.1.2",
"semver": "^7.3.5",
"simple-git": "^3.0.0",
"size-limit": "^10.0.0",
"size-limit": "^11.0.0",
"stylelint": "^15.1.0",
"stylelint-config-rational-order": "^0.1.2",
"stylelint-config-standard": "^34.0.0",
Expand Down

0 comments on commit 78a95cf

Please sign in to comment.