feat: replace timepicker dropdownClassName to popupClassName (#139)

* feat: replace timepicker dropdownClassName to popupClassName

* feat: edit warning info

* feat: add rangePicker

docs/demo/TimePicker.md

@@ -0,0 +1,4 @@
+## TimePicker
+
+
+<code src="../examples/TimePicker.tsx" />

docs/examples/TimePicker.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import { TimePicker,  } from '../../src';
+import type { Dayjs } from 'dayjs';
+import dayjs from 'dayjs';
+import customParseFormat from 'dayjs/plugin/customParseFormat';
+dayjs.extend(customParseFormat);
+
+export default () => {
+  const onChange = (time: Dayjs, timeString: string) => {
+    console.log(time, timeString);
+  };
+
+  return (
+    <TimePicker onChange={onChange} defaultValue={dayjs('00:00:00', 'HH:mm:ss')} />
+  );
+};

src/TimePicker.tsx

@@ -0,0 +1,58 @@
+import * as React from 'react';
+import { TimePicker } from 'antd';
+import warning from 'rc-util/lib/warning';
+
+type TimePickerProps = Parameters<typeof TimePicker>[0];
+type TimePickerRef = TimePickerProps['ref'];
+
+type RangePickerProps = Parameters<typeof TimePicker>[0];
+type RangePickerRef = RangePickerProps['ref'];
+
+type CompatibleTimePickerProps = TimePickerProps & {
+  /** @deprecated Please use `popupClassName` instead. */
+  dropdownClassName?: string;
+};
+
+type CompatibleRangePickerProps = RangePickerProps & {
+  /** @deprecated Please use `popupClassName` instead. */
+  dropdownClassName?: string;
+};
+
+const CompatibleTimePicker = React.forwardRef(
+  (
+    { dropdownClassName, popupClassName, ...restProps }: CompatibleTimePickerProps,
+    ref: TimePickerRef,
+  ) => {
+    warning(
+      !dropdownClassName,
+      "[antd: TimePicker] `dropdownClassName` is removed in v5, please use `popupClassName` instead.",
+    );
+
+    return (
+      <TimePicker {...restProps} popupClassName={popupClassName || dropdownClassName} ref={ref} />
+    );
+  },
+);
+
+
+
+CompatibleTimePicker.RangePicker = React.forwardRef(
+  (
+    { dropdownClassName, popupClassName, ...restProps }: CompatibleRangePickerProps,
+    ref: RangePickerRef,
+  ) => {
+    warning(
+      !dropdownClassName,
+      "[antd: RangePicker] `dropdownClassName` is removed in v5, please use `popupClassName` instead.",
+    );
+
+    return (
+      <TimePicker.RangePicker {...restProps} popupClassName={popupClassName || dropdownClassName} ref={ref} />
+    );
+  },
+);
+
+if (process.env.NODE_ENV !== 'production') {
+  CompatibleTimePicker.displayName = 'CompatibleTimePicker';
+}
+export default CompatibleTimePicker;

src/index.tsx

@@ -5,3 +5,4 @@ export { default as Mentions } from './Mentions';
 export { default as Select } from './Select';
 export { default as TreeSelect } from './TreeSelect';
 export { default as DatePicker } from './DatePicker';
+export { default as TimePicker } from './TimePicker';

tests/TimePicker.test.tsx

@@ -0,0 +1,45 @@
+import React from 'react';
+import { TimePicker } from '../src';
+import { render } from '@testing-library/react';
+
+describe('TimePicker', () => {
+
+
+  it('TimePicker dropdownClassName', async () => {
+    const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+
+    const { container } = render(
+      <TimePicker
+        dropdownClassName="test"
+      />,
+    );
+
+    expect(errSpy).toHaveBeenCalledWith(
+      "Warning: [antd: TimePicker] `dropdownClassName` is removed in v5, please use `popupClassName` instead.",
+    );
+
+    // TODO: Remove this when antd release version
+    // expect(container.querySelector('.test')).toBeTruthy();
+
+    errSpy.mockRestore();
+  });
+
+  it('TimePicker.RangePicker dropdownClassName', async () => {
+    const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+
+    const { container } = render(
+      <TimePicker.RangePicker
+        dropdownClassName="test"
+      />,
+    );
+
+    expect(errSpy).toHaveBeenCalledWith(
+      "Warning: [antd: RangePicker] `dropdownClassName` is removed in v5, please use `popupClassName` instead.",
+    );
+
+    // TODO: Remove this when antd release version
+    // expect(container.querySelector('.test')).toBeTruthy();
+
+    errSpy.mockRestore();
+  });
+});