feat: feat: popupconfirm components add trigger API

Tencent · Jul 13, 2023 · b1fb46a · b1fb46a
1 parent e9a2047
commit b1fb46a
Show file tree

Hide file tree

Showing 6 changed files with 32 additions and 2 deletions.
diff --git a/src/popconfirm/Popconfirm.tsx b/src/popconfirm/Popconfirm.tsx
@@ -24,7 +24,6 @@ const Popconfirm = forwardRef((props: PopconfirmProps, ref: React.RefObject<Popu
       ref={ref}
       {...props}
       visible={visible}
-      trigger="click"
       onVisibleChange={(visible) => setVisible(visible)}
       overlayClassName={classNames(`${classPrefix}-popconfirm`)}
       content={

diff --git a/src/popconfirm/__tests__/popconfirm.test.tsx b/src/popconfirm/__tests__/popconfirm.test.tsx
@@ -44,6 +44,7 @@ describe('Popconfirm 组件测试', () => {
     const { getByText, queryByTestId, queryByText } = render(
       <Popconfirm
         placement="top"
+        trigger="click"
         content={<div data-testid={testId}>{text}</div>}
         onCancel={onCancelMock}
         onConfirm={onConfirmMock}

diff --git a/src/popconfirm/_usage/props.json b/src/popconfirm/_usage/props.json
@@ -60,6 +60,29 @@
       }
     ]
   },
+  {
+    "name": "trigger",
+    "type": "enum",
+    "defaultValue": "hover",
+    "options": [
+      {
+        "label": "hover",
+        "value": "hover"
+      },
+      {
+        "label": "click",
+        "value": "click"
+      },
+      {
+        "label": "focus",
+        "value": "focus"
+      },
+      {
+        "label": "context-menu",
+        "value": "context-menu"
+      }
+    ]
+  },
   {
     "name": "showArrow",
     "type": "Boolean",
@@ -91,4 +114,4 @@
     "defaultValue": false,
     "options": []
   }
-]
+]
diff --git a/src/popconfirm/popconfirm.en-US.md b/src/popconfirm/popconfirm.en-US.md
@@ -18,6 +18,7 @@ placement | String | top | options：top/left/right/bottom/top-left/top-right/bo
 popupProps | Object | - | Typescript：`PopupProps`，[Popup API Documents](./popup?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/popconfirm/type.ts) | N
 showArrow | Boolean | true | \- | N
 theme | String | default | options：default/warning/danger | N
+trigger | String | hover | options：hover/click/focus/mousedown/context-menu | N
 triggerElement | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 visible | Boolean | - | \- | N
 defaultVisible | Boolean | - | uncontrolled property | N

diff --git a/src/popconfirm/popconfirm.md b/src/popconfirm/popconfirm.md
@@ -17,6 +17,7 @@ placement | String | top | 浮层出现位置。可选项：top/left/right/botto
 popupProps | Object | - | 透传 Popup 组件属性。TS 类型：`PopupProps`，[Popup API Documents](./popup?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/popconfirm/type.ts) | N
 showArrow | Boolean | true | 是否显示浮层箭头 | N
 theme | String | default | 文字提示风格。可选项：default/warning/danger | N
+trigger | String | hover | 触发浮层出现的方式。可选项：hover/click/focus/mousedown/context-menu | N
 triggerElement | TNode | - | 触发元素。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 visible | Boolean | - | 是否显示气泡确认框 | N
 defaultVisible | Boolean | - | 是否显示气泡确认框。非受控属性 | N

diff --git a/src/popconfirm/type.ts b/src/popconfirm/type.ts
@@ -68,6 +68,11 @@ export interface TdPopconfirmProps {
    * @default default
    */
   theme?: 'default' | 'warning' | 'danger';
+  /**
+   * 触发浮层出现的方式
+   * @default hover
+   */
+  trigger?: 'hover' | 'click' | 'focus' | 'mousedown' | 'context-menu';
   /**
    * 触发元素
    */