import React from 'react';
import { FormField, NumberInput } from '@wix/design-system';
import { BaseInputProps } from '../BaseInput';
import { Field } from '../Field';
import { dataHooks } from '../dataHooks';

export interface NumberProps extends BaseInputProps<number | null> {}

export const Number = ({
  dataHook,
  schema,
  initialValue,
  onChange,
}: NumberProps) => {
  return (
    <Field dataHook={dataHook} type={schema.type}>
      <FormField dataHook={dataHooks.Label} label={schema.label}>
        <NumberInput
          dataHook={dataHooks.Input}
          defaultValue={initialValue || undefined}
          onChange={(e) => onChange(e)}
        />
      </FormField>
    </Field>
  );
};