Background is off when autoFocusOnLoad is used

[alex-mironov]

const cellStyle = {
  width: 56,
  height: 56,
  borderWidth: 0,
  color: theme.colors.black,
  borderBottomWidth: 2,
  fontSize: 22,
  lineHeight: 24,
}

export const styleSheet = StyleSheet.create({
  cellBase: {
    ...cellStyle,
    borderBottomColor: theme.colors.black,
  },

  cellHighLighted: {
    backgroundColor: 'rgba(229, 0, 75, 0.05)',
    borderBottomColor: theme.colors.red,
  },

  cellError: {
    ...cellStyle,
    borderBottomColor: theme.colors.red,
  },
})

render () => {
  return (
      <OTPInputView
        pinCount={4}
        autoFocusOnLoad
        codeInputFieldStyle={error ? styleSheet.cellError : styleSheet.cellBase}
        codeInputHighlightStyle={styleSheet.cellHighLighted}
            onCodeChanged={setCode}
            code={code}
      />
  )
}

On the first run it produces

[eric-dao37]

Hi @alex-mironov

Can you give more detail about the problem you have? We can see in the picture the background of highlighted slot is red