JSFiddle - React, Tailwind, and code Playground

by Alex Baumgertner

HTML

<script src="//raw.githubusercontent.com/bem/bem-bl/support/2.x/blocks-common/i-jquery/__inherit/i-jquery__inherit.js"></script>
<script src="//raw.githubusercontent.com/bem/bem-bl/support/2.x/blocks-common/i-jquery/__identify/i-jquery__identify.js"></script>
<script src="//raw.githubusercontent.com/bem/bem-bl/support/2.x/blocks-common/i-jquery/__debounce/i-jquery__debounce.js"></script>
<script src="//raw.githubusercontent.com/bem/bem-bl/support/2.x/blocks-common/i-jquery/__observable/i-jquery__observable.js"></script>
<script src="//raw.githubusercontent.com/bem/bem-bl/support/2.x/blocks-common/i-bem/i-bem.js"></script>
<script src="//raw.githubusercontent.com/bem/bem-bl/support/2.x/blocks-common/i-bem/__internal/i-bem__internal.js"></script>
<script src="//raw.githubusercontent.com/bem/bem-bl/support/2.x/blocks-common/i-bem/__dom/i-bem__dom.js"></script>
<div class="block-name i-bem" data-bem="{&quot;block-name&quot;:{}}">
    <div class="block-name__body">
        <button class="block-name__focus-elem">__focus-elem</button>
    </div>
</div>

CSS

.block-name_js_inited {
    padding: 15px;
    background: lightgray;
}

JavaScript

/* дефолтная инициализация */
$(function () {
    
    BEM.DOM.decl('block-name', {}, {});

    BEM.afterCurrentEvent(function () {
        BEM.DOM.init();
    });

});