Merge branch 'master' into feature-merge-master

wanghui2021 · Nov 15, 2023 · 78a95cf · 78a95cf
2 parents 0383234 + ab4863c
commit 78a95cf
Show file tree

Hide file tree

Showing 9 changed files with 26 additions and 19 deletions.
diff --git a/components/_util/__tests__/useZIndex.test.tsx b/components/_util/__tests__/useZIndex.test.tsx
@@ -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) => (
@@ -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 />
@@ -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;
 }
@@ -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,
                 ),
               );
             });
@@ -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 +

diff --git a/components/_util/hooks/useZIndex.tsx b/components/_util/hooks/useZIndex.tsx
@@ -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,
@@ -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,
 };

diff --git a/components/color-picker/ColorPicker.tsx b/components/color-picker/ColorPicker.tsx
@@ -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,
@@ -232,7 +231,6 @@ const ColorPicker: CompoundedComponent = (props) => {
   const mergedStyle: React.CSSProperties = { ...colorPicker?.style, ...style };
 
   // ============================ zIndex ============================
-  const [zIndex] = useZIndex('ColorPicker');
 
   return wrapSSR(
     <Popover
@@ -254,7 +252,6 @@ const ColorPicker: CompoundedComponent = (props) => {
         </NoFormStyle>
       }
       overlayClassName={mergePopupCls}
-      zIndex={zIndex}
       {...popoverProps}
     >
       {children || (

diff --git a/components/popover/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/popover/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -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"

diff --git a/components/popover/index.tsx b/components/popover/index.tsx
@@ -52,8 +52,6 @@ const Popover = React.forwardRef<TooltipRef, PopoverProps>((props, ref) => {
 
   const overlayCls = classNames(overlayClassName, hashId);
 
-  // ============================ zIndex ============================
-
   return wrapCSSVar(
     <Tooltip
       placement={placement}

diff --git a/components/tabs/index.en-US.md b/components/tabs/index.en-US.md
@@ -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
 

diff --git a/components/tabs/index.zh-CN.md b/components/tabs/index.zh-CN.md
@@ -85,6 +85,7 @@ Ant Design 依次提供了三级选项卡，分别用于不同的场景。
 | key | 对应 activeKey | string | - |  |
 | label | 选项卡头显示文字 | ReactNode | - |  |
 | children | 选项卡头显示内容 | ReactNode | - |  |
+| closable | 是否显示选项卡的关闭按钮，在 `type="editable-card"` 时有效 | boolean | true |  |
 
 ## 主题变量（Design Token）
 

diff --git a/components/tooltip/index.tsx b/components/tooltip/index.tsx
@@ -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}

diff --git a/package.json b/package.json
@@ -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",
@@ -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",
@@ -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",