это всего лишь 3 модификатора. Это нормально.

Вот, смотрите, пример от создателей БЭМ: https://ru.bem.info/libraries/classic/bem-components/6.0.0/desktop/button/

Там куча модификаторов, но их многообразие сгруппировано по принципу «если блок в состоянии АB, он не может быть в состоянии CD»

И поэтому это не вызывает хаоса, а наоборот.

Если все сильно разное и в дальнейшем скорее всего изменится, то можно вообще сделать так

.component-a__button.button {
Color: red;
Font-size: 24px;
}

В .button оставить другие общие стили

Если мы делаем кнопку button_view_action, она уже не может быть ещё и button_view_plain

Ну я так изначально и собирался делать, но Роман отговорил =)

Изначально было кажется наследование, тут наследования нет

Кажется, нет. У вас элемент элемента.Сейчас попробую продемонстрировать более корректный вариант…

Вот

я предлага вариант .page-a__component_a

О, это тоже норм вариант, но не для каскадной стилизации, а для шаблонизатора.

Возможно это было сказано про последний селектор .page-a__component_a__title

Это вообще не по БЭМ с точки зрения именования

Ну в приципе стало понятнее. Сейчас попробую найти все использования данной компоненты и вычленить из них общие модификаторы, и сгруппировать их если не получится через состояния.

Всем привет. Это снова я =)
В общем по-изучал элементу и где она используется. Обнаружил что есть в зависимости от страницы (не на всех, но на многих) может изменятся ширина кнопки.

Т.е. стандартная ширина например 200.
Например в PageA внутри ComponentB располагается ComponentA и этой componentA ширина специфична только для этого набора родителей:

Текущий CSS

.page-a {
       .component-b {
             .component-a {
                      widht: 215px;
             }
       }
}

В связи с этим я могу предположить чтобы сделать спец модификатор типа:
.component-a_width_215     - key-value модификатор

либо:
<div class="page_a__component-a      component_a"> - это как я предполагаю будет миксом (все не могу отвязаться от этой идеи)

и получается:
.component_a {
    width: 200px;
    ...
}

.page_a__component_a {
    width: 215px
}

С миксом правда не очень получается, ибо он создан для создания отдельных BEM сущностей, например для позиционирования. Но как по-другому придумать я не знаю =(

Если нет понимания, что же именно влияет на какое-то свойство блока (или его элементов), то да, придётся делать модификатор-свойство. Это не то чтобы нормально, но иногда бывает — тут уже вопрос к дизайнеру, который «лепит» бессмысленные (а они бессмысленные, раз нельзя найти логическое именование для модификатора) состояния для блоков (кнопок, контролов и прочих интерфейсных сущностей).

Можешь скинуть дизайн — может, глядя на него будет проще понять, о чём думал дизайнер.

Тут скорее накладка на локализацию натягивается.

Т.к. в компоненете просто не возможно разместить текст в одну строку для некоторых языков и приходится растягивать компоненту. Т.к. дизайнер рисует и проектирует только для двух языков