В чем смысл БЭМ блока, если нужны служебные блоки?

Question

[htmlclassic]

для этого блока я написал такой код:

(1)<div class="contact-information">
    (2)<a href="tel:[phone]" class="contact-information__phone-number">8-800-777-49-67</a>
    (3)<button class="contact-information__order-call-btn">Заказать звонок</button>
    (4)<div class="contact-information__order-call-popup">
        (5)<div class="order-call-popup__title">Здесь будет форма</div>

В общем, весь блок я назвал .contact-information
дальше, внутри у меня будет всплывающее окно .contact-information__order-call-popup, в котором будет форма.

Внутри этого попапа у меня есть какие-то элементы, к которым мне надо обращаться. Эти элементы относятся как бы и к общему блоку и конкретно к попапу отдельно.
Я всегда беру и делаю новый блок (5ая строка) только потому, чтобы я мог адекватно потом создавать элементы внутри попапа. Но в то же время, этот новый блок который я создал, он не самостоятельный блок, а лишь часть блока .contact-information

Я читал, что именование по БЭМ даёт возможность создавать уникальные блоки. В итоге я внутри блока создаю ещё один блок, хотя он на самом деле не блок, а элемент. Разве это правильно?

Мой попап относится конкретно к .contact-information, но в итоге, мой попап получается отдельным блоком.

Comments

[Максим Морев]

Вот здесь отвечал на такой же, по своей сути, вопрос.
Вкратце - блоки в том числе нужны для декомпозиции, самое главное - каким-либо очевидным образом дать понять, что это не самостоятельная вещь.

[Mikhail Osher]

всплывающее окно это отдельный блок. ему незачем зависеть от родителя.

[htmlclassic]

Mikhail Osher, т.е. если это всплывающее окно будет исключительно внутри данного родителя, то всё равно это отдельный блок?

[Ankhena]

htmlclassic, у (4) будет два класса (или по крайней мере два, если вдруг еще будут модификаторы).
Первый - класс элемента от родительского блока.
И второй - класс блока.
В БЭМ это называется микс. Почитайте в спеке.

А (5) вообще лишний. Вместо него можно сразу форму писать.
И у этой формы тоже будет аналогичный микс из классов. Потому что она элемент попапа (или contact-information) и при этом тоже самостоятельный блок.

[Алекс Глебов]

htmlclassic, всплывающее окно в принципе самостоятельный блок. Оно вам в следующем проекте понадобится. А содержимое еще один блок.
Потом модалка с формой, если мыслить универсально и расширяемо, может в будущем вызываться по кнопке из другого места. т.е она вообще не зависит от родителя где находится кнопка, а лежит на странице где то в конце боди. Сама форма может переиспользоваться в другом месте с другими полями.

[htmlclassic]

Ankhena, у (4) два класса.
Первый - класс элемента от родительского блока.
И второй - класс блока

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

[Ankhena]

htmlclassic, блоки в БЭМ не должны ничего знать о своей внешней геометрии. Значит, если в неё есть необходимость, то это нужно делать в классе элемента.

Если вы хотите использовать только БЭМоподобный нейминг, то тогда вообще без разницы.

[htmlclassic]

Ankhena, в моем случае я блоку не задаю какую-то внешнюю геометрию (у родителя флекс и там я раскидываю блоки как надо).

я не могу понять. вот приведу пример с менюшкой.

<nav class="nav">
                    <ul class="nav__list">
                        <li class="nav__item"><a class="nav__link" href="">О нас</a></li>
                        <li class="nav__item"><a class="nav__link" href="">Оплата и доставка</a></li>
                        <li class="nav__item"><a class="nav__link" href="">Новости</a></li>
                        <li class="nav__item"><a class="nav__link" href="">Контакты</a></li>
                    </ul>
                </nav>

этот .nav находится внутри .header
это менюха у меня -- это элемент блока хедер. но т.к. мне надо создавать еще элементы, я делаю этот .nav как блок новый, а не элемент хедера

мне нужно изменить <nav class="nav"> на <nav class="header__nav nav">
или нет?
.header__nav мне по сути вообще не нужен (не буду задавать внешнюю геометрию). нужен ли этот класс здесь?
я бы сказал нужен, чтобы показать, что .nav -- это не уникальный блок, а элемент хедера, но я тут хз, если честно)

[Ankhena]

htmlclassic, если не задаете и никогда не будете, то можно не писать.

[htmlclassic]

Ankhena, ну тогда же получается, что блок nav уже не элемент хедера, а как бы отдельный уникальный блок

[Ankhena]

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