UNPKG

@paraboly/pwc-sliding-panel

Version:

A panel that slides open from the sides of the page when you click a handle.

1 lines 3.08 kB
System.register(["./p-5aa5bade.system.js"],(function(e){"use strict";var t,n,r,i;return{setters:[function(e){t=e.r;n=e.h;r=e.g;i=e.c}],execute:function(){var o=e("pwc_sliding_panel",function(){function e(e){t(this,e);this.active=false;this.anchor="left"}e.prototype.activeWatchHandler=function(e){if(e){this.root.classList.add("pwc-sliding-panel___active")}else{this.root.classList.remove("pwc-sliding-panel___active")}};e.prototype.toggledListener=function(){this.active=!this.active};e.prototype.render=function(){return n("slot",null)};Object.defineProperty(e.prototype,"root",{get:function(){return r(this)},enumerable:true,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{active:["activeWatchHandler"]}},enumerable:true,configurable:true});Object.defineProperty(e,"style",{get:function(){return":root{--pwc-sliding-panel___content-width:200px;--pwc-sliding-panel___toggle-width:30px;--pwc-sliding-panel___toggle-height:30px;--pwc-sliding-panel___transition-duration:0.25s}pwc-sliding-panel{display:block;position:absolute;-webkit-transition:all var(--pwc-sliding-panel___transition-duration) ease;transition:all var(--pwc-sliding-panel___transition-duration) ease;-webkit-box-sizing:border-box;box-sizing:border-box}pwc-sliding-panel[anchor=left]{left:calc(var(--pwc-sliding-panel___content-width) * -1)}pwc-sliding-panel[anchor=left].pwc-sliding-panel___active{left:0}pwc-sliding-panel[anchor=right]{right:calc(var(--pwc-sliding-panel___content-width) * -1)}pwc-sliding-panel[anchor=right].pwc-sliding-panel___active{right:0}"},enumerable:true,configurable:true});return e}());var u=e("pwc_sliding_panel_content",function(){function e(e){t(this,e)}e.prototype.render=function(){return n("slot",null)};Object.defineProperty(e.prototype,"root",{get:function(){return r(this)},enumerable:true,configurable:true});Object.defineProperty(e,"style",{get:function(){return"pwc-sliding-panel-content{display:block;width:var(--pwc-sliding-panel___content-width);background:#fff;border:1px solid #000;-webkit-box-sizing:border-box;box-sizing:border-box}"},enumerable:true,configurable:true});return e}());var c=e("pwc_sliding_panel_toggle",function(){function e(e){t(this,e);this.toggled=i(this,"toggled",7)}e.prototype.clickListener=function(e){if(e.target===this.root){this.toggled.emit()}};e.prototype.render=function(){return n("slot",null)};Object.defineProperty(e.prototype,"root",{get:function(){return r(this)},enumerable:true,configurable:true});Object.defineProperty(e,"style",{get:function(){return"pwc-sliding-panel-toggle{width:var(--pwc-sliding-panel___toggle-width);height:var(--pwc-sliding-panel___toggle-height);position:absolute;top:0;display:block;background:#fff;border:1px solid #000;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box}pwc-sliding-panel[anchor=left]>pwc-sliding-panel-toggle{right:calc(var(--pwc-sliding-panel___toggle-width) * -1)}pwc-sliding-panel[anchor=right]>pwc-sliding-panel-toggle{left:calc(var(--pwc-sliding-panel___toggle-width) * -1)}"},enumerable:true,configurable:true});return e}())}}}));