Revert "chore(deps-dev): bump @types/react from 17.0.62 to 18.2.15"

docs/examples/components/TooltipSlider.tsx

@@ -1,10 +1,9 @@
-import type { SliderProps } from '@/index';
-import Slider from '@/index';
-import type { TooltipRef } from 'rc-tooltip';
-import Tooltip from 'rc-tooltip';
+import * as React from 'react';
 import 'rc-tooltip/assets/bootstrap.css';
+import Slider from 'rc-slider';
+import type { SliderProps } from 'rc-slider';
 import raf from 'rc-util/lib/raf';
-import * as React from 'react';
+import Tooltip from 'rc-tooltip';
 
 const HandleTooltip = (props: {
   value: number;
@@ -14,7 +13,7 @@ const HandleTooltip = (props: {
 }) => {
   const { value, children, visible, tipFormatter = (val) => `${val} %`, ...restProps } = props;
 
-  const tooltipRef = React.useRef<TooltipRef>();
+  const tooltipRef = React.useRef<any>();
   const rafRef = React.useRef<number | null>(null);
 
   function cancelKeepAlign() {
@@ -63,7 +62,7 @@ const TooltipSlider = ({
   tipFormatter,
   tipProps,
   ...props
-}: SliderProps & { tipFormatter?: (value: number) => React.ReactNode; tipProps?: any }) => {
+}: SliderProps & { tipFormatter?: (value: number) => React.ReactNode; tipProps: any }) => {
   const tipHandleRender: SliderProps['handleRender'] = (node, handleProps) => {
     return (
       <HandleTooltip

docs/examples/debug.tsx

@@ -1,12 +1,13 @@
-import Slider from '@/index';
 import React from 'react';
+import Slider from 'rc-slider';
 import '../../assets/index.less';
 
 export default () => {
   const [disabled, setDisabled] = React.useState(false);
   const [range, setRange] = React.useState(false);
   const [reverse, setReverse] = React.useState(false);
   const [vertical, setVertical] = React.useState(false);
+  const [value, setValue] = React.useState(30);
 
   return (
     <div
@@ -49,7 +50,7 @@
           // allowCross={false}
           onChange={(nextValues) => {
             console.log('Change:', nextValues);
-            //   setValue(nextValues as any);
+          //   setValue(nextValues as any);
           }}
           onChangeComplete={(v) => {
             console.log('AfterChange:', v);

docs/examples/handle.tsx

@@ -1,5 +1,5 @@
-import Slider from '@/index';
 import React from 'react';
+import Slider from 'rc-slider';
 import '../../assets/index.less';
 import TooltipSlider, { handleRender } from './components/TooltipSlider';
 

docs/examples/marks.tsx

@@ -1,5 +1,5 @@
-import Slider from '@/index';
 import React from 'react';
+import Slider from 'rc-slider';
 import '../../assets/index.less';
 
 const style = { width: 400, margin: 50 };
@@ -25,14 +25,7 @@ export default () => (
   <div>
     <div style={style}>
       <p>Slider with marks, `step=null`</p>
-      <Slider
-        min={-10}
-        marks={marks}
-        step={null}
-        onChange={log}
-        defaultValue={20}
-        onChangeComplete={(v) => console.log('AfterChange:', v)}
-      />
+      <Slider min={-10} marks={marks} step={null} onChange={log} defaultValue={20} onChangeComplete={(v) => console.log('AfterChange:', v)} />
     </div>
 
     <div style={style}>

docs/examples/multiple.tsx

@@ -1,5 +1,5 @@
 /* eslint react/no-multi-comp: 0, no-console: 0 */
-import Slider from '@/index';
+import Slider from 'rc-slider';
 import React from 'react';
 import '../../assets/index.less';
 

docs/examples/range.tsx

@@ -1,6 +1,6 @@
 /* eslint react/no-multi-comp: 0, no-console: 0 */
-import Slider from '@/index';
 import React from 'react';
+import Slider from 'rc-slider';
 import '../../assets/index.less';
 
 const style = { width: 400, margin: 50 };

docs/examples/slider.tsx

@@ -1,6 +1,6 @@
 /* eslint react/no-multi-comp: 0, max-len: 0 */
-import Slider from '@/index';
 import React from 'react';
+import Slider from 'rc-slider';
 import '../../assets/index.less';
 import TooltipSlider from './components/TooltipSlider';
 

docs/examples/vertical.tsx

@@ -1,5 +1,5 @@
-import Slider from '@/index';
 import React from 'react';
+import Slider from 'rc-slider';
 import '../../assets/index.less';
 
 const style: React.CSSProperties = {

package.json

@@ -2,6 +2,9 @@
   "name": "rc-slider",
   "version": "10.5.0",
   "description": "Slider UI component for React",
+  "engines": {
+    "node": ">=8.x"
+  },
   "keywords": [
     "react",
     "react-component",
@@ -11,34 +14,38 @@
     "range"
   ],
   "homepage": "http://github.com/react-component/slider/",
-  "bugs": {
-    "url": "http://github.com/react-component/slider/issues"
-  },
   "repository": {
     "type": "git",
     "url": "git@github.com:react-component/slider.git"
   },
-  "license": "MIT",
-  "main": "./lib/index",
-  "module": "./es/index",
-  "types": "./lib/index.d.ts",
-  "style": "./assets/index.css",
+  "bugs": {
+    "url": "http://github.com/react-component/slider/issues"
+  },
   "files": [
     "assets/*.css",
     "lib",
     "es"
   ],
+  "license": "MIT",
+  "main": "./lib/index",
+  "module": "./es/index",
+  "style": "./assets/index.css",
+  "types": "./lib/index.d.ts",
   "scripts": {
-    "compile": "father build && lessc assets/index.less assets/index.css",
-    "coverage": "rc-test --coverage",
+    "start": "dumi dev",
     "docs:build": "dumi build",
     "docs:deploy": "gh-pages -d .doc",
-    "lint": "eslint src/ --ext .ts,.tsx,.jsx,.js,.md",
-    "now-build": "npm run docs:build",
+    "compile": "father build && lessc assets/index.less assets/index.css",
     "prepublishOnly": "npm run compile && np --yolo --no-publish",
+    "lint": "eslint src/ --ext .ts,.tsx,.jsx,.js,.md",
     "prettier": "prettier --write \"**/*.{ts,tsx,js,jsx,json,md}\"",
-    "start": "dumi dev",
-    "test": "rc-test"
+    "test": "rc-test",
+    "coverage": "rc-test --coverage",
+    "now-build": "npm run docs:build"
+  },
+  "peerDependencies": {
+    "react": ">=16.9.0",
+    "react-dom": ">=16.9.0"
   },
   "dependencies": {
     "@babel/runtime": "^7.10.1",
@@ -51,14 +58,14 @@
     "@testing-library/react": "^12.1.3",
     "@types/classnames": "^2.2.9",
     "@types/jest": "^29.5.1",
-    "@types/react": "^18.2.41",
+    "@types/react": "^17.0.15",
     "@types/react-dom": "^18.0.11",
     "@umijs/fabric": "^4.0.1",
     "cross-env": "^7.0.0",
-    "dumi": "^2.2.10",
     "eslint": "^8.54.0",
     "eslint-plugin-jest": "^27.6.0",
     "eslint-plugin-unicorn": "^49.0.0",
+    "dumi": "^2.2.10",
     "father": "^4.3.5",
     "father-build": "^1.18.6",
     "gh-pages": "^6.1.0",
@@ -72,12 +79,5 @@
     "react-dom": "^16.0.0",
     "regenerator-runtime": "^0.14.0",
     "typescript": "^5.1.6"
-  },
-  "peerDependencies": {
-    "react": ">=16.9.0",
-    "react-dom": ">=16.9.0"
-  },
-  "engines": {
-    "node": ">=8.x"
   }
 }

src/Handles/Handle.tsx

@@ -26,7 +26,7 @@
   onChangeComplete?: () => void;
 }
 
-const Handle = React.forwardRef<HTMLDivElement, HandleProps>((props, ref) => {
+const Handle = React.forwardRef((props: HandleProps, ref: React.Ref<HTMLDivElement>) => {
   const {
     prefixCls,
     value,
@@ -124,7 +124,7 @@
         onChangeComplete?.();
         break;
     }
-  };
+  }
 
   // ============================ Offset ============================
   const positionStyle = getDirectionStyle(direction, value, min, max);

src/Handles/index.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import type { OnStartMove } from '../interface';
-import { getIndex } from '../util';
-import type { HandleProps } from './Handle';
 import Handle from './Handle';
+import type { HandleProps } from './Handle';
+import { getIndex } from '../util';
+import type { OnStartMove } from '../interface';
 
 export interface HandlesProps {
   prefixCls: string;
@@ -21,7 +21,7 @@ export interface HandlesRef {
   focus: (index: number) => void;
 }
 
-const Handles = React.forwardRef<HandlesRef, HandlesProps>((props, ref) => {
+const Handles = React.forwardRef((props: HandlesProps, ref: React.Ref<HandlesRef>) => {
   const {
     prefixCls,
     style,

src/Marks/index.tsx

@@ -29,7 +29,13 @@ export default function Marks(props: MarksProps) {
   return (
     <div className={markPrefixCls}>
       {marks.map(({ value, style, label }) => (
-        <Mark key={value} prefixCls={markPrefixCls} style={style} value={value} onClick={onClick}>
+        <Mark
+          key={value}
+          prefixCls={markPrefixCls}
+          style={style}
+          value={value}
+          onClick={onClick}
+        >
           {label}
         </Mark>
       ))}

src/Slider.tsx

@@ -3,14 +3,10 @@ import useMergedState from 'rc-util/lib/hooks/useMergedState';
 import isEqual from 'rc-util/lib/isEqual';
 import warning from 'rc-util/lib/warning';
 import * as React from 'react';
-import type { HandlesProps, HandlesRef } from './Handles';
-import Handles from './Handles';
-import type { InternalMarkObj, MarkObj } from './Marks';
-import Marks from './Marks';
-import Steps from './Steps';
-import Tracks from './Tracks';
 import type { SliderContextProps } from './context';
 import SliderContext from './context';
+import type { HandlesProps, HandlesRef } from './Handles';
+import Handles from './Handles';
 import useDrag from './hooks/useDrag';
 import useOffset from './hooks/useOffset';
 import type {
@@ -20,6 +16,10 @@ import type {
   SliderClassNames,
   SliderStyles,
 } from './interface';
+import type { InternalMarkObj, MarkObj } from './Marks';
+import Marks from './Marks';
+import Steps from './Steps';
+import Tracks from './Tracks';
 
 /**
  * New:
@@ -106,7 +106,7 @@ export interface SliderRef {
   blur: () => void;
 }
 
-const Slider = React.forwardRef<SliderRef, SliderProps>((props, ref) => {
+const Slider = React.forwardRef((props: SliderProps, ref: React.Ref<SliderRef>) => {
   const {
     prefixCls = 'rc-slider',
     className,
@@ -211,7 +211,7 @@ const Slider = React.forwardRef<SliderRef, SliderProps>((props, ref) => {
           markObj.style = mark.style;
           markObj.label = mark.label;
         } else {
-          markObj.label = mark as React.ReactNode;
+          markObj.label = mark;
         }
 
         return markObj;
@@ -292,10 +292,7 @@ const Slider = React.forwardRef<SliderRef, SliderProps>((props, ref) => {
 
   const finishChange = () => {
     onAfterChange?.(getTriggerValue(rawValuesRef.current));
-    warning(
-      !onAfterChange,
-      '[rc-slider] `onAfterChange` is deprecated. Please use `onChangeComplete` instead.',
-    );
+    warning(!onAfterChange, '[rc-slider] `onAfterChange` is deprecated. Please use `onChangeComplete` instead.');
     onChangeComplete?.(getTriggerValue(rawValuesRef.current));
   };
 

src/interface.ts

@@ -2,11 +2,7 @@ import type React from 'react';
 
 export type Direction = 'rtl' | 'ltr' | 'ttb' | 'btt';
 
-export type OnStartMove = (
-  e: React.MouseEvent | React.TouchEvent,
-  valueIndex: number,
-  startValues?: number[],
-) => void;
+export type OnStartMove = (e: React.MouseEvent | React.TouchEvent, valueIndex: number, startValues?: number[]) => void;
 
 export type AriaValueFormat = (value: number) => string;
 

tsconfig.json

@@ -10,7 +10,7 @@
     "paths": {
       "@/*": ["src/*"],
       "@@/*": ["src/.umi/*"],
-      "rc-slider": ["src/index.ts"]
+      "rc-slider": ["src/index.tsx"]
     }
   }
 }