feat: tooltip support show-arrow cls when showArrow not falsy (#430)

* feat: tooltip support show-arrow cls when showArrow not falsy

* feat: optimize code

* feat: reset resolutions

* chore: merge master

* feat: optimize code

Author: kiner-tang

src/Tooltip.tsx

@@ -5,6 +5,7 @@ import type { TriggerProps } from 'rc-trigger';
 import type { AlignType, AnimationType, ActionType } from 'rc-trigger/lib/interface';
 import { placements } from './placements';
 import Popup from './Popup';
+import classNames from 'classnames';
 
 export interface TooltipProps extends Pick<TriggerProps, 'onPopupAlign' | 'builtinPlacements'> {
   trigger?: ActionType | ActionType[];
@@ -64,7 +65,7 @@ const Tooltip = (props: TooltipProps, ref) => {
     arrowContent,
     overlay,
     id,
-    showArrow,
+    showArrow = true,
     ...restProps
   } = props;
 
@@ -101,7 +102,9 @@ const Tooltip = (props: TooltipProps, ref) => {
 
   return (
     <Trigger
-      popupClassName={overlayClassName}
+      popupClassName={classNames(overlayClassName, {
+        [`${prefixCls}-show-arrow`]: showArrow,
+      })}
       prefixCls={prefixCls}
       popup={getPopupElement}
       action={trigger}

tests/index.test.tsx

@@ -174,6 +174,7 @@ describe('rc-tooltip', () => {
         </Tooltip>,
       );
       fireEvent.click(container.querySelector('.target'));
+      expect(container.querySelector('.rc-tooltip').classList).toContain('rc-tooltip-show-arrow');
       expect(container.querySelector('.rc-tooltip-content').outerHTML).toBe(
         '<div class="rc-tooltip-content"><div class="rc-tooltip-arrow"></div><div class="rc-tooltip-inner" role="tooltip"><strong class="x-content">Tooltip content</strong></div></div>',
       );
@@ -191,6 +192,7 @@ describe('rc-tooltip', () => {
         </Tooltip>,
       );
       fireEvent.click(container.querySelector('.target'));
+      expect(container.querySelector('.rc-tooltip').classList).toContain('rc-tooltip-show-arrow');
       expect(container.querySelector('.rc-tooltip-content').outerHTML).toBe(
         '<div class="rc-tooltip-content"><div class="rc-tooltip-arrow"></div><div class="rc-tooltip-inner" role="tooltip"><strong class="x-content">Tooltip content</strong></div></div>',
       );
@@ -208,6 +210,9 @@ describe('rc-tooltip', () => {
         </Tooltip>,
       );
       fireEvent.click(container.querySelector('.target'));
+      expect(container.querySelector('.rc-tooltip').classList).not.toContain(
+        'rc-tooltip-show-arrow',
+      );
       expect(container.querySelector('.rc-tooltip-content').outerHTML).toBe(
         '<div class="rc-tooltip-content"><div class="rc-tooltip-inner" role="tooltip"><strong class="x-content">Tooltip content</strong></div></div>',
       );