SQFormAutoComplete dynamic width is not working and causing unexpected behavior

[Chris-Boyle]

In this PR #372 and ticket we introduced some autocomplete drop down custom width logic. Since consuming it in Senior we are seeing some unexpected behavior with the SQFormAutoComplete drop downs.
What I think we should do is revert the PR so it doesn't block any application releases. Look at the solution again with a clean slate and find a better fix.
Autocomplete width goes wider than the modal width causing a horizontal scroll
This is without the lockWidthToField prop set to true.

Styles from our form/card component

Consumer code for the actions issue
I left out some of the additional fields but this is what I think matters. Here is the full source code link

const formMuiGridProps = {
  justify: 'space-between',
  alignItems: 'center',
};
 <SQForm
              initialValues={initialFormValues}
              validationSchema={validationSchema}
              muiGridProps={formMuiGridProps}
              onSubmit={noop}
            >
      <SQFormAutocomplete
        name="actionKey"
        label="Assign action"
        size={4}
        isRequired
        onChange={onAssignActionChange}
        displayEmpty
      >
        {actionOptions}
      </SQFormAutocomplete>
</SQForm>

Senior issues and Storybook issues: https://www.loom.com/share/0e70d6f614b84cafb7b3e3d51340ff23

I can also see some unexpected behavior in Storybook.
In our storybook this story should use the lockwidth prop to make the drop down with not wider than the field. On initial render it is not working

The next time the drop down is clicked it does perform correctly.

I think lockWidthToField should be default to true to make all these changes passive.