fix(striker-ui): allow specify valueKey in InputWithRef

main
Tsu-ba-me 2 years ago
parent 40febdae87
commit 0f40ffe604
  1. 36
      striker-ui/components/InputWithRef.tsx

@ -20,6 +20,7 @@ type InputWithRefOptionalPropsWithDefault<
> = { > = {
createInputOnChangeHandlerOptions?: CreateInputOnChangeHandlerOptions<TypeName>; createInputOnChangeHandlerOptions?: CreateInputOnChangeHandlerOptions<TypeName>;
required?: boolean; required?: boolean;
valueKey?: string;
valueType?: TypeName; valueType?: TypeName;
}; };
type InputWithRefOptionalPropsWithoutDefault = { type InputWithRefOptionalPropsWithoutDefault = {
@ -57,6 +58,7 @@ const INPUT_WITH_REF_DEFAULT_PROPS: Required<
InputWithRefOptionalPropsWithoutDefault = { InputWithRefOptionalPropsWithoutDefault = {
createInputOnChangeHandlerOptions: {}, createInputOnChangeHandlerOptions: {},
required: false, required: false,
valueKey: 'value',
valueType: 'string', valueType: 'string',
}; };
@ -71,6 +73,7 @@ const InputWithRef = forwardRef(
inputTestBatch, inputTestBatch,
onFirstRender, onFirstRender,
required: isRequired = INPUT_WITH_REF_DEFAULT_PROPS.required, required: isRequired = INPUT_WITH_REF_DEFAULT_PROPS.required,
valueKey = INPUT_WITH_REF_DEFAULT_PROPS.valueKey,
valueType = INPUT_WITH_REF_DEFAULT_PROPS.valueType as TypeName, valueType = INPUT_WITH_REF_DEFAULT_PROPS.valueType as TypeName,
}: InputWithRefProps<TypeName, InputComponent>, }: InputWithRefProps<TypeName, InputComponent>,
ref: ForwardedRef<InputForwardedRefContent<TypeName>>, ref: ForwardedRef<InputForwardedRefContent<TypeName>>,
@ -123,6 +126,26 @@ const InputWithRef = forwardRef(
})), })),
[initOnBlur, testInput], [initOnBlur, testInput],
); );
const onChange = useMemo(
() =>
createInputOnChangeHandler<TypeName>({
postSet: (...args) => {
setIsChangedByUser(true);
initOnChange?.call(null, ...args);
postSetAppend?.call(null, ...args);
},
set: setValue,
setType: valueType,
...restCreateInputOnChangeHandlerOptions,
}),
[
initOnChange,
postSetAppend,
restCreateInputOnChangeHandlerOptions,
setValue,
valueType,
],
);
const onFocus = useMemo<InputBaseProps['onFocus']>( const onFocus = useMemo<InputBaseProps['onFocus']>(
() => () =>
initOnFocus ?? initOnFocus ??
@ -133,17 +156,6 @@ const InputWithRef = forwardRef(
[initOnFocus, inputTestBatch], [initOnFocus, inputTestBatch],
); );
const onChange = createInputOnChangeHandler<TypeName>({
postSet: (...args) => {
setIsChangedByUser(true);
initOnChange?.call(null, ...args);
postSetAppend?.call(null, ...args);
},
set: setValue,
setType: valueType,
...restCreateInputOnChangeHandlerOptions,
});
useEffect(() => { useEffect(() => {
if (isFirstRender) { if (isFirstRender) {
onFirstRender?.call(null, { isRequired }); onFirstRender?.call(null, { isRequired });
@ -167,7 +179,7 @@ const InputWithRef = forwardRef(
onChange, onChange,
onFocus, onFocus,
required: isRequired, required: isRequired,
value: inputValue, [valueKey]: inputValue,
}); });
}, },
); );

Loading…
Cancel
Save