JSFiddle - React, Tailwind, and code Playground

by Gerónimo Garcia Sgritta

HTML

<div wlcc-drawer>
    My button Promos
</div>
<div wlcc-drawer-box>
    blablablablablba
</div>

JavaScript

var myApp = angular.module('wlcc');

myApp.directive('wlccDrawer', function() {
  return {
    restrict: 'A',
    require: 'wlccDrawer',
    link: function(scope, element) {        
        element.$bind('click', function(){
            scope.$emit('wlccDrawerClicked');
        });      
    }
  };
});

myApp.directive('wlccDrawerBox', function(){
    return {
        restrict: 'A'
        priority: 800,
        require: '^wlccDrawer',
        link: function(scope, element) {
            scope.$on('wlccDrawerClicked', function(){
                element.addClass('wlccShowDrawerAnimated');
            });
        }
    }
});