Использование компонента Stepper, Step с styled-components

[hellpirat]

<Stepper value={step} onChange={() => {}}>
       <StepWrapper key="1">Регистрация</StepWrapper>
       <StepWrapper key="2">Подтверждение почты</StepWrapper>
 </Stepper>

const StepWrapper = styled(Step)
  padding: 0;

Результат: Child component should be instance of <Step />

[hellpirat]

const StepWrapper = styled(Step)`
  padding: 0 !important;
`
StepWrapper.displayName = 'ruiStep'

Вот так вроде сработало :)

[hellpirat]

C табами похожая ситуация: )
Решается так: TabItemWrapper.displayName = 'ruiTabsItem'

[andrepolischuk]

да, в текущей реализации компоненты оборачивающие дочерние айтемы: табы, сайднав, меню и некоторые другие требуют определенный displayName у детей