feat: ranges support customize component

Author: zombieJ

src/RangePicker.tsx

@@ -110,6 +110,7 @@ export interface RangePickerSharedProps<DateType> {
   /** @private Internal usage. Do not use in your production env */
   components?: {
     button: React.ComponentType;
+    rangeItem: React.ComponentType;
   };
 }
 
@@ -827,21 +828,23 @@ function InnerRangePicker<DateType>(props: RangePickerProps<DateType>) {
       const mergedRanges = ranges || {};
       const rangeList = Object.keys(mergedRanges);
       const Button = (components && components.button) || 'button';
+      const RangeItem = (components && components.rangeItem) || 'span';
 
       rangesNode = (
         <ul className={`${prefixCls}-ranges`}>
           {rangeList.map(label => {
             const range = mergedRanges[label];
 
             return (
-              <li
-                key={label}
-                onClick={() => {
-                  const newValues = Array.isArray(range) ? range : range();
-                  triggerChange(newValues);
-                }}
-              >
-                {label}
+              <li key={label}>
+                <RangeItem
+                  onClick={() => {
+                    const newValues = Array.isArray(range) ? range : range();
+                    triggerChange(newValues);
+                  }}
+                >
+                  {label}
+                </RangeItem>
               </li>
             );
           })}

tests/range.spec.tsx

@@ -280,7 +280,7 @@ describe('Picker.Range', () => {
     let testNode;
 
     // Basic
-    testNode = wrapper.find('.rc-picker-ranges li').first();
+    testNode = wrapper.find('.rc-picker-ranges li span').first();
     expect(testNode.text()).toEqual('test');
     testNode.simulate('click');
     expect(onChange).toHaveBeenCalledWith(
@@ -289,7 +289,7 @@ describe('Picker.Range', () => {
     );
 
     // Function
-    testNode = wrapper.find('.rc-picker-ranges li').last();
+    testNode = wrapper.find('.rc-picker-ranges li span').last();
     expect(testNode.text()).toEqual('func');
     testNode.simulate('click');
     expect(onChange).toHaveBeenCalledWith(