Merge pull request #16985 from lhyt/feature_disabled_prop_popconfirm

feat(popconfirm): add disabled in popconfirm

components/layout/__tests__/__snapshots__/demo.test.js.snap

@@ -285,7 +285,7 @@ exports[`renders ./components/layout/demo/fixed.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;display:none"
+        style="display:none"
       >
         <div
           aria-expanded="false"
@@ -309,7 +309,7 @@ exports[`renders ./components/layout/demo/fixed.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;display:none"
+        style="display:none"
       >
         <div
           aria-expanded="false"
@@ -333,7 +333,7 @@ exports[`renders ./components/layout/demo/fixed.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;display:none"
+        style="display:none"
       >
         <div
           aria-expanded="false"
@@ -357,7 +357,7 @@ exports[`renders ./components/layout/demo/fixed.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;visibility:hidden;position:absolute"
+        style="visibility:hidden;position:absolute"
       >
         <div
           aria-expanded="false"
@@ -1269,7 +1269,7 @@ exports[`renders ./components/layout/demo/top.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;display:none"
+        style="display:none"
       >
         <div
           aria-expanded="false"
@@ -1293,7 +1293,7 @@ exports[`renders ./components/layout/demo/top.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;display:none"
+        style="display:none"
       >
         <div
           aria-expanded="false"
@@ -1317,7 +1317,7 @@ exports[`renders ./components/layout/demo/top.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;display:none"
+        style="display:none"
       >
         <div
           aria-expanded="false"
@@ -1341,7 +1341,7 @@ exports[`renders ./components/layout/demo/top.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;visibility:hidden;position:absolute"
+        style="visibility:hidden;position:absolute"
       >
         <div
           aria-expanded="false"
@@ -1436,7 +1436,7 @@ exports[`renders ./components/layout/demo/top-side.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;display:none"
+        style="display:none"
       >
         <div
           aria-expanded="false"
@@ -1460,7 +1460,7 @@ exports[`renders ./components/layout/demo/top-side.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;display:none"
+        style="display:none"
       >
         <div
           aria-expanded="false"
@@ -1484,7 +1484,7 @@ exports[`renders ./components/layout/demo/top-side.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;display:none"
+        style="display:none"
       >
         <div
           aria-expanded="false"
@@ -1508,7 +1508,7 @@ exports[`renders ./components/layout/demo/top-side.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;visibility:hidden;position:absolute"
+        style="visibility:hidden;position:absolute"
       >
         <div
           aria-expanded="false"
@@ -1772,7 +1772,7 @@ exports[`renders ./components/layout/demo/top-side-2.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;display:none"
+        style="display:none"
       >
         <div
           aria-expanded="false"
@@ -1796,7 +1796,7 @@ exports[`renders ./components/layout/demo/top-side-2.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;display:none"
+        style="display:none"
       >
         <div
           aria-expanded="false"
@@ -1820,7 +1820,7 @@ exports[`renders ./components/layout/demo/top-side-2.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;display:none"
+        style="display:none"
       >
         <div
           aria-expanded="false"
@@ -1844,7 +1844,7 @@ exports[`renders ./components/layout/demo/top-side-2.md correctly 1`] = `
       <li
         class="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu"
         role="menuitem"
-        style="line-height:64px;visibility:hidden;position:absolute"
+        style="visibility:hidden;position:absolute"
       >
         <div
           aria-expanded="false"

components/popconfirm/__tests__/index.test.js

@@ -134,4 +134,15 @@ describe('Popconfirm', () => {
     );
     expect(popconfirm.instance().getPopupDomNode()).toBeTruthy();
   });
+
+  it('should not open in disabled', () => {
+    const popconfirm = mount(
+      <Popconfirm title="code" disabled>
+        <span>click me</span>
+      </Popconfirm>,
+    );
+    const triggerNode = popconfirm.find('span').at(0);
+    triggerNode.simulate('click');
+    expect(popconfirm.instance().getPopupDomNode()).toBeFalsy();
+  });
 });

components/popconfirm/index.en-US.md

@@ -23,6 +23,7 @@ The difference with the `confirm` modal dialog is that it's more lightweight tha
 | onCancel | callback of cancel | function(e) | - |
 | onConfirm | callback of confirmation | function(e) | - |
 | icon | customize icon of confirmation | ReactNode | <Icon type="exclamation-circle" /> |
+| disabled | is show popconfirm when click its childrenNode | boolean | false |
 
 Consult [Tooltip's documentation](https://ant.design/components/tooltip/#API) to find more APIs.
 

components/popconfirm/index.tsx

@@ -10,6 +10,7 @@ import { ConfigConsumer, ConfigConsumerProps } from '../config-provider';
 
 export interface PopconfirmProps extends AbstractTooltipProps {
   title: React.ReactNode;
+  disabled?: boolean;
   onConfirm?: (e?: React.MouseEvent<any>) => void;
   onCancel?: (e?: React.MouseEvent<any>) => void;
   okText?: React.ReactNode;
@@ -37,6 +38,7 @@ class Popconfirm extends React.Component<PopconfirmProps, PopconfirmState> {
     trigger: 'click' as PopconfirmProps['trigger'],
     okType: 'primary' as PopconfirmProps['okType'],
     icon: <Icon type="exclamation-circle" theme="filled" />,
+    disabled: false,
   };
 
   static getDerivedStateFromProps(nextProps: PopconfirmProps) {
@@ -81,6 +83,10 @@ class Popconfirm extends React.Component<PopconfirmProps, PopconfirmState> {
   };
 
   onVisibleChange = (visible: boolean) => {
+    const { disabled } = this.props;
+    if (disabled) {
+      return;
+    }
     this.setVisible(visible);
   };
 

components/popconfirm/index.zh-CN.md

@@ -24,6 +24,7 @@ title: Popconfirm
 | onCancel | 点击取消的回调 | function(e) | 无 |
 | onConfirm | 点击确认的回调 | function(e) | 无 |
 | icon | 自定义弹出气泡 Icon 图标 | ReactNode | <Icon type="exclamation-circle" /> |
+| disabled | 点击 Popconfirm 子元素是否弹出气泡确认框 | boolean | false |
 
 更多属性请参考 [Tooltip](/components/tooltip/#API)。
 

components/time-picker/__tests__/__snapshots__/index.test.js.snap

@@ -41,16 +41,17 @@ exports[`TimePicker not render clean icon when allowClear is false 1`] = `
 `;
 
 exports[`TimePicker prop locale should works 1`] = `
-<span
+Array [
+  <span
     class="ant-time-picker"
     style=""
->
+  >
     <input
       class="ant-time-picker-input"
       id=""
       placeholder="Избери дата"
       type="text"
-    value=""
+      value="00:00:00"
     />
     <span
       class="ant-time-picker-icon"
@@ -78,7 +79,934 @@ exports[`TimePicker prop locale should works 1`] = `
         </svg>
       </i>
     </span>
-</span>
+    <i
+      aria-label="icon: close-circle"
+      class="anticon anticon-close-circle ant-time-picker-clear"
+      tabindex="-1"
+    >
+      <svg
+        aria-hidden="true"
+        class=""
+        data-icon="close-circle"
+        fill="currentColor"
+        focusable="false"
+        height="1em"
+        viewBox="64 64 896 896"
+        width="1em"
+      >
+        <path
+          d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"
+        />
+      </svg>
+    </i>
+  </span>,
+  <div>
+    <div
+      class="ant-time-picker-panel ant-time-picker-panel-column-3 ant-time-picker-panel-placement-bottomLeft slide-up-appear"
+      style="left: -999px; top: -1001px;"
+    >
+      <div
+        class="ant-time-picker-panel-inner"
+      >
+        <div
+          class="ant-time-picker-panel-input-wrap"
+        >
+          <input
+            class="ant-time-picker-panel-input"
+            placeholder="Избери дата"
+            value="00:00:00"
+          />
+        </div>
+        <div
+          class="ant-time-picker-panel-combobox"
+        >
+          <div
+            class="ant-time-picker-panel-select"
+          >
+            <ul>
+              <li
+                class="ant-time-picker-panel-select-option-selected"
+                role="button"
+              >
+                00
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                01
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                02
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                03
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                04
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                05
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                06
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                07
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                08
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                09
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                10
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                11
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                12
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                13
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                14
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                15
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                16
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                17
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                18
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                19
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                20
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                21
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                22
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                23
+              </li>
+            </ul>
+          </div>
+          <div
+            class="ant-time-picker-panel-select"
+          >
+            <ul>
+              <li
+                class="ant-time-picker-panel-select-option-selected"
+                role="button"
+              >
+                00
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                01
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                02
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                03
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                04
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                05
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                06
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                07
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                08
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                09
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                10
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                11
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                12
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                13
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                14
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                15
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                16
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                17
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                18
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                19
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                20
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                21
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                22
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                23
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                24
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                25
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                26
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                27
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                28
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                29
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                30
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                31
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                32
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                33
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                34
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                35
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                36
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                37
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                38
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                39
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                40
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                41
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                42
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                43
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                44
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                45
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                46
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                47
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                48
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                49
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                50
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                51
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                52
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                53
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                54
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                55
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                56
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                57
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                58
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                59
+              </li>
+            </ul>
+          </div>
+          <div
+            class="ant-time-picker-panel-select"
+          >
+            <ul>
+              <li
+                class="ant-time-picker-panel-select-option-selected"
+                role="button"
+              >
+                00
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                01
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                02
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                03
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                04
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                05
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                06
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                07
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                08
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                09
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                10
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                11
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                12
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                13
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                14
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                15
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                16
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                17
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                18
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                19
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                20
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                21
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                22
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                23
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                24
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                25
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                26
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                27
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                28
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                29
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                30
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                31
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                32
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                33
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                34
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                35
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                36
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                37
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                38
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                39
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                40
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                41
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                42
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                43
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                44
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                45
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                46
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                47
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                48
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                49
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                50
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                51
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                52
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                53
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                54
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                55
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                56
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                57
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                58
+              </li>
+              <li
+                class=""
+                role="button"
+              >
+                59
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>,
+]
 `;
 
 exports[`TimePicker renders addon correctly 1`] = `

components/time-picker/__tests__/index.test.js

@@ -73,7 +73,9 @@ describe('TimePicker', () => {
     const locale = {
       placeholder: 'Избери дата',
     };
-    const wrapper = mount(<TimePicker open locale={locale} />);
+    const wrapper = mount(
+      <TimePicker defaultValue={moment('2000-01-01 00:00:00')} open locale={locale} />,
+    );
     expect(wrapper.render()).toMatchSnapshot();
   });
 });