enhance: (Stepper) value prop type inference

ant-design · Feb 25, 2022 · 7ef4efe · 7ef4efe
1 parent 588889d
commit 7ef4efe
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 11 deletions.
diff --git a/src/components/stepper/demos/demo1.tsx b/src/components/stepper/demos/demo1.tsx
@@ -20,7 +20,7 @@ export default () => {
         <Stepper
           value={num}
           onChange={value => {
-            setNum(value as number)
+            setNum(value)
           }}
         />
       </DemoBlock>

diff --git a/src/components/stepper/stepper.tsx b/src/components/stepper/stepper.tsx
@@ -10,18 +10,29 @@ import Button from '../button'
 
 const classPrefix = `adm-stepper`
 
-export type StepperProps = Pick<InputProps, 'onFocus' | 'onBlur'> & {
+type ValueProps = {
+  allowEmpty: true
   value?: number | null
   defaultValue?: number | null
   onChange?: (value: number | null) => void
-  min?: number
-  max?: number
-  step?: number
-  digits?: number
-  disabled?: boolean
-  inputReadOnly?: boolean
-  allowEmpty?: boolean
-} & NativeProps<
+}
+
+type ValuePropsWithNull = {
+  allowEmpty?: false
+  value?: number
+  defaultValue?: number
+  onChange?: (value: number) => void
+}
+
+export type StepperProps = Pick<InputProps, 'onFocus' | 'onBlur'> &
+  (ValuePropsWithNull | ValueProps) & {
+    min?: number
+    max?: number
+    step?: number
+    digits?: number
+    disabled?: boolean
+    inputReadOnly?: boolean
+  } & NativeProps<
     | '--height'
     | '--input-width'
     | '--input-font-size'
@@ -48,7 +59,7 @@ export const Stepper: FC<StepperProps> = p => {
   const props = mergeProps(defaultProps, p)
   const { disabled, step, max, min, inputReadOnly } = props
 
-  const [value, setValue] = usePropsValue(props)
+  const [value, setValue] = usePropsValue<number | null>(props as any)
   const [inputValue, setInputValue] = useState(() => convertValueToText(value))
   function setValueWithCheck(v: number) {
     if (isNaN(v)) return