BemElement

BemElement<T>(Base, config): T

Defined in: packages/webcomponents/src/bemElement.js:124

Mixin that makes a custom-element class a BEM component — the decorator-free form of bem, for projects that don’t compile TC39 decorators. It:

• reads the block from context (an ancestor’s element, or none at the root),
• applies the computed BEM class(es) to the host element,
• provides config.element as the block for descendants (re-rooting),
• observes config.modifiers as attributes and recomputes on change.

class Card extends BemElement(HTMLElement, { element: 'card', modifiers: ['active'] }) {}
customElements.define('bb-card', Card);
// <bb-card active> → host class="card card--active"; descendants see block "card"

Type Parameters

T

T extends (…args) => CustomElementLike

Parameters

Base

T

The custom-element base class to extend (e.g. HTMLElement).

config

BemElementConfig

Returns

T