А что за ошибку пишет?

Всем привет, вопрос по styled components. Создал стилизованный компонент таблицы - CustomTable, внутри прописал стили и для ячеек (th, td), а именно, чтобы выравнивались по умолчанию по центру. Но в некоторых случаях мне нужно, чтобы некоторые ячейки таблицы выравнивались по левую сторону. Создал для этой цели другой стилизованный комп для ячеек td - CustomTableCell.

Проблема в следующем, когда хочу выровнять текст в ячейке и для этого использую CustomTableCell внутри CustomTable, то стили не применяются поскольку у CustomTable стили имеют приоритет выше. Как можно решить проблему, чтобы не использовать Important?

а кто знает зачем реакт в своем хелепере createElement дублирует ключ, помещая его как в корне возвращаемого объекта, так и в свойство props?

const useComponent = () => {
  const [state, setState] = useState({});
  const Component = () => <div {...state} />;

  return [Component, setState];

}

Забыл в tsx переименовать, когда добавил компонент )))

Код можешь показать, то что ты описал можно сделать 3 разными методами

Я бы сделал так:

const CustomTable = styled.table`

`

const CustomCell = styled.td`
  ${CustomTable} & {
    text-align: ${props => props.left ? 'left' : 'center'}
  }

ну и потом

<CustomTable>
...
  <CustomCell>Я по центру</CustomCell>
  <CustomCell left>А я левая</CustomCell>
...
</CustomTable>

упс, я удалил в td

text-align: center

на 28 строчке

const CustomTableCell = styled.td`
  ${CustomTable} & {
    ....
 `

сейчас чекаю

https://styled-components.com/docs/advanced#referring-to-other-components

Вот тут все написанно

Оно работает, но меняет для всех сразу. Первая колонка первая ячейка была выравнена слева, но когда хочу правую верхнюю выровнять по правому краю, оно меняет и первую колонку.

сейчас чекну, спасибо

Гониво какое-то, не может оно сразу всех менять, ты часом не в цикле выводишь?

А стоп

ага

а не, те у меня статичные

Можешь полностью код показать, вывода таблицы

под ними с цикла выводятся