@duetds/components/lib/duet/p-9f63ceoi.system.entry.js

This package includes Duet Core Components and related tools.

System.register(["./p-2c514bc6.system.js"],(function(t){"use strict";var e,i,s,a;return{setters:[function(t){e=t.r;i=t.h;s=t.H;a=t.c}],execute:function(){var n=t("duet_layout",function(){function t(t){var i=this;e(this,t);this.hasSidebar=false;this.hasTop=false;this.ua="";this.layoutHeight=0;this.sidebarHeight=0;this.isTicking=false;this.lastPosition=-1;this.sticky=false;this.margin="auto";this.stickyTop=540;this.stickyDistance="with-links";this.center=false;this.middle=false;this.getFrame=function(){if(!i.isTicking){requestAnimationFrame(i.animationLoop);i.isTicking=true}};this.animationLoop=function(){var t=window.pageYOffset;if(i.lastPosition===t){i.isTicking=false}else{i.lastPosition=t}if(i.sidebarHeight===0){i.sidebarHeight=i.sidebar.offsetHeight}var e=i.layoutHeight+i.stickyTop-i.sidebarHeight-20;if(t>i.stickyTop&&t<e){i.sidebar.classList.add("sticky");i.sidebar.classList.remove("sticky-stopped")}else if(t>i.stickyTop&&t>e){i.sidebar.classList.add("sticky-stopped")}else{i.sidebar.classList.remove("sticky");i.sidebar.classList.remove("sticky-stopped")}i.isTicking=false}}t.prototype.componentWillLoad=function(){this.hasSidebar=!!this.element.querySelector("[slot='sidebar']");this.hasTop=!!this.element.querySelector("[slot='top']");if(!this.element.querySelector("[slot='main']")){console.warn("[DUET WARNING]: Nothing passed to <duet-layout> named slots. Please use one of 'main', 'sidebar' or 'top' to display contents.")}};t.prototype.componentDidLoad=function(){{this.sidebar=this.element.shadowRoot.querySelector(".duet-sidebar-container")}this.layoutHeight=this.element.offsetHeight;this.ua=navigator.userAgent||navigator.vendor;if(this.sticky){window.addEventListener("scroll",this.getFrame,false)}};t.prototype.componentDidUnload=function(){if(this.sticky){window.removeEventListener("scroll",this.getFrame)}};t.prototype.render=function(){return i(s,{class:{"duet-middle":this.middle,"duet-ie":document["documentMode"]||/Edge/.test(this.ua)}},this.hasTop?i("div",{class:{"duet-layout-top":true,"has-sidebar":this.hasSidebar,"duet-center":this.center}},i("div",{class:"duet-layout-top-wrapper"},i("div",{class:"duet-layout-top-margin"},i("slot",{name:"top"})))):"",i("div",{class:{"duet-layout":true,"has-sidebar":this.hasSidebar,"duet-m-0":this.margin==="none","duet-no-nav":this.navDistance==="none","duet-with-links":this.navDistance==="with-links","duet-without-links":this.navDistance==="without-links","duet-center":this.center,"sticky-without-links":this.stickyDistance==="without-links"}},i("main",{class:"duet-main"},i("slot",{name:"main"})),this.hasSidebar?i("aside",{class:"duet-sidebar"},i("div",{class:"duet-sidebar-container"},i("slot",{name:"sidebar"}))):""))};Object.defineProperty(t.prototype,"element",{get:function(){return a(this)},enumerable:true,configurable:true});Object.defineProperty(t,"style",{get:function(){return":host{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;padding:0;margin:0;display:block;width:100%;-ms-flex:1 0 auto;flex:1 0 auto}:host(.duet-middle){display:-ms-flexbox;display:flex}:host(.duet-middle) .duet-layout{padding:36px 28px!important}\@media only screen and (min-width:36em){:host(.duet-middle) .duet-layout{padding:48px 36px!important}}\@media only screen and (min-width:62em){:host(.duet-middle) .duet-layout{padding:56px!important}}:host(.duet-ie){height:100%}:host(.duet-middle.duet-ie){height:auto}.duet-layout{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;padding:0;margin:0;margin:0 auto 36px;position:relative;max-width:1110px;margin-top:72px;padding:0 16px}.duet-layout.duet-m-0{margin-top:0!important;margin-bottom:0!important}.duet-layout.duet-without-links{margin-top:112px}\@media only screen and (min-width:62em){.duet-layout.duet-without-links{margin-top:136px}}.duet-layout.duet-with-links{margin-top:112px}\@media only screen and (min-width:62em){.duet-layout.duet-with-links{margin-top:184px}}.duet-layout.duet-no-nav{margin-top:0}.duet-layout.duet-center{max-width:888px;width:100%;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}\@media only screen and (min-width:36em){.duet-layout.duet-center{padding:0 48px}}\@media only screen and (min-width:48em){.duet-layout.duet-center{padding:0 72px}}\@media only screen and (min-width:62em){.duet-layout.duet-center{width:100%}}\@media only screen and (min-width:36em){.duet-layout{padding:0 28px}}\@media only screen and (min-width:62em){.duet-layout{display:-ms-flexbox;display:flex;flex-start:flex-start;-ms-flex-direction:row;flex-direction:row;padding:0 56px;margin-bottom:48px}}\@media only screen and (min-width:76.25em){.duet-layout{padding:0}}.duet-layout-bottom,.duet-layout-top,.duet-main,.duet-sidebar{margin:0}.duet-layout-bottom,.duet-layout-top,.duet-main,.duet-sidebar{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;padding:0;display:block;width:100%}.duet-layout-top{margin:0;margin:0 auto;position:relative}.duet-layout-top-wrapper{margin:0 auto;padding:0 20px;max-width:1110px}\@media only screen and (min-width:36em){.duet-layout-top-wrapper{padding:0 28px}}\@media only screen and (min-width:62em){.duet-layout-top-wrapper{padding:0 56px}}.duet-center .duet-layout-top-wrapper{max-width:740px}\@media only screen and (min-width:36em){.duet-center .duet-layout-top-wrapper{padding:0 48px}}\@media only screen and (min-width:48em){.duet-center .duet-layout-top-wrapper{padding:0 72px}}\@media only screen and (min-width:62em){.duet-layout-top-margin{padding-right:20px}.has-sidebar .duet-layout-top-margin{padding-right:0}}.duet-main{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;padding:0;margin:0}\@media only screen and (min-width:62em){.duet-main{margin-right:20px}}.duet-sidebar{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;padding:0;margin:0;margin-bottom:auto}\@media only screen and (min-width:62em){.duet-sidebar{min-width:356px;max-width:356px}}.duet-sidebar-container{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;padding:0;margin:0}\@media only screen and (min-width:62em){.duet-sidebar-container{width:356px}.duet-sidebar-container.sticky{top:4.5rem;position:fixed}.sticky-without-links .duet-sidebar-container.sticky{top:5.2rem}.duet-sidebar-container.sticky-stopped{position:absolute;top:auto;bottom:0}}"},enumerable:true,configurable:true});return t}());var r=t("duet_spacer",function(){function t(t){e(this,t);this.size="medium";this.direction="vertical";this.breakpoint=""}t.prototype.render=function(){var t;return i(s,{class:(t={"duet-spacer":true,"duet-spacer-xx-small":this.breakpoint==="xx-small","duet-spacer-x-small":this.breakpoint==="x-small","duet-spacer-small":this.breakpoint==="small","duet-spacer-medium":this.breakpoint==="medium","duet-spacer-large":this.breakpoint==="large","duet-spacer-x-large":this.breakpoint==="x-large","duet-spacer-xx-large":this.breakpoint==="xx-large"},t[this.size]=true,t[this.direction]=true,t)},i("slot",null))};Object.defineProperty(t,"style",{get:function(){return":host{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;padding:0;margin:0;position:relative;display:block;width:12px;height:12px}\@media only screen and (min-width:36em){:host{width:16px;height:16px}}:host(.horizontal){display:inline-block;height:100%!important}:host(.horizontal.x-small),:host(.horizontal.xx-small){height:100%;width:4px;min-width:4px}\@media only screen and (min-width:36em){:host(.horizontal.x-small){width:8px;min-width:8px}}:host(.horizontal.small){height:100%;width:8px;min-width:8px}\@media only screen and (min-width:36em){:host(.horizontal.small){width:12px;min-width:12px}}:host(.horizontal.medium){height:100%}:host(.horizontal.large){height:100%;width:16px;min-width:16px}\@media only screen and (min-width:36em){:host(.horizontal.large){width:20px;min-width:20px}}:host(.horizontal.x-large){height:100%;width:20px;min-width:20px}\@media only screen and (min-width:36em){:host(.horizontal.x-large){width:28px;min-width:28px}}:host(.horizontal.xx-large){height:100%;width:28px;min-width:28px}\@media only screen and (min-width:36em){:host(.horizontal.xx-large){width:36px;min-width:36px}}:host(.horizontal.xxx-large){height:100%;width:36px;min-width:36px}\@media only screen and (min-width:36em){:host(.horizontal.xxx-large){width:48px;min-width:48px}}:host(.horizontal.xxxx-large){height:100%;width:48px;min-width:48px}\@media only screen and (min-width:36em){:host(.horizontal.xxxx-large){width:72px;min-width:72px}}:host(.vertical.x-small),:host(.vertical.xx-small){width:100%;height:4px;min-height:4px}\@media only screen and (min-width:36em){:host(.vertical.x-small){height:8px;min-height:8px}}:host(.vertical.small){width:100%;height:8px;min-height:8px}\@media only screen and (min-width:36em){:host(.vertical.small){height:12px;min-height:12px}}:host(.vertical.medium){width:100%}:host(.vertical.large){width:100%;height:16px;min-height:16px}\@media only screen and (min-width:36em){:host(.vertical.large){height:20px;min-height:20px}}:host(.vertical.x-large){width:100%;height:20px;min-height:20px}\@media only screen and (min-width:36em){:host(.vertical.x-large){height:28px;min-height:28px}}:host(.vertical.xx-large){width:100%;height:28px;min-height:28px}\@media only screen and (min-width:36em){:host(.vertical.xx-large){height:36px;min-height:36px}}:host(.vertical.xxx-large){width:100%;height:36px;min-height:36px}\@media only screen and (min-width:36em){:host(.vertical.xxx-large){height:48px;min-height:48px}}:host(.vertical.xxxx-large){width:100%;height:48px;min-height:48px}\@media only screen and (min-width:36em){:host(.vertical.xxxx-large){height:72px;min-height:72px}}:host(.duet-spacer-xx-small){display:none}\@media only screen and (max-width:22.5em){:host(.duet-spacer-xx-small){display:block}}:host(.duet-spacer-x-small){display:none}\@media only screen and (max-width:35.9375em){:host(.duet-spacer-x-small){display:block}}:host(.duet-spacer-small){display:none}\@media only screen and (min-width:36em){:host(.duet-spacer-small){display:block}}:host(.duet-spacer-medium){display:none}\@media only screen and (min-width:48em){:host(.duet-spacer-medium){display:block}}:host(.duet-spacer-large){display:none}\@media only screen and (min-width:62em){:host(.duet-spacer-large){display:block}}:host(.duet-spacer-x-large){display:none}\@media only screen and (min-width:64.0625em){:host(.duet-spacer-x-large){display:block}}:host(.duet-spacer-xx-large){display:none}\@media only screen and (min-width:76.25em){:host(.duet-spacer-xx-large){display:block}}"},enumerable:true,configurable:true});return t}())}}}));