RaFormInput width always seems to be 256px

Question

I have the below tabbed form and no matter what I set as far as content (grids, boxes, etc) the width of the parent form is always 256px

The html element is MuiContainer-root RaFormInput-input-61 but its always the RaFormInput with this limit. Is there something obvious I am missing here?

<Edit {...props} title={<ClientTitle />}>
  <TabbedForm>
    <FormTab label="details">
      <Container maxWidth={false}>
        <Grid container className={classes.root} spacing={2}>
          <Grid container direction="row">
            <Typography variant="h6" gutterBottom>
              {translate('resources.clients.fieldGroups.identity')}
            </Typography>
          </Grid>
          <Grid container direction="row" justify="flex-start" alignItems="center" spacing={2}>
            <Grid item>
              <TextInput source="firstname" resource="clients" validate={requiredValidate} fullWidth />
            </Grid>
            <Grid item>
              <TextInput source="lastname" resource="clients" validate={requiredValidate} fullWidth />
            </Grid>
          </Grid>
        </Grid>
      </Container>
    </FormTab>
    <FormTab label="referrals">
      <AddNewReferralButton record={props.record} />
      <ReferenceManyField reference="referrals" target="clientid" addLabel={false}>
        <Datagrid>
          <TextField label="Name" source="name" />
          <TextField label="Status" source="status" />
          <EditButton />
        </Datagrid>
      </ReferenceManyField>
    </FormTab>
  </TabbedForm>
</Edit>

Answer 1

Yes, you are.

SimpleForm docs state that:

The <SimpleForm> renders its child components line by line (within

components). It accepts **Input** and **Field** components as children.

TabbedForm section underneath in the docs explains that it has the same behaviour as the SimpleForm except:

However, the component renders inputs grouped by tab.

The Mui Container / Grid /Box components are not ra-inputs nor ra-fields. What you are trying to do is build a custom form layout which is achieved through the FormWithRedirect component read here or you can do it entirely by your own following react-final-form docs.