51 lines
1.2 KiB
TypeScript
51 lines
1.2 KiB
TypeScript
import { RefObject } from 'react';
|
|
|
|
import { FormGroup } from '@/components/form/FormGroup';
|
|
import { NumberInputField, NumberInputProps, NumberInputRoot } from '../ui/number-input';
|
|
import { useFormidableContextElement } from '../formidable';
|
|
|
|
export type FormNumberProps = Pick<
|
|
NumberInputProps,
|
|
'step' | 'defaultValue' | 'min' | 'max'
|
|
> & {
|
|
name: string;
|
|
ref?: RefObject<any>;
|
|
label?: string;
|
|
placeholder?: string;
|
|
isRequired?: boolean;
|
|
};
|
|
|
|
export const FormNumber = ({
|
|
name,
|
|
ref,
|
|
placeholder,
|
|
step,
|
|
min,
|
|
max,
|
|
defaultValue,
|
|
...rest
|
|
}: FormNumberProps) => {
|
|
const {form, value, isModify, onChange, onRestore} = useFormidableContextElement(name);
|
|
return (
|
|
<FormGroup
|
|
enableModifyNotification={form.configuration.enableModifyNotification}
|
|
enableReset={form.configuration.enableReset}
|
|
isModify={isModify}
|
|
onRestore={onRestore}
|
|
{...rest}
|
|
>
|
|
<NumberInputRoot
|
|
ref={ref}
|
|
value={value}
|
|
onValueChange={(e) => onChange(e.value)}
|
|
step={step}
|
|
defaultValue={defaultValue}
|
|
min={min}
|
|
max={max}
|
|
>
|
|
<NumberInputField />
|
|
</NumberInputRoot>
|
|
</FormGroup>
|
|
);
|
|
};
|