React StepIconProps.classes не применяются

#reactjs

#reactjs

Вопрос:

Я пытаюсь применить StepIcon стиль как часть Stepper компонента, где в конечном итоге я хотел бы отобразить цвет значка завершенного шага.

В моем StepLabel компоненте я применяю:

 <StepLabel
    StepIconProps={{classes: {completed: classes.stepIcon}}}>{label}</StepLabel>
  

Мои классы:

 export const MyStepper = withStyles(theme => ({
    stepIcon: {
        color: 'red',
    },
  }))(Stepper);
  

Но при проверке классов с помощью инструментов разработчика кажется, что класс MuiTheme всегда переопределяет мое пользовательское переопределение:

введите описание изображения здесь

Что я делаю не так?

Комментарии:

1. Вы пробовали red !important ?

2. Я думаю, что это ошибка. В исходном коде StepIcon root компонент является тем, который обеспечивает поведение по умолчанию для completed, используя amp;$completed вместо блока class.completed. Корневые классы применяются первыми, и я думаю, что это проблема. SvgIcon этого не делает, что я считаю правильным

3. @dubes Использование root with amp;$completed не помогло, вы имеете в виду, что я должен использовать SvgIcon as <StepIcon> ? и как мне управлять значком «завершено» шага?