Merge branch 'master' into dependabot/npm_and_yarn/testing-library/re…

…act-14.0.0

.dumi/app.tsx

@@ -0,0 +1,10 @@
+import { Navigate } from 'dumi';
+import * as React from 'react';
+
+export function patchClientRoutes({ routes }) {
+  routes[0].children.unshift({
+    id: 'demo-redirect',
+    path: '/demo',
+    element: <Navigate to="arrow-content" />,
+  });
+}

.dumi/tsconfig.json

@@ -0,0 +1,6 @@
+{
+  "extends": "../tsconfig.json",
+  "include": [
+    "**/*"
+  ]
+}

.dumirc.ts

@@ -1,6 +1,12 @@
 import { defineConfig } from 'dumi';
 import path from 'path';
 
+const isProdSite =
+  // 不是预览模式 同时是生产环境
+  process.env.PREVIEW !== 'true' && process.env.NODE_ENV === 'production';
+
+const name = 'tooltip';
+
 export default defineConfig({
   alias: {
     'rc-tooltip$': path.resolve('src'),
@@ -12,4 +18,6 @@ export default defineConfig({
     name: 'Tooltip',
     logo: 'https://avatars0.githubusercontent.com/u/9441414?s=200&v=4',
   },
+  base: isProdSite ? `/${name}/` : '/',
+  publicPath: isProdSite ? `/${name}/` : '/',
 });

.github/workflows/react-component-ci.yml

@@ -15,7 +15,7 @@ jobs:
 
       - uses: actions/setup-node@v1
         with:
-          node-version: '12'
+          node-version: '14'
 
       - name: cache package-lock.json
         uses: actions/cache@v2
@@ -43,7 +43,7 @@ jobs:
       - name: install
         if: steps.node_modules_cache_id.outputs.cache-hit != 'true'
         run: npm ci
-  
+
   lint:
     runs-on: ubuntu-latest
     steps:
@@ -66,7 +66,7 @@ jobs:
         run: npm run lint
 
     needs: setup
-  
+
   compile:
     runs-on: ubuntu-latest
     steps:
@@ -89,7 +89,7 @@ jobs:
         run: npm run compile
 
     needs: setup
-  
+
   coverage:
     runs-on: ubuntu-latest
     steps:

assets/bootstrap_white.less

@@ -104,6 +104,7 @@
     margin-top: -@tooltip-arrow-width;
     border-width: @tooltip-arrow-width @tooltip-arrow-width @tooltip-arrow-width 0;
     border-right-color: @tooltip-arrow-color;
+    transform: translateX(calc(-100% + @tooltip-shadow-width));
   }
 
   &-placement-right &-arrow-inner,
@@ -135,6 +136,7 @@
     margin-top: -@tooltip-arrow-width;
     border-width: @tooltip-arrow-width 0 @tooltip-arrow-width @tooltip-arrow-width;
     border-left-color: @tooltip-arrow-color;
+    transform: translateX(calc(100% - @tooltip-shadow-width));
   }
 
   &-placement-left &-arrow-inner,

package.json

@@ -1,6 +1,6 @@
 {
   "name": "rc-tooltip",
-  "version": "6.0.1",
+  "version": "6.1.2",
   "description": "React Tooltip",
   "keywords": [
     "react",
@@ -23,40 +23,40 @@
   "main": "lib/index",
   "module": "es/index",
   "files": [
-    "dist",
     "lib",
     "es",
     "assets/*.css",
     "assets/*.less"
   ],
   "scripts": {
     "compile": "father build && lessc assets/bootstrap.less assets/bootstrap.css && lessc assets/bootstrap_white.less assets/bootstrap_white.css",
+    "prepare": "dumi setup",
     "docs:build": "dumi build",
-    "docs:deploy": "gh-pages -d .doc",
+    "docs:deploy": "gh-pages -d dist",
     "lint": "eslint src/ --ext .tsx,.ts,.jsx,.js",
-    "now-build": "npm run build",
     "prepublishOnly": "npm run compile && np --no-cleanup --yolo --no-publish",
+    "postpublish": "npm run docs:build && npm run docs:deploy",
     "start": "dumi dev",
     "test": "rc-test"
   },
   "dependencies": {
     "@babel/runtime": "^7.11.2",
-    "@rc-component/trigger": "^1.0.4",
+    "@rc-component/trigger": "^1.18.0",
     "classnames": "^2.3.1"
   },
   "devDependencies": {
     "@rc-component/father-plugin": "^1.0.0",
     "@testing-library/react": "^14.0.0",
-    "@types/jest": "^26.0.0",
+    "@types/jest": "^29.4.0",
     "@types/react": "^18.0.26",
     "@types/react-dom": "^18.0.10",
     "@types/warning": "^3.0.0",
     "cross-env": "^7.0.0",
-    "dumi": "^2.1.1",
+    "dumi": "^2.2.13",
     "eslint": "^7.1.0",
     "father": "^4.0.0",
     "gh-pages": "^3.1.0",
-    "less": "^3.11.1",
+    "less": "^4.1.1",
     "np": "^7.1.0",
     "rc-test": "^7.0.9",
     "react": "^18.2.0",

src/Tooltip.tsx

@@ -1,12 +1,22 @@
-import type { TriggerProps, TriggerRef } from '@rc-component/trigger';
+import type { ArrowType, TriggerProps, TriggerRef } from '@rc-component/trigger';
 import Trigger from '@rc-component/trigger';
 import type { ActionType, AlignType, AnimationType } from '@rc-component/trigger/lib/interface';
 import * as React from 'react';
 import { forwardRef, useImperativeHandle, useRef } from 'react';
 import { placements } from './placements';
 import Popup from './Popup';
 
-export interface TooltipProps extends Pick<TriggerProps, 'onPopupAlign' | 'builtinPlacements'> {
+export interface TooltipProps
+  extends Pick<
+    TriggerProps,
+    | 'onPopupAlign'
+    | 'builtinPlacements'
+    | 'fresh'
+    | 'children'
+    | 'mouseLeaveDelay'
+    | 'mouseEnterDelay'
+    | 'prefixCls'
+  > {
   trigger?: ActionType | ActionType[];
   defaultVisible?: boolean;
   visible?: boolean;
@@ -22,22 +32,18 @@ export interface TooltipProps extends Pick<TriggerProps, 'onPopupAlign' | 'built
   overlay: (() => React.ReactNode) | React.ReactNode;
   overlayStyle?: React.CSSProperties;
   overlayClassName?: string;
-  prefixCls?: string;
-  mouseEnterDelay?: number;
-  mouseLeaveDelay?: number;
   getTooltipContainer?: (node: HTMLElement) => HTMLElement;
   destroyTooltipOnHide?: boolean;
   align?: AlignType;
-  showArrow?: boolean;
+  showArrow?: boolean | ArrowType;
   arrowContent?: React.ReactNode;
   id?: string;
-  children?: React.ReactElement;
-  popupVisible?: boolean;
   overlayInnerStyle?: React.CSSProperties;
   zIndex?: number;
 }
 
 export interface TooltipRef {
+  nativeElement: HTMLElement;
   forceAlign: VoidFunction;
 }
 
@@ -71,7 +77,7 @@ const Tooltip = (props: TooltipProps, ref: React.Ref<TooltipRef>) => {
   const triggerRef = useRef<TriggerRef>(null);
   useImperativeHandle(ref, () => triggerRef.current);
 
-  const extraProps = { ...restProps };
+  const extraProps: Partial<TooltipProps & TriggerProps> = { ...restProps };
   if ('visible' in props) {
     extraProps.popupVisible = props.visible;
   }

src/index.tsx

@@ -1,6 +1,7 @@
-import Tooltip from './Tooltip';
 import Popup from './Popup';
+import Tooltip from './Tooltip';
 
+export type { TooltipRef } from './Tooltip';
 export { Popup };
 
 export default Tooltip;

tests/index.test.tsx

@@ -1,6 +1,6 @@
 import { act, fireEvent, render } from '@testing-library/react';
 import React from 'react';
-import Tooltip from '../src';
+import Tooltip, { TooltipRef } from '../src';
 
 const verifyContent = (wrapper: HTMLElement, content: string) => {
   expect(wrapper.querySelector('.x-content').textContent).toBe(content);
@@ -178,9 +178,26 @@ describe('rc-tooltip', () => {
         </Tooltip>,
       );
       fireEvent.click(container.querySelector('.target'));
-      console.log(container.innerHTML);
       expect(container.querySelector('.rc-tooltip-arrow')).toBeTruthy();
     });
+    it('should show tooltip arrow when showArrow is object', () => {
+      const { container } = render(
+        <Tooltip
+          destroyTooltipOnHide
+          trigger={['click']}
+          placement="left"
+          overlay={<strong className="x-content">Tooltip content</strong>}
+          showArrow={{
+            className: 'abc',
+          }}
+        >
+          <div className="target">Click this</div>
+        </Tooltip>,
+      );
+      fireEvent.click(container.querySelector('.target'));
+      expect(container.querySelector('.rc-tooltip-arrow')).toBeTruthy();
+      expect(container.querySelector('.rc-tooltip-arrow').classList.contains('abc')).toBeTruthy();
+    });
     it('should hide tooltip arrow when showArrow is false', () => {
       const { container } = render(
         <Tooltip
@@ -222,4 +239,16 @@ describe('rc-tooltip', () => {
     fireEvent.click(container.querySelector('.target'));
     expect(container.querySelector('.x-content')).toBeTruthy();
   });
+
+  it('ref support nativeElement', () => {
+    const nodeRef = React.createRef<TooltipRef>();
+
+    const { container } = render(
+      <Tooltip ref={nodeRef} overlay={<div />}>
+        <button />
+      </Tooltip>,
+    );
+
+    expect(nodeRef.current.nativeElement).toBe(container.querySelector('button'));
+  });
 });

tsconfig.json

@@ -8,10 +8,22 @@
     "skipLibCheck": true,
     "esModuleInterop": true,
     "paths": {
-      "@/*": ["src/*"],
-      "@@/*": [".dumi/tmp/*"],
-      "rc-tooltip": ["src/index.tsx"]
+      "@/*": [
+        "src/*"
+      ],
+      "@@/*": [
+        ".dumi/tmp/*"
+      ],
+      "rc-tooltip": [
+        "src/index.tsx"
+      ]
     }
   },
-  "include": [".dumi/**/*", ".dumirc.ts", "./src/**/*.ts", "./src/**/*.tsx", "./docs/**/*.tsx", "./tests/**/*.tsx"]
-}
+  "include": [
+    ".dumirc.ts",
+    "./src/**/*.ts",
+    "./src/**/*.tsx",
+    "./docs/**/*.tsx",
+    "./tests/**/*.tsx"
+  ]
+}