JSFiddle - React, Tailwind, and code Playground

HTML

<div id="charms">
  <label>dddd</label>
</div>

CSS

#charms{
    
    width:100px;height:100%;background:#888;
    position:absolute;right:-100px;
    transition:all 500ms cubic-bezier(.4,.89,.71,.73);
}
body{overflow:hidden; margin:0px;}

JavaScript

$(window).on('mousemove',function(e){
      
    if(e.pageX >= $(window).width() - 10 || e.target.id=='charms' ){
        $('#charms').css({'right':'0px'});
    }
     else{
     $('#charms').css({'right':'-100px'});
     }
    
});