diff --git a/.eslintrc.json b/.eslintrc.json index d5dd0f115..97eec591f 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -1,4 +1,5 @@ { + "root": true, "env": { "node": true, "builtin": true, diff --git a/lerna.json b/lerna.json index ebb176d9b..c9e459dff 100644 --- a/lerna.json +++ b/lerna.json @@ -1,5 +1,5 @@ { - "lerna": "3.2.1", + "lerna": "3.10.8", "packages": [ "packages/*" ], diff --git a/package.json b/package.json index 78de351d6..b995af86b 100644 --- a/package.json +++ b/package.json @@ -1,12 +1,14 @@ { - "devDependencies": { - "lerna": "3.2.1" + "dependencies": { + "lerna": "3.10.8", + "prettier": "^1.14.3", + "pretty-quick": "^1.8.0" }, "private": true, "scripts": { "bootstrap": "lerna bootstrap", - "setup": "npm run bootstrap && npm run build:uikit", - "build:uikit": "lerna exec --scope @pattern-lab/uikit-workshop -- npm run build", + "setup": "npm install && npm run bootstrap && npm run build:uikit", + "build:uikit": "cd packages/uikit-workshop && npm run build", "precommit": "pretty-quick --staged", "prettier": "prettier --config .prettierrc --write ./**/*.js --ignore-path .prettierignore", "test": "lerna run test", diff --git a/packages/core/src/lib/addPattern.js b/packages/core/src/lib/addPattern.js index af6886466..12c0c9429 100644 --- a/packages/core/src/lib/addPattern.js +++ b/packages/core/src/lib/addPattern.js @@ -1,7 +1,5 @@ 'use strict'; -const _ = require('lodash'); - const logger = require('./log'); module.exports = function(pattern, patternlab) { diff --git a/packages/core/src/lib/buildPatterns.js b/packages/core/src/lib/buildPatterns.js index 51dcea8b3..824d6840e 100644 --- a/packages/core/src/lib/buildPatterns.js +++ b/packages/core/src/lib/buildPatterns.js @@ -141,7 +141,10 @@ module.exports = (deletePatternDir, patternlab, additionalData) => { } //render all patterns last, so lineageR works const allPatternsPromise = patternsToBuild.map(pattern => - compose(pattern, patternlab) + compose( + pattern, + patternlab + ) ); //copy non-pattern files like JavaScript const allJS = patternsToBuild.map(pattern => { diff --git a/packages/core/src/lib/markModifiedPatterns.js b/packages/core/src/lib/markModifiedPatterns.js index 00ed51de1..aa80b25bb 100644 --- a/packages/core/src/lib/markModifiedPatterns.js +++ b/packages/core/src/lib/markModifiedPatterns.js @@ -28,10 +28,8 @@ module.exports = function(lastModified, patternlab) { array.forEach(func); } }; - const modifiedOrNot = _.groupBy( - patternlab.patterns, - p => - changes_hunter.needsRebuild(lastModified, p) ? 'modified' : 'notModified' + const modifiedOrNot = _.groupBy(patternlab.patterns, p => + changes_hunter.needsRebuild(lastModified, p) ? 'modified' : 'notModified' ); // For all unmodified patterns load their rendered template output diff --git a/packages/core/src/lib/object_factory.js b/packages/core/src/lib/object_factory.js index 0c3ffe5d2..895db06bf 100644 --- a/packages/core/src/lib/object_factory.js +++ b/packages/core/src/lib/object_factory.js @@ -76,7 +76,9 @@ const Pattern = function(relPath, data, patternlab) { // (rendered!) html file for this pattern, to be shown in the iframe this.patternLink = this.patternSectionSubtype ? `$${this.name}/index.html` - : patternlab ? this.getPatternLink(patternlab, 'rendered') : null; + : patternlab + ? this.getPatternLink(patternlab, 'rendered') + : null; // The canonical "key" by which this pattern is known. This is the callable // name of the pattern. UPDATE: this.key is now known as this.patternPartial diff --git a/packages/core/src/lib/plugin_manager.js b/packages/core/src/lib/plugin_manager.js index a3a37ab58..33bde9fe5 100644 --- a/packages/core/src/lib/plugin_manager.js +++ b/packages/core/src/lib/plugin_manager.js @@ -3,9 +3,6 @@ const plugin_manager = function() { const path = require('path'); const findModules = require('./findModules'); - - const _ = require('lodash'); - const logger = require('./log'); const pluginMatcher = /^plugin-(.*)$/; diff --git a/packages/uikit-workshop/dist/index.html b/packages/uikit-workshop/dist/index.html index 908d91800..f4d117f40 100644 --- a/packages/uikit-workshop/dist/index.html +++ b/packages/uikit-workshop/dist/index.html @@ -1,411 +1,8 @@ - - - - - Pattern Lab - - - - - - - - - - - - - - -
-
- -
- -
- - - -
- -
- -
- - -
- - -
- -
-
-
-
-
- - - - -
-
-
-
-
-
- -
-
- - - - - - - - - - -
- - - - - - - - - - - - \ No newline at end of file + \ No newline at end of file diff --git a/packages/uikit-workshop/dist/styleguide/css/pattern-lab.3a52e38b.css b/packages/uikit-workshop/dist/styleguide/css/pattern-lab.3a52e38b.css new file mode 100644 index 000000000..ee9ccf6a1 --- /dev/null +++ b/packages/uikit-workshop/dist/styleguide/css/pattern-lab.3a52e38b.css @@ -0,0 +1 @@ +button{font-size:inherit;background-color:transparent}pre[class*=language-]{background-image:-webkit-gradient(linear,left top,right top,from(#fff),to(rgba(255,255,255,0))),-webkit-gradient(linear,right top,left top,from(#fff),to(rgba(255,255,255,0))),-webkit-gradient(linear,left top,right top,from(#eaf0f6),to(rgba(238,238,238,0))),-webkit-gradient(linear,right top,left top,from(#eaf0f6),to(rgba(238,238,238,0))),-webkit-gradient(linear,left top,left bottom,from(#fff),to(rgba(255,255,255,0))),-webkit-gradient(linear,left bottom,left top,from(#fff),to(rgba(255,255,255,0))),-webkit-gradient(linear,left top,left bottom,from(#eaf0f6),to(rgba(238,238,238,0))),-webkit-gradient(linear,left bottom,left top,from(#eaf0f6),to(rgba(238,238,238,0)));background-image:-webkit-linear-gradient(left,#fff,rgba(255,255,255,0)),-webkit-linear-gradient(right,#fff,rgba(255,255,255,0)),-webkit-linear-gradient(left,#eaf0f6,rgba(238,238,238,0)),-webkit-linear-gradient(right,#eaf0f6,rgba(238,238,238,0)),-webkit-linear-gradient(top,#fff,rgba(255,255,255,0)),-webkit-linear-gradient(bottom,#fff,rgba(255,255,255,0)),-webkit-linear-gradient(top,#eaf0f6,rgba(238,238,238,0)),-webkit-linear-gradient(bottom,#eaf0f6,rgba(238,238,238,0));background-image:linear-gradient(to right,#fff,rgba(255,255,255,0)),linear-gradient(to left,#fff,rgba(255,255,255,0)),linear-gradient(to right,#eaf0f6,rgba(238,238,238,0)),linear-gradient(to left,#eaf0f6,rgba(238,238,238,0)),linear-gradient(to bottom,#fff,rgba(255,255,255,0)),linear-gradient(to top,#fff,rgba(255,255,255,0)),linear-gradient(to bottom,#eaf0f6,rgba(238,238,238,0)),linear-gradient(to top,#eaf0f6,rgba(238,238,238,0));background-color:#fff;background-attachment:local,local,scroll,scroll,local,local,scroll,scroll;background-position:0 0,100% 0,0 0,100% 0,0 0,0 100%,0 0,0 100%;background-size:4em 100%,4em 100%,1em 100%,1em 100%,100% 4em,100% 4em,100% 1em,100% 1em;background-repeat:no-repeat;-ms-overflow-style:-ms-autohiding-scrollbar;-webkit-overflow-scrolling:touch;overflow:auto}code[class*=language-],pre[class*=language-]{color:#000;text-shadow:0 1px #fff;font-family:Consolas,Monaco,'Andale Mono',monospace;direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;line-height:1.5;word-wrap:normal;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none}code[class*=language-] ::selection,code[class*=language-]::selection,pre[class*=language-] ::selection,pre[class*=language-]::selection{text-shadow:none;background-color:#b3d4fc}@media print{code[class*=language-],pre[class*=language-]{text-shadow:none}}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background-color:#f5f2f0}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#708090}.token.punctuation{color:#999}.namespace{opacity:.7}.token.boolean,.token.constant,.token.deleted,.token.number,.token.property,.token.symbol,.token.tag{color:#905}.token.attr-name,.token.builtin,.token.char,.token.inserted,.token.selector,.token.string{color:#690}.language-css .token.string,.style .token.string,.token.entity,.token.operator,.token.url{color:#a67f59;background-color:rgba(255,255,255,.5)}.token.atrule,.token.attr-value,.token.keyword{color:#07a}.token.function{color:#dd4a68}.token.important,.token.regex,.token.variable{color:#e90}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}pre.line-numbers{position:relative;padding-left:3.8em;counter-reset:linenumber}pre.line-numbers>code{position:relative}.line-numbers .line-numbers-rows{position:absolute;pointer-events:none;top:0;font-size:100%;left:-3.8em;width:3em;letter-spacing:-1px;border-right:1px solid #999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.line-numbers-rows>span{pointer-events:none;display:block;counter-increment:linenumber}.line-numbers-rows>span:before{content:counter(linenumber);color:#999;display:block;padding-right:.8em;text-align:right}.token a{color:inherit}pl-controls{margin-left:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.pl-c-body--theme-sidebar pl-controls{display:block}@media all and (min-width:42em){.pl-c-body--theme-sidebar pl-controls{width:100%}}.pl-c-controls{margin-left:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-controls{display:block}}.pl-c-controls__list{list-style:none;margin:0;padding:0;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}pl-drawer{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:relative;position:-webkit-sticky;position:sticky;top:auto;bottom:0;left:0;right:0;z-index:20;overflow:visible}.pl-c-body--theme-light pl-drawer{background-color:#fff;color:#4d4c4c;border-top:1.1px solid #ccc}.pl-c-drawer{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;background-color:#222;color:#ccc;width:100%;height:100%;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);pointer-events:none;overflow:hidden;max-width:100vw}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-drawer{max-width:calc(100vw - 14rem)}}.pl-c-body--theme-light .pl-c-drawer{background-color:#fff;color:#4d4c4c}.pl-c-drawer.pl-is-active{pointer-events:auto}.pl-c-drawer__wrapper{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.pl-c-drawer__wrapper>*{height:100%}.pl-c-drawer__content{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;overflow:hidden}.pl-c-drawer__toolbar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-negative:0;flex-shrink:0}.pl-c-drawer__content-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;overflow:hidden}@supports (padding:env(safe-area-inset-top)){.pl-c-drawer__content-wrapper{padding-right:calc(env(safe-area-inset-right) - .9rem)}}.pl-c-drawer__toolbar-controls{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-item-align:end;align-self:flex-end;position:relative;z-index:10;-ms-flex-negative:0;flex-shrink:0}.pl-c-drawer__close-btn{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;margin:0;-webkit-appearance:none;-ms-flex-negative:0;flex-shrink:0;z-index:2;opacity:.85;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pl-c-drawer__close-btn:hover{color:#fff;background-color:#222}.pl-c-drawer__close-btn.pl-is-active,.pl-c-drawer__close-btn:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-drawer__close-btn{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-drawer__close-btn:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-drawer__close-btn:active,.pl-c-body--theme-light .pl-c-drawer__close-btn:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-drawer__close-btn{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-drawer__close-btn{font-size:.85rem;padding:1.5rem 1rem}@media all and (max-width:41em){.pl-c-drawer__close-btn{border-radius:20rem;padding-top:.5rem;padding-bottom:.5rem}}.pl-c-drawer__close-btn:focus,.pl-c-drawer__close-btn:hover{opacity:1}.pl-c-drawer__close-btn:active,.pl-c-drawer__close-btn:focus{opacity:1}.pl-c-drawer__cover{width:100%;height:100%;top:0;left:0;display:none;position:fixed;z-index:20;cursor:move}.pl-c-drawer__resizer{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;top:0;left:0;right:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:14px;width:100%;background-color:inherit;z-index:2;cursor:ns-resize}.pl-c-drawer__resizer:after{content:'';height:3px;width:50px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;-webkit-transition:opacity .3s ease-out;transition:opacity .3s ease-out;opacity:.5;background-color:currentColor;border-radius:3px;display:block}.pl-c-drawer__resizer:hover:after{opacity:.8}.pl-c-drawer__resizer:active:after,.pl-c-drawer__resizer:focus:after{opacity:.95}.pl-c-drawer__close-btn-icon{width:12px;height:12px;color:currentColor;fill:currentColor;-webkit-transition:fill .1s ease-out;transition:fill .1s ease-out;-ms-flex-negative:0;flex-shrink:0;-ms-flex-item-align:center;align-self:center}.pl-c-code-copy-btn{display:inline-block;position:absolute;top:.5rem;right:.5rem;padding:.2rem .4rem;background-color:#eee;color:#222;border:1px solid #ddd;border-radius:6px;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;font-size:1rem;text-transform:lowercase;line-height:1;cursor:pointer;z-index:2;-webkit-transition:background-color .1s ease-out;transition:background-color .1s ease-out}.pl-c-code-copy-btn:focus,.pl-c-code-copy-btn:hover{background-color:#ccc}@media all and (min-width:42em){.pl-c-body--theme-sidebar pl-header{width:14rem;height:100vh;overflow:auto;padding:1rem;-webkit-overflow-scrolling:touch;border-bottom:0}}.pl-c-body--theme-light pl-header{border-right:1px solid #ccc;background-color:#fff;border-bottom:1px solid #ccc}.pl-c-header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;width:100%;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;font-size:.7rem;min-height:30px;background-color:inherit}@supports (padding:0px){.pl-c-header{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-header{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}}.pl-c-header__nav-toggle{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;border:0}.pl-c-header__nav-toggle:hover{color:#fff;background-color:#222}.pl-c-header__nav-toggle.pl-is-active,.pl-c-header__nav-toggle:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-header__nav-toggle{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-header__nav-toggle:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-header__nav-toggle:active,.pl-c-body--theme-light .pl-c-header__nav-toggle:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-header__nav-toggle{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-header__nav-toggle{font-size:.85rem;padding:1.5rem 1rem}@media all and (min-width:42em){.pl-c-header__nav-toggle{display:none}}pl-layout .pl-c-layout{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}@media all and (min-width:42em){pl-layout.pl-c-body--theme-sidebar{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}pl-layout.pl-c-body--theme-light{background-color:#fff}pl-nav{background-color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex}.pl-c-nav{overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;background-color:inherit;position:absolute;left:0;top:100%;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;transition:max-height .1s ease-out}.pl-c-nav.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}@media all and (min-width:42em){.pl-c-nav{overflow:visible;max-height:none}}.pl-c-nav.pl-is-active{-webkit-box-shadow:0 1px 1px #000;box-shadow:0 1px 1px #000}.pl-c-body--theme-light .pl-c-nav.pl-is-active{-webkit-box-shadow:0 1px 1px #a6a6a6;box-shadow:0 1px 1px #a6a6a6}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-nav.pl-is-active{-webkit-box-shadow:none;box-shadow:none}}@media all and (min-width:42em){.pl-c-nav.pl-is-active{overflow:visible;max-height:none}}@media all and (min-width:42em){.pl-c-nav{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;position:relative;top:auto;width:auto;-webkit-box-shadow:none;box-shadow:none}}.pl-c-nav__list{z-index:1;margin:0;padding:0;list-style:none;-ms-flex-negative:0;flex-shrink:0;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;max-width:100%;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;background-color:inherit}@media all and (min-width:42em){.pl-c-nav__list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.pl-c-body--theme-sidebar .pl-c-nav__list{display:block}}.pl-c-nav__item{background-color:inherit;-webkit-transform:translateZ(0);transform:translateZ(0);cursor:pointer;position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pl-c-body--theme-sidebar .pl-c-nav__item{display:block}@media all and (min-width:42em){.pl-c-nav__sublist>.pl-c-nav__item:last-child{overflow:hidden;border-bottom-left-radius:6px;border-bottom-right-radius:6px}}.pl-c-nav__link{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0}.pl-c-nav__link:hover{color:#fff;background-color:#222}.pl-c-nav__link.pl-is-active,.pl-c-nav__link:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-nav__link{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-nav__link:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-nav__link:active,.pl-c-body--theme-light .pl-c-nav__link:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-nav__link{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-nav__link{font-size:.85rem;padding:1.5rem 1rem}.pl-c-body--theme-sidebar .pl-c-nav__link{width:100%}.pl-c-nav__link--sublink{text-transform:none;padding-left:.5rem}.pl-c-nav__link--dropdown{-webkit-appearance:none;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.pl-c-nav__link--dropdown:after{content:'\25BC';color:rgba(255,255,255,.25);display:inline-block;font-size:7px;position:relative;top:1px;right:-2px;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-nav__link--dropdown:focus:after,.pl-c-nav__link--dropdown:hover:after{color:grey}.pl-c-nav__link--dropdown.pl-is-active{color:#fff;background-color:#222}.pl-c-nav__link--dropdown.pl-is-active:after{color:grey;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.pl-c-nav__sublist{background-color:inherit;list-style:none;margin:0;padding:0}@media all and (min-width:42em){.pl-c-nav__sublist{position:absolute;top:100%;left:0;min-width:10rem;border-bottom-left-radius:6px;border-bottom-right-radius:6px}}.pl-c-nav__sublist--dropdown,.pl-c-nav__subsublist--dropdown{list-style:none;margin:0;padding:0;overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;visibility:hidden}.pl-c-nav__sublist--dropdown.pl-is-active,.pl-c-nav__subsublist--dropdown.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-nav__sublist--dropdown.pl-is-active,.pl-c-nav__subsublist--dropdown.pl-is-active{margin-left:.5rem;visibility:visible;max-height:none}@media all and (min-width:42em){.pl-c-nav__sublist--dropdown.pl-is-active,.pl-c-nav__subsublist--dropdown.pl-is-active{height:auto;max-height:calc(100vh - 2rem - 1rem)}}.pl-c-body--theme-sidebar .pl-c-nav__sublist--dropdown.pl-is-active,.pl-c-body--theme-sidebar .pl-c-nav__subsublist--dropdown.pl-is-active{max-height:none}@media all and (min-width:42em){.pl-c-nav__sublist--dropdown.pl-is-active{margin-left:0;border-width:1px;border-style:solid;border-color:#000}.pl-c-body--theme-light .pl-c-nav__sublist--dropdown.pl-is-active{border-color:#ccc}}.pl-c-nav__subsublist{list-style:none;margin:0;padding:0}pl-search{background-color:inherit;top:0;z-index:10;-ms-flex-negative:0;flex-shrink:0;padding:.3rem .5rem;display:inline-block}@media screen and (min-width:42em){pl-search{margin-left:1rem;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-negative:1;flex-shrink:1;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.pl-c-body--theme-sidebar pl-search{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-left:0;padding-left:0;padding-right:0;width:100%}}.pl-c-typeahead{width:100%;background-color:inherit;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;z-index:10;text-transform:capitalize;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;color:#fafafa;position:relative}.pl-c-body--theme-light .pl-c-typeahead{color:#222}@media screen and (min-width:42em){.pl-c-typeahead{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.pl-c-body--theme-sidebar .pl-c-typeahead{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}.pl-c-typeahead__hint{top:0;left:0;right:0;width:100%}.pl-c-typeahead__hint,.pl-c-typeahead__input{text-transform:capitalize;background-color:#222;color:#fff;border-color:#090909;text-overflow:ellipsis;border-width:1px;border-style:solid;-webkit-transition:all .1s ease;transition:all .1s ease;max-width:100%;padding:.31rem .5rem;font-size:16px;width:100%;outline-offset:-3px;outline-width:2px;-webkit-appearance:none}@media all and (min-width:900px){.pl-c-typeahead__hint,.pl-c-typeahead__input{font-size:inherit}}.pl-c-typeahead__hint::-ms-clear,.pl-c-typeahead__input::-ms-clear{display:none}.pl-c-body--theme-sidebar .pl-c-typeahead__hint,.pl-c-body--theme-sidebar .pl-c-typeahead__input{border-radius:0}.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__hint,.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__input{padding-right:1.7rem}@media all and (min-width:42em){.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__hint,.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__input{padding-right:1.4rem}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-typeahead__hint,.pl-c-body--theme-sidebar .pl-c-typeahead__input{max-width:none}}.pl-c-body--theme-light .pl-c-typeahead__hint,.pl-c-body--theme-light .pl-c-typeahead__input{background-color:#eee;color:#4d4c4c!important;border-color:#ddd!important}.pl-c-typeahead__hint::-moz-input-placeholder,.pl-c-typeahead__hint::-webkit-input-placeholder,.pl-c-typeahead__input::-moz-input-placeholder,.pl-c-typeahead__input::-webkit-input-placeholder{color:#fff!important;-webkit-transition:all .1s ease;transition:all .1s ease}.pl-c-typeahead__hint:focus,.pl-c-typeahead__hint:hover,.pl-c-typeahead__input:focus,.pl-c-typeahead__input:hover{color:#fff;background-color:#1d1d1d!important}.pl-c-body--theme-light .pl-c-typeahead__hint:focus,.pl-c-body--theme-light .pl-c-typeahead__hint:hover,.pl-c-body--theme-light .pl-c-typeahead__input:focus,.pl-c-body--theme-light .pl-c-typeahead__input:hover{color:#222!important;background-color:#ddd!important;border-color:#ccc!important}.pl-c-typeahead__hint:focus::-moz-input-placeholder,.pl-c-typeahead__hint:focus::-webkit-input-placeholder,.pl-c-typeahead__hint:hover::-moz-input-placeholder,.pl-c-typeahead__hint:hover::-webkit-input-placeholder,.pl-c-typeahead__input:focus::-moz-input-placeholder,.pl-c-typeahead__input:focus::-webkit-input-placeholder,.pl-c-typeahead__input:hover::-moz-input-placeholder,.pl-c-typeahead__input:hover::-webkit-input-placeholder{color:#fff!important}.pl-c-body--theme-light .pl-c-typeahead__hint:focus::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__hint:focus::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__hint:hover::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__hint:hover::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:focus::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:focus::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:hover::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:hover::-webkit-input-placeholder{color:#222!important}.pl-c-typeahead__menu{overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;background-color:#222;text-transform:capitalize;position:absolute;min-width:100%;width:100%;overflow:hidden;top:100%;right:0;max-height:0;display:block!important;-webkit-transition:max-height .3s ease,opacity .3s ease;transition:max-height .3s ease,opacity .3s ease;opacity:0}.pl-c-typeahead__menu.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}@media all and (min-width:42em){.pl-c-typeahead__menu{border-bottom-right-radius:6px;border-bottom-left-radius:6px}}.pl-c-body--theme-light .pl-c-typeahead__menu{background-color:#fafafa}.pl-c-typeahead__menu.pl-is-open{max-height:120rem;max-height:calc(var(--viewport-height) - 4rem);opacity:1}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-typeahead__menu{position:relative!important;border-radius:0}}@media all and (max-width:41em){.pl-c-typeahead__menu{position:relative!important}}.pl-c-typeahead__results{list-style:none;margin:0;padding:0;background-color:inherit;border-color:transparent;border-width:1px;border-style:solid;overflow:hidden;border-color:#151515}@media all and (min-width:42em){.pl-c-typeahead__results{border-bottom-right-radius:6px;border-bottom-left-radius:6px}}.pl-c-typeahead__results:empty{border-width:0;max-height:0}.pl-c-body--theme-light .pl-c-typeahead__results{border-color:#ccc}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-typeahead__results{border-radius:0}}.pl-c-typeahead__result{-webkit-transition:all .3s ease;transition:all .3s ease;background-color:inherit;padding:.8em;cursor:pointer;overflow:hidden}.pl-c-typeahead__result:last-child{border-bottom-right-radius:6px;border-bottom-left-radius:6px}.pl-c-body--theme-sidebar .pl-c-typeahead__result:last-child{border-radius:0}.pl-c-typeahead__result:hover{background-color:rgba(255,255,255,.15)}.pl-c-body--theme-light .pl-c-typeahead__result:hover{background-color:#eee}.pl-c-typeahead__result:active,.pl-c-typeahead__result:focus{background-color:rgba(255,255,255,.18)}.pl-c-body--theme-light .pl-c-typeahead__result:active,.pl-c-body--theme-light .pl-c-typeahead__result:focus{background-color:#ddd}.pl-c-typeahead__result.pl-has-cursor{color:#fff;background-color:rgba(255,255,255,.25)}.pl-c-body--theme-light .pl-c-typeahead__result.pl-has-cursor{color:#000;background-color:#ddd}.pl-c-typeahead__input-wrapper{position:relative}.pl-c-typeahead__clear-button{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;height:1.7rem;width:1.7rem;background-color:transparent;border-radius:20rem;overflow:hidden;position:absolute;right:0;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);z-index:100;cursor:pointer;border:0;-webkit-transition:opacity .1s ease;transition:opacity .1s ease;opacity:0;visibility:hidden}.pl-c-typeahead__clear-button:hover{color:#fff;background-color:#222}.pl-c-typeahead__clear-button.pl-is-active,.pl-c-typeahead__clear-button:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-typeahead__clear-button{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-typeahead__clear-button:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-typeahead__clear-button:active,.pl-c-body--theme-light .pl-c-typeahead__clear-button:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-typeahead__clear-button{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-typeahead__clear-button{font-size:.85rem;padding:1.5rem 1rem}.pl-c-typeahead__clear-button:active,.pl-c-typeahead__clear-button:hover{background-color:transparent}@media all and (min-width:42em){.pl-c-typeahead__clear-button{height:1.4rem;width:1.4rem}}.pl-c-body--theme-light .pl-c-typeahead__clear-button{background-color:transparent}.pl-c-body--theme-light .pl-c-typeahead__clear-button:active,.pl-c-body--theme-light .pl-c-typeahead__clear-button:hover{background-color:transparent}.pl-c-typeahead__clear-button.pl-is-visible{opacity:1;visibility:visible}.pl-c-typeahead__clear-button-icon{fill:currentColor;line-height:0;font-size:0;position:absolute;top:50%;left:50%;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0)}pl-toggle-info{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-item-align:center;align-self:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;z-index:10;width:100%;cursor:pointer}.pl-c-toggle-info,.pl-c-toggle-info__action{width:100%}pl-toggle-layout{display:none;-ms-flex-item-align:center;align-self:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;z-index:10;width:100%;cursor:pointer}@media all and (min-width:42em){pl-toggle-layout{display:-webkit-box;display:-ms-flexbox;display:flex}}.pl-c-toggle-layout,.pl-c-toggle-layout__action{width:100%}pl-toggle-theme{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-item-align:center;align-self:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;z-index:10;width:100%;cursor:pointer}.pl-c-toggle-theme,.pl-c-toggle-theme__action{width:100%}pl-tools-menu{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pl-c-tools{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex}.pl-c-tools__toggle{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;margin:0;padding-top:.6rem;padding-bottom:.5rem;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;min-width:30px}.pl-c-tools__toggle:hover{color:#fff;background-color:#222}.pl-c-tools__toggle.pl-is-active,.pl-c-tools__toggle:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-tools__toggle{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-tools__toggle:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-tools__toggle:active,.pl-c-body--theme-light .pl-c-tools__toggle:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-tools__toggle{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-tools__toggle{font-size:.85rem;padding:1.5rem 1rem}.pl-c-tools__toggle-icon{-webkit-transition:inherit;transition:inherit}.pl-c-tools__list{list-style:none;margin:0;padding:0;overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;position:absolute;top:100%;right:0;z-index:10;width:10rem;border-bottom-left-radius:6px;border-bottom-right-radius:6px}.pl-c-tools__list.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-tools__action{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;margin:0}.pl-c-tools__action:hover{color:#fff;background-color:#222}.pl-c-tools__action.pl-is-active,.pl-c-tools__action:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-tools__action{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-tools__action:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-tools__action:active,.pl-c-body--theme-light .pl-c-tools__action:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-tools__action{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-tools__action{font-size:.85rem;padding:1.5rem 1rem}.pl-c-tools__action-icon{margin-left:auto}.pl-c-viewport{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%;position:relative;top:2rem;bottom:0;left:0;right:0;z-index:0;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-transition:height .3s ease;transition:height .3s ease}@supports ((position:-webkit-sticky) or (position:sticky)){.pl-c-viewport{top:0}}.pl-c-viewport__cover{width:100%;height:100%;display:none;position:fixed;top:0;left:0;z-index:200;cursor:move;pointer-events:auto}.pl-c-viewport__iframe-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;max-width:100vw;width:100%;position:relative;margin:0 auto;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-overflow-scrolling:touch;width:100%}.pl-c-viewport__iframe-wrapper.hay-mode{-webkit-transition:all 40s linear;transition:all 40s linear}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-viewport__iframe-wrapper{max-width:calc(100vw - 14rem)}}.pl-c-viewport__iframe{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;width:100%;border:0;padding:0;margin:0;top:0;bottom:0;left:0;right:0;background-color:#fff;max-width:100vw}.pl-c-viewport__iframe.is-ready{min-height:0}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-viewport__iframe{max-width:calc(100vw - 14rem)}}.pl-c-viewport__iframe.hay-mode{-webkit-transition:all 40s linear;transition:all 40s linear}.pl-c-viewport__resizer{position:absolute;right:0;top:0;bottom:0;width:14px;margin:0;height:100%;cursor:ew-resize}.pl-c-viewport__resizer-handle{margin:0;width:100%;height:100%;background-color:#ccc;-webkit-transition:background-color .1s ease-out;transition:background-color .1s ease-out}.pl-c-viewport__resizer-handle:hover{background-color:grey}.pl-c-viewport__resizer-handle:active{cursor:move;background-color:#4d4c4c}.vp-animate{-webkit-transition:width .8s ease-out;transition:width .8s ease-out}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-viewport-modal-wrapper{max-width:calc(100vw - 14rem)}}@media all and (min-width:42em) and (-ms-high-contrast:none),all and (min-width:42em) and (-ms-high-contrast:active){.pl-c-body--theme-sidebar .pl-c-viewport-modal-wrapper{margin-left:14rem}}.pl-c-viewport-size{margin:0;border:0;padding:.3rem .5rem .4rem;line-height:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.pl-c-viewport-size__input{padding:.1rem;margin:0;border:0;border-radius:3px;background-color:transparent;font-size:inherit;color:grey;width:35px;text-align:right;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-viewport-size__input::-moz-focus-inner{padding:0;border:0}.pl-c-viewport-size__input:hover{color:#fff;background-color:#222}.pl-c-viewport-size__input:active,.pl-c-viewport-size__input:focus{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-viewport-size__label{display:block;margin:0;padding:0}.pl-c-size-list{display:none;list-style:none;margin:0;padding:0;overflow-x:auto;padding:0 .25rem}@media all and (min-width:42em){.pl-c-size-list{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-overflow-scrolling:touch}}@media all and (min-width:53em){.pl-c-size-list{display:block;display:-webkit-box;display:-ms-flexbox;display:flex}}.pl-c-size-list__action{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px}.pl-c-size-list__action:hover{color:#fff;background-color:#222}.pl-c-size-list__action.pl-is-active,.pl-c-size-list__action:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-size-list__action{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-size-list__action:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-size-list__action:active,.pl-c-body--theme-light .pl-c-size-list__action:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-size-list__action{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-size-list__action{font-size:.85rem;padding:1.5rem 1rem}.pl-c-size-list__item:first-child{margin-left:auto}.pl-c-size-list__item:last-child{margin-right:auto}.pl-has-annotation{cursor:help!important;outline:1px dotted grey;outline-offset:-4px;-webkit-transition:-webkit-box-shadow .1s ease;transition:-webkit-box-shadow .1s ease;transition:box-shadow .1s ease;transition:box-shadow .1s ease,-webkit-box-shadow .1s ease}.pl-has-annotation a,.pl-has-annotation input{cursor:help!important}.pl-has-annotation:hover{-webkit-box-shadow:0 0 3px grey;box-shadow:0 0 3px grey}.pl-has-annotation.active{-webkit-box-shadow:inset 0 0 6px #4d4c4c;box-shadow:inset 0 0 6px #4d4c4c;outline:1px dotted grey;outline-offset:-1px}.pl-c-annotation-tip{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:24px!important;height:24px!important;margin-top:6px!important;margin-left:6px!important;border-radius:50%!important;background-color:#222!important;color:#fff!important;font-size:16px!important;position:absolute;z-index:100}.pl-c-annotations{margin:1rem 0}.pl-c-annotations__title{font-size:1.2rem!important;margin:0 0 .5rem}.pl-c-annotations .pl-c-annotations__list{counter-reset:the-count;padding:0;margin:0;list-style:none}.pl-c-annotations__item{position:relative;padding-left:1.5rem;margin-bottom:1rem;border-radius:6px;-webkit-transition:background-color .1s ease;transition:background-color .1s ease}.pl-c-annotations__item:before{content:counter(the-count);counter-increment:the-count;font-size:85%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:14px;height:14px;border-radius:50%;padding:2px;text-align:center;background-color:grey;color:#fff;position:absolute;top:4px;left:0}.pl-c-annotations__item.pl-is-active{outline:1px dotted grey;outline-offset:-1px}.pl-c-annotations .pl-c-annotations__item-title{margin-bottom:0}.pl-c-breadcrumb{list-style:none;margin:0;padding:0;margin-bottom:.5rem;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:.7rem;color:grey;text-transform:capitalize}.pl-c-breadcrumb__item:after{content:'\25B6';opacity:.4;font-size:6px;display:inline-block;margin:0 .2rem;position:relative;top:-1px}.pl-c-logo{max-width:2rem;margin:0 1rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pl-c-logo:focus{outline:1px dotted grey;outline-offset:-1px}.pl-c-logo__img{display:block;max-width:100%;height:auto}.pl-c-category{margin-top:6rem;font:HelveticaNeue,Helvetica,Arial,sans-serif!important}.pl-c-category:first-of-type{margin-top:2rem}.pl-c-category__title{font-size:1.4rem!important;color:#222!important;margin:0 0 .2rem;text-transform:capitalize}.pl-c-category__title-link{-webkit-transition:color .1s ease-out;transition:color .1s ease-out}.pl-c-category__description{font-size:.85rem;line-height:1.5;max-width:30rem}.pl-c-category__description:empty{display:none}.pl-c-pattern-info{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-flow:row wrap;flex-flow:row wrap;width:100%;overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-pattern .pl-c-pattern-info{overflow:scroll;-ms-overflow-style:-ms-autohiding-scrollbar;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-overflow-scrolling:touch}.pl-c-pattern .pl-c-pattern-info::-webkit-scrollbar{width:0!important}@media all and (min-width:53em){.pl-c-pattern .pl-c-pattern-info{max-height:none;overflow:visible}}.pl-c-pattern-info__panel{-ms-flex-preferred-size:40%;flex-basis:40%;padding-top:1rem;padding-right:1rem;padding-bottom:0;padding-left:1rem;margin-bottom:1rem;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;max-width:100%;max-height:30rem;min-width:300px;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-pattern-info__header{margin-bottom:.5rem}.pl-c-pattern-info__title{font-size:1.4rem!important;font-weight:400;margin-top:0;margin-bottom:0;color:inherit;text-transform:capitalize;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.pl-c-pattern-info__description{border-bottom-color:grey}.pl-c-annotations{border-top-color:grey}.pl-c-lineage{font-size:.85rem;line-height:1.7;margin-top:0}.pl-c-lineage__link{font-style:italic;color:grey;text-decoration:underline;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:opacity .1s ease;transition:opacity .1s ease}.pl-c-lineage__link:focus,.pl-c-lineage__link:hover{opacity:.8}.pl-c-pattern-state{display:inline-block;width:5px;height:5px;margin-left:10px;position:relative;top:5px;left:0;border-radius:50%;background-color:#02a4d5;line-height:4px;text-indent:10px}.pl-c-pattern-state--complete{background-color:#03790f}.pl-c-pattern-state--inreview{background-color:#c7a118}.pl-c-pattern-state--deprecated{background-color:#b00b02}.complete:before{color:#03790f!important}.pl-c-pattern{margin-bottom:2rem;position:relative;clear:both}.pl-c-pattern__header{position:relative;padding:.5rem 0 0;line-height:1.3;font-size:90%;color:grey}.pl-c-pattern__header:empty{padding:0}.pl-c-pattern__title{font-family:HelveticaNeue,Helvetica,Arial,sans-serif!important;font-size:.85rem!important;line-height:1!important;font-weight:400!important;margin:0!important;padding:0!important;text-transform:capitalize!important}.pl-c-pattern__title-link{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;padding:1rem 0 .3rem;color:grey!important;text-decoration:none;cursor:pointer}.pl-c-pattern__title-link:focus,.pl-c-pattern__title-link:hover{color:#000!important}.pl-c-pattern__extra-toggle{font-size:9px;position:absolute;bottom:-1px;right:0;z-index:1;padding:.65em .65em .5em;line-height:1;color:grey;background-color:transparent;font-weight:400;border:1px solid #ddd;border-top-left-radius:6px;border-top-right-radius:6px;-webkit-transition:background-color .1s ease-out;transition:background-color .1s ease-out}.pl-c-pattern__extra-toggle .pl-c-pattern__toggle-icon{display:inline-block}.pl-c-pattern__extra-toggle.pl-is-active,.pl-c-pattern__extra-toggle:focus,.pl-c-pattern__extra-toggle:hover{background-color:#fafafa;color:#000}.pl-c-pattern__extra-toggle:focus{outline:1px dotted #4d4c4c}.pl-c-pattern__extra-toggle.pl-is-active{border-bottom-color:#fafafa}.pl-c-pattern__extra-toggle.pl-is-active .pl-c-pattern__toggle-icon{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.pl-c-pattern__extra{background-color:#fafafa;border-top:1px solid #ddd;margin-bottom:1rem;overflow:hidden;max-height:1px;position:relative;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-pattern__extra.pl-is-active{border:1px solid #ddd;border-radius:6px;border-top-right-radius:0;max-height:150rem}.pl-c-tabs{padding:0 .5rem .5rem;background-color:#fff;border:1px solid #ddd;border-radius:6px;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:hidden;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.pl-c-tabs__list{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;list-style:none;margin:0;padding:.5rem 0;padding-bottom:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.1)}.pl-c-tabs__link{display:block;line-height:1;border-bottom:4px solid transparent;color:grey;background-color:#fff;cursor:pointer;text-decoration:none;text-transform:uppercase;-webkit-transition:all .1s ease-out;transition:all .1s ease-out;padding:8px;font-size:13px}.pl-c-tabs__link:hover{color:#222}.pl-c-tabs__link.pl-is-active-tab{color:#222;border-bottom-color:#bf6500}.pl-c-tabs__content{overflow:auto;-webkit-overflow-scrolling:touch;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.pl-c-tabs__panel{display:none}.pl-c-tabs__panel.pl-is-active-tab{display:-webkit-box;display:-ms-flexbox;display:flex;height:100%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.pl-c-tabs__panel :not(pre)>code[class*=language-],.pl-c-tabs__panel pre[class*=language-]{background-color:transparent;margin:0;padding-top:1rem;padding-right:.5rem;padding-bottom:.5rem;padding-left:.5rem;border:0;display:block;width:100%}.pl-c-tabs__panel code[class*=language-]{background-color:transparent;margin:0}.pl-c-text-passage{font-size:.85rem;line-height:1.7}.pl-c-text-passage p{margin-top:0;margin-bottom:1rem}.pl-c-text-passage a{color:grey;text-decoration:underline;-webkit-transition:opacity .1s ease;transition:opacity .1s ease}.pl-c-text-passage a:focus,.pl-c-text-passage a:hover{opacity:.8}.pl-c-text-passage code[class*=language-],.pl-c-text-passage pre[class*=language-]{color:inherit}.pl-c-text-passage blockquote{padding-left:.8rem;border-left:3px solid inherit}.pl-c-text-passage hr{height:1px;background-color:grey;margin:2rem 0;border:0}.pl-c-text-passage h1{margin-bottom:1rem;font-weight:400}.pl-c-text-passage h2{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h3{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h4{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h5{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h6{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage ul{list-style:square;margin-left:.9rem;margin-bottom:1rem}.pl-c-text-passage ul li:last-child{margin-bottom:0}.pl-c-text-passage ol{list-style:decimal;margin-left:.9rem;margin-bottom:1rem}.pl-c-text-passage ol li:last-child{margin-bottom:0}.pl-c-text-passage li{margin-bottom:.5rem}@media all and (max-width:41em){.pl-c-body--theme-light .pl-c-tools__list.pl-is-active{border-bottom:1px solid #ccc;border-left:1px solid #ccc}}.pl-c-body--theme-light:not(.pl-c-body--theme-sidebar) .pl-c-tools__list.pl-is-active{border-bottom:1px solid #ccc;border-left:1px solid #ccc}.pl-c-body--theme-light .pl-c-nav__link--dropdown{color:#4d4c4c;background-color:#fff}.pl-c-body--theme-light .pl-c-nav__link--dropdown:after{color:#ccc}@media all and (min-width:42em){.pl-c-body--theme-light .pl-c-nav__sublist>.pl-c-nav__item:last-child .pl-c-nav__link{border-bottom-left-radius:6px;border-bottom-right-radius:6px}}.pl-c-body--theme-light .pl-c-viewport-size__input{color:#4d4c4c}.pl-c-body--theme-light .pl-c-viewport-size__input:focus,.pl-c-body--theme-light .pl-c-viewport-size__input:hover{background-color:#ddd}.pl-c-body--theme-light .typeahead{background-color:#ddd!important}.pl-c-body--theme-light .tt-input{background-color:#eee!important;color:#4d4c4c!important}.pl-c-body--theme-light .tt-input:hover{color:#222;background-color:#ddd!important}.pl-c-body--theme-light .tt-input:hover::-webkit-input-placeholder{color:#222}.pl-c-body--theme-light .tt-input:hover::-moz-input-placeholder{color:#222}.pl-c-body--theme-light .pl-c-drawer__close-btn,.pl-c-body--theme-light .pl-c-tools__action{background-color:#fff}.pl-c-body--theme-light .pl-c-drawer__close-btn:focus,.pl-c-body--theme-light .pl-c-drawer__close-btn:hover,.pl-c-body--theme-light .pl-c-tools__action:focus,.pl-c-body--theme-light .pl-c-tools__action:hover{background-color:#eee;color:#4d4c4c}.pl-c-body--theme-density-cozy .pl-c-header{font-size:.85rem}.pl-c-body--theme-density-cozy .pl-c-viewport-size__input{width:44px}.pl-c-body--theme-density-cozy .pl-c-typeahead{padding:.9rem .8rem}@media all and (max-width:78em){.pl-c-body--theme-density-cozy .pl-c-size-list{display:none}}@media all and (max-width:78em){.pl-c-body--theme-density-cozy .pl-c-viewport-size{display:none}}.pl-c-body--theme-density-cozy .pl-c-tools__toggle{min-width:44px}.pl-c-body--theme-density-cozy .pl-c-viewport{top:3.28rem}.pl-c-body--theme-density-comfortable .pl-c-header{font-size:.85rem}.pl-c-body--theme-density-comfortable .pl-c-logo{max-width:4rem}.pl-c-body--theme-density-comfortable .pl-c-header .tt-suggestion{padding:1.5rem 1rem}.pl-c-body--theme-density-comfortable .pl-c-viewport-size__input{width:44px}.pl-c-body--theme-density-comfortable .pl-c-typeahead{padding:.9rem 1rem}@media all and (max-width:78em){.pl-c-body--theme-density-comfortable .pl-c-size-list{display:none}}@media all and (max-width:78em){.pl-c-body--theme-density-comfortable .pl-c-viewport-size{display:none}}.pl-c-body--theme-density-comfortable .pl-c-tools__toggle{min-width:44px}.pl-c-body--theme-density-comfortable .pl-c-viewport{top:3.8rem}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-logo{max-width:7rem;margin:0 auto 1rem}.pl-c-body--theme-sidebar .pl-c-nav{display:block;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.pl-c-body--theme-sidebar .pl-c-nav__list{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.pl-c-body--theme-sidebar .pl-c-nav__sublist{position:relative;border-radius:0}.pl-c-body--theme-sidebar .pl-c-nav__sublist .pl-c-nav__link{padding-left:1rem}.pl-c-body--theme-sidebar .pl-c-nav__sublist--dropdown.pl-is-active{border:0;border-left:1px solid #4d4c4c}.pl-c-body--theme-sidebar.pl-c-body--theme-light .pl-c-nav__sublist--dropdown.pl-is-active{border-left-color:#eee}.pl-c-body--theme-sidebar .pl-c-nav__subsublist{border-left:1px solid #4d4c4c;margin-left:1rem}.pl-c-body--theme-sidebar.pl-c-body--theme-light .pl-c-nav__subsublist{border-left-color:#eee}.pl-c-body--theme-sidebar .pl-c-nav__sublist .pl-c-nav__link{border-left:0;border-right:0}}@media all and (min-width:42em) and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-nav__sublist>.pl-c-nav__item:last-child .pl-c-nav__link{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:0}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-controls{display:block;justify-self:flex-end;margin-left:0}.pl-c-body--theme-sidebar .pl-c-viewport-size{display:none}.pl-c-body--theme-sidebar .pl-c-tools__toggle{display:none}.pl-c-body--theme-sidebar .pl-c-tools__list{max-height:none;overflow:visible;position:relative;border-radius:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%}.pl-c-body--theme-sidebar .pl-c-drawer{right:0;width:auto}}.is-vishidden{position:absolute!important;overflow:hidden;width:1px;height:1px;padding:0;border:0;clip:rect(1px,1px,1px,1px)} \ No newline at end of file diff --git a/packages/uikit-workshop/dist/styleguide/css/pattern-lab.css b/packages/uikit-workshop/dist/styleguide/css/pattern-lab.css index b397d2bac..2ad371d26 100644 --- a/packages/uikit-workshop/dist/styleguide/css/pattern-lab.css +++ b/packages/uikit-workshop/dist/styleguide/css/pattern-lab.css @@ -1 +1 @@ -.pl-c-body *{-webkit-box-sizing:border-box;box-sizing:border-box}button{font-size:inherit;background-color:transparent}.pl-c-html{min-height:100%}.pl-c-body{margin:0;padding:0;-webkit-text-size-adjust:100%;display:-webkit-box;display:-ms-flexbox;display:flex}code[class*=language-],pre[class*=language-]{color:#000;text-shadow:0 1px #fff;font-family:Consolas,Monaco,'Andale Mono',monospace;direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;line-height:1.5;word-wrap:normal;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none}code[class*=language-] ::-moz-selection,code[class*=language-]::-moz-selection,pre[class*=language-] ::-moz-selection,pre[class*=language-]::-moz-selection{text-shadow:none;background-color:#b3d4fc}code[class*=language-] ::selection,code[class*=language-]::selection,pre[class*=language-] ::selection,pre[class*=language-]::selection{text-shadow:none;background-color:#b3d4fc}@media print{code[class*=language-],pre[class*=language-]{text-shadow:none}}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background-color:#f5f2f0}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#708090}.token.punctuation{color:#999}.namespace{opacity:.7}.token.boolean,.token.constant,.token.deleted,.token.number,.token.property,.token.symbol,.token.tag{color:#905}.token.attr-name,.token.builtin,.token.char,.token.inserted,.token.selector,.token.string{color:#690}.language-css .token.string,.style .token.string,.token.entity,.token.operator,.token.url{color:#a67f59;background-color:rgba(255,255,255,.5)}.token.atrule,.token.attr-value,.token.keyword{color:#07a}.token.function{color:#dd4a68}.token.important,.token.regex,.token.variable{color:#e90}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}pre.line-numbers{position:relative;padding-left:3.8em;counter-reset:linenumber}pre.line-numbers>code{position:relative}.line-numbers .line-numbers-rows{position:absolute;pointer-events:none;top:0;font-size:100%;left:-3.8em;width:3em;letter-spacing:-1px;border-right:1px solid #999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.line-numbers-rows>span{pointer-events:none;display:block;counter-increment:linenumber}.line-numbers-rows>span:before{content:counter(linenumber);color:#999;display:block;padding-right:.8em;text-align:right}.token a{color:inherit}pl-search{background-color:inherit;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;top:0;z-index:10;-ms-flex-negative:0;flex-shrink:0;padding:.3rem .5rem;display:inline-block}@media screen and (min-width:42em){pl-search{margin-left:1rem;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-negative:1;flex-shrink:1}.pl-c-body--theme-sidebar pl-search{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-left:0;padding-left:0;padding-right:0;width:100%}}.pl-c-typeahead{width:100%;background-color:inherit;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;z-index:10;text-transform:capitalize;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;color:#fafafa;position:relative}.pl-c-body--theme-light .pl-c-typeahead{color:#222}@media screen and (min-width:42em){.pl-c-typeahead{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.pl-c-body--theme-sidebar .pl-c-typeahead{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}.pl-c-typeahead__hint{top:0;left:0;right:0;width:100%}.pl-c-typeahead__hint,.pl-c-typeahead__input{text-transform:capitalize;background-color:#222;color:#fff;border-color:#090909;text-overflow:ellipsis;border-width:1px;border-style:solid;-webkit-transition:all .1s ease;transition:all .1s ease;max-width:100%;padding:.31rem .5rem;font-size:16px;width:100%;outline-offset:-3px;outline-width:2px;-webkit-appearance:none}@media all and (min-width:900px){.pl-c-typeahead__hint,.pl-c-typeahead__input{font-size:inherit}}.pl-c-typeahead__hint::-ms-clear,.pl-c-typeahead__input::-ms-clear{display:none}.pl-c-body--theme-sidebar .pl-c-typeahead__hint,.pl-c-body--theme-sidebar .pl-c-typeahead__input{border-radius:0}.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__hint,.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__input{padding-right:1.7rem}@media all and (min-width:42em){.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__hint,.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__input{padding-right:1.4rem}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-typeahead__hint,.pl-c-body--theme-sidebar .pl-c-typeahead__input{max-width:none}}.pl-c-body--theme-light .pl-c-typeahead__hint,.pl-c-body--theme-light .pl-c-typeahead__input{background-color:#eee;color:#4d4c4c!important;border-color:#ddd!important}.pl-c-typeahead__hint::-moz-input-placeholder,.pl-c-typeahead__hint::-webkit-input-placeholder,.pl-c-typeahead__input::-moz-input-placeholder,.pl-c-typeahead__input::-webkit-input-placeholder{color:#fff!important;-webkit-transition:all .1s ease;transition:all .1s ease}.pl-c-typeahead__hint:focus,.pl-c-typeahead__hint:hover,.pl-c-typeahead__input:focus,.pl-c-typeahead__input:hover{color:#fff;background-color:#1d1d1d!important}.pl-c-body--theme-light .pl-c-typeahead__hint:focus,.pl-c-body--theme-light .pl-c-typeahead__hint:hover,.pl-c-body--theme-light .pl-c-typeahead__input:focus,.pl-c-body--theme-light .pl-c-typeahead__input:hover{color:#222!important;background-color:#ddd!important;border-color:#ccc!important}.pl-c-typeahead__hint:focus::-moz-input-placeholder,.pl-c-typeahead__hint:focus::-webkit-input-placeholder,.pl-c-typeahead__hint:hover::-moz-input-placeholder,.pl-c-typeahead__hint:hover::-webkit-input-placeholder,.pl-c-typeahead__input:focus::-moz-input-placeholder,.pl-c-typeahead__input:focus::-webkit-input-placeholder,.pl-c-typeahead__input:hover::-moz-input-placeholder,.pl-c-typeahead__input:hover::-webkit-input-placeholder{color:#fff!important}.pl-c-body--theme-light .pl-c-typeahead__hint:focus::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__hint:focus::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__hint:hover::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__hint:hover::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:focus::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:focus::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:hover::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:hover::-webkit-input-placeholder{color:#222!important}.pl-c-typeahead__menu{overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;background-color:#222;text-transform:capitalize;position:absolute;min-width:100%;width:100%;overflow:hidden;top:100%;right:0;max-height:0;display:block!important;-webkit-transition:max-height .3s ease,opacity .3s ease;transition:max-height .3s ease,opacity .3s ease;opacity:0}.pl-c-typeahead__menu.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}@media all and (min-width:42em){.pl-c-typeahead__menu{border-bottom-right-radius:6px;border-bottom-left-radius:6px}}.pl-c-body--theme-light .pl-c-typeahead__menu{background-color:#fafafa}.pl-c-typeahead__menu.pl-is-open{max-height:120rem;max-height:calc(var(--viewport-height) - 4rem);opacity:1}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-typeahead__menu{position:relative!important;border-radius:0}}@media all and (max-width:41em){.pl-c-typeahead__menu{position:relative!important}}.pl-c-typeahead__results{list-style:none;margin:0;padding:0;background-color:inherit;border-color:transparent;border-width:1px;border-style:solid;overflow:hidden;border-color:#151515}@media all and (min-width:42em){.pl-c-typeahead__results{border-bottom-right-radius:6px;border-bottom-left-radius:6px}}.pl-c-typeahead__results:empty{border-width:0;max-height:0}.pl-c-body--theme-light .pl-c-typeahead__results{border-color:#ccc}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-typeahead__results{border-radius:0}}.pl-c-typeahead__result{-webkit-transition:all .3s ease;transition:all .3s ease;background-color:inherit;padding:.8em;cursor:pointer;overflow:hidden}.pl-c-typeahead__result:last-child{border-bottom-right-radius:6px;border-bottom-left-radius:6px}.pl-c-body--theme-sidebar .pl-c-typeahead__result:last-child{border-radius:0}.pl-c-typeahead__result:hover{background-color:rgba(255,255,255,.15)}.pl-c-body--theme-light .pl-c-typeahead__result:hover{background-color:#eee}.pl-c-typeahead__result:active,.pl-c-typeahead__result:focus{background-color:rgba(255,255,255,.18)}.pl-c-body--theme-light .pl-c-typeahead__result:active,.pl-c-body--theme-light .pl-c-typeahead__result:focus{background-color:#ddd}.pl-c-typeahead__result.pl-has-cursor{color:#fff;background-color:rgba(255,255,255,.25)}.pl-c-body--theme-light .pl-c-typeahead__result.pl-has-cursor{color:#000;background-color:#ddd}.pl-c-typeahead__input-wrapper{position:relative}.pl-c-typeahead__clear-button{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;height:1.7rem;width:1.7rem;background-color:transparent;border-radius:20rem;overflow:hidden;position:absolute;right:0;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);z-index:100;cursor:pointer;border:0;-webkit-transition:opacity .1s ease;transition:opacity .1s ease;opacity:0;visibility:hidden}.pl-c-typeahead__clear-button:hover{color:#fff;background-color:#222}.pl-c-typeahead__clear-button.pl-is-active,.pl-c-typeahead__clear-button:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-typeahead__clear-button{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-typeahead__clear-button:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-typeahead__clear-button:active,.pl-c-body--theme-light .pl-c-typeahead__clear-button:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-typeahead__clear-button{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-typeahead__clear-button{font-size:.85rem;padding:1.5rem 1rem}.pl-c-typeahead__clear-button:active,.pl-c-typeahead__clear-button:hover{background-color:transparent}@media all and (min-width:42em){.pl-c-typeahead__clear-button{height:1.4rem;width:1.4rem}}.pl-c-body--theme-light .pl-c-typeahead__clear-button{background-color:transparent}.pl-c-body--theme-light .pl-c-typeahead__clear-button:active,.pl-c-body--theme-light .pl-c-typeahead__clear-button:hover{background-color:transparent}.pl-c-typeahead__clear-button.pl-is-visible{opacity:1;visibility:visible}.pl-c-typeahead__clear-button-icon{fill:currentColor;line-height:0;font-size:0;position:absolute;top:50%;left:50%;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0)}pl-layout{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%;min-height:100vh;max-width:100vw;background-color:#ddd}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){pl-layout{overflow:hidden}}@media all and (min-width:42em){pl-layout.pl-c-body--theme-sidebar{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}pl-layout.pl-c-body--theme-light{background-color:#fff}.pl-c-header{position:fixed;position:-webkit-sticky;position:sticky;top:0;left:0;z-index:4;display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;background-color:#000;color:grey;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;font-size:.7rem;min-height:30px}@supports (padding:0px){.pl-c-header{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}}.pl-c-header__nav-toggle{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;border:0}.pl-c-header__nav-toggle:hover{color:#fff;background-color:#222}.pl-c-header__nav-toggle.pl-is-active,.pl-c-header__nav-toggle:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-header__nav-toggle{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-header__nav-toggle:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-header__nav-toggle:active,.pl-c-body--theme-light .pl-c-header__nav-toggle:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-header__nav-toggle{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-header__nav-toggle{font-size:.85rem;padding:1.5rem 1rem}@media all and (min-width:42em){.pl-c-header__nav-toggle{display:none}}.pl-c-logo{max-width:2rem;margin:0 1rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pl-c-logo:focus{outline:1px dotted grey;outline-offset:-1px}.pl-c-logo__img{display:block;max-width:100%;height:auto}.pl-c-nav{overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;background-color:inherit;position:absolute;left:0;top:100%;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;transition:max-height .1s ease-out}.pl-c-nav.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}@media all and (min-width:42em){.pl-c-nav{overflow:visible;max-height:none}}.pl-c-nav.pl-is-active{-webkit-box-shadow:0 1px 1px #000;box-shadow:0 1px 1px #000}.pl-c-body--theme-light .pl-c-nav.pl-is-active{-webkit-box-shadow:0 1px 1px #a6a6a6;box-shadow:0 1px 1px #a6a6a6}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-nav.pl-is-active{-webkit-box-shadow:none;box-shadow:none}}@media all and (min-width:42em){.pl-c-nav.pl-is-active{overflow:visible;max-height:none}}@media all and (min-width:42em){.pl-c-nav{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;position:relative;top:auto;width:auto;-webkit-box-shadow:none;box-shadow:none}}.pl-c-nav__list{z-index:1;margin:0;padding:0;list-style:none;-ms-flex-negative:0;flex-shrink:0;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;background-color:inherit}@media all and (min-width:42em){.pl-c-nav__list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.pl-c-body--theme-sidebar .pl-c-nav__list{display:block}}.pl-c-nav__item{background-color:inherit;-webkit-transform:translateZ(0);transform:translateZ(0);cursor:pointer;position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pl-c-body--theme-sidebar .pl-c-nav__item{display:block}@media all and (min-width:42em){.pl-c-nav__sublist>.pl-c-nav__item:last-child{overflow:hidden;border-bottom-left-radius:6px;border-bottom-right-radius:6px}}.pl-c-nav__link{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0}.pl-c-nav__link:hover{color:#fff;background-color:#222}.pl-c-nav__link.pl-is-active,.pl-c-nav__link:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-nav__link{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-nav__link:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-nav__link:active,.pl-c-body--theme-light .pl-c-nav__link:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-nav__link{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-nav__link{font-size:.85rem;padding:1.5rem 1rem}.pl-c-body--theme-sidebar .pl-c-nav__link{width:100%}.pl-c-nav__link--sublink{text-transform:none;padding-left:.5rem}.pl-c-nav__link--dropdown{-webkit-appearance:none;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.pl-c-nav__link--dropdown:after{content:'\25BC';color:rgba(255,255,255,.25);display:inline-block;font-size:7px;position:relative;top:1px;right:-2px;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-nav__link--dropdown:focus:after,.pl-c-nav__link--dropdown:hover:after{color:grey}.pl-c-nav__link--dropdown.pl-is-active{color:#fff;background-color:#222}.pl-c-nav__link--dropdown.pl-is-active:after{color:grey;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.pl-c-nav__sublist{background-color:inherit;list-style:none;margin:0;padding:0}@media all and (min-width:42em){.pl-c-nav__sublist{position:absolute;top:100%;left:0;min-width:10rem;border-bottom-left-radius:6px;border-bottom-right-radius:6px}}.pl-c-nav__sublist--dropdown,.pl-c-nav__subsublist--dropdown{list-style:none;margin:0;padding:0;overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;visibility:hidden}.pl-c-nav__sublist--dropdown.pl-is-active,.pl-c-nav__subsublist--dropdown.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-nav__sublist--dropdown.pl-is-active,.pl-c-nav__subsublist--dropdown.pl-is-active{margin-left:.5rem;visibility:visible;max-height:none}@media all and (min-width:42em){.pl-c-nav__sublist--dropdown.pl-is-active,.pl-c-nav__subsublist--dropdown.pl-is-active{height:auto;max-height:calc(100vh - 2rem - 1rem)}}.pl-c-body--theme-sidebar .pl-c-nav__sublist--dropdown.pl-is-active,.pl-c-body--theme-sidebar .pl-c-nav__subsublist--dropdown.pl-is-active{max-height:none}@media all and (min-width:42em){.pl-c-nav__sublist--dropdown.pl-is-active{margin-left:0;border-width:1px;border-style:solid;border-color:#000}.pl-c-body--theme-light .pl-c-nav__sublist--dropdown.pl-is-active{border-color:#ccc}}.pl-c-nav__subsublist{list-style:none;margin:0;padding:0}.pl-c-viewport-size{margin:0;border:0;padding:.3rem .5rem .4rem;line-height:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.pl-c-viewport-size__input{padding:.1rem;margin:0;border:0;border-radius:3px;background-color:transparent;font-size:inherit;color:grey;width:35px;text-align:right;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-viewport-size__input::-moz-focus-inner{padding:0;border:0}.pl-c-viewport-size__input:hover{color:#fff;background-color:#222}.pl-c-viewport-size__input:active,.pl-c-viewport-size__input:focus{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-viewport-size__label{display:block;margin:0;padding:0}.pl-c-size-list{display:none;list-style:none;margin:0;padding:0;overflow-x:auto;padding:0 .25rem}@media all and (min-width:42em){.pl-c-size-list{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-overflow-scrolling:touch}}@media all and (min-width:53em){.pl-c-size-list{display:block;display:-webkit-box;display:-ms-flexbox;display:flex}}.pl-c-size-list__action{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px}.pl-c-size-list__action:hover{color:#fff;background-color:#222}.pl-c-size-list__action.pl-is-active,.pl-c-size-list__action:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-size-list__action{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-size-list__action:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-size-list__action:active,.pl-c-body--theme-light .pl-c-size-list__action:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-size-list__action{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-size-list__action{font-size:.85rem;padding:1.5rem 1rem}.pl-c-size-list__item:first-child{margin-left:auto}.pl-c-size-list__item:last-child{margin-right:auto}.pl-c-controls{margin-left:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-controls{display:block}}.pl-c-controls__list{list-style:none;margin:0;padding:0;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.pl-c-tools{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex}.pl-c-tools__toggle{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;margin:0;padding-top:.6rem;padding-bottom:.5rem;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;min-width:30px}.pl-c-tools__toggle:hover{color:#fff;background-color:#222}.pl-c-tools__toggle.pl-is-active,.pl-c-tools__toggle:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-tools__toggle{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-tools__toggle:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-tools__toggle:active,.pl-c-body--theme-light .pl-c-tools__toggle:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-tools__toggle{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-tools__toggle{font-size:.85rem;padding:1.5rem 1rem}.pl-c-tools__toggle-icon{-webkit-transition:inherit;transition:inherit}.pl-c-tools__list{list-style:none;margin:0;padding:0;overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;position:absolute;top:100%;right:0;z-index:10;width:10rem;border-bottom-left-radius:6px;border-bottom-right-radius:6px}.pl-c-tools__list.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-tools__action{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;margin:0}.pl-c-tools__action:hover{color:#fff;background-color:#222}.pl-c-tools__action.pl-is-active,.pl-c-tools__action:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-tools__action{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-tools__action:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-tools__action:active,.pl-c-body--theme-light .pl-c-tools__action:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-tools__action{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-tools__action{font-size:.85rem;padding:1.5rem 1rem}.pl-c-tools__action-icon{margin-left:auto}.pl-c-viewport{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%;position:relative;top:2rem;bottom:0;left:0;right:0;z-index:0;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-transition:height .3s ease;transition:height .3s ease}@supports ((position: -webkit-sticky) or (position: sticky)){.pl-c-viewport{top:0}}.pl-c-body--theme-sidebar .pl-c-viewport{top:0}.pl-c-viewport__cover{width:100%;height:100%;display:none;position:fixed;top:0;left:0;z-index:200;cursor:move;pointer-events:auto}.pl-c-viewport__iframe-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;max-width:100vw;width:100%;position:relative;margin:0 auto;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-overflow-scrolling:touch;width:100%}.pl-c-viewport__iframe-wrapper.hay-mode{-webkit-transition:all 40s linear;transition:all 40s linear}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-viewport__iframe-wrapper{max-width:calc(100vw - 14rem)}}.pl-c-viewport__iframe{min-height:calc(100vh - 35.5px);-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;width:100%;border:0;padding:0;margin:0;top:0;bottom:0;left:0;right:0;background-color:#fff;max-width:100vw}.pl-c-viewport__iframe.is-ready{min-height:0}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-viewport__iframe{max-width:calc(100vw - 14rem)}}.pl-c-viewport__iframe.hay-mode{-webkit-transition:all 40s linear;transition:all 40s linear}.pl-c-viewport__resizer{position:absolute;right:0;top:0;bottom:0;width:14px;margin:0;height:100%;cursor:ew-resize}.pl-c-viewport__resizer-handle{margin:0;width:100%;height:100%;background-color:#ccc;-webkit-transition:background-color .1s ease-out;transition:background-color .1s ease-out}.pl-c-viewport__resizer-handle:hover{background-color:grey}.pl-c-viewport__resizer-handle:active{cursor:move;background-color:#4d4c4c}.vp-animate{-webkit-transition:width .8s ease-out;transition:width .8s ease-out}.pl-c-viewport-modal-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;max-width:100vw;position:relative}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-viewport-modal-wrapper{max-width:calc(100vw - 14rem)}}@media all and (min-width:42em) and (-ms-high-contrast:none),all and (min-width:42em) and (-ms-high-contrast:active){.pl-c-body--theme-sidebar .pl-c-viewport-modal-wrapper{margin-left:14rem}}.pl-c-pattern{margin-bottom:2rem;position:relative;clear:both}.pl-c-pattern__header{position:relative;padding:.5rem 0 0;line-height:1.3;font-size:90%;color:grey}.pl-c-pattern__header:empty{padding:0}.pl-c-pattern__title{font-family:HelveticaNeue,Helvetica,Arial,sans-serif!important;font-size:.85rem!important;line-height:1!important;font-weight:400!important;margin:0!important;padding:0!important;text-transform:capitalize!important}.pl-c-pattern__title-link{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;padding:1rem 0 .3rem;color:grey!important;text-decoration:none;cursor:pointer}.pl-c-pattern__title-link:focus,.pl-c-pattern__title-link:hover{color:#000!important}.pl-c-pattern__extra-toggle{font-size:9px;position:absolute;bottom:-1px;right:0;z-index:1;padding:.65em .65em .5em;line-height:1;color:grey;background-color:transparent;font-weight:400;border:1px solid #ddd;border-top-left-radius:6px;border-top-right-radius:6px;-webkit-transition:background-color .1s ease-out;transition:background-color .1s ease-out}.pl-c-pattern__extra-toggle .pl-c-pattern__toggle-icon{display:inline-block}.pl-c-pattern__extra-toggle.pl-is-active,.pl-c-pattern__extra-toggle:focus,.pl-c-pattern__extra-toggle:hover{background-color:#fafafa;color:#000}.pl-c-pattern__extra-toggle:focus{outline:1px dotted #4d4c4c}.pl-c-pattern__extra-toggle.pl-is-active{border-bottom-color:#fafafa}.pl-c-pattern__extra-toggle.pl-is-active .pl-c-pattern__toggle-icon{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.pl-c-pattern__extra{background-color:#fafafa;border-top:1px solid #ddd;margin-bottom:1rem;overflow:hidden;max-height:1px;position:relative;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-pattern__extra.pl-is-active{border:1px solid #ddd;border-radius:6px;border-top-right-radius:0;max-height:150rem}.pl-c-category{margin-top:6rem;font:HelveticaNeue,Helvetica,Arial,sans-serif!important}.pl-c-category:first-of-type{margin-top:2rem}.pl-c-category__title{font-size:1.4rem!important;color:#222!important;margin:0 0 .2rem;text-transform:capitalize}.pl-c-category__title-link{-webkit-transition:color .1s ease-out;transition:color .1s ease-out}.pl-c-category__description{font-size:.85rem;line-height:1.5;max-width:30rem}.pl-c-category__description:empty{display:none}.pl-c-pattern-info{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-flow:row wrap;flex-flow:row wrap;width:100%;overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-pattern .pl-c-pattern-info{max-height:20rem;min-height:18rem;overflow:scroll;-ms-overflow-style:-ms-autohiding-scrollbar;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-overflow-scrolling:touch}.pl-c-pattern .pl-c-pattern-info::-webkit-scrollbar{width:0!important}@media all and (min-width:53em){.pl-c-pattern .pl-c-pattern-info{max-height:none;height:18rem;overflow:visible}}.pl-c-pattern-info__panel{-ms-flex-preferred-size:40%;flex-basis:40%;padding-top:1rem;padding-right:1rem;padding-bottom:0;padding-left:1rem;margin-bottom:1rem;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;max-width:100%;min-width:300px;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-pattern-info__header{margin-bottom:.5rem}.pl-c-pattern-info__title{font-size:1.4rem!important;font-weight:400;margin-top:0;margin-bottom:0;color:inherit;text-transform:capitalize;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.pl-c-pattern-info__description{border-bottom-color:grey}.pl-c-annotations{border-top-color:grey}.pl-c-pattern-state{display:inline-block;width:5px;height:5px;margin-left:10px;position:relative;top:5px;left:0;border-radius:50%;background-color:#02a4d5;line-height:4px;text-indent:10px}.pl-c-pattern-state--complete{background-color:#03790f}.pl-c-pattern-state--inreview{background-color:#c7a118}.pl-c-pattern-state--deprecated{background-color:#b00b02}.complete:before{color:#03790f!important}.pl-c-lineage{font-size:.85rem;line-height:1.7;margin-top:0}.pl-c-lineage__link{font-style:italic;color:grey;text-decoration:underline;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:opacity .1s ease;transition:opacity .1s ease}.pl-c-lineage__link:focus,.pl-c-lineage__link:hover{opacity:.8}.pl-c-breadcrumb{list-style:none;margin:0;padding:0;margin-bottom:.5rem;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:.7rem;color:grey;text-transform:capitalize}.pl-c-breadcrumb__item:after{content:'\25B6';opacity:.4;font-size:6px;display:inline-block;margin:0 .2rem;position:relative;top:-1px}.pl-c-tabs{padding:0 .5rem .5rem;background-color:#fff;border:1px solid #ddd;border-radius:6px;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:hidden;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.pl-c-tabs__list{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;list-style:none;margin:0;padding:.5rem 0;background-color:#fff}.pl-c-tabs__link{display:block;line-height:1;padding:.2rem .4rem;border:1px solid transparent;border-radius:6px;color:grey;background-color:#fff;cursor:pointer;text-decoration:none;text-transform:lowercase;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-tabs__link:hover{color:#222}.pl-c-tabs__link.pl-is-active-tab{color:#222;background-color:#eee;border:1px solid #ddd}.pl-c-tabs__content{overflow:auto;-webkit-overflow-scrolling:touch;padding-top:.5rem}.pl-c-tabs__panel{display:none}.pl-c-tabs__panel.pl-is-active-tab{display:block}.pl-c-tabs__panel :not(pre)>code[class*=language-],.pl-c-tabs__panel pre[class*=language-]{background-color:transparent;margin:0;padding:0;border:0;display:block}.pl-c-tabs__panel code[class*=language-]{background-color:transparent;margin:0}.pl-c-tools{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex}.pl-c-tools__toggle{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;margin:0;padding-top:.6rem;padding-bottom:.5rem;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;min-width:30px}.pl-c-tools__toggle:hover{color:#fff;background-color:#222}.pl-c-tools__toggle.pl-is-active,.pl-c-tools__toggle:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-tools__toggle{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-tools__toggle:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-tools__toggle:active,.pl-c-body--theme-light .pl-c-tools__toggle:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-tools__toggle{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-tools__toggle{font-size:.85rem;padding:1.5rem 1rem}.pl-c-tools__toggle-icon{-webkit-transition:inherit;transition:inherit}.pl-c-tools__list{list-style:none;margin:0;padding:0;overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;position:absolute;top:100%;right:0;z-index:10;width:10rem;border-bottom-left-radius:6px;border-bottom-right-radius:6px}.pl-c-tools__list.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-tools__action{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;margin:0}.pl-c-tools__action:hover{color:#fff;background-color:#222}.pl-c-tools__action.pl-is-active,.pl-c-tools__action:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-tools__action{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-tools__action:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-tools__action:active,.pl-c-body--theme-light .pl-c-tools__action:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-tools__action{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-tools__action{font-size:.85rem;padding:1.5rem 1rem}.pl-c-tools__action-icon{margin-left:auto}.pl-has-annotation{cursor:help!important;outline:1px dotted grey;outline-offset:-4px;-webkit-transition:-webkit-box-shadow .1s ease;transition:-webkit-box-shadow .1s ease;transition:box-shadow .1s ease;transition:box-shadow .1s ease, -webkit-box-shadow .1s ease}.pl-has-annotation a,.pl-has-annotation input{cursor:help!important}.pl-has-annotation:hover{-webkit-box-shadow:0 0 3px grey;box-shadow:0 0 3px grey}.pl-has-annotation.active{-webkit-box-shadow:inset 0 0 6px #4d4c4c;box-shadow:inset 0 0 6px #4d4c4c;outline:1px dotted grey;outline-offset:-1px}.pl-c-annotation-tip{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:24px!important;height:24px!important;margin-top:6px!important;margin-left:6px!important;border-radius:50%!important;background-color:#222!important;color:#fff!important;font-size:16px!important;position:absolute;z-index:100}.pl-c-annotations{margin:1rem 0}.pl-c-annotations__title{font-size:1.2rem!important;margin:0 0 .5rem}.pl-c-annotations .pl-c-annotations__list{counter-reset:the-count;padding:0;margin:0;list-style:none}.pl-c-annotations__item{position:relative;padding-left:1.5rem;margin-bottom:1rem;border-radius:6px;-webkit-transition:background-color .1s ease;transition:background-color .1s ease}.pl-c-annotations__item:before{content:counter(the-count);counter-increment:the-count;font-size:85%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:14px;height:14px;border-radius:50%;padding:2px;text-align:center;background-color:grey;color:#fff;position:absolute;top:4px;left:0}.pl-c-annotations__item.pl-is-active{outline:1px dotted grey;outline-offset:-1px}.pl-c-annotations .pl-c-annotations__item-title{margin-bottom:0}pl-modal{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:relative;position:-webkit-sticky;position:sticky;z-index:20;max-height:100vh;-webkit-box-shadow:0 0 2px 0 #4d4c4c;box-shadow:0 0 2px 0 #4d4c4c;overflow:visible}.pl-c-modal{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;background-color:#222;color:#ccc;position:-webkit-sticky;position:sticky;top:auto;bottom:0;left:0;right:0;z-index:5;width:100%;height:0;-webkit-transition:height .3s ease,-webkit-transform .3s ease;transition:height .3s ease,-webkit-transform .3s ease;transition:transform .3s ease,height .3s ease;transition:transform .3s ease,height .3s ease,-webkit-transform .3s ease;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);pointer-events:none;will-change:height,transform;overflow:hidden;max-width:100vw;-webkit-box-shadow:0 -1px 2px rgba(77,76,76,.1);box-shadow:0 -1px 2px rgba(77,76,76,.1)}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-modal{max-width:calc(100vw - 14rem)}}.pl-c-modal.pl-is-active{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);height:40vh;-webkit-transition:-webkit-transform .3s ease;transition:-webkit-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease, -webkit-transform .3s ease;pointer-events:auto}.pl-c-modal__wrapper{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.pl-c-modal__wrapper>*{height:100%}.pl-c-modal__content{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;overflow:hidden}.pl-c-modal__toolbar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-negative:0;flex-shrink:0}.pl-c-modal__content-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;overflow:hidden}.pl-c-modal__toolbar-controls{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-item-align:end;align-self:flex-end;position:relative;z-index:10;-ms-flex-negative:0;flex-shrink:0}.pl-c-modal__close-btn{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;margin:0;-webkit-appearance:none;-ms-flex-negative:0;flex-shrink:0;z-index:2;opacity:.85;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pl-c-modal__close-btn:hover{color:#fff;background-color:#222}.pl-c-modal__close-btn.pl-is-active,.pl-c-modal__close-btn:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-modal__close-btn{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-modal__close-btn:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-modal__close-btn:active,.pl-c-body--theme-light .pl-c-modal__close-btn:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-modal__close-btn{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-modal__close-btn{font-size:.85rem;padding:1.5rem 1rem}@media all and (max-width:41em){.pl-c-modal__close-btn{border-radius:20rem;padding-top:.5rem;padding-bottom:.5rem}}.pl-c-modal__close-btn:focus,.pl-c-modal__close-btn:hover{opacity:1}.pl-c-modal__close-btn:active,.pl-c-modal__close-btn:focus{opacity:1}.pl-c-modal__cover{width:100%;height:100%;display:none;position:absolute;z-index:20;cursor:move}.pl-c-modal__resizer{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;top:0;left:0;right:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;left:0;height:14px;width:100%;background-color:inherit;z-index:2;cursor:ns-resize}.pl-c-modal__resizer:after{content:'';height:3px;width:50px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;-webkit-transition:opacity .3s ease-out;transition:opacity .3s ease-out;opacity:.5;background-color:currentColor;border-radius:3px;display:block}.pl-c-modal__resizer:hover:after{opacity:.8}.pl-c-modal__resizer:active:after,.pl-c-modal__resizer:focus:after{opacity:.95}.pl-c-modal__close-btn-icon{width:12px;height:12px;color:currentColor;fill:currentColor;-webkit-transition:fill .1s ease-out;transition:fill .1s ease-out;-ms-flex-negative:0;flex-shrink:0;-ms-flex-item-align:center;align-self:center}.pl-c-code-copy-btn{display:inline-block;position:absolute;top:.5rem;right:.5rem;padding:.2rem .4rem;background-color:#eee;color:#222;border:1px solid #ddd;border-radius:6px;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;font-size:1rem;text-transform:lowercase;line-height:1;cursor:pointer;z-index:2;-webkit-transition:background-color .1s ease-out;transition:background-color .1s ease-out}.pl-c-code-copy-btn:focus,.pl-c-code-copy-btn:hover{background-color:#ccc}.pl-c-text-passage{font-size:.85rem;line-height:1.7}.pl-c-text-passage p{margin-top:0;margin-bottom:1rem}.pl-c-text-passage a{color:grey;text-decoration:underline;-webkit-transition:opacity .1s ease;transition:opacity .1s ease}.pl-c-text-passage a:focus,.pl-c-text-passage a:hover{opacity:.8}.pl-c-text-passage code[class*=language-],.pl-c-text-passage pre[class*=language-]{color:inherit}.pl-c-text-passage blockquote{padding-left:.8rem;border-left:3px solid inherit}.pl-c-text-passage hr{height:1px;background-color:grey;margin:2rem 0;border:0}.pl-c-text-passage h1{margin-bottom:1rem;font-weight:400}.pl-c-text-passage h2{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h3{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h4{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h5{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h6{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage ul{list-style:square;margin-left:.9rem;margin-bottom:1rem}.pl-c-text-passage ul li:last-child{margin-bottom:0}.pl-c-text-passage ol{list-style:decimal;margin-left:.9rem;margin-bottom:1rem}.pl-c-text-passage ol li:last-child{margin-bottom:0}.pl-c-text-passage li{margin-bottom:.5rem}.pl-c-body--theme-light .pl-c-header{background-color:#fff;border-bottom:1px solid #ccc}@media all and (max-width:41em){.pl-c-body--theme-light .pl-c-tools__list.pl-is-active{border-bottom:1px solid #ccc;border-left:1px solid #ccc}}.pl-c-body--theme-light:not(.pl-c-body--theme-sidebar) .pl-c-tools__list.pl-is-active{border-bottom:1px solid #ccc;border-left:1px solid #ccc}.pl-c-body--theme-light .pl-c-nav__link--dropdown{color:#4d4c4c;background-color:#fff}.pl-c-body--theme-light .pl-c-nav__link--dropdown:after{color:#ccc}@media all and (min-width:42em){.pl-c-body--theme-light .pl-c-nav__sublist>.pl-c-nav__item:last-child .pl-c-nav__link{border-bottom-left-radius:6px;border-bottom-right-radius:6px}}.pl-c-body--theme-light .pl-c-viewport-size__input{color:#4d4c4c}.pl-c-body--theme-light .pl-c-viewport-size__input:focus,.pl-c-body--theme-light .pl-c-viewport-size__input:hover{background-color:#ddd}.pl-c-body--theme-light .typeahead{background-color:#ddd!important}.pl-c-body--theme-light .tt-input{background-color:#eee!important;color:#4d4c4c!important}.pl-c-body--theme-light .tt-input:hover{color:#222;background-color:#ddd!important}.pl-c-body--theme-light .tt-input:hover::-webkit-input-placeholder{color:#222}.pl-c-body--theme-light .tt-input:hover::-moz-input-placeholder{color:#222}.pl-c-body--theme-light .pl-c-modal{background-color:#fff;color:#4d4c4c;border-top:1px solid #ccc}.pl-c-body--theme-light .pl-c-modal__close-btn,.pl-c-body--theme-light .pl-c-tools__action{background-color:#fff}.pl-c-body--theme-light .pl-c-modal__close-btn:focus,.pl-c-body--theme-light .pl-c-modal__close-btn:hover,.pl-c-body--theme-light .pl-c-tools__action:focus,.pl-c-body--theme-light .pl-c-tools__action:hover{background-color:#eee;color:#4d4c4c}.pl-c-body--theme-density-cozy .pl-c-header{font-size:.85rem}.pl-c-body--theme-density-cozy .pl-c-viewport-size__input{width:44px}.pl-c-body--theme-density-cozy .pl-c-typeahead{padding:.9rem .8rem}@media all and (max-width:78em){.pl-c-body--theme-density-cozy .pl-c-size-list{display:none}}@media all and (max-width:78em){.pl-c-body--theme-density-cozy .pl-c-viewport-size{display:none}}.pl-c-body--theme-density-cozy .pl-c-tools__toggle{min-width:44px}.pl-c-body--theme-density-cozy .pl-c-viewport{top:3.28rem}.pl-c-body--theme-density-comfortable .pl-c-header{font-size:.85rem}.pl-c-body--theme-density-comfortable .pl-c-logo{max-width:4rem}.pl-c-body--theme-density-comfortable .pl-c-header .tt-suggestion{padding:1.5rem 1rem}.pl-c-body--theme-density-comfortable .pl-c-viewport-size__input{width:44px}.pl-c-body--theme-density-comfortable .pl-c-typeahead{padding:.9rem 1rem}@media all and (max-width:78em){.pl-c-body--theme-density-comfortable .pl-c-size-list{display:none}}@media all and (max-width:78em){.pl-c-body--theme-density-comfortable .pl-c-viewport-size{display:none}}.pl-c-body--theme-density-comfortable .pl-c-tools__toggle{min-width:44px}.pl-c-body--theme-density-comfortable .pl-c-viewport{top:3.8rem}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-header{width:14rem;height:100vh;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;border-bottom:0;padding:1rem;overflow:auto;-webkit-overflow-scrolling:touch;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.pl-c-body--theme-sidebar.pl-c-body--theme-light .pl-c-header{border-right:1px solid #ccc}.pl-c-body--theme-sidebar .pl-c-logo{max-width:7rem;margin:0 auto 1rem}.pl-c-body--theme-sidebar .pl-c-nav{display:block;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.pl-c-body--theme-sidebar .pl-c-nav__list{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.pl-c-body--theme-sidebar .pl-c-nav__sublist{position:relative;border-radius:0}.pl-c-body--theme-sidebar .pl-c-nav__sublist .pl-c-nav__link{padding-left:1rem}.pl-c-body--theme-sidebar .pl-c-nav__sublist--dropdown.pl-is-active{border:0;border-left:1px solid #4d4c4c}.pl-c-body--theme-sidebar.pl-c-body--theme-light .pl-c-nav__sublist--dropdown.pl-is-active{border-left-color:#eee}.pl-c-body--theme-sidebar .pl-c-nav__subsublist{border-left:1px solid #4d4c4c;margin-left:1rem}.pl-c-body--theme-sidebar.pl-c-body--theme-light .pl-c-nav__subsublist{border-left-color:#eee}.pl-c-body--theme-sidebar .pl-c-nav__sublist .pl-c-nav__link{border-left:0;border-right:0}}@media all and (min-width:42em) and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-nav__sublist>.pl-c-nav__item:last-child .pl-c-nav__link{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:0}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-controls{display:block;justify-self:flex-end;margin-left:0}.pl-c-body--theme-sidebar .pl-c-viewport-size{display:none}.pl-c-body--theme-sidebar .pl-c-tools__toggle{display:none}.pl-c-body--theme-sidebar .pl-c-tools__list{max-height:none;overflow:visible;position:relative;border-radius:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%}.pl-c-body--theme-sidebar .pl-c-modal{right:0;width:auto}}.is-vishidden{position:absolute!important;overflow:hidden;width:1px;height:1px;padding:0;border:0;clip:rect(1px,1px,1px,1px)} +.pl-c-body *{-webkit-box-sizing:border-box;box-sizing:border-box}button{font-size:inherit;background-color:transparent}.pl-c-html{min-height:100%}.pl-c-body{margin:0;padding:0;-webkit-text-size-adjust:100%;display:-webkit-box;display:-ms-flexbox;display:flex}pre[class*=language-]{background-image:-webkit-gradient(linear,left top, right top,from(#fff),to(rgba(255,255,255,0))),-webkit-gradient(linear,right top, left top,from(#fff),to(rgba(255,255,255,0))),-webkit-gradient(linear,left top, right top,from(#eaf0f6),to(rgba(238,238,238,0))),-webkit-gradient(linear,right top, left top,from(#eaf0f6),to(rgba(238,238,238,0))),-webkit-gradient(linear,left top, left bottom,from(#fff),to(rgba(255,255,255,0))),-webkit-gradient(linear,left bottom, left top,from(#fff),to(rgba(255,255,255,0))),-webkit-gradient(linear,left top, left bottom,from(#eaf0f6),to(rgba(238,238,238,0))),-webkit-gradient(linear,left bottom, left top,from(#eaf0f6),to(rgba(238,238,238,0)));background-image:-webkit-linear-gradient(left,#fff,rgba(255,255,255,0)),-webkit-linear-gradient(right,#fff,rgba(255,255,255,0)),-webkit-linear-gradient(left,#eaf0f6,rgba(238,238,238,0)),-webkit-linear-gradient(right,#eaf0f6,rgba(238,238,238,0)),-webkit-linear-gradient(top,#fff,rgba(255,255,255,0)),-webkit-linear-gradient(bottom,#fff,rgba(255,255,255,0)),-webkit-linear-gradient(top,#eaf0f6,rgba(238,238,238,0)),-webkit-linear-gradient(bottom,#eaf0f6,rgba(238,238,238,0));background-image:linear-gradient(to right,#fff,rgba(255,255,255,0)),linear-gradient(to left,#fff,rgba(255,255,255,0)),linear-gradient(to right,#eaf0f6,rgba(238,238,238,0)),linear-gradient(to left,#eaf0f6,rgba(238,238,238,0)),linear-gradient(to bottom,#fff,rgba(255,255,255,0)),linear-gradient(to top,#fff,rgba(255,255,255,0)),linear-gradient(to bottom,#eaf0f6,rgba(238,238,238,0)),linear-gradient(to top,#eaf0f6,rgba(238,238,238,0));background-color:#fff;background-attachment:local,local,scroll,scroll,local,local,scroll,scroll;background-position:0 0,100% 0,0 0,100% 0,0 0,0 100%,0 0,0 100%;background-size:4em 100%,4em 100%,1em 100%,1em 100%,100% 4em,100% 4em,100% 1em,100% 1em;background-repeat:no-repeat;-ms-overflow-style:-ms-autohiding-scrollbar;-webkit-overflow-scrolling:touch;overflow:auto}code[class*=language-],pre[class*=language-]{color:#000;text-shadow:0 1px #fff;font-family:Consolas,Monaco,'Andale Mono',monospace;direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;line-height:1.5;word-wrap:normal;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none}code[class*=language-] ::selection,code[class*=language-]::selection,pre[class*=language-] ::selection,pre[class*=language-]::selection{text-shadow:none;background-color:#b3d4fc}@media print{code[class*=language-],pre[class*=language-]{text-shadow:none}}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background-color:#f5f2f0}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#708090}.token.punctuation{color:#999}.namespace{opacity:.7}.token.boolean,.token.constant,.token.deleted,.token.number,.token.property,.token.symbol,.token.tag{color:#905}.token.attr-name,.token.builtin,.token.char,.token.inserted,.token.selector,.token.string{color:#690}.language-css .token.string,.style .token.string,.token.entity,.token.operator,.token.url{color:#a67f59;background-color:rgba(255,255,255,.5)}.token.atrule,.token.attr-value,.token.keyword{color:#07a}.token.function{color:#dd4a68}.token.important,.token.regex,.token.variable{color:#e90}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}pre.line-numbers{position:relative;padding-left:3.8em;counter-reset:linenumber}pre.line-numbers>code{position:relative}.line-numbers .line-numbers-rows{position:absolute;pointer-events:none;top:0;font-size:100%;left:-3.8em;width:3em;letter-spacing:-1px;border-right:1px solid #999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.line-numbers-rows>span{pointer-events:none;display:block;counter-increment:linenumber}.line-numbers-rows>span:before{content:counter(linenumber);color:#999;display:block;padding-right:.8em;text-align:right}.token a{color:inherit}pl-controls{margin-left:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.pl-c-body--theme-sidebar pl-controls{display:block}@media all and (min-width:42em){.pl-c-body--theme-sidebar pl-controls{width:100%}}.pl-c-controls{margin-left:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-controls{display:block}}.pl-c-controls__list{list-style:none;margin:0;padding:0;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}pl-drawer{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:relative;position:-webkit-sticky;position:sticky;top:auto;bottom:0;left:0;right:0;z-index:20;overflow:visible}.pl-c-body--theme-light pl-drawer{background-color:#fff;color:#4d4c4c;border-top:1.1px solid #ccc}.pl-c-drawer{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;background-color:#222;color:#ccc;width:100%;height:100%;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);pointer-events:none;overflow:hidden;max-width:100vw}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-drawer{max-width:calc(100vw - 14rem)}}.pl-c-body--theme-light .pl-c-drawer{background-color:#fff;color:#4d4c4c}.pl-c-drawer.pl-is-active{pointer-events:auto}.pl-c-drawer__wrapper{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.pl-c-drawer__wrapper>*{height:100%}.pl-c-drawer__content{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;overflow:hidden}.pl-c-drawer__toolbar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-negative:0;flex-shrink:0}.pl-c-drawer__content-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;overflow:hidden}@supports (padding:env(safe-area-inset-top)){.pl-c-drawer__content-wrapper{padding-right:calc(env(safe-area-inset-right) - .9rem)}}.pl-c-drawer__toolbar-controls{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-item-align:end;align-self:flex-end;position:relative;z-index:10;-ms-flex-negative:0;flex-shrink:0}.pl-c-drawer__close-btn{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;margin:0;-webkit-appearance:none;-ms-flex-negative:0;flex-shrink:0;z-index:2;opacity:.85;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pl-c-drawer__close-btn:hover{color:#fff;background-color:#222}.pl-c-drawer__close-btn.pl-is-active,.pl-c-drawer__close-btn:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-drawer__close-btn{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-drawer__close-btn:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-drawer__close-btn:active,.pl-c-body--theme-light .pl-c-drawer__close-btn:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-drawer__close-btn{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-drawer__close-btn{font-size:.85rem;padding:1.5rem 1rem}@media all and (max-width:41em){.pl-c-drawer__close-btn{border-radius:20rem;padding-top:.5rem;padding-bottom:.5rem}}.pl-c-drawer__close-btn:focus,.pl-c-drawer__close-btn:hover{opacity:1}.pl-c-drawer__close-btn:active,.pl-c-drawer__close-btn:focus{opacity:1}.pl-c-drawer__cover{width:100%;height:100%;top:0;left:0;display:none;position:fixed;z-index:20;cursor:move}.pl-c-drawer__resizer{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;top:0;left:0;right:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:14px;width:100%;background-color:inherit;z-index:2;cursor:ns-resize}.pl-c-drawer__resizer:after{content:'';height:3px;width:50px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;-webkit-transition:opacity .3s ease-out;transition:opacity .3s ease-out;opacity:.5;background-color:currentColor;border-radius:3px;display:block}.pl-c-drawer__resizer:hover:after{opacity:.8}.pl-c-drawer__resizer:active:after,.pl-c-drawer__resizer:focus:after{opacity:.95}.pl-c-drawer__close-btn-icon{width:12px;height:12px;color:currentColor;fill:currentColor;-webkit-transition:fill .1s ease-out;transition:fill .1s ease-out;-ms-flex-negative:0;flex-shrink:0;-ms-flex-item-align:center;align-self:center}.pl-c-code-copy-btn{display:inline-block;position:absolute;top:.5rem;right:.5rem;padding:.2rem .4rem;background-color:#eee;color:#222;border:1px solid #ddd;border-radius:6px;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;font-size:1rem;text-transform:lowercase;line-height:1;cursor:pointer;z-index:2;-webkit-transition:background-color .1s ease-out;transition:background-color .1s ease-out}.pl-c-code-copy-btn:focus,.pl-c-code-copy-btn:hover{background-color:#ccc}pl-header{position:fixed;position:-webkit-sticky;position:sticky;top:0;left:0;z-index:4;display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;background-color:#000;color:grey}@media all and (min-width:42em){.pl-c-body--theme-sidebar pl-header{width:14rem;height:100vh;overflow:auto;padding:1rem;-webkit-overflow-scrolling:touch;border-bottom:0}}.pl-c-body--theme-light pl-header{border-right:1px solid #ccc;background-color:#fff;border-bottom:1px solid #ccc}.pl-c-header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;width:100%;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;font-size:.7rem;min-height:30px;background-color:inherit}@supports (padding:0px){.pl-c-header{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-header{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}}.pl-c-header__nav-toggle{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;border:0}.pl-c-header__nav-toggle:hover{color:#fff;background-color:#222}.pl-c-header__nav-toggle.pl-is-active,.pl-c-header__nav-toggle:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-header__nav-toggle{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-header__nav-toggle:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-header__nav-toggle:active,.pl-c-body--theme-light .pl-c-header__nav-toggle:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-header__nav-toggle{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-header__nav-toggle{font-size:.85rem;padding:1.5rem 1rem}@media all and (min-width:42em){.pl-c-header__nav-toggle{display:none}}pl-layout{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%;min-height:100vh;max-width:100vw;background-color:#ddd}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){pl-layout{overflow:hidden}}pl-layout .pl-c-layout{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}@media all and (min-width:42em){pl-layout.pl-c-body--theme-sidebar{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}pl-layout.pl-c-body--theme-light{background-color:#fff}pl-nav{background-color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex}.pl-c-nav{overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;background-color:inherit;position:absolute;left:0;top:100%;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;transition:max-height .1s ease-out}.pl-c-nav.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}@media all and (min-width:42em){.pl-c-nav{overflow:visible;max-height:none}}.pl-c-nav.pl-is-active{-webkit-box-shadow:0 1px 1px #000;box-shadow:0 1px 1px #000}.pl-c-body--theme-light .pl-c-nav.pl-is-active{-webkit-box-shadow:0 1px 1px #a6a6a6;box-shadow:0 1px 1px #a6a6a6}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-nav.pl-is-active{-webkit-box-shadow:none;box-shadow:none}}@media all and (min-width:42em){.pl-c-nav.pl-is-active{overflow:visible;max-height:none}}@media all and (min-width:42em){.pl-c-nav{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;position:relative;top:auto;width:auto;-webkit-box-shadow:none;box-shadow:none}}.pl-c-nav__list{z-index:1;margin:0;padding:0;list-style:none;-ms-flex-negative:0;flex-shrink:0;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;max-width:100%;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;background-color:inherit}@media all and (min-width:42em){.pl-c-nav__list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.pl-c-body--theme-sidebar .pl-c-nav__list{display:block}}.pl-c-nav__item{background-color:inherit;-webkit-transform:translateZ(0);transform:translateZ(0);cursor:pointer;position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pl-c-body--theme-sidebar .pl-c-nav__item{display:block}@media all and (min-width:42em){.pl-c-nav__sublist>.pl-c-nav__item:last-child{overflow:hidden;border-bottom-left-radius:6px;border-bottom-right-radius:6px}}.pl-c-nav__link{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0}.pl-c-nav__link:hover{color:#fff;background-color:#222}.pl-c-nav__link.pl-is-active,.pl-c-nav__link:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-nav__link{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-nav__link:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-nav__link:active,.pl-c-body--theme-light .pl-c-nav__link:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-nav__link{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-nav__link{font-size:.85rem;padding:1.5rem 1rem}.pl-c-body--theme-sidebar .pl-c-nav__link{width:100%}.pl-c-nav__link--sublink{text-transform:none;padding-left:.5rem}.pl-c-nav__link--dropdown{-webkit-appearance:none;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.pl-c-nav__link--dropdown:after{content:'\25BC';color:rgba(255,255,255,.25);display:inline-block;font-size:7px;position:relative;top:1px;right:-2px;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-nav__link--dropdown:focus:after,.pl-c-nav__link--dropdown:hover:after{color:grey}.pl-c-nav__link--dropdown.pl-is-active{color:#fff;background-color:#222}.pl-c-nav__link--dropdown.pl-is-active:after{color:grey;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.pl-c-nav__sublist{background-color:inherit;list-style:none;margin:0;padding:0}@media all and (min-width:42em){.pl-c-nav__sublist{position:absolute;top:100%;left:0;min-width:10rem;border-bottom-left-radius:6px;border-bottom-right-radius:6px}}.pl-c-nav__sublist--dropdown,.pl-c-nav__subsublist--dropdown{list-style:none;margin:0;padding:0;overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;visibility:hidden}.pl-c-nav__sublist--dropdown.pl-is-active,.pl-c-nav__subsublist--dropdown.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-nav__sublist--dropdown.pl-is-active,.pl-c-nav__subsublist--dropdown.pl-is-active{margin-left:.5rem;visibility:visible;max-height:none}@media all and (min-width:42em){.pl-c-nav__sublist--dropdown.pl-is-active,.pl-c-nav__subsublist--dropdown.pl-is-active{height:auto;max-height:calc(100vh - 2rem - 1rem)}}.pl-c-body--theme-sidebar .pl-c-nav__sublist--dropdown.pl-is-active,.pl-c-body--theme-sidebar .pl-c-nav__subsublist--dropdown.pl-is-active{max-height:none}@media all and (min-width:42em){.pl-c-nav__sublist--dropdown.pl-is-active{margin-left:0;border-width:1px;border-style:solid;border-color:#000}.pl-c-body--theme-light .pl-c-nav__sublist--dropdown.pl-is-active{border-color:#ccc}}.pl-c-nav__subsublist{list-style:none;margin:0;padding:0}pl-search{background-color:inherit;top:0;z-index:10;-ms-flex-negative:0;flex-shrink:0;padding:.3rem .5rem;display:inline-block}@media screen and (min-width:42em){pl-search{margin-left:1rem;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-negative:1;flex-shrink:1;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.pl-c-body--theme-sidebar pl-search{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-left:0;padding-left:0;padding-right:0;width:100%}}.pl-c-typeahead{width:100%;background-color:inherit;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;z-index:10;text-transform:capitalize;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;color:#fafafa;position:relative}.pl-c-body--theme-light .pl-c-typeahead{color:#222}@media screen and (min-width:42em){.pl-c-typeahead{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.pl-c-body--theme-sidebar .pl-c-typeahead{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}.pl-c-typeahead__hint{top:0;left:0;right:0;width:100%}.pl-c-typeahead__hint,.pl-c-typeahead__input{text-transform:capitalize;background-color:#222;color:#fff;border-color:#090909;text-overflow:ellipsis;border-width:1px;border-style:solid;-webkit-transition:all .1s ease;transition:all .1s ease;max-width:100%;padding:.31rem .5rem;font-size:16px;width:100%;outline-offset:-3px;outline-width:2px;-webkit-appearance:none}@media all and (min-width:900px){.pl-c-typeahead__hint,.pl-c-typeahead__input{font-size:inherit}}.pl-c-typeahead__hint::-ms-clear,.pl-c-typeahead__input::-ms-clear{display:none}.pl-c-body--theme-sidebar .pl-c-typeahead__hint,.pl-c-body--theme-sidebar .pl-c-typeahead__input{border-radius:0}.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__hint,.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__input{padding-right:1.7rem}@media all and (min-width:42em){.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__hint,.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__input{padding-right:1.4rem}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-typeahead__hint,.pl-c-body--theme-sidebar .pl-c-typeahead__input{max-width:none}}.pl-c-body--theme-light .pl-c-typeahead__hint,.pl-c-body--theme-light .pl-c-typeahead__input{background-color:#eee;color:#4d4c4c!important;border-color:#ddd!important}.pl-c-typeahead__hint::-moz-input-placeholder,.pl-c-typeahead__hint::-webkit-input-placeholder,.pl-c-typeahead__input::-moz-input-placeholder,.pl-c-typeahead__input::-webkit-input-placeholder{color:#fff!important;-webkit-transition:all .1s ease;transition:all .1s ease}.pl-c-typeahead__hint:focus,.pl-c-typeahead__hint:hover,.pl-c-typeahead__input:focus,.pl-c-typeahead__input:hover{color:#fff;background-color:#1d1d1d!important}.pl-c-body--theme-light .pl-c-typeahead__hint:focus,.pl-c-body--theme-light .pl-c-typeahead__hint:hover,.pl-c-body--theme-light .pl-c-typeahead__input:focus,.pl-c-body--theme-light .pl-c-typeahead__input:hover{color:#222!important;background-color:#ddd!important;border-color:#ccc!important}.pl-c-typeahead__hint:focus::-moz-input-placeholder,.pl-c-typeahead__hint:focus::-webkit-input-placeholder,.pl-c-typeahead__hint:hover::-moz-input-placeholder,.pl-c-typeahead__hint:hover::-webkit-input-placeholder,.pl-c-typeahead__input:focus::-moz-input-placeholder,.pl-c-typeahead__input:focus::-webkit-input-placeholder,.pl-c-typeahead__input:hover::-moz-input-placeholder,.pl-c-typeahead__input:hover::-webkit-input-placeholder{color:#fff!important}.pl-c-body--theme-light .pl-c-typeahead__hint:focus::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__hint:focus::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__hint:hover::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__hint:hover::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:focus::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:focus::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:hover::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:hover::-webkit-input-placeholder{color:#222!important}.pl-c-typeahead__menu{overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;background-color:#222;text-transform:capitalize;position:absolute;min-width:100%;width:100%;overflow:hidden;top:100%;right:0;max-height:0;display:block!important;-webkit-transition:max-height .3s ease,opacity .3s ease;transition:max-height .3s ease,opacity .3s ease;opacity:0}.pl-c-typeahead__menu.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}@media all and (min-width:42em){.pl-c-typeahead__menu{border-bottom-right-radius:6px;border-bottom-left-radius:6px}}.pl-c-body--theme-light .pl-c-typeahead__menu{background-color:#fafafa}.pl-c-typeahead__menu.pl-is-open{max-height:120rem;max-height:calc(var(--viewport-height) - 4rem);opacity:1}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-typeahead__menu{position:relative!important;border-radius:0}}@media all and (max-width:41em){.pl-c-typeahead__menu{position:relative!important}}.pl-c-typeahead__results{list-style:none;margin:0;padding:0;background-color:inherit;border-color:transparent;border-width:1px;border-style:solid;overflow:hidden;border-color:#151515}@media all and (min-width:42em){.pl-c-typeahead__results{border-bottom-right-radius:6px;border-bottom-left-radius:6px}}.pl-c-typeahead__results:empty{border-width:0;max-height:0}.pl-c-body--theme-light .pl-c-typeahead__results{border-color:#ccc}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-typeahead__results{border-radius:0}}.pl-c-typeahead__result{-webkit-transition:all .3s ease;transition:all .3s ease;background-color:inherit;padding:.8em;cursor:pointer;overflow:hidden}.pl-c-typeahead__result:last-child{border-bottom-right-radius:6px;border-bottom-left-radius:6px}.pl-c-body--theme-sidebar .pl-c-typeahead__result:last-child{border-radius:0}.pl-c-typeahead__result:hover{background-color:rgba(255,255,255,.15)}.pl-c-body--theme-light .pl-c-typeahead__result:hover{background-color:#eee}.pl-c-typeahead__result:active,.pl-c-typeahead__result:focus{background-color:rgba(255,255,255,.18)}.pl-c-body--theme-light .pl-c-typeahead__result:active,.pl-c-body--theme-light .pl-c-typeahead__result:focus{background-color:#ddd}.pl-c-typeahead__result.pl-has-cursor{color:#fff;background-color:rgba(255,255,255,.25)}.pl-c-body--theme-light .pl-c-typeahead__result.pl-has-cursor{color:#000;background-color:#ddd}.pl-c-typeahead__input-wrapper{position:relative}.pl-c-typeahead__clear-button{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;height:1.7rem;width:1.7rem;background-color:transparent;border-radius:20rem;overflow:hidden;position:absolute;right:0;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);z-index:100;cursor:pointer;border:0;-webkit-transition:opacity .1s ease;transition:opacity .1s ease;opacity:0;visibility:hidden}.pl-c-typeahead__clear-button:hover{color:#fff;background-color:#222}.pl-c-typeahead__clear-button.pl-is-active,.pl-c-typeahead__clear-button:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-typeahead__clear-button{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-typeahead__clear-button:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-typeahead__clear-button:active,.pl-c-body--theme-light .pl-c-typeahead__clear-button:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-typeahead__clear-button{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-typeahead__clear-button{font-size:.85rem;padding:1.5rem 1rem}.pl-c-typeahead__clear-button:active,.pl-c-typeahead__clear-button:hover{background-color:transparent}@media all and (min-width:42em){.pl-c-typeahead__clear-button{height:1.4rem;width:1.4rem}}.pl-c-body--theme-light .pl-c-typeahead__clear-button{background-color:transparent}.pl-c-body--theme-light .pl-c-typeahead__clear-button:active,.pl-c-body--theme-light .pl-c-typeahead__clear-button:hover{background-color:transparent}.pl-c-typeahead__clear-button.pl-is-visible{opacity:1;visibility:visible}.pl-c-typeahead__clear-button-icon{fill:currentColor;line-height:0;font-size:0;position:absolute;top:50%;left:50%;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0)}pl-toggle-info{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-item-align:center;align-self:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;z-index:10;width:100%;cursor:pointer}.pl-c-toggle-info,.pl-c-toggle-info__action{width:100%}pl-toggle-layout{display:none;-ms-flex-item-align:center;align-self:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;z-index:10;width:100%;cursor:pointer}@media all and (min-width:42em){pl-toggle-layout{display:-webkit-box;display:-ms-flexbox;display:flex}}.pl-c-toggle-layout,.pl-c-toggle-layout__action{width:100%}pl-toggle-theme{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-item-align:center;align-self:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;z-index:10;width:100%;cursor:pointer}.pl-c-toggle-theme,.pl-c-toggle-theme__action{width:100%}pl-tools-menu{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pl-c-tools{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex}.pl-c-tools__toggle{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;margin:0;padding-top:.6rem;padding-bottom:.5rem;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;min-width:30px}.pl-c-tools__toggle:hover{color:#fff;background-color:#222}.pl-c-tools__toggle.pl-is-active,.pl-c-tools__toggle:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-tools__toggle{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-tools__toggle:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-tools__toggle:active,.pl-c-body--theme-light .pl-c-tools__toggle:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-tools__toggle{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-tools__toggle{font-size:.85rem;padding:1.5rem 1rem}.pl-c-tools__toggle-icon{-webkit-transition:inherit;transition:inherit}.pl-c-tools__list{list-style:none;margin:0;padding:0;overflow:hidden;max-height:0;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;position:absolute;top:100%;right:0;z-index:10;width:10rem;border-bottom-left-radius:6px;border-bottom-right-radius:6px}.pl-c-tools__list.pl-is-active{max-height:calc(100vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(100vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-tools__action{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;margin:0}.pl-c-tools__action:hover{color:#fff;background-color:#222}.pl-c-tools__action.pl-is-active,.pl-c-tools__action:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-tools__action{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-tools__action:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-tools__action:active,.pl-c-body--theme-light .pl-c-tools__action:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-tools__action{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-tools__action{font-size:.85rem;padding:1.5rem 1rem}.pl-c-tools__action-icon{margin-left:auto}pl-iframe{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.pl-c-viewport{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%;position:relative;top:2rem;bottom:0;left:0;right:0;z-index:0;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-transition:height .3s ease;transition:height .3s ease}@supports ((position: -webkit-sticky) or (position: sticky)){.pl-c-viewport{top:0}}.pl-c-body--theme-sidebar .pl-c-viewport{top:0}.pl-c-viewport__cover{width:100%;height:100%;display:none;position:fixed;top:0;left:0;z-index:200;cursor:move;pointer-events:auto}.pl-c-viewport__iframe-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;max-width:100vw;width:100%;position:relative;margin:0 auto;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-overflow-scrolling:touch;width:100%}.pl-c-viewport__iframe-wrapper.hay-mode{-webkit-transition:all 40s linear;transition:all 40s linear}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-viewport__iframe-wrapper{max-width:calc(100vw - 14rem)}}.pl-c-viewport__iframe{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;width:100%;border:0;padding:0;margin:0;top:0;bottom:0;left:0;right:0;background-color:#fff;max-width:100vw}.pl-c-viewport__iframe.is-ready{min-height:0}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-viewport__iframe{max-width:calc(100vw - 14rem)}}.pl-c-viewport__iframe.hay-mode{-webkit-transition:all 40s linear;transition:all 40s linear}.pl-c-viewport__resizer{position:absolute;right:0;top:0;bottom:0;width:14px;margin:0;height:100%;cursor:ew-resize}.pl-c-viewport__resizer-handle{margin:0;width:100%;height:100%;background-color:#ccc;-webkit-transition:background-color .1s ease-out;transition:background-color .1s ease-out}.pl-c-viewport__resizer-handle:hover{background-color:grey}.pl-c-viewport__resizer-handle:active{cursor:move;background-color:#4d4c4c}.vp-animate{-webkit-transition:width .8s ease-out;transition:width .8s ease-out}.pl-c-viewport-modal-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;max-width:100vw;position:relative}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-viewport-modal-wrapper{max-width:calc(100vw - 14rem)}}@media all and (min-width:42em) and (-ms-high-contrast:none),all and (min-width:42em) and (-ms-high-contrast:active){.pl-c-body--theme-sidebar .pl-c-viewport-modal-wrapper{margin-left:14rem}}.pl-c-viewport-size{margin:0;border:0;padding:.3rem .5rem .4rem;line-height:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.pl-c-viewport-size__input{padding:.1rem;margin:0;border:0;border-radius:3px;background-color:transparent;font-size:inherit;color:grey;width:35px;text-align:right;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-viewport-size__input::-moz-focus-inner{padding:0;border:0}.pl-c-viewport-size__input:hover{color:#fff;background-color:#222}.pl-c-viewport-size__input:active,.pl-c-viewport-size__input:focus{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-viewport-size__label{display:block;margin:0;padding:0}.pl-c-size-list{display:none;list-style:none;margin:0;padding:0;overflow-x:auto;padding:0 .25rem}@media all and (min-width:42em){.pl-c-size-list{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-overflow-scrolling:touch}}@media all and (min-width:53em){.pl-c-size-list{display:block;display:-webkit-box;display:-ms-flexbox;display:flex}}.pl-c-size-list__action{background-color:#000;color:grey;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;outline-offset:-3px;outline-width:2px}.pl-c-size-list__action:hover{color:#fff;background-color:#222}.pl-c-size-list__action.pl-is-active,.pl-c-size-list__action:active{color:#fff;background-color:#222;outline:1px dotted grey;outline-offset:-1px}.pl-c-body--theme-light .pl-c-size-list__action{background-color:#fff;color:#4d4c4c}.pl-c-body--theme-light .pl-c-size-list__action:hover{background-color:#eee}.pl-c-body--theme-light .pl-c-size-list__action:active,.pl-c-body--theme-light .pl-c-size-list__action:focus{background-color:#ddd}.pl-c-body--theme-density-cozy .pl-c-size-list__action{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-size-list__action{font-size:.85rem;padding:1.5rem 1rem}.pl-c-size-list__item:first-child{margin-left:auto}.pl-c-size-list__item:last-child{margin-right:auto}.pl-has-annotation{cursor:help!important;outline:1px dotted grey;outline-offset:-4px;-webkit-transition:-webkit-box-shadow .1s ease;transition:-webkit-box-shadow .1s ease;transition:box-shadow .1s ease;transition:box-shadow .1s ease, -webkit-box-shadow .1s ease}.pl-has-annotation a,.pl-has-annotation input{cursor:help!important}.pl-has-annotation:hover{-webkit-box-shadow:0 0 3px grey;box-shadow:0 0 3px grey}.pl-has-annotation.active{-webkit-box-shadow:inset 0 0 6px #4d4c4c;box-shadow:inset 0 0 6px #4d4c4c;outline:1px dotted grey;outline-offset:-1px}.pl-c-annotation-tip{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:24px!important;height:24px!important;margin-top:6px!important;margin-left:6px!important;border-radius:50%!important;background-color:#222!important;color:#fff!important;font-size:16px!important;position:absolute;z-index:100}.pl-c-annotations{margin:1rem 0}.pl-c-annotations__title{font-size:1.2rem!important;margin:0 0 .5rem}.pl-c-annotations .pl-c-annotations__list{counter-reset:the-count;padding:0;margin:0;list-style:none}.pl-c-annotations__item{position:relative;padding-left:1.5rem;margin-bottom:1rem;border-radius:6px;-webkit-transition:background-color .1s ease;transition:background-color .1s ease}.pl-c-annotations__item:before{content:counter(the-count);counter-increment:the-count;font-size:85%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:14px;height:14px;border-radius:50%;padding:2px;text-align:center;background-color:grey;color:#fff;position:absolute;top:4px;left:0}.pl-c-annotations__item.pl-is-active{outline:1px dotted grey;outline-offset:-1px}.pl-c-annotations .pl-c-annotations__item-title{margin-bottom:0}.pl-c-breadcrumb{list-style:none;margin:0;padding:0;margin-bottom:.5rem;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:.7rem;color:grey;text-transform:capitalize}.pl-c-breadcrumb__item:after{content:'\25B6';opacity:.4;font-size:6px;display:inline-block;margin:0 .2rem;position:relative;top:-1px}.pl-c-logo{max-width:2rem;margin:0 1rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.pl-c-logo:focus{outline:1px dotted grey;outline-offset:-1px}.pl-c-logo__img{display:block;max-width:100%;height:auto}.pl-c-category{margin-top:6rem;font:HelveticaNeue,Helvetica,Arial,sans-serif!important}.pl-c-category:first-of-type{margin-top:2rem}.pl-c-category__title{font-size:1.4rem!important;color:#222!important;margin:0 0 .2rem;text-transform:capitalize}.pl-c-category__title-link{-webkit-transition:color .1s ease-out;transition:color .1s ease-out}.pl-c-category__description{font-size:.85rem;line-height:1.5;max-width:30rem}.pl-c-category__description:empty{display:none}.pl-c-pattern-info{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-flow:row wrap;flex-flow:row wrap;width:100%;overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-pattern .pl-c-pattern-info{overflow:scroll;-ms-overflow-style:-ms-autohiding-scrollbar;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-overflow-scrolling:touch}.pl-c-pattern .pl-c-pattern-info::-webkit-scrollbar{width:0!important}@media all and (min-width:53em){.pl-c-pattern .pl-c-pattern-info{max-height:none;overflow:visible}}.pl-c-pattern-info__panel{-ms-flex-preferred-size:40%;flex-basis:40%;padding-top:1rem;padding-right:1rem;padding-bottom:0;padding-left:1rem;margin-bottom:1rem;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;max-width:100%;max-height:30rem;min-width:300px;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:auto;-webkit-overflow-scrolling:touch}.pl-c-pattern-info__header{margin-bottom:.5rem}.pl-c-pattern-info__title{font-size:1.4rem!important;font-weight:400;margin-top:0;margin-bottom:0;color:inherit;text-transform:capitalize;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.pl-c-pattern-info__description{border-bottom-color:grey}.pl-c-annotations{border-top-color:grey}.pl-c-lineage{font-size:.85rem;line-height:1.7;margin-top:0}.pl-c-lineage__link{font-style:italic;color:grey;text-decoration:underline;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:opacity .1s ease;transition:opacity .1s ease}.pl-c-lineage__link:focus,.pl-c-lineage__link:hover{opacity:.8}.pl-c-pattern-state{display:inline-block;width:5px;height:5px;margin-left:10px;position:relative;top:5px;left:0;border-radius:50%;background-color:#02a4d5;line-height:4px;text-indent:10px}.pl-c-pattern-state--complete{background-color:#03790f}.pl-c-pattern-state--inreview{background-color:#c7a118}.pl-c-pattern-state--deprecated{background-color:#b00b02}.complete:before{color:#03790f!important}.pl-c-pattern{margin-bottom:2rem;position:relative;clear:both}.pl-c-pattern__header{position:relative;padding:.5rem 0 0;line-height:1.3;font-size:90%;color:grey}.pl-c-pattern__header:empty{padding:0}.pl-c-pattern__title{font-family:HelveticaNeue,Helvetica,Arial,sans-serif!important;font-size:.85rem!important;line-height:1!important;font-weight:400!important;margin:0!important;padding:0!important;text-transform:capitalize!important}.pl-c-pattern__title-link{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;padding:1rem 0 .3rem;color:grey!important;text-decoration:none;cursor:pointer}.pl-c-pattern__title-link:focus,.pl-c-pattern__title-link:hover{color:#000!important}.pl-c-pattern__extra-toggle{font-size:9px;position:absolute;bottom:-1px;right:0;z-index:1;padding:.65em .65em .5em;line-height:1;color:grey;background-color:transparent;font-weight:400;border:1px solid #ddd;border-top-left-radius:6px;border-top-right-radius:6px;-webkit-transition:background-color .1s ease-out;transition:background-color .1s ease-out}.pl-c-pattern__extra-toggle .pl-c-pattern__toggle-icon{display:inline-block}.pl-c-pattern__extra-toggle.pl-is-active,.pl-c-pattern__extra-toggle:focus,.pl-c-pattern__extra-toggle:hover{background-color:#fafafa;color:#000}.pl-c-pattern__extra-toggle:focus{outline:1px dotted #4d4c4c}.pl-c-pattern__extra-toggle.pl-is-active{border-bottom-color:#fafafa}.pl-c-pattern__extra-toggle.pl-is-active .pl-c-pattern__toggle-icon{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.pl-c-pattern__extra{background-color:#fafafa;border-top:1px solid #ddd;margin-bottom:1rem;overflow:hidden;max-height:1px;position:relative;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-pattern__extra.pl-is-active{border:1px solid #ddd;border-radius:6px;border-top-right-radius:0;max-height:150rem}.pl-c-tabs{padding:0 .5rem .5rem;background-color:#fff;border:1px solid #ddd;border-radius:6px;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:hidden;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.pl-c-tabs__list{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;list-style:none;margin:0;padding:.5rem 0;padding-bottom:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.1)}.pl-c-tabs__link{display:block;line-height:1;border-bottom:4px solid transparent;color:grey;background-color:#fff;cursor:pointer;text-decoration:none;text-transform:uppercase;-webkit-transition:all .1s ease-out;transition:all .1s ease-out;padding:8px;font-size:13px}.pl-c-tabs__link:hover{color:#222}.pl-c-tabs__link.pl-is-active-tab{color:#222;border-bottom-color:#bf6500}.pl-c-tabs__content{overflow:auto;-webkit-overflow-scrolling:touch;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.pl-c-tabs__panel{display:none}.pl-c-tabs__panel.pl-is-active-tab{display:-webkit-box;display:-ms-flexbox;display:flex;height:100%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.pl-c-tabs__panel :not(pre)>code[class*=language-],.pl-c-tabs__panel pre[class*=language-]{background-color:transparent;margin:0;padding-top:1rem;padding-right:.5rem;padding-bottom:.5rem;padding-left:.5rem;border:0;display:block;width:100%}.pl-c-tabs__panel code[class*=language-]{background-color:transparent;margin:0}.pl-c-text-passage{font-size:.85rem;line-height:1.7}.pl-c-text-passage p{margin-top:0;margin-bottom:1rem}.pl-c-text-passage a{color:grey;text-decoration:underline;-webkit-transition:opacity .1s ease;transition:opacity .1s ease}.pl-c-text-passage a:focus,.pl-c-text-passage a:hover{opacity:.8}.pl-c-text-passage code[class*=language-],.pl-c-text-passage pre[class*=language-]{color:inherit}.pl-c-text-passage blockquote{padding-left:.8rem;border-left:3px solid inherit}.pl-c-text-passage hr{height:1px;background-color:grey;margin:2rem 0;border:0}.pl-c-text-passage h1{margin-bottom:1rem;font-weight:400}.pl-c-text-passage h2{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h3{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h4{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h5{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h6{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage ul{list-style:square;margin-left:.9rem;margin-bottom:1rem}.pl-c-text-passage ul li:last-child{margin-bottom:0}.pl-c-text-passage ol{list-style:decimal;margin-left:.9rem;margin-bottom:1rem}.pl-c-text-passage ol li:last-child{margin-bottom:0}.pl-c-text-passage li{margin-bottom:.5rem}@media all and (max-width:41em){.pl-c-body--theme-light .pl-c-tools__list.pl-is-active{border-bottom:1px solid #ccc;border-left:1px solid #ccc}}.pl-c-body--theme-light:not(.pl-c-body--theme-sidebar) .pl-c-tools__list.pl-is-active{border-bottom:1px solid #ccc;border-left:1px solid #ccc}.pl-c-body--theme-light .pl-c-nav__link--dropdown{color:#4d4c4c;background-color:#fff}.pl-c-body--theme-light .pl-c-nav__link--dropdown:after{color:#ccc}@media all and (min-width:42em){.pl-c-body--theme-light .pl-c-nav__sublist>.pl-c-nav__item:last-child .pl-c-nav__link{border-bottom-left-radius:6px;border-bottom-right-radius:6px}}.pl-c-body--theme-light .pl-c-viewport-size__input{color:#4d4c4c}.pl-c-body--theme-light .pl-c-viewport-size__input:focus,.pl-c-body--theme-light .pl-c-viewport-size__input:hover{background-color:#ddd}.pl-c-body--theme-light .typeahead{background-color:#ddd!important}.pl-c-body--theme-light .tt-input{background-color:#eee!important;color:#4d4c4c!important}.pl-c-body--theme-light .tt-input:hover{color:#222;background-color:#ddd!important}.pl-c-body--theme-light .tt-input:hover::-webkit-input-placeholder{color:#222}.pl-c-body--theme-light .tt-input:hover::-moz-input-placeholder{color:#222}.pl-c-body--theme-light .pl-c-drawer__close-btn,.pl-c-body--theme-light .pl-c-tools__action{background-color:#fff}.pl-c-body--theme-light .pl-c-drawer__close-btn:focus,.pl-c-body--theme-light .pl-c-drawer__close-btn:hover,.pl-c-body--theme-light .pl-c-tools__action:focus,.pl-c-body--theme-light .pl-c-tools__action:hover{background-color:#eee;color:#4d4c4c}.pl-c-body--theme-density-cozy .pl-c-header{font-size:.85rem}.pl-c-body--theme-density-cozy .pl-c-viewport-size__input{width:44px}.pl-c-body--theme-density-cozy .pl-c-typeahead{padding:.9rem .8rem}@media all and (max-width:78em){.pl-c-body--theme-density-cozy .pl-c-size-list{display:none}}@media all and (max-width:78em){.pl-c-body--theme-density-cozy .pl-c-viewport-size{display:none}}.pl-c-body--theme-density-cozy .pl-c-tools__toggle{min-width:44px}.pl-c-body--theme-density-cozy .pl-c-viewport{top:3.28rem}.pl-c-body--theme-density-comfortable .pl-c-header{font-size:.85rem}.pl-c-body--theme-density-comfortable .pl-c-logo{max-width:4rem}.pl-c-body--theme-density-comfortable .pl-c-header .tt-suggestion{padding:1.5rem 1rem}.pl-c-body--theme-density-comfortable .pl-c-viewport-size__input{width:44px}.pl-c-body--theme-density-comfortable .pl-c-typeahead{padding:.9rem 1rem}@media all and (max-width:78em){.pl-c-body--theme-density-comfortable .pl-c-size-list{display:none}}@media all and (max-width:78em){.pl-c-body--theme-density-comfortable .pl-c-viewport-size{display:none}}.pl-c-body--theme-density-comfortable .pl-c-tools__toggle{min-width:44px}.pl-c-body--theme-density-comfortable .pl-c-viewport{top:3.8rem}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-logo{max-width:7rem;margin:0 auto 1rem}.pl-c-body--theme-sidebar .pl-c-nav{display:block;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.pl-c-body--theme-sidebar .pl-c-nav__list{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.pl-c-body--theme-sidebar .pl-c-nav__sublist{position:relative;border-radius:0}.pl-c-body--theme-sidebar .pl-c-nav__sublist .pl-c-nav__link{padding-left:1rem}.pl-c-body--theme-sidebar .pl-c-nav__sublist--dropdown.pl-is-active{border:0;border-left:1px solid #4d4c4c}.pl-c-body--theme-sidebar.pl-c-body--theme-light .pl-c-nav__sublist--dropdown.pl-is-active{border-left-color:#eee}.pl-c-body--theme-sidebar .pl-c-nav__subsublist{border-left:1px solid #4d4c4c;margin-left:1rem}.pl-c-body--theme-sidebar.pl-c-body--theme-light .pl-c-nav__subsublist{border-left-color:#eee}.pl-c-body--theme-sidebar .pl-c-nav__sublist .pl-c-nav__link{border-left:0;border-right:0}}@media all and (min-width:42em) and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-nav__sublist>.pl-c-nav__item:last-child .pl-c-nav__link{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:0}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-controls{display:block;justify-self:flex-end;margin-left:0}.pl-c-body--theme-sidebar .pl-c-viewport-size{display:none}.pl-c-body--theme-sidebar .pl-c-tools__toggle{display:none}.pl-c-body--theme-sidebar .pl-c-tools__list{max-height:none;overflow:visible;position:relative;border-radius:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%}.pl-c-body--theme-sidebar .pl-c-drawer{right:0;width:auto}}.is-vishidden{position:absolute!important;overflow:hidden;width:1px;height:1px;padding:0;border:0;clip:rect(1px,1px,1px,1px)} diff --git a/packages/uikit-workshop/dist/styleguide/js/0-chunk-d792df13253aa9b6508b.js b/packages/uikit-workshop/dist/styleguide/js/0-chunk-d792df13253aa9b6508b.js deleted file mode 100644 index 5a15f29a1..000000000 --- a/packages/uikit-workshop/dist/styleguide/js/0-chunk-d792df13253aa9b6508b.js +++ /dev/null @@ -1,15 +0,0 @@ -(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[0],{ - -/***/ "./node_modules/@webcomponents/shadydom/src/shadydom.js": -/*!***************************************************************************!*\ - !*** ./node_modules/@webcomponents/shadydom/src/shadydom.js + 16 modules ***! - \***************************************************************************/ -/*! no exports provided */ -/***/ (function(module, __webpack_exports__, __webpack_require__) { - -"use strict"; -eval("var native_methods_namespaceObject = {};\n__webpack_require__.r(native_methods_namespaceObject);\n__webpack_require__.d(native_methods_namespaceObject, \"appendChild\", function() { return native_methods_appendChild; });\n__webpack_require__.d(native_methods_namespaceObject, \"insertBefore\", function() { return native_methods_insertBefore; });\n__webpack_require__.d(native_methods_namespaceObject, \"replaceChild\", function() { return native_methods_replaceChild; });\n__webpack_require__.d(native_methods_namespaceObject, \"removeChild\", function() { return native_methods_removeChild; });\n__webpack_require__.d(native_methods_namespaceObject, \"setAttribute\", function() { return native_methods_setAttribute; });\n__webpack_require__.d(native_methods_namespaceObject, \"removeAttribute\", function() { return native_methods_removeAttribute; });\n__webpack_require__.d(native_methods_namespaceObject, \"cloneNode\", function() { return native_methods_cloneNode; });\n__webpack_require__.d(native_methods_namespaceObject, \"importNode\", function() { return native_methods_importNode; });\n__webpack_require__.d(native_methods_namespaceObject, \"addEventListener\", function() { return addEventListener; });\n__webpack_require__.d(native_methods_namespaceObject, \"removeEventListener\", function() { return removeEventListener; });\n__webpack_require__.d(native_methods_namespaceObject, \"windowAddEventListener\", function() { return windowAddEventListener; });\n__webpack_require__.d(native_methods_namespaceObject, \"windowRemoveEventListener\", function() { return windowRemoveEventListener; });\n__webpack_require__.d(native_methods_namespaceObject, \"dispatchEvent\", function() { return native_methods_dispatchEvent; });\n__webpack_require__.d(native_methods_namespaceObject, \"contains\", function() { return native_methods_contains; });\n__webpack_require__.d(native_methods_namespaceObject, \"getElementById\", function() { return native_methods_getElementById; });\n__webpack_require__.d(native_methods_namespaceObject, \"elementQuerySelector\", function() { return elementQuerySelector; });\n__webpack_require__.d(native_methods_namespaceObject, \"fragmentQuerySelector\", function() { return fragmentQuerySelector; });\n__webpack_require__.d(native_methods_namespaceObject, \"documentQuerySelector\", function() { return documentQuerySelector; });\n__webpack_require__.d(native_methods_namespaceObject, \"querySelector\", function() { return native_methods_querySelector; });\n__webpack_require__.d(native_methods_namespaceObject, \"elementQuerySelectorAll\", function() { return elementQuerySelectorAll; });\n__webpack_require__.d(native_methods_namespaceObject, \"fragmentQuerySelectorAll\", function() { return fragmentQuerySelectorAll; });\n__webpack_require__.d(native_methods_namespaceObject, \"documentQuerySelectorAll\", function() { return documentQuerySelectorAll; });\n__webpack_require__.d(native_methods_namespaceObject, \"querySelectorAll\", function() { return native_methods_querySelectorAll; });\nvar native_tree_walker_namespaceObject = {};\n__webpack_require__.r(native_tree_walker_namespaceObject);\n__webpack_require__.d(native_tree_walker_namespaceObject, \"parentNode\", function() { return parentNode; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"firstChild\", function() { return native_tree_walker_firstChild; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"lastChild\", function() { return lastChild; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"previousSibling\", function() { return previousSibling; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"nextSibling\", function() { return nextSibling; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"childNodes\", function() { return native_tree_walker_childNodes; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"parentElement\", function() { return parentElement; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"firstElementChild\", function() { return firstElementChild; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"lastElementChild\", function() { return lastElementChild; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"previousElementSibling\", function() { return previousElementSibling; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"nextElementSibling\", function() { return nextElementSibling; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"children\", function() { return native_tree_walker_children; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"innerHTML\", function() { return innerHTML; });\n__webpack_require__.d(native_tree_walker_namespaceObject, \"textContent\", function() { return textContent; });\nvar native_tree_accessors_namespaceObject = {};\n__webpack_require__.r(native_tree_accessors_namespaceObject);\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"nodeAccessors\", function() { return nodeAccessors; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"fragmentAccessors\", function() { return fragmentAccessors; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"documentAccessors\", function() { return documentAccessors; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"parentNode\", function() { return native_tree_accessors_parentNode; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"firstChild\", function() { return native_tree_accessors_firstChild; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"lastChild\", function() { return native_tree_accessors_lastChild; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"previousSibling\", function() { return native_tree_accessors_previousSibling; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"nextSibling\", function() { return native_tree_accessors_nextSibling; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"childNodes\", function() { return native_tree_accessors_childNodes; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"parentElement\", function() { return native_tree_accessors_parentElement; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"previousElementSibling\", function() { return native_tree_accessors_previousElementSibling; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"nextElementSibling\", function() { return native_tree_accessors_nextElementSibling; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"innerHTML\", function() { return native_tree_accessors_innerHTML; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"textContent\", function() { return native_tree_accessors_textContent; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"children\", function() { return native_tree_accessors_children; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"firstElementChild\", function() { return native_tree_accessors_firstElementChild; });\n__webpack_require__.d(native_tree_accessors_namespaceObject, \"lastElementChild\", function() { return native_tree_accessors_lastElementChild; });\n\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/shady-data.js\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\nvar ShadyData =\n/*#__PURE__*/\nfunction () {\n function ShadyData() {\n _classCallCheck(this, ShadyData);\n\n /** @type {ShadowRoot} */\n this.root = null;\n /** @type {ShadowRoot} */\n\n this.publicRoot = null;\n this.dirty = false;\n this.observer = null;\n /** @type {Array} */\n\n this.assignedNodes = null;\n /** @type {Element} */\n\n this.assignedSlot = null;\n /** @type {Array} */\n\n this._previouslyAssignedNodes = null;\n /** @type {Element} */\n\n this._prevAssignedSlot = null;\n /** @type {Array} */\n\n this.flattenedNodes = null;\n this.ownerShadyRoot = undefined;\n /** @type {Node|undefined} */\n\n this.parentNode = undefined;\n /** @type {Node|undefined} */\n\n this.firstChild = undefined;\n /** @type {Node|undefined} */\n\n this.lastChild = undefined;\n /** @type {Node|undefined} */\n\n this.previousSibling = undefined;\n /** @type {Node|undefined} */\n\n this.nextSibling = undefined;\n /** @type {Array|undefined} */\n\n this.childNodes = undefined;\n this.__outsideAccessors = false;\n this.__insideAccessors = false;\n this.__onCallbackListeners = {};\n }\n\n _createClass(ShadyData, [{\n key: \"toJSON\",\n value: function toJSON() {\n return {};\n }\n }]);\n\n return ShadyData;\n}();\nfunction ensureShadyDataForNode(node) {\n if (!node.__shady) {\n node.__shady = new ShadyData();\n }\n\n return node.__shady;\n}\nfunction shadyDataForNode(node) {\n return node && node.__shady;\n}\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/utils.js\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n\nvar settings = window['ShadyDOM'] || {};\nsettings.hasNativeShadowDOM = Boolean(Element.prototype.attachShadow && Node.prototype.getRootNode);\nvar desc = Object.getOwnPropertyDescriptor(Node.prototype, 'firstChild');\nsettings.hasDescriptors = Boolean(desc && desc.configurable && desc.get);\nsettings.inUse = settings['force'] || !settings.hasNativeShadowDOM; // Default to using native accessors (instead of treewalker) only for\n// IE/Edge where they are faster.\n\nvar IS_IE = navigator.userAgent.match('Trident');\nvar IS_EDGE = navigator.userAgent.match('Edge');\n\nif (settings.useNativeAccessors === undefined) {\n settings.useNativeAccessors = settings.hasDescriptors && (IS_IE || IS_EDGE);\n}\n\nfunction isTrackingLogicalChildNodes(node) {\n var nodeData = shadyDataForNode(node);\n return nodeData && nodeData.firstChild !== undefined;\n}\nfunction utils_isShadyRoot(obj) {\n return Boolean(obj._localName === 'ShadyRoot');\n}\nfunction ownerShadyRootForNode(node) {\n var root = node.getRootNode();\n\n if (utils_isShadyRoot(root)) {\n return root;\n }\n}\nvar utils_p = Element.prototype;\nvar matches = utils_p.matches || utils_p.matchesSelector || utils_p.mozMatchesSelector || utils_p.msMatchesSelector || utils_p.oMatchesSelector || utils_p.webkitMatchesSelector;\nfunction matchesSelector(element, selector) {\n return matches.call(element, selector);\n}\n\nfunction copyOwnProperty(name, source, target) {\n var pd = Object.getOwnPropertyDescriptor(source, name);\n\n if (pd) {\n Object.defineProperty(target, name, pd);\n }\n}\n\nfunction extend(target, source) {\n if (target && source) {\n var n$ = Object.getOwnPropertyNames(source);\n\n for (var i = 0, n; i < n$.length && (n = n$[i]); i++) {\n copyOwnProperty(n, source, target);\n }\n }\n\n return target || source;\n}\nfunction extendAll(target) {\n for (var i = 0; i < (arguments.length <= 1 ? 0 : arguments.length - 1); i++) {\n extend(target, i + 1 < 1 || arguments.length <= i + 1 ? undefined : arguments[i + 1]);\n }\n\n return target;\n}\nfunction mixin(target, source) {\n for (var i in source) {\n target[i] = source[i];\n }\n\n return target;\n}\nfunction patchPrototype(obj, mixin) {\n var proto = Object.getPrototypeOf(obj);\n\n if (!proto.hasOwnProperty('__patchProto')) {\n var patchProto = Object.create(proto);\n patchProto.__sourceProto = proto;\n extend(patchProto, mixin);\n proto['__patchProto'] = patchProto;\n } // old browsers don't have setPrototypeOf\n\n\n obj.__proto__ = proto['__patchProto'];\n}\nvar twiddle = document.createTextNode('');\nvar utils_content = 0;\nvar queue = [];\nnew MutationObserver(function () {\n while (queue.length) {\n // catch errors in user code...\n try {\n queue.shift()();\n } catch (e) {\n // enqueue another record and throw\n twiddle.textContent = utils_content++;\n throw e;\n }\n }\n}).observe(twiddle, {\n characterData: true\n}); // use MutationObserver to get microtask async timing.\n\nfunction microtask(callback) {\n queue.push(callback);\n twiddle.textContent = utils_content++;\n}\nvar hasDocumentContains = Boolean(document.contains);\nfunction utils_contains(container, node) {\n while (node) {\n if (node == container) {\n return true;\n }\n\n node = node.parentNode;\n }\n\n return false;\n}\n\nfunction getNodeHTMLCollectionName(node) {\n return node.getAttribute('id') || node.getAttribute('name');\n}\n\nfunction isValidHTMLCollectionName(name) {\n return name !== 'length' && isNaN(name);\n}\n\nfunction createPolyfilledHTMLCollection(nodes) {\n // Note: loop in reverse so that the first named item matches the named property\n for (var l = nodes.length - 1; l >= 0; l--) {\n var node = nodes[l];\n var name = getNodeHTMLCollectionName(node);\n\n if (name && isValidHTMLCollectionName(name)) {\n nodes[name] = node;\n }\n }\n\n nodes.item = function (index) {\n return nodes[index];\n };\n\n nodes.namedItem = function (name) {\n if (isValidHTMLCollectionName(name) && nodes[name]) {\n return nodes[name];\n }\n\n var _iteratorNormalCompletion = true;\n var _didIteratorError = false;\n var _iteratorError = undefined;\n\n try {\n for (var _iterator = nodes[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {\n var _node = _step.value;\n var nodeName = getNodeHTMLCollectionName(_node);\n\n if (nodeName == name) {\n return _node;\n }\n }\n } catch (err) {\n _didIteratorError = true;\n _iteratorError = err;\n } finally {\n try {\n if (!_iteratorNormalCompletion && _iterator.return != null) {\n _iterator.return();\n }\n } finally {\n if (_didIteratorError) {\n throw _iteratorError;\n }\n }\n }\n\n return null;\n };\n\n return nodes;\n}\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/flush.js\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n // render enqueuer/flusher\n\nvar flushList = [];\nvar scheduled;\nfunction enqueue(callback) {\n if (!scheduled) {\n scheduled = true;\n microtask(flush);\n }\n\n flushList.push(callback);\n}\nfunction flush() {\n scheduled = false;\n var didFlush = Boolean(flushList.length);\n\n while (flushList.length) {\n flushList.shift()();\n }\n\n return didFlush;\n}\nflush['list'] = flushList;\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/observe-changes.js\nfunction observe_changes_classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction observe_changes_defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction observe_changes_createClass(Constructor, protoProps, staticProps) { if (protoProps) observe_changes_defineProperties(Constructor.prototype, protoProps); if (staticProps) observe_changes_defineProperties(Constructor, staticProps); return Constructor; }\n\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n\n\n\nvar observe_changes_AsyncObserver =\n/*#__PURE__*/\nfunction () {\n function AsyncObserver() {\n observe_changes_classCallCheck(this, AsyncObserver);\n\n this._scheduled = false;\n this.addedNodes = [];\n this.removedNodes = [];\n this.callbacks = new Set();\n }\n\n observe_changes_createClass(AsyncObserver, [{\n key: \"schedule\",\n value: function schedule() {\n var _this = this;\n\n if (!this._scheduled) {\n this._scheduled = true;\n microtask(function () {\n _this.flush();\n });\n }\n }\n }, {\n key: \"flush\",\n value: function flush() {\n if (this._scheduled) {\n this._scheduled = false;\n var mutations = this.takeRecords();\n\n if (mutations.length) {\n this.callbacks.forEach(function (cb) {\n cb(mutations);\n });\n }\n }\n }\n }, {\n key: \"takeRecords\",\n value: function takeRecords() {\n if (this.addedNodes.length || this.removedNodes.length) {\n var mutations = [{\n addedNodes: this.addedNodes,\n removedNodes: this.removedNodes\n }];\n this.addedNodes = [];\n this.removedNodes = [];\n return mutations;\n }\n\n return [];\n }\n }]);\n\n return AsyncObserver;\n}(); // TODO(sorvell): consider instead polyfilling MutationObserver\n// directly so that users do not have to fork their code.\n// Supporting the entire api may be challenging: e.g. filtering out\n// removed nodes in the wrong scope and seeing non-distributing\n// subtree child mutations.\n\n\nvar observe_changes_observeChildren = function observeChildren(node, callback) {\n var sd = ensureShadyDataForNode(node);\n\n if (!sd.observer) {\n sd.observer = new observe_changes_AsyncObserver();\n }\n\n sd.observer.callbacks.add(callback);\n var observer = sd.observer;\n return {\n _callback: callback,\n _observer: observer,\n _node: node,\n takeRecords: function takeRecords() {\n return observer.takeRecords();\n }\n };\n};\nvar observe_changes_unobserveChildren = function unobserveChildren(handle) {\n var observer = handle && handle._observer;\n\n if (observer) {\n observer.callbacks.delete(handle._callback);\n\n if (!observer.callbacks.size) {\n ensureShadyDataForNode(handle._node).observer = null;\n }\n }\n};\nfunction filterMutations(mutations, target) {\n /** @const {Node} */\n var targetRootNode = target.getRootNode();\n return mutations.map(function (mutation) {\n /** @const {boolean} */\n var mutationInScope = targetRootNode === mutation.target.getRootNode();\n\n if (mutationInScope && mutation.addedNodes) {\n var nodes = Array.from(mutation.addedNodes).filter(function (n) {\n return targetRootNode === n.getRootNode();\n });\n\n if (nodes.length) {\n mutation = Object.create(mutation);\n Object.defineProperty(mutation, 'addedNodes', {\n value: nodes,\n configurable: true\n });\n return mutation;\n }\n } else if (mutationInScope) {\n return mutation;\n }\n }).filter(function (m) {\n return m;\n });\n}\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/native-methods.js\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\nvar native_methods_appendChild = Element.prototype.appendChild;\nvar native_methods_insertBefore = Element.prototype.insertBefore;\nvar native_methods_replaceChild = Element.prototype.replaceChild;\nvar native_methods_removeChild = Element.prototype.removeChild;\nvar native_methods_setAttribute = Element.prototype.setAttribute;\nvar native_methods_removeAttribute = Element.prototype.removeAttribute;\nvar native_methods_cloneNode = Element.prototype.cloneNode;\nvar native_methods_importNode = Document.prototype.importNode;\nvar addEventListener = Element.prototype.addEventListener;\nvar removeEventListener = Element.prototype.removeEventListener;\nvar windowAddEventListener = Window.prototype.addEventListener;\nvar windowRemoveEventListener = Window.prototype.removeEventListener;\nvar native_methods_dispatchEvent = Element.prototype.dispatchEvent;\nvar native_methods_contains = Node.prototype.contains || HTMLElement.prototype.contains;\nvar native_methods_getElementById = Document.prototype.getElementById;\nvar elementQuerySelector = Element.prototype.querySelector;\nvar fragmentQuerySelector = DocumentFragment.prototype.querySelector;\nvar documentQuerySelector = Document.prototype.querySelector;\nvar native_methods_querySelector =\n/** @this {Element|Document|DocumentFragment} */\nfunction querySelector(selector) {\n switch (this.nodeType) {\n case Node.ELEMENT_NODE:\n return elementQuerySelector.call(\n /** @type {Element} */\n this, selector);\n\n case Node.DOCUMENT_NODE:\n return documentQuerySelector.call(\n /** @type {Document} */\n this, selector);\n\n default:\n return fragmentQuerySelector.call(this, selector);\n }\n};\nvar elementQuerySelectorAll = Element.prototype.querySelectorAll;\nvar fragmentQuerySelectorAll = DocumentFragment.prototype.querySelectorAll;\nvar documentQuerySelectorAll = Document.prototype.querySelectorAll;\nvar native_methods_querySelectorAll =\n/** @this {Element|Document|DocumentFragment} */\nfunction querySelectorAll(selector) {\n switch (this.nodeType) {\n case Node.ELEMENT_NODE:\n return elementQuerySelectorAll.call(\n /** @type {Element} */\n this, selector);\n\n case Node.DOCUMENT_NODE:\n return documentQuerySelectorAll.call(\n /** @type {Document} */\n this, selector);\n\n default:\n return fragmentQuerySelectorAll.call(this, selector);\n }\n};\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/innerHTML.js\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n// Cribbed from ShadowDOM polyfill\n// https://github.com/webcomponents/webcomponentsjs/blob/master/src/ShadowDOM/wrappers/HTMLElement.js#L28\n/////////////////////////////////////////////////////////////////////////////\n// innerHTML and outerHTML\n// http://www.whatwg.org/specs/web-apps/current-work/multipage/the-end.html#escapingString\nvar escapeAttrRegExp = /[&\\u00A0\"]/g;\nvar escapeDataRegExp = /[&\\u00A0<>]/g;\n\nfunction escapeReplace(c) {\n switch (c) {\n case '&':\n return '&';\n\n case '<':\n return '<';\n\n case '>':\n return '>';\n\n case '\"':\n return '"';\n\n case \"\\xA0\":\n return ' ';\n }\n}\n\nfunction escapeAttr(s) {\n return s.replace(escapeAttrRegExp, escapeReplace);\n}\n\nfunction escapeData(s) {\n return s.replace(escapeDataRegExp, escapeReplace);\n}\n\nfunction makeSet(arr) {\n var set = {};\n\n for (var i = 0; i < arr.length; i++) {\n set[arr[i]] = true;\n }\n\n return set;\n} // http://www.whatwg.org/specs/web-apps/current-work/#void-elements\n\n\nvar voidElements = makeSet(['area', 'base', 'br', 'col', 'command', 'embed', 'hr', 'img', 'input', 'keygen', 'link', 'meta', 'param', 'source', 'track', 'wbr']);\nvar plaintextParents = makeSet(['style', 'script', 'xmp', 'iframe', 'noembed', 'noframes', 'plaintext', 'noscript']);\n/**\n * @param {Node} node\n * @param {Node} parentNode\n * @param {Function=} callback\n */\n\nfunction getOuterHTML(node, parentNode, callback) {\n switch (node.nodeType) {\n case Node.ELEMENT_NODE:\n {\n var tagName = node.localName;\n var s = '<' + tagName;\n var attrs = node.attributes;\n\n for (var i = 0, attr; attr = attrs[i]; i++) {\n s += ' ' + attr.name + '=\"' + escapeAttr(attr.value) + '\"';\n }\n\n s += '>';\n\n if (voidElements[tagName]) {\n return s;\n }\n\n return s + getInnerHTML(node, callback) + '';\n }\n\n case Node.TEXT_NODE:\n {\n var data =\n /** @type {Text} */\n node.data;\n\n if (parentNode && plaintextParents[parentNode.localName]) {\n return data;\n }\n\n return escapeData(data);\n }\n\n case Node.COMMENT_NODE:\n {\n return '';\n }\n\n default:\n {\n window.console.error(node);\n throw new Error('not implemented');\n }\n }\n}\n/**\n * @param {Node} node\n * @param {Function=} callback\n */\n\nfunction getInnerHTML(node, callback) {\n if (node.localName === 'template') {\n node =\n /** @type {HTMLTemplateElement} */\n node.content;\n }\n\n var s = '';\n var c$ = callback ? callback(node) : node.childNodes;\n\n for (var i = 0, l = c$.length, child; i < l && (child = c$[i]); i++) {\n s += getOuterHTML(child, node, callback);\n }\n\n return s;\n}\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/native-tree-walker.js\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n\n\nvar nodeWalker = document.createTreeWalker(document, NodeFilter.SHOW_ALL, null, false);\nvar elementWalker = document.createTreeWalker(document, NodeFilter.SHOW_ELEMENT, null, false);\nfunction parentNode(node) {\n nodeWalker.currentNode = node;\n return nodeWalker.parentNode();\n}\nfunction native_tree_walker_firstChild(node) {\n nodeWalker.currentNode = node;\n return nodeWalker.firstChild();\n}\nfunction lastChild(node) {\n nodeWalker.currentNode = node;\n return nodeWalker.lastChild();\n}\nfunction previousSibling(node) {\n nodeWalker.currentNode = node;\n return nodeWalker.previousSibling();\n}\nfunction nextSibling(node) {\n nodeWalker.currentNode = node;\n return nodeWalker.nextSibling();\n}\nfunction native_tree_walker_childNodes(node) {\n var nodes = [];\n nodeWalker.currentNode = node;\n var n = nodeWalker.firstChild();\n\n while (n) {\n nodes.push(n);\n n = nodeWalker.nextSibling();\n }\n\n return nodes;\n}\nfunction parentElement(node) {\n elementWalker.currentNode = node;\n return elementWalker.parentNode();\n}\nfunction firstElementChild(node) {\n elementWalker.currentNode = node;\n return elementWalker.firstChild();\n}\nfunction lastElementChild(node) {\n elementWalker.currentNode = node;\n return elementWalker.lastChild();\n}\nfunction previousElementSibling(node) {\n elementWalker.currentNode = node;\n return elementWalker.previousSibling();\n}\nfunction nextElementSibling(node) {\n elementWalker.currentNode = node;\n return elementWalker.nextSibling();\n}\nfunction native_tree_walker_children(node) {\n var nodes = [];\n elementWalker.currentNode = node;\n var n = elementWalker.firstChild();\n\n while (n) {\n nodes.push(n);\n n = elementWalker.nextSibling();\n }\n\n return createPolyfilledHTMLCollection(nodes);\n}\nfunction innerHTML(node) {\n return getInnerHTML(node, function (n) {\n return native_tree_walker_childNodes(n);\n });\n}\nfunction textContent(node) {\n /* eslint-disable no-case-declarations */\n switch (node.nodeType) {\n case Node.ELEMENT_NODE:\n case Node.DOCUMENT_FRAGMENT_NODE:\n var textWalker = document.createTreeWalker(node, NodeFilter.SHOW_TEXT, null, false);\n var content = '',\n n;\n\n while (n = textWalker.nextNode()) {\n // TODO(sorvell): can't use textContent since we patch it on Node.prototype!\n // However, should probably patch it only on element.\n content += n.nodeValue;\n }\n\n return content;\n\n default:\n return node.nodeValue;\n }\n /* eslint-enable */\n\n}\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/native-tree-accessors.js\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n\nvar hasDescriptors = settings.hasDescriptors; // Find descriptor on the \"lowest\" native prototype. Safe as these are not\n// overridden and we call these on nodes.\n\nvar nativeProtos = [Node.prototype, Element.prototype, HTMLElement.prototype]; // note, avoid Array.find for IE11 compat.\n\nfunction findNativeProtoWithDescriptor(name) {\n for (var i = 0; i < nativeProtos.length; i++) {\n var proto = nativeProtos[i];\n\n if (proto.hasOwnProperty(name)) {\n return proto;\n }\n }\n}\n\nfunction findNodeDescriptor(name) {\n var proto = findNativeProtoWithDescriptor(name);\n\n if (!proto) {\n throw Error(\"Could not find descriptor for \".concat(name));\n }\n\n return Object.getOwnPropertyDescriptor(proto, name);\n}\n\nvar nodeAccessors = hasDescriptors ? {\n parentNode: findNodeDescriptor('parentNode'),\n firstChild: findNodeDescriptor('firstChild'),\n lastChild: findNodeDescriptor('lastChild'),\n previousSibling: findNodeDescriptor('previousSibling'),\n nextSibling: findNodeDescriptor('nextSibling'),\n childNodes: findNodeDescriptor('childNodes'),\n parentElement: findNodeDescriptor('parentElement'),\n previousElementSibling: findNodeDescriptor('previousElementSibling'),\n nextElementSibling: findNodeDescriptor('nextElementSibling'),\n innerHTML: findNodeDescriptor('innerHTML'),\n textContent: findNodeDescriptor('textContent'),\n firstElementChild: findNodeDescriptor('firstElementChild'),\n lastElementChild: findNodeDescriptor('lastElementChild'),\n children: findNodeDescriptor('children')\n} : {};\nvar fragmentAccessors = hasDescriptors ? {\n firstElementChild: Object.getOwnPropertyDescriptor(DocumentFragment.prototype, 'firstElementChild'),\n lastElementChild: Object.getOwnPropertyDescriptor(DocumentFragment.prototype, 'lastElementChild'),\n children: Object.getOwnPropertyDescriptor(DocumentFragment.prototype, 'children')\n} : {};\nvar documentAccessors = hasDescriptors ? {\n firstElementChild: Object.getOwnPropertyDescriptor(Document.prototype, 'firstElementChild'),\n lastElementChild: Object.getOwnPropertyDescriptor(Document.prototype, 'lastElementChild'),\n children: Object.getOwnPropertyDescriptor(Document.prototype, 'children')\n} : {};\nfunction native_tree_accessors_parentNode(node) {\n return nodeAccessors.parentNode.get.call(node);\n}\nfunction native_tree_accessors_firstChild(node) {\n return nodeAccessors.firstChild.get.call(node);\n}\nfunction native_tree_accessors_lastChild(node) {\n return nodeAccessors.lastChild.get.call(node);\n}\nfunction native_tree_accessors_previousSibling(node) {\n return nodeAccessors.previousSibling.get.call(node);\n}\nfunction native_tree_accessors_nextSibling(node) {\n return nodeAccessors.nextSibling.get.call(node);\n}\nfunction native_tree_accessors_childNodes(node) {\n return Array.prototype.slice.call(nodeAccessors.childNodes.get.call(node));\n}\nfunction native_tree_accessors_parentElement(node) {\n return nodeAccessors.parentElement.get.call(node);\n}\nfunction native_tree_accessors_previousElementSibling(node) {\n return nodeAccessors.previousElementSibling.get.call(node);\n}\nfunction native_tree_accessors_nextElementSibling(node) {\n return nodeAccessors.nextElementSibling.get.call(node);\n}\nfunction native_tree_accessors_innerHTML(node) {\n return nodeAccessors.innerHTML.get.call(node);\n}\nfunction native_tree_accessors_textContent(node) {\n return nodeAccessors.textContent.get.call(node);\n}\nfunction native_tree_accessors_children(node) {\n switch (node.nodeType) {\n case Node.DOCUMENT_FRAGMENT_NODE:\n return fragmentAccessors.children.get.call(node);\n\n case Node.DOCUMENT_NODE:\n return documentAccessors.children.get.call(node);\n\n default:\n return nodeAccessors.children.get.call(node);\n }\n}\nfunction native_tree_accessors_firstElementChild(node) {\n switch (node.nodeType) {\n case Node.DOCUMENT_FRAGMENT_NODE:\n return fragmentAccessors.firstElementChild.get.call(node);\n\n case Node.DOCUMENT_NODE:\n return documentAccessors.firstElementChild.get.call(node);\n\n default:\n return nodeAccessors.firstElementChild.get.call(node);\n }\n}\nfunction native_tree_accessors_lastElementChild(node) {\n switch (node.nodeType) {\n case Node.DOCUMENT_FRAGMENT_NODE:\n return fragmentAccessors.lastElementChild.get.call(node);\n\n case Node.DOCUMENT_NODE:\n return documentAccessors.lastElementChild.get.call(node);\n\n default:\n return nodeAccessors.lastElementChild.get.call(node);\n }\n}\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/native-tree.js\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n\n\n\nvar accessors = settings.useNativeAccessors ? native_tree_accessors_namespaceObject : native_tree_walker_namespaceObject;\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/patch-accessors.js\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n\n\n\n\n\n\n\nfunction clearNode(node) {\n while (node.firstChild) {\n node.removeChild(node.firstChild);\n }\n}\n\nvar patch_accessors_hasDescriptors = settings.hasDescriptors;\nvar inertDoc = document.implementation.createHTMLDocument('inert');\nvar nativeIsConnectedAccessors =\n/** @type {ObjectPropertyDescriptor} */\nObject.getOwnPropertyDescriptor(Node.prototype, 'isConnected');\nvar nativeIsConnected = nativeIsConnectedAccessors && nativeIsConnectedAccessors.get;\nvar nativeActiveElementDescriptor =\n/** @type {ObjectPropertyDescriptor} */\nObject.getOwnPropertyDescriptor(Document.prototype, 'activeElement');\n\nfunction getDocumentActiveElement() {\n if (nativeActiveElementDescriptor && nativeActiveElementDescriptor.get) {\n return nativeActiveElementDescriptor.get.call(document);\n } else if (!settings.hasDescriptors) {\n return document.activeElement;\n }\n}\n\nfunction activeElementForNode(node) {\n var active = getDocumentActiveElement(); // In IE11, activeElement might be an empty object if the document is\n // contained in an iframe.\n // https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/10998788/\n\n if (!active || !active.nodeType) {\n return null;\n }\n\n var isShadyRoot = !!utils_isShadyRoot(node);\n\n if (node !== document) {\n // If this node isn't a document or shady root, then it doesn't have\n // an active element.\n if (!isShadyRoot) {\n return null;\n } // If this shady root's host is the active element or the active\n // element is not a descendant of the host (in the composed tree),\n // then it doesn't have an active element.\n\n\n if (node.host === active || !native_methods_contains.call(node.host, active)) {\n return null;\n }\n } // This node is either the document or a shady root of which the active\n // element is a (composed) descendant of its host; iterate upwards to\n // find the active element's most shallow host within it.\n\n\n var activeRoot = ownerShadyRootForNode(active);\n\n while (activeRoot && activeRoot !== node) {\n active = activeRoot.host;\n activeRoot = ownerShadyRootForNode(active);\n }\n\n if (node === document) {\n // This node is the document, so activeRoot should be null.\n return activeRoot ? null : active;\n } else {\n // This node is a non-document shady root, and it should be\n // activeRoot.\n return activeRoot === node ? active : null;\n }\n}\n\nvar OutsideAccessors = {\n parentElement: {\n /** @this {Node} */\n get: function get() {\n var nodeData = shadyDataForNode(this);\n var l = nodeData && nodeData.parentNode;\n\n if (l && l.nodeType !== Node.ELEMENT_NODE) {\n l = null;\n }\n\n return l !== undefined ? l : accessors.parentElement(this);\n },\n configurable: true\n },\n parentNode: {\n /** @this {Node} */\n get: function get() {\n var nodeData = shadyDataForNode(this);\n var l = nodeData && nodeData.parentNode;\n return l !== undefined ? l : accessors.parentNode(this);\n },\n configurable: true\n },\n nextSibling: {\n /** @this {Node} */\n get: function get() {\n var nodeData = shadyDataForNode(this);\n var l = nodeData && nodeData.nextSibling;\n return l !== undefined ? l : accessors.nextSibling(this);\n },\n configurable: true\n },\n previousSibling: {\n /** @this {Node} */\n get: function get() {\n var nodeData = shadyDataForNode(this);\n var l = nodeData && nodeData.previousSibling;\n return l !== undefined ? l : accessors.previousSibling(this);\n },\n configurable: true\n },\n // fragment, element, document\n nextElementSibling: {\n /**\n * @this {HTMLElement}\n */\n get: function get() {\n var nodeData = shadyDataForNode(this);\n\n if (nodeData && nodeData.nextSibling !== undefined) {\n var n = this.nextSibling;\n\n while (n && n.nodeType !== Node.ELEMENT_NODE) {\n n = n.nextSibling;\n }\n\n return n;\n } else {\n return accessors.nextElementSibling(this);\n }\n },\n configurable: true\n },\n previousElementSibling: {\n /**\n * @this {HTMLElement}\n */\n get: function get() {\n var nodeData = shadyDataForNode(this);\n\n if (nodeData && nodeData.previousSibling !== undefined) {\n var n = this.previousSibling;\n\n while (n && n.nodeType !== Node.ELEMENT_NODE) {\n n = n.previousSibling;\n }\n\n return n;\n } else {\n return accessors.previousElementSibling(this);\n }\n },\n configurable: true\n }\n};\nvar ClassNameAccessor = {\n className: {\n /**\n * @this {HTMLElement}\n */\n get: function get() {\n return this.getAttribute('class') || '';\n },\n\n /**\n * @this {HTMLElement}\n */\n set: function set(value) {\n this.setAttribute('class', value);\n },\n configurable: true\n }\n};\nvar IsConnectedAccessor = {\n isConnected: {\n /**\n * @this {Node}\n */\n get: function get() {\n if (nativeIsConnected && nativeIsConnected.call(this)) {\n return true;\n }\n\n if (this.nodeType == Node.DOCUMENT_FRAGMENT_NODE) {\n return false;\n } // Fast path for distributed nodes.\n\n\n var ownerDocument = this.ownerDocument;\n\n if (hasDocumentContains) {\n if (native_methods_contains.call(ownerDocument, this)) {\n return true;\n }\n } else if (ownerDocument.documentElement && native_methods_contains.call(ownerDocument.documentElement, this)) {\n return true;\n } // Slow path for non-distributed nodes.\n\n\n var node = this;\n\n while (node && !(node instanceof Document)) {\n node = node.parentNode || (utils_isShadyRoot(node) ?\n /** @type {ShadowRoot} */\n node.host : undefined);\n }\n\n return !!(node && node instanceof Document);\n },\n configurable: true\n }\n};\nvar InsideAccessors = {\n childNodes: {\n /**\n * @this {HTMLElement}\n */\n get: function get() {\n var childNodes;\n\n if (isTrackingLogicalChildNodes(this)) {\n var nodeData = shadyDataForNode(this);\n\n if (!nodeData.childNodes) {\n nodeData.childNodes = [];\n\n for (var n = this.firstChild; n; n = n.nextSibling) {\n nodeData.childNodes.push(n);\n }\n }\n\n childNodes = nodeData.childNodes;\n } else {\n childNodes = accessors.childNodes(this);\n }\n\n childNodes.item = function (index) {\n return childNodes[index];\n };\n\n return childNodes;\n },\n configurable: true\n },\n childElementCount: {\n /** @this {HTMLElement} */\n get: function get() {\n return this.children.length;\n },\n configurable: true\n },\n firstChild: {\n /** @this {HTMLElement} */\n get: function get() {\n var nodeData = shadyDataForNode(this);\n var l = nodeData && nodeData.firstChild;\n return l !== undefined ? l : accessors.firstChild(this);\n },\n configurable: true\n },\n lastChild: {\n /** @this {HTMLElement} */\n get: function get() {\n var nodeData = shadyDataForNode(this);\n var l = nodeData && nodeData.lastChild;\n return l !== undefined ? l : accessors.lastChild(this);\n },\n configurable: true\n },\n textContent: {\n /**\n * @this {HTMLElement}\n */\n get: function get() {\n if (isTrackingLogicalChildNodes(this)) {\n var tc = [];\n\n for (var i = 0, cn = this.childNodes, c; c = cn[i]; i++) {\n if (c.nodeType !== Node.COMMENT_NODE) {\n tc.push(c.textContent);\n }\n }\n\n return tc.join('');\n } else {\n return accessors.textContent(this);\n }\n },\n\n /**\n * @this {HTMLElement}\n * @param {string} text\n */\n set: function set(text) {\n if (typeof text === 'undefined' || text === null) {\n text = '';\n }\n\n switch (this.nodeType) {\n case Node.ELEMENT_NODE:\n case Node.DOCUMENT_FRAGMENT_NODE:\n if (!isTrackingLogicalChildNodes(this) && patch_accessors_hasDescriptors) {\n // may be removing a nested slot but fast path if we know we are not.\n var firstChild = this.firstChild;\n\n if (firstChild != this.lastChild || firstChild && firstChild.nodeType != Node.TEXT_NODE) {\n clearNode(this);\n }\n\n nodeAccessors.textContent.set.call(this, text);\n } else {\n clearNode(this); // Document fragments must have no childnodes if setting a blank string\n\n if (text.length > 0 || this.nodeType === Node.ELEMENT_NODE) {\n this.appendChild(document.createTextNode(text));\n }\n }\n\n break;\n\n default:\n // TODO(sorvell): can't do this if patch nodeValue.\n this.nodeValue = text;\n break;\n }\n },\n configurable: true\n },\n // fragment, element, document\n firstElementChild: {\n /**\n * @this {HTMLElement}\n */\n get: function get() {\n var nodeData = shadyDataForNode(this);\n\n if (nodeData && nodeData.firstChild !== undefined) {\n var n = this.firstChild;\n\n while (n && n.nodeType !== Node.ELEMENT_NODE) {\n n = n.nextSibling;\n }\n\n return n;\n } else {\n return accessors.firstElementChild(this);\n }\n },\n configurable: true\n },\n lastElementChild: {\n /**\n * @this {HTMLElement}\n */\n get: function get() {\n var nodeData = shadyDataForNode(this);\n\n if (nodeData && nodeData.lastChild !== undefined) {\n var n = this.lastChild;\n\n while (n && n.nodeType !== Node.ELEMENT_NODE) {\n n = n.previousSibling;\n }\n\n return n;\n } else {\n return accessors.lastElementChild(this);\n }\n },\n configurable: true\n },\n children: {\n /**\n * @this {HTMLElement}\n */\n get: function get() {\n if (!isTrackingLogicalChildNodes(this)) {\n return accessors.children(this);\n }\n\n return createPolyfilledHTMLCollection(Array.prototype.filter.call(this.childNodes, function (n) {\n return n.nodeType === Node.ELEMENT_NODE;\n }));\n },\n configurable: true\n },\n // element (HTMLElement on IE11)\n innerHTML: {\n /**\n * @this {HTMLElement}\n */\n get: function get() {\n if (isTrackingLogicalChildNodes(this)) {\n var content = this.localName === 'template' ?\n /** @type {HTMLTemplateElement} */\n this.content : this;\n return getInnerHTML(content);\n } else {\n return accessors.innerHTML(this);\n }\n },\n\n /**\n * @this {HTMLElement}\n */\n set: function set(text) {\n var content = this.localName === 'template' ?\n /** @type {HTMLTemplateElement} */\n this.content : this;\n clearNode(content);\n var containerName = this.localName || 'div';\n var htmlContainer;\n\n if (!this.namespaceURI || this.namespaceURI === inertDoc.namespaceURI) {\n htmlContainer = inertDoc.createElement(containerName);\n } else {\n htmlContainer = inertDoc.createElementNS(this.namespaceURI, containerName);\n }\n\n if (patch_accessors_hasDescriptors) {\n nodeAccessors.innerHTML.set.call(htmlContainer, text);\n } else {\n htmlContainer.innerHTML = text;\n }\n\n var newContent = this.localName === 'template' ?\n /** @type {HTMLTemplateElement} */\n htmlContainer.content : htmlContainer;\n\n while (newContent.firstChild) {\n content.appendChild(newContent.firstChild);\n }\n },\n configurable: true\n }\n}; // Note: Can be patched on element prototype on all browsers.\n// Must be patched on instance on browsers that support native Shadow DOM\n// but do not have builtin accessors (old Chrome).\n\nvar ShadowRootAccessor = {\n shadowRoot: {\n /**\n * @this {HTMLElement}\n */\n get: function get() {\n var nodeData = shadyDataForNode(this);\n return nodeData && nodeData.publicRoot || null;\n },\n configurable: true\n }\n}; // Note: Can be patched on document prototype on browsers with builtin accessors.\n// Must be patched separately on simulated ShadowRoot.\n// Must be patched as `_activeElement` on browsers without builtin accessors.\n\nvar ActiveElementAccessor = {\n activeElement: {\n /**\n * @this {HTMLElement}\n */\n get: function get() {\n return activeElementForNode(this);\n },\n\n /**\n * @this {HTMLElement}\n */\n set: function set() {},\n configurable: true\n }\n}; // patch a group of descriptors on an object only if it exists or if the `force`\n// argument is true.\n\n/**\n * @param {!Object} obj\n * @param {!Object} descriptors\n * @param {boolean=} force\n */\n\nfunction patchAccessorGroup(obj, descriptors, force) {\n for (var p in descriptors) {\n var objDesc = Object.getOwnPropertyDescriptor(obj, p);\n\n if (objDesc && objDesc.configurable || !objDesc && force) {\n Object.defineProperty(obj, p, descriptors[p]);\n } else if (force) {\n console.warn('Could not define', p, 'on', obj); // eslint-disable-line no-console\n }\n }\n} // patch dom accessors on proto where they exist\n\n\nfunction patchAccessors(proto) {\n patchAccessorGroup(proto, OutsideAccessors);\n patchAccessorGroup(proto, ClassNameAccessor);\n patchAccessorGroup(proto, InsideAccessors);\n patchAccessorGroup(proto, ActiveElementAccessor);\n}\nfunction patchShadowRootAccessors(proto) {\n proto.__proto__ = DocumentFragment.prototype; // ensure element descriptors (IE/Edge don't have em)\n\n patchAccessorGroup(proto, OutsideAccessors, true);\n patchAccessorGroup(proto, InsideAccessors, true);\n patchAccessorGroup(proto, ActiveElementAccessor, true); // Ensure native properties are all safely wrapped since ShadowRoot is not an\n // actual DocumentFragment instance.\n\n Object.defineProperties(proto, {\n nodeType: {\n value: Node.DOCUMENT_FRAGMENT_NODE,\n configurable: true\n },\n nodeName: {\n value: '#document-fragment',\n configurable: true\n },\n nodeValue: {\n value: null,\n configurable: true\n }\n }); // make undefined\n\n ['localName', 'namespaceURI', 'prefix'].forEach(function (prop) {\n Object.defineProperty(proto, prop, {\n value: undefined,\n configurable: true\n });\n }); // defer properties to host\n\n ['ownerDocument', 'baseURI', 'isConnected'].forEach(function (prop) {\n Object.defineProperty(proto, prop, {\n get: function get() {\n return this.host[prop];\n },\n configurable: true\n });\n });\n} // ensure an element has patched \"outside\" accessors; no-op when not needed\n\nvar patchOutsideElementAccessors = settings.hasDescriptors ? function () {} : function (element) {\n var sd = ensureShadyDataForNode(element);\n\n if (!sd.__outsideAccessors) {\n sd.__outsideAccessors = true;\n patchAccessorGroup(element, OutsideAccessors, true);\n patchAccessorGroup(element, ClassNameAccessor, true);\n }\n}; // ensure an element has patched \"inside\" accessors; no-op when not needed\n\nvar patchInsideElementAccessors = settings.hasDescriptors ? function () {} : function (element) {\n var sd = ensureShadyDataForNode(element);\n\n if (!sd.__insideAccessors) {\n patchAccessorGroup(element, InsideAccessors, true);\n patchAccessorGroup(element, ShadowRootAccessor, true);\n }\n};\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/logical-tree.js\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n\n\n\nvar logical_tree_childNodes = accessors.childNodes;\nfunction recordInsertBefore(node, container, ref_node) {\n patchInsideElementAccessors(container);\n var containerData = ensureShadyDataForNode(container);\n\n if (containerData.firstChild !== undefined) {\n containerData.childNodes = null;\n } // handle document fragments\n\n\n if (node.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {\n var c$ = node.childNodes;\n\n for (var i = 0; i < c$.length; i++) {\n linkNode(c$[i], container, ref_node);\n } // cleanup logical dom in doc fragment.\n\n\n var nodeData = ensureShadyDataForNode(node);\n var resetTo = nodeData.firstChild !== undefined ? null : undefined;\n nodeData.firstChild = nodeData.lastChild = resetTo;\n nodeData.childNodes = resetTo;\n } else {\n linkNode(node, container, ref_node);\n }\n}\n\nfunction linkNode(node, container, ref_node) {\n patchOutsideElementAccessors(node);\n ref_node = ref_node || null;\n var nodeData = ensureShadyDataForNode(node);\n var containerData = ensureShadyDataForNode(container);\n var ref_nodeData = ref_node ? ensureShadyDataForNode(ref_node) : null; // update ref_node.previousSibling <-> node\n\n nodeData.previousSibling = ref_node ? ref_nodeData.previousSibling : container.lastChild;\n var psd = shadyDataForNode(nodeData.previousSibling);\n\n if (psd) {\n psd.nextSibling = node;\n } // update node <-> ref_node\n\n\n var nsd = shadyDataForNode(nodeData.nextSibling = ref_node);\n\n if (nsd) {\n nsd.previousSibling = node;\n } // update node <-> container\n\n\n nodeData.parentNode = container;\n\n if (ref_node) {\n if (ref_node === containerData.firstChild) {\n containerData.firstChild = node;\n }\n } else {\n containerData.lastChild = node;\n\n if (!containerData.firstChild) {\n containerData.firstChild = node;\n }\n } // remove caching of childNodes\n\n\n containerData.childNodes = null;\n}\n\nfunction recordRemoveChild(node, container) {\n var nodeData = ensureShadyDataForNode(node);\n var containerData = ensureShadyDataForNode(container);\n\n if (node === containerData.firstChild) {\n containerData.firstChild = nodeData.nextSibling;\n }\n\n if (node === containerData.lastChild) {\n containerData.lastChild = nodeData.previousSibling;\n }\n\n var p = nodeData.previousSibling;\n var n = nodeData.nextSibling;\n\n if (p) {\n ensureShadyDataForNode(p).nextSibling = n;\n }\n\n if (n) {\n ensureShadyDataForNode(n).previousSibling = p;\n } // When an element is removed, logical data is no longer tracked.\n // Explicitly set `undefined` here to indicate this. This is disginguished\n // from `null` which is set if info is null.\n\n\n nodeData.parentNode = nodeData.previousSibling = nodeData.nextSibling = undefined;\n\n if (containerData.childNodes !== undefined) {\n // remove caching of childNodes\n containerData.childNodes = null;\n }\n}\n/**\n * @param {!Node} node\n * @param {Array=} nodes\n */\n\nfunction recordChildNodes(node, nodes) {\n var nodeData = ensureShadyDataForNode(node);\n\n if (nodeData.firstChild === undefined) {\n // remove caching of childNodes\n nodeData.childNodes = null;\n var c$ = nodes || logical_tree_childNodes(node);\n nodeData.firstChild = c$[0] || null;\n nodeData.lastChild = c$[c$.length - 1] || null;\n patchInsideElementAccessors(node);\n\n for (var i = 0; i < c$.length; i++) {\n var n = c$[i];\n var sd = ensureShadyDataForNode(n);\n sd.parentNode = node;\n sd.nextSibling = c$[i + 1] || null;\n sd.previousSibling = c$[i - 1] || null;\n patchOutsideElementAccessors(n);\n }\n }\n}\n\n\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/logical-mutation.js\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n\n\n\n\n\nvar logical_mutation_parentNode = accessors.parentNode; // Patched `insertBefore`. Note that all mutations that add nodes are routed\n// here. When a is added or a node is added to a host with a shadowRoot\n// with a slot, a standard dom `insert` call is aborted and `_asyncRender`\n// is called on the relevant shadowRoot. In all other cases, a standard dom\n// `insert` can be made, but the location and ref_node may need to be changed.\n\n/**\n * @param {!Node} parent\n * @param {Node} node\n * @param {Node=} ref_node\n */\n\nfunction logical_mutation_insertBefore(parent, node, ref_node) {\n if (node === parent) {\n throw Error(\"Failed to execute 'appendChild' on 'Node': The new child element contains the parent.\");\n }\n\n if (ref_node) {\n var refData = shadyDataForNode(ref_node);\n var p = refData && refData.parentNode;\n\n if (p !== undefined && p !== parent || p === undefined && logical_mutation_parentNode(ref_node) !== parent) {\n throw Error(\"Failed to execute 'insertBefore' on 'Node': The node \" + \"before which the new node is to be inserted is not a child of this node.\");\n }\n }\n\n if (ref_node === node) {\n return node;\n }\n /** @type {!Array} */\n\n\n var slotsAdded = [];\n /** @type {function(!Node, string): void} */\n\n var scopingFn = addShadyScoping;\n var ownerRoot = ownerShadyRootForNode(parent);\n /** @type {string} */\n\n var newScopeName = ownerRoot ? ownerRoot.host.localName : ''; // remove from existing location\n\n if (node.parentNode) {\n // NOTE: avoid node.removeChild as this *can* trigger another patched\n // method (e.g. custom elements) and we want only the shady method to run.\n // The following table describes what style scoping actions should happen as a result of this insertion.\n // document -> shadowRoot: replace\n // shadowRoot -> shadowRoot: replace\n // shadowRoot -> shadowRoot of same type: do nothing\n // shadowRoot -> document: allow unscoping\n // document -> document: do nothing\n // The \"same type of shadowRoot\" and \"document to document cases rely on `currentScopeIsCorrect` returning true\n var oldScopeName = currentScopeForNode(node);\n logical_mutation_removeChild(node.parentNode, node, Boolean(ownerRoot) || !(node.getRootNode() instanceof ShadowRoot));\n\n scopingFn = function scopingFn(node, newScopeName) {\n replaceShadyScoping(node, newScopeName, oldScopeName);\n };\n } // add to new parent\n\n\n var allowNativeInsert = true;\n var needsScoping = !currentScopeIsCorrect(node, newScopeName);\n\n if (ownerRoot && (!node['__noInsertionPoint'] || needsScoping)) {\n treeVisitor(node, function (node) {\n if (node.localName === 'slot') {\n slotsAdded.push(\n /** @type {!HTMLSlotElement} */\n node);\n }\n\n if (needsScoping) {\n scopingFn(node, newScopeName);\n }\n });\n }\n\n if (slotsAdded.length) {\n ownerRoot._addSlots(slotsAdded);\n } // if a slot is added, must render containing root.\n\n\n if (parent.localName === 'slot' || slotsAdded.length) {\n if (ownerRoot) {\n ownerRoot._asyncRender();\n }\n }\n\n if (isTrackingLogicalChildNodes(parent)) {\n recordInsertBefore(node, parent, ref_node); // when inserting into a host with a shadowRoot with slot, use\n // `shadowRoot._asyncRender()` via `attach-shadow` module\n\n var parentData = shadyDataForNode(parent);\n\n if (hasShadowRootWithSlot(parent)) {\n parentData.root._asyncRender();\n\n allowNativeInsert = false; // when inserting into a host with shadowRoot with NO slot, do nothing\n // as the node should not be added to composed dome anywhere.\n } else if (parentData.root) {\n allowNativeInsert = false;\n }\n }\n\n if (allowNativeInsert) {\n // if adding to a shadyRoot, add to host instead\n var container = utils_isShadyRoot(parent) ?\n /** @type {ShadowRoot} */\n parent.host : parent; // if ref_node, get the ref_node that's actually in composed dom.\n\n if (ref_node) {\n ref_node = firstComposedNode(ref_node);\n native_methods_insertBefore.call(container, node, ref_node);\n } else {\n native_methods_appendChild.call(container, node);\n } // Since ownerDocument is not patched, it can be incorrect afer this call\n // if the node is physically appended via distribution. This can result\n // in the custom elements polyfill not upgrading the node if it's in an inert doc.\n // We correct this by calling `adoptNode`.\n\n } else if (node.ownerDocument !== parent.ownerDocument) {\n parent.ownerDocument.adoptNode(node);\n }\n\n scheduleObserver(parent, node);\n return node;\n}\n/**\n * Patched `removeChild`. Note that all dom \"removals\" are routed here.\n * Removes the given `node` from the element's `children`.\n * This method also performs dom composition.\n * @param {Node} parent\n * @param {Node} node\n * @param {boolean=} skipUnscoping\n*/\n\nfunction logical_mutation_removeChild(parent, node) {\n var skipUnscoping = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;\n\n if (node.parentNode !== parent) {\n throw Error('The node to be removed is not a child of this node: ' + node);\n }\n\n var preventNativeRemove;\n var ownerRoot = ownerShadyRootForNode(node);\n var removingInsertionPoint;\n var parentData = shadyDataForNode(parent);\n\n if (isTrackingLogicalChildNodes(parent)) {\n recordRemoveChild(node, parent);\n\n if (hasShadowRootWithSlot(parent)) {\n parentData.root._asyncRender();\n\n preventNativeRemove = true;\n }\n } // unscope a node leaving a ShadowRoot if ShadyCSS is present, and this node\n // is not going to be rescoped in `insertBefore`\n\n\n if (getScopingShim() && !skipUnscoping && ownerRoot) {\n var oldScopeName = currentScopeForNode(node);\n treeVisitor(node, function (node) {\n removeShadyScoping(node, oldScopeName);\n });\n }\n\n removeOwnerShadyRoot(node); // if removing slot, must render containing root\n\n if (ownerRoot) {\n var changeSlotContent = parent && parent.localName === 'slot';\n\n if (changeSlotContent) {\n preventNativeRemove = true;\n }\n\n removingInsertionPoint = ownerRoot._removeContainedSlots(node);\n\n if (removingInsertionPoint || changeSlotContent) {\n ownerRoot._asyncRender();\n }\n }\n\n if (!preventNativeRemove) {\n // if removing from a shadyRoot, remove from host instead\n var container = utils_isShadyRoot(parent) ?\n /** @type {ShadowRoot} */\n parent.host : parent; // not guaranteed to physically be in container; e.g.\n // (1) if parent has a shadyRoot, element may or may not at distributed\n // location (could be undistributed)\n // (2) if parent is a slot, element may not ben in composed dom\n\n if (!(parentData.root || node.localName === 'slot') || container === logical_mutation_parentNode(node)) {\n native_methods_removeChild.call(container, node);\n }\n }\n\n scheduleObserver(parent, null, node);\n return node;\n}\n\nfunction removeOwnerShadyRoot(node) {\n // optimization: only reset the tree if node is actually in a root\n if (hasCachedOwnerRoot(node)) {\n var c$ = node.childNodes;\n\n for (var i = 0, l = c$.length, n; i < l && (n = c$[i]); i++) {\n removeOwnerShadyRoot(n);\n }\n }\n\n var nodeData = shadyDataForNode(node);\n\n if (nodeData) {\n nodeData.ownerShadyRoot = undefined;\n }\n}\n\nfunction hasCachedOwnerRoot(node) {\n var nodeData = shadyDataForNode(node);\n return Boolean(nodeData && nodeData.ownerShadyRoot !== undefined);\n}\n/**\n * Finds the first flattened node that is composed in the node's parent.\n * If the given node is a slot, then the first flattened node is returned\n * if it exists, otherwise advance to the node's nextSibling.\n * @param {Node} node within which to find first composed node\n * @returns {Node} first composed node\n */\n\n\nfunction firstComposedNode(node) {\n var composed = node;\n\n if (node && node.localName === 'slot') {\n var nodeData = shadyDataForNode(node);\n var flattened = nodeData && nodeData.flattenedNodes;\n composed = flattened && flattened.length ? flattened[0] : firstComposedNode(node.nextSibling);\n }\n\n return composed;\n}\n\nfunction hasShadowRootWithSlot(node) {\n var nodeData = shadyDataForNode(node);\n var root = nodeData && nodeData.root;\n return root && root._hasInsertionPoint();\n}\n/**\n * Should be called whenever an attribute changes. If the `slot` attribute\n * changes, provokes rendering if necessary. If a `` element's `name`\n * attribute changes, updates the root's slot map and renders.\n * @param {Node} node\n * @param {string} name\n */\n\n\nfunction distributeAttributeChange(node, name) {\n if (name === 'slot') {\n var parent = node.parentNode;\n\n if (hasShadowRootWithSlot(parent)) {\n shadyDataForNode(parent).root._asyncRender();\n }\n } else if (node.localName === 'slot' && name === 'name') {\n var root = ownerShadyRootForNode(node);\n\n if (root) {\n root._updateSlotName(node);\n\n root._asyncRender();\n }\n }\n}\n/**\n * @param {Node} node\n * @param {Node=} addedNode\n * @param {Node=} removedNode\n */\n\n\nfunction scheduleObserver(node, addedNode, removedNode) {\n var nodeData = shadyDataForNode(node);\n var observer = nodeData && nodeData.observer;\n\n if (observer) {\n if (addedNode) {\n observer.addedNodes.push(addedNode);\n }\n\n if (removedNode) {\n observer.removedNodes.push(removedNode);\n }\n\n observer.schedule();\n }\n}\n/**\n * @param {Node} node\n * @param {Object=} options\n */\n\n\nfunction logical_mutation_getRootNode(node, options) {\n // eslint-disable-line no-unused-vars\n if (!node || !node.nodeType) {\n return;\n }\n\n var nodeData = ensureShadyDataForNode(node);\n var root = nodeData.ownerShadyRoot;\n\n if (root === undefined) {\n if (utils_isShadyRoot(node)) {\n root = node;\n nodeData.ownerShadyRoot = root;\n } else {\n var parent = node.parentNode;\n root = parent ? logical_mutation_getRootNode(parent) : node; // memo-ize result for performance but only memo-ize\n // result if node is in the document. This avoids a problem where a root\n // can be cached while an element is inside a fragment.\n // If this happens and we cache the result, the value can become stale\n // because for perf we avoid processing the subtree of added fragments.\n\n if (native_methods_contains.call(document.documentElement, node)) {\n nodeData.ownerShadyRoot = root;\n }\n }\n }\n\n return root;\n} // NOTE: `query` is used primarily for ShadyDOM's querySelector impl,\n// but it's also generally useful to recurse through the element tree\n// and is used by Polymer's styling system.\n\n/**\n * @param {Node} node\n * @param {Function} matcher\n * @param {Function=} halter\n */\n\nfunction query(node, matcher, halter) {\n var list = [];\n queryElements(node.childNodes, matcher, halter, list);\n return list;\n}\n\nfunction queryElements(elements, matcher, halter, list) {\n for (var i = 0, l = elements.length, c; i < l && (c = elements[i]); i++) {\n if (c.nodeType === Node.ELEMENT_NODE && queryElement(c, matcher, halter, list)) {\n return true;\n }\n }\n}\n\nfunction queryElement(node, matcher, halter, list) {\n var result = matcher(node);\n\n if (result) {\n list.push(node);\n }\n\n if (halter && halter(result)) {\n return result;\n }\n\n queryElements(node.childNodes, matcher, halter, list);\n}\n\nfunction renderRootNode(element) {\n var root = element.getRootNode();\n\n if (utils_isShadyRoot(root)) {\n root._render();\n }\n}\nvar logical_mutation_scopingShim = null;\n\nfunction getScopingShim() {\n if (!logical_mutation_scopingShim) {\n logical_mutation_scopingShim = window['ShadyCSS'] && window['ShadyCSS']['ScopingShim'];\n }\n\n return logical_mutation_scopingShim || null;\n}\n\nfunction logical_mutation_setAttribute(node, attr, value) {\n var scopingShim = getScopingShim();\n\n if (scopingShim && attr === 'class') {\n scopingShim['setElementClass'](node, value);\n } else {\n native_methods_setAttribute.call(node, attr, value);\n distributeAttributeChange(node, attr);\n }\n}\nfunction logical_mutation_removeAttribute(node, attr) {\n native_methods_removeAttribute.call(node, attr);\n distributeAttributeChange(node, attr);\n}\nfunction logical_mutation_cloneNode(node, deep) {\n if (node.localName == 'template') {\n return native_methods_cloneNode.call(node, deep);\n } else {\n var n = native_methods_cloneNode.call(node, false); // Attribute nodes historically had childNodes, but they have later\n // been removed from the spec.\n // Make sure we do not do a deep clone on them for old browsers (IE11)\n\n if (deep && n.nodeType !== Node.ATTRIBUTE_NODE) {\n var c$ = node.childNodes;\n\n for (var i = 0, nc; i < c$.length; i++) {\n nc = c$[i].cloneNode(true);\n n.appendChild(nc);\n }\n }\n\n return n;\n }\n} // note: Though not technically correct, we fast path `importNode`\n// when called on a node not owned by the main document.\n// This allows, for example, elements that cannot\n// contain custom elements and are therefore not likely to contain shadowRoots\n// to cloned natively. This is a fairly significant performance win.\n\nfunction logical_mutation_importNode(node, deep) {\n // A template element normally has no children with shadowRoots, so make\n // sure we always make a deep copy to correctly construct the template.content\n if (node.ownerDocument !== document || node.localName === 'template') {\n return native_methods_importNode.call(document, node, deep);\n }\n\n var n = native_methods_importNode.call(document, node, false);\n\n if (deep) {\n var c$ = node.childNodes;\n\n for (var i = 0, nc; i < c$.length; i++) {\n nc = logical_mutation_importNode(c$[i], true);\n n.appendChild(nc);\n }\n }\n\n return n;\n}\n/**\n * @param {!Node} node\n * @param {string} newScopeName\n */\n\nfunction addShadyScoping(node, newScopeName) {\n var scopingShim = getScopingShim();\n\n if (!scopingShim) {\n return;\n }\n\n scopingShim['scopeNode'](node, newScopeName);\n}\n/**\n * @param {!Node} node\n * @param {string} currentScopeName\n */\n\n\nfunction removeShadyScoping(node, currentScopeName) {\n var scopingShim = getScopingShim();\n\n if (!scopingShim) {\n return;\n }\n\n scopingShim['unscopeNode'](node, currentScopeName);\n}\n/**\n * @param {!Node} node\n * @param {string} newScopeName\n * @param {string} oldScopeName\n */\n\n\nfunction replaceShadyScoping(node, newScopeName, oldScopeName) {\n var scopingShim = getScopingShim();\n\n if (!scopingShim) {\n return;\n }\n\n removeShadyScoping(node, oldScopeName);\n addShadyScoping(node, newScopeName);\n}\n/**\n * @param {!Node} node\n * @param {string} newScopeName\n * @return {boolean}\n */\n\n\nfunction currentScopeIsCorrect(node, newScopeName) {\n var scopingShim = getScopingShim();\n\n if (!scopingShim) {\n return true;\n }\n\n if (node.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {\n // NOTE: as an optimization, only check that all the top-level children\n // have the correct scope.\n var correctScope = true;\n\n for (var idx = 0; correctScope && idx < node.childNodes.length; idx++) {\n correctScope = correctScope && currentScopeIsCorrect(node.childNodes[idx], newScopeName);\n }\n\n return correctScope;\n }\n\n if (node.nodeType !== Node.ELEMENT_NODE) {\n return true;\n }\n\n var currentScope = scopingShim['currentScopeForNode'](node);\n return currentScope === newScopeName;\n}\n/**\n * @param {!Node} node\n * @return {string}\n */\n\n\nfunction currentScopeForNode(node) {\n if (node.nodeType !== Node.ELEMENT_NODE) {\n return '';\n }\n\n var scopingShim = getScopingShim();\n\n if (!scopingShim) {\n return '';\n }\n\n return scopingShim['currentScopeForNode'](node);\n}\n/**\n * Walk over a node's tree and apply visitorFn to each element node\n *\n * @param {Node} node\n * @param {function(!Node):void} visitorFn\n */\n\n\nfunction treeVisitor(node, visitorFn) {\n if (!node) {\n return;\n } // this check is necessary if `node` is a Document Fragment\n\n\n if (node.nodeType === Node.ELEMENT_NODE) {\n visitorFn(node);\n }\n\n for (var idx = 0, n; idx < node.childNodes.length; idx++) {\n n = node.childNodes[idx];\n\n if (n.nodeType === Node.ELEMENT_NODE) {\n treeVisitor(n, visitorFn);\n }\n }\n}\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/patch-events.js\nfunction _typeof(obj) { if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n\n\n\n/*\nMake this name unique so it is unlikely to conflict with properties on objects passed to `addEventListener`\nhttps://github.com/webcomponents/shadydom/issues/173\n*/\n\nvar\n/** string */\neventWrappersName = \"__eventWrappers\".concat(Date.now());\n/** @type {?function(!Event): boolean} */\n\nvar composedGetter = function () {\n var composedProp = Object.getOwnPropertyDescriptor(Event.prototype, 'composed');\n return composedProp ? function (ev) {\n return composedProp.get.call(ev);\n } : null;\n}(); // https://github.com/w3c/webcomponents/issues/513#issuecomment-224183937\n\n\nvar alwaysComposed = {\n 'blur': true,\n 'focus': true,\n 'focusin': true,\n 'focusout': true,\n 'click': true,\n 'dblclick': true,\n 'mousedown': true,\n 'mouseenter': true,\n 'mouseleave': true,\n 'mousemove': true,\n 'mouseout': true,\n 'mouseover': true,\n 'mouseup': true,\n 'wheel': true,\n 'beforeinput': true,\n 'input': true,\n 'keydown': true,\n 'keyup': true,\n 'compositionstart': true,\n 'compositionupdate': true,\n 'compositionend': true,\n 'touchstart': true,\n 'touchend': true,\n 'touchmove': true,\n 'touchcancel': true,\n 'pointerover': true,\n 'pointerenter': true,\n 'pointerdown': true,\n 'pointermove': true,\n 'pointerup': true,\n 'pointercancel': true,\n 'pointerout': true,\n 'pointerleave': true,\n 'gotpointercapture': true,\n 'lostpointercapture': true,\n 'dragstart': true,\n 'drag': true,\n 'dragenter': true,\n 'dragleave': true,\n 'dragover': true,\n 'drop': true,\n 'dragend': true,\n 'DOMActivate': true,\n 'DOMFocusIn': true,\n 'DOMFocusOut': true,\n 'keypress': true\n};\nvar unpatchedEvents = {\n 'DOMAttrModified': true,\n 'DOMAttributeNameChanged': true,\n 'DOMCharacterDataModified': true,\n 'DOMElementNameChanged': true,\n 'DOMNodeInserted': true,\n 'DOMNodeInsertedIntoDocument': true,\n 'DOMNodeRemoved': true,\n 'DOMNodeRemovedFromDocument': true,\n 'DOMSubtreeModified': true\n};\n\nfunction pathComposer(startNode, composed) {\n var composedPath = [];\n var current = startNode;\n var startRoot = startNode === window ? window : startNode.getRootNode();\n\n while (current) {\n composedPath.push(current);\n\n if (current.assignedSlot) {\n current = current.assignedSlot;\n } else if (current.nodeType === Node.DOCUMENT_FRAGMENT_NODE && current.host && (composed || current !== startRoot)) {\n current = current.host;\n } else {\n current = current.parentNode;\n }\n } // event composedPath includes window when startNode's ownerRoot is document\n\n\n if (composedPath[composedPath.length - 1] === document) {\n composedPath.push(window);\n }\n\n return composedPath;\n}\n\nfunction retarget(refNode, path) {\n if (!utils_isShadyRoot) {\n return refNode;\n } // If ANCESTOR's root is not a shadow root or ANCESTOR's root is BASE's\n // shadow-including inclusive ancestor, return ANCESTOR.\n\n\n var refNodePath = pathComposer(refNode, true);\n var p$ = path;\n\n for (var i = 0, ancestor, lastRoot, root, rootIdx; i < p$.length; i++) {\n ancestor = p$[i];\n root = ancestor === window ? window : ancestor.getRootNode();\n\n if (root !== lastRoot) {\n rootIdx = refNodePath.indexOf(root);\n lastRoot = root;\n }\n\n if (!utils_isShadyRoot(root) || rootIdx > -1) {\n return ancestor;\n }\n }\n}\n\nvar eventMixin = {\n /**\n * @this {Event}\n */\n get composed() {\n if (this.__composed === undefined) {\n // if there's an original `composed` getter on the Event prototype, use that\n if (composedGetter) {\n // TODO(web-padawan): see https://github.com/webcomponents/shadydom/issues/275\n this.__composed = this.type === 'focusin' || this.type === 'focusout' || composedGetter(this); // If the event is trusted, or `isTrusted` is not supported, check the list of always composed events\n } else if (this.isTrusted !== false) {\n this.__composed = alwaysComposed[this.type];\n }\n }\n\n return this.__composed || false;\n },\n\n /**\n * @this {Event}\n */\n composedPath: function composedPath() {\n if (!this.__composedPath) {\n this.__composedPath = pathComposer(this['__target'], this.composed);\n }\n\n return this.__composedPath;\n },\n\n /**\n * @this {Event}\n */\n get target() {\n return retarget(this.currentTarget || this['__previousCurrentTarget'], this.composedPath());\n },\n\n // http://w3c.github.io/webcomponents/spec/shadow/#event-relatedtarget-retargeting\n\n /**\n * @this {Event}\n */\n get relatedTarget() {\n if (!this.__relatedTarget) {\n return null;\n }\n\n if (!this.__relatedTargetComposedPath) {\n this.__relatedTargetComposedPath = pathComposer(this.__relatedTarget, true);\n } // find the deepest node in relatedTarget composed path that is in the same root with the currentTarget\n\n\n return retarget(this.currentTarget || this['__previousCurrentTarget'], this.__relatedTargetComposedPath);\n },\n\n /**\n * @this {Event}\n */\n stopPropagation: function stopPropagation() {\n Event.prototype.stopPropagation.call(this);\n this.__propagationStopped = true;\n },\n\n /**\n * @this {Event}\n */\n stopImmediatePropagation: function stopImmediatePropagation() {\n Event.prototype.stopImmediatePropagation.call(this);\n this.__immediatePropagationStopped = true;\n this.__propagationStopped = true;\n }\n};\n\nfunction mixinComposedFlag(Base) {\n // NOTE: avoiding use of `class` here so that transpiled output does not\n // try to do `Base.call` with a dom construtor.\n var klazz = function klazz(type, options) {\n var event = new Base(type, options);\n event.__composed = options && Boolean(options['composed']);\n return event;\n }; // put constructor properties on subclass\n\n\n mixin(klazz, Base);\n klazz.prototype = Base.prototype;\n return klazz;\n}\n\nvar nonBubblingEventsToRetarget = {\n 'focus': true,\n 'blur': true\n};\n/**\n * Check if the event has been retargeted by comparing original `target`, and calculated `target`\n * @param {Event} event\n * @return {boolean} True if the original target and calculated target are the same\n */\n\nfunction hasRetargeted(event) {\n return event['__target'] !== event.target || event.__relatedTarget !== event.relatedTarget;\n}\n/**\n *\n * @param {Event} event\n * @param {Node} node\n * @param {string} phase\n */\n\n\nfunction fireHandlers(event, node, phase) {\n var hs = node.__handlers && node.__handlers[event.type] && node.__handlers[event.type][phase];\n\n if (hs) {\n for (var i = 0, fn; fn = hs[i]; i++) {\n if (hasRetargeted(event) && event.target === event.relatedTarget) {\n return;\n }\n\n fn.call(node, event);\n\n if (event.__immediatePropagationStopped) {\n return;\n }\n }\n }\n}\n\nfunction retargetNonBubblingEvent(e) {\n var path = e.composedPath();\n var node; // override `currentTarget` to let patched `target` calculate correctly\n\n Object.defineProperty(e, 'currentTarget', {\n get: function get() {\n return node;\n },\n configurable: true\n });\n\n for (var i = path.length - 1; i >= 0; i--) {\n node = path[i]; // capture phase fires all capture handlers\n\n fireHandlers(e, node, 'capture');\n\n if (e.__propagationStopped) {\n return;\n }\n } // set the event phase to `AT_TARGET` as in spec\n\n\n Object.defineProperty(e, 'eventPhase', {\n get: function get() {\n return Event.AT_TARGET;\n }\n }); // the event only needs to be fired when owner roots change when iterating the event path\n // keep track of the last seen owner root\n\n var lastFiredRoot;\n\n for (var _i = 0; _i < path.length; _i++) {\n node = path[_i];\n var nodeData = shadyDataForNode(node);\n var root = nodeData && nodeData.root;\n\n if (_i === 0 || root && root === lastFiredRoot) {\n fireHandlers(e, node, 'bubble'); // don't bother with window, it doesn't have `getRootNode` and will be last in the path anyway\n\n if (node !== window) {\n lastFiredRoot = node.getRootNode();\n }\n\n if (e.__propagationStopped) {\n return;\n }\n }\n }\n}\n\nfunction listenerSettingsEqual(savedListener, node, type, capture, once, passive) {\n var savedNode = savedListener.node,\n savedType = savedListener.type,\n savedCapture = savedListener.capture,\n savedOnce = savedListener.once,\n savedPassive = savedListener.passive;\n return node === savedNode && type === savedType && capture === savedCapture && once === savedOnce && passive === savedPassive;\n}\n\nfunction findListener(wrappers, node, type, capture, once, passive) {\n for (var i = 0; i < wrappers.length; i++) {\n if (listenerSettingsEqual(wrappers[i], node, type, capture, once, passive)) {\n return i;\n }\n }\n\n return -1;\n}\n/**\n * Firefox can throw on accessing eventWrappers inside of `removeEventListener` during a selenium run\n * Try/Catch accessing eventWrappers to work around\n * https://bugzilla.mozilla.org/show_bug.cgi?id=1353074\n */\n\nfunction getEventWrappers(eventLike) {\n var wrappers = null;\n\n try {\n wrappers = eventLike[eventWrappersName];\n } catch (e) {} // eslint-disable-line no-empty\n\n\n return wrappers;\n}\n/**\n * @this {Event}\n */\n\n\nfunction patch_events_addEventListener(type, fnOrObj, optionsOrCapture) {\n if (!fnOrObj) {\n return;\n }\n\n var handlerType = _typeof(fnOrObj); // bail if `fnOrObj` is not a function, not an object\n\n\n if (handlerType !== 'function' && handlerType !== 'object') {\n return;\n } // bail if `fnOrObj` is an object without a `handleEvent` method\n\n\n if (handlerType === 'object' && (!fnOrObj.handleEvent || typeof fnOrObj.handleEvent !== 'function')) {\n return;\n }\n\n var ael = this instanceof Window ? windowAddEventListener : addEventListener;\n\n if (unpatchedEvents[type]) {\n return ael.call(this, type, fnOrObj, optionsOrCapture);\n } // The callback `fn` might be used for multiple nodes/events. Since we generate\n // a wrapper function, we need to keep track of it when we remove the listener.\n // It's more efficient to store the node/type/options information as Array in\n // `fn` itself rather than the node (we assume that the same callback is used\n // for few nodes at most, whereas a node will likely have many event listeners).\n // NOTE(valdrin) invoking external functions is costly, inline has better perf.\n\n\n var capture, once, passive;\n\n if (optionsOrCapture && _typeof(optionsOrCapture) === 'object') {\n capture = Boolean(optionsOrCapture.capture);\n once = Boolean(optionsOrCapture.once);\n passive = Boolean(optionsOrCapture.passive);\n } else {\n capture = Boolean(optionsOrCapture);\n once = false;\n passive = false;\n } // hack to let ShadyRoots have event listeners\n // event listener will be on host, but `currentTarget`\n // will be set to shadyroot for event listener\n\n\n var target = optionsOrCapture && optionsOrCapture.__shadyTarget || this;\n var wrappers = fnOrObj[eventWrappersName];\n\n if (wrappers) {\n // Stop if the wrapper function has already been created.\n if (findListener(wrappers, target, type, capture, once, passive) > -1) {\n return;\n }\n } else {\n fnOrObj[eventWrappersName] = [];\n }\n /**\n * @this {HTMLElement}\n * @param {Event} e\n */\n\n\n var wrapperFn = function wrapperFn(e) {\n // Support `once` option.\n if (once) {\n this.removeEventListener(type, fnOrObj, optionsOrCapture);\n }\n\n if (!e['__target']) {\n patchEvent(e);\n }\n\n var lastCurrentTargetDesc;\n\n if (target !== this) {\n // replace `currentTarget` to make `target` and `relatedTarget` correct for inside the shadowroot\n lastCurrentTargetDesc = Object.getOwnPropertyDescriptor(e, 'currentTarget');\n Object.defineProperty(e, 'currentTarget', {\n get: function get() {\n return target;\n },\n configurable: true\n });\n }\n\n e['__previousCurrentTarget'] = e['currentTarget']; // Always check if a shadowRoot is in the current event path.\n // If it is not, the event was generated on either the host of the shadowRoot\n // or a children of the host.\n\n if (utils_isShadyRoot(target) && e.composedPath().indexOf(target) == -1) {\n return;\n } // There are two critera that should stop events from firing on this node\n // 1. the event is not composed and the current node is not in the same root as the target\n // 2. when bubbling, if after retargeting, relatedTarget and target point to the same node\n\n\n if (e.composed || e.composedPath().indexOf(target) > -1) {\n if (hasRetargeted(e) && e.target === e.relatedTarget) {\n if (e.eventPhase === Event.BUBBLING_PHASE) {\n e.stopImmediatePropagation();\n }\n\n return;\n } // prevent non-bubbling events from triggering bubbling handlers on shadowroot, but only if not in capture phase\n\n\n if (e.eventPhase !== Event.CAPTURING_PHASE && !e.bubbles && e.target !== target && !(target instanceof Window)) {\n return;\n }\n\n var ret = handlerType === 'function' ? fnOrObj.call(target, e) : fnOrObj.handleEvent && fnOrObj.handleEvent(e);\n\n if (target !== this) {\n // replace the \"correct\" `currentTarget`\n if (lastCurrentTargetDesc) {\n Object.defineProperty(e, 'currentTarget', lastCurrentTargetDesc);\n lastCurrentTargetDesc = null;\n } else {\n delete e['currentTarget'];\n }\n }\n\n return ret;\n }\n }; // Store the wrapper information.\n\n\n fnOrObj[eventWrappersName].push({\n // note: use target here which is either a shadowRoot\n // (when the host element is proxy'ing the event) or this element\n node: target,\n type: type,\n capture: capture,\n once: once,\n passive: passive,\n wrapperFn: wrapperFn\n });\n\n if (nonBubblingEventsToRetarget[type]) {\n this.__handlers = this.__handlers || {};\n this.__handlers[type] = this.__handlers[type] || {\n 'capture': [],\n 'bubble': []\n };\n\n this.__handlers[type][capture ? 'capture' : 'bubble'].push(wrapperFn);\n } else {\n ael.call(this, type, wrapperFn, optionsOrCapture);\n }\n}\n/**\n * @this {Event}\n */\n\nfunction patch_events_removeEventListener(type, fnOrObj, optionsOrCapture) {\n if (!fnOrObj) {\n return;\n }\n\n var rel = this instanceof Window ? windowRemoveEventListener : removeEventListener;\n\n if (unpatchedEvents[type]) {\n return rel.call(this, type, fnOrObj, optionsOrCapture);\n } // NOTE(valdrin) invoking external functions is costly, inline has better perf.\n\n\n var capture, once, passive;\n\n if (optionsOrCapture && _typeof(optionsOrCapture) === 'object') {\n capture = Boolean(optionsOrCapture.capture);\n once = Boolean(optionsOrCapture.once);\n passive = Boolean(optionsOrCapture.passive);\n } else {\n capture = Boolean(optionsOrCapture);\n once = false;\n passive = false;\n }\n\n var target = optionsOrCapture && optionsOrCapture.__shadyTarget || this; // Search the wrapped function.\n\n var wrapperFn = undefined;\n var wrappers = getEventWrappers(fnOrObj);\n\n if (wrappers) {\n var idx = findListener(wrappers, target, type, capture, once, passive);\n\n if (idx > -1) {\n wrapperFn = wrappers.splice(idx, 1)[0].wrapperFn; // Cleanup.\n\n if (!wrappers.length) {\n fnOrObj[eventWrappersName] = undefined;\n }\n }\n }\n\n rel.call(this, type, wrapperFn || fnOrObj, optionsOrCapture);\n\n if (wrapperFn && nonBubblingEventsToRetarget[type] && this.__handlers && this.__handlers[type]) {\n var arr = this.__handlers[type][capture ? 'capture' : 'bubble'];\n\n var _idx = arr.indexOf(wrapperFn);\n\n if (_idx > -1) {\n arr.splice(_idx, 1);\n }\n }\n}\n\nfunction activateFocusEventOverrides() {\n for (var ev in nonBubblingEventsToRetarget) {\n window.addEventListener(ev, function (e) {\n if (!e['__target']) {\n patchEvent(e);\n retargetNonBubblingEvent(e);\n }\n }, true);\n }\n}\n\nfunction patchEvent(event) {\n event['__target'] = event.target;\n event.__relatedTarget = event.relatedTarget; // patch event prototype if we can\n\n if (settings.hasDescriptors) {\n patchPrototype(event, eventMixin); // and fallback to patching instance\n } else {\n extend(event, eventMixin);\n }\n}\n\nvar PatchedEvent = mixinComposedFlag(window.Event);\nvar PatchedCustomEvent = mixinComposedFlag(window.CustomEvent);\nvar PatchedMouseEvent = mixinComposedFlag(window.MouseEvent);\nfunction patchEvents() {\n window.Event = PatchedEvent;\n window.CustomEvent = PatchedCustomEvent;\n window.MouseEvent = PatchedMouseEvent;\n activateFocusEventOverrides(); // Fix up `Element.prototype.click()` if `isTrusted` is supported, but `composed` isn't\n\n if (!composedGetter && Object.getOwnPropertyDescriptor(Event.prototype, 'isTrusted')) {\n /** @this {Element} */\n var composedClickFn = function composedClickFn() {\n var ev = new MouseEvent('click', {\n bubbles: true,\n cancelable: true,\n composed: true\n });\n this.dispatchEvent(ev);\n };\n\n if (Element.prototype.click) {\n Element.prototype.click = composedClickFn;\n } else if (HTMLElement.prototype.click) {\n HTMLElement.prototype.click = composedClickFn;\n }\n }\n}\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/array-splice.js\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\nfunction newSplice(index, removed, addedCount) {\n return {\n index: index,\n removed: removed,\n addedCount: addedCount\n };\n}\n\nvar EDIT_LEAVE = 0;\nvar EDIT_UPDATE = 1;\nvar EDIT_ADD = 2;\nvar EDIT_DELETE = 3; // Note: This function is *based* on the computation of the Levenshtein\n// \"edit\" distance. The one change is that \"updates\" are treated as two\n// edits - not one. With Array splices, an update is really a delete\n// followed by an add. By retaining this, we optimize for \"keeping\" the\n// maximum array items in the original array. For example:\n//\n// 'xxxx123' -> '123yyyy'\n//\n// With 1-edit updates, the shortest path would be just to update all seven\n// characters. With 2-edit updates, we delete 4, leave 3, and add 4. This\n// leaves the substring '123' intact.\n\nfunction calcEditDistances(current, currentStart, currentEnd, old, oldStart, oldEnd) {\n // \"Deletion\" columns\n var rowCount = oldEnd - oldStart + 1;\n var columnCount = currentEnd - currentStart + 1;\n var distances = new Array(rowCount); // \"Addition\" rows. Initialize null column.\n\n for (var i = 0; i < rowCount; i++) {\n distances[i] = new Array(columnCount);\n distances[i][0] = i;\n } // Initialize null row\n\n\n for (var j = 0; j < columnCount; j++) {\n distances[0][j] = j;\n }\n\n for (var _i = 1; _i < rowCount; _i++) {\n for (var _j = 1; _j < columnCount; _j++) {\n if (equals(current[currentStart + _j - 1], old[oldStart + _i - 1])) distances[_i][_j] = distances[_i - 1][_j - 1];else {\n var north = distances[_i - 1][_j] + 1;\n var west = distances[_i][_j - 1] + 1;\n distances[_i][_j] = north < west ? north : west;\n }\n }\n }\n\n return distances;\n} // This starts at the final weight, and walks \"backward\" by finding\n// the minimum previous weight recursively until the origin of the weight\n// matrix.\n\n\nfunction spliceOperationsFromEditDistances(distances) {\n var i = distances.length - 1;\n var j = distances[0].length - 1;\n var current = distances[i][j];\n var edits = [];\n\n while (i > 0 || j > 0) {\n if (i == 0) {\n edits.push(EDIT_ADD);\n j--;\n continue;\n }\n\n if (j == 0) {\n edits.push(EDIT_DELETE);\n i--;\n continue;\n }\n\n var northWest = distances[i - 1][j - 1];\n var west = distances[i - 1][j];\n var north = distances[i][j - 1];\n var min = void 0;\n if (west < north) min = west < northWest ? west : northWest;else min = north < northWest ? north : northWest;\n\n if (min == northWest) {\n if (northWest == current) {\n edits.push(EDIT_LEAVE);\n } else {\n edits.push(EDIT_UPDATE);\n current = northWest;\n }\n\n i--;\n j--;\n } else if (min == west) {\n edits.push(EDIT_DELETE);\n i--;\n current = west;\n } else {\n edits.push(EDIT_ADD);\n j--;\n current = north;\n }\n }\n\n edits.reverse();\n return edits;\n}\n/**\n * Splice Projection functions:\n *\n * A splice map is a representation of how a previous array of items\n * was transformed into a new array of items. Conceptually it is a list of\n * tuples of\n *\n * \n *\n * which are kept in ascending index order of. The tuple represents that at\n * the |index|, |removed| sequence of items were removed, and counting forward\n * from |index|, |addedCount| items were added.\n */\n\n/**\n * Lacking individual splice mutation information, the minimal set of\n * splices can be synthesized given the previous state and final state of an\n * array. The basic approach is to calculate the edit distance matrix and\n * choose the shortest path through it.\n *\n * Complexity: O(l * p)\n * l: The length of the current array\n * p: The length of the old array\n */\n\n\nfunction calcSplices(current, currentStart, currentEnd, old, oldStart, oldEnd) {\n var prefixCount = 0;\n var suffixCount = 0;\n var splice;\n var minLength = Math.min(currentEnd - currentStart, oldEnd - oldStart);\n if (currentStart == 0 && oldStart == 0) prefixCount = sharedPrefix(current, old, minLength);\n if (currentEnd == current.length && oldEnd == old.length) suffixCount = sharedSuffix(current, old, minLength - prefixCount);\n currentStart += prefixCount;\n oldStart += prefixCount;\n currentEnd -= suffixCount;\n oldEnd -= suffixCount;\n if (currentEnd - currentStart == 0 && oldEnd - oldStart == 0) return [];\n\n if (currentStart == currentEnd) {\n splice = newSplice(currentStart, [], 0);\n\n while (oldStart < oldEnd) {\n splice.removed.push(old[oldStart++]);\n }\n\n return [splice];\n } else if (oldStart == oldEnd) return [newSplice(currentStart, [], currentEnd - currentStart)];\n\n var ops = spliceOperationsFromEditDistances(calcEditDistances(current, currentStart, currentEnd, old, oldStart, oldEnd));\n splice = undefined;\n var splices = [];\n var index = currentStart;\n var oldIndex = oldStart;\n\n for (var i = 0; i < ops.length; i++) {\n switch (ops[i]) {\n case EDIT_LEAVE:\n if (splice) {\n splices.push(splice);\n splice = undefined;\n }\n\n index++;\n oldIndex++;\n break;\n\n case EDIT_UPDATE:\n if (!splice) splice = newSplice(index, [], 0);\n splice.addedCount++;\n index++;\n splice.removed.push(old[oldIndex]);\n oldIndex++;\n break;\n\n case EDIT_ADD:\n if (!splice) splice = newSplice(index, [], 0);\n splice.addedCount++;\n index++;\n break;\n\n case EDIT_DELETE:\n if (!splice) splice = newSplice(index, [], 0);\n splice.removed.push(old[oldIndex]);\n oldIndex++;\n break;\n }\n }\n\n if (splice) {\n splices.push(splice);\n }\n\n return splices;\n}\n\nfunction sharedPrefix(current, old, searchLength) {\n for (var i = 0; i < searchLength; i++) {\n if (!equals(current[i], old[i])) return i;\n }\n\n return searchLength;\n}\n\nfunction sharedSuffix(current, old, searchLength) {\n var index1 = current.length;\n var index2 = old.length;\n var count = 0;\n\n while (count < searchLength && equals(current[--index1], old[--index2])) {\n count++;\n }\n\n return count;\n}\n\nfunction equals(currentValue, previousValue) {\n return currentValue === previousValue;\n}\n\nfunction calculateSplices(current, previous) {\n return calcSplices(current, 0, current.length, previous, 0, previous.length);\n}\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/attach-shadow.js\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance\"); }\n\nfunction _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }\n\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance\"); }\n\nfunction _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === \"[object Arguments]\") return Array.from(iter); }\n\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }\n\nfunction attach_shadow_classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction attach_shadow_defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction attach_shadow_createClass(Constructor, protoProps, staticProps) { if (protoProps) attach_shadow_defineProperties(Constructor.prototype, protoProps); if (staticProps) attach_shadow_defineProperties(Constructor, staticProps); return Constructor; }\n\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n\n\n\n\n\n\n\nvar attach_shadow_parentNode = accessors.parentNode,\n attach_shadow_childNodes = accessors.childNodes; // Do not export this object. It must be passed as the first argument to the\n// ShadyRoot constructor in `attachShadow` to prevent the constructor from\n// throwing. This prevents the user from being able to manually construct a\n// ShadyRoot (i.e. `new ShadowRoot()`).\n\nvar ShadyRootConstructionToken = {};\nvar CATCHALL_NAME = '__catchall';\nvar SHADYROOT_NAME = 'ShadyRoot';\nvar MODE_CLOSED = 'closed';\nvar isRendering = settings['deferConnectionCallbacks'] && document.readyState === 'loading';\nvar rootRendered;\n\nfunction ancestorList(node) {\n var ancestors = [];\n\n do {\n ancestors.unshift(node);\n } while (node = node.parentNode);\n\n return ancestors;\n}\n/**\n * @extends {ShadowRoot}\n */\n\n\nvar attach_shadow_ShadyRoot =\n/*#__PURE__*/\nfunction () {\n function ShadyRoot(token, host, options) {\n attach_shadow_classCallCheck(this, ShadyRoot);\n\n if (token !== ShadyRootConstructionToken) {\n throw new TypeError('Illegal constructor');\n } // NOTE: set a fake local name so this element can be\n // distinguished from a DocumentFragment when patching.\n // FF doesn't allow this to be `localName`\n\n\n this._localName = SHADYROOT_NAME; // root <=> host\n\n this.host = host;\n this._mode = options && options.mode;\n recordChildNodes(host);\n var hostData = ensureShadyDataForNode(host);\n hostData.root = this;\n hostData.publicRoot = this._mode !== MODE_CLOSED ? this : null; // setup root\n\n var rootData = ensureShadyDataForNode(this);\n rootData.firstChild = rootData.lastChild = rootData.parentNode = rootData.nextSibling = rootData.previousSibling = null;\n rootData.childNodes = []; // state flags\n\n this._renderPending = false;\n this._hasRendered = false; // marsalled lazily\n\n this._slotList = null;\n /** @type {Object>} */\n\n this._slotMap = null;\n this._pendingSlots = null;\n this._initialChildren = null;\n\n this._asyncRender();\n } // async render\n\n\n attach_shadow_createClass(ShadyRoot, [{\n key: \"_asyncRender\",\n value: function _asyncRender() {\n var _this = this;\n\n if (!this._renderPending) {\n this._renderPending = true;\n enqueue(function () {\n return _this._render();\n });\n }\n } // returns the oldest renderPending ancestor root.\n\n }, {\n key: \"_getRenderRoot\",\n value: function _getRenderRoot() {\n var renderRoot;\n var root = this;\n\n while (root) {\n if (root._renderPending) {\n renderRoot = root;\n }\n\n root = root._rendererForHost();\n }\n\n return renderRoot;\n } // Returns the shadyRoot `this.host` if `this.host`\n // has children that require distribution.\n\n }, {\n key: \"_rendererForHost\",\n value: function _rendererForHost() {\n var root = this.host.getRootNode();\n\n if (utils_isShadyRoot(root)) {\n var c$ = this.host.childNodes;\n\n for (var i = 0, c; i < c$.length; i++) {\n c = c$[i];\n\n if (this._isInsertionPoint(c)) {\n return root;\n }\n }\n }\n }\n }, {\n key: \"_render\",\n value: function _render() {\n var root = this._getRenderRoot();\n\n if (root) {\n root['_renderRoot']();\n }\n } // NOTE: avoid renaming to ease testability.\n\n }, {\n key: '_renderRoot',\n value: function _renderRoot() {\n // track rendering state.\n var wasRendering = isRendering;\n isRendering = true;\n this._renderPending = false;\n\n if (this._slotList) {\n this._distribute();\n\n this._compose();\n } // on initial render remove any undistributed children.\n\n\n if (!this._hasRendered) {\n var c$ = this.host.childNodes;\n\n for (var i = 0, l = c$.length; i < l; i++) {\n var child = c$[i];\n var data = shadyDataForNode(child);\n\n if (attach_shadow_parentNode(child) === this.host && (child.localName === 'slot' || !data.assignedSlot)) {\n native_methods_removeChild.call(this.host, child);\n }\n }\n }\n\n this._hasRendered = true;\n isRendering = wasRendering;\n\n if (rootRendered) {\n rootRendered();\n }\n }\n }, {\n key: \"_distribute\",\n value: function _distribute() {\n this._validateSlots(); // capture # of previously assigned nodes to help determine if dirty.\n\n\n for (var i = 0, slot; i < this._slotList.length; i++) {\n slot = this._slotList[i];\n\n this._clearSlotAssignedNodes(slot);\n } // distribute host children.\n\n\n for (var n = this.host.firstChild; n; n = n.nextSibling) {\n this._distributeNodeToSlot(n);\n } // fallback content, slotchange, and dirty roots\n\n\n for (var _i = 0; _i < this._slotList.length; _i++) {\n var _slot = this._slotList[_i];\n var slotData = shadyDataForNode(_slot); // distribute fallback content\n\n if (!slotData.assignedNodes.length) {\n for (var _n = _slot.firstChild; _n; _n = _n.nextSibling) {\n this._distributeNodeToSlot(_n, _slot);\n }\n }\n\n var slotParentData = shadyDataForNode(_slot.parentNode);\n var slotParentRoot = slotParentData && slotParentData.root;\n\n if (slotParentRoot && slotParentRoot._hasInsertionPoint()) {\n slotParentRoot['_renderRoot']();\n }\n\n this._addAssignedToFlattenedNodes(slotData.flattenedNodes, slotData.assignedNodes);\n\n var prevAssignedNodes = slotData._previouslyAssignedNodes;\n\n if (prevAssignedNodes) {\n for (var _i2 = 0; _i2 < prevAssignedNodes.length; _i2++) {\n shadyDataForNode(prevAssignedNodes[_i2])._prevAssignedSlot = null;\n }\n\n slotData._previouslyAssignedNodes = null; // dirty if previously less assigned nodes than previously assigned.\n\n if (prevAssignedNodes.length > slotData.assignedNodes.length) {\n slotData.dirty = true;\n }\n }\n /* Note: A slot is marked dirty whenever a node is newly assigned to it\n or a node is assigned to a different slot (done in `_distributeNodeToSlot`)\n or if the number of nodes assigned to the slot has decreased (done above);\n */\n\n\n if (slotData.dirty) {\n slotData.dirty = false;\n\n this._fireSlotChange(_slot);\n }\n }\n }\n /**\n * Distributes given `node` to the appropriate slot based on its `slot`\n * attribute. If `forcedSlot` is given, then the node is distributed to the\n * `forcedSlot`.\n * Note: slot to which the node is assigned will be marked dirty for firing\n * `slotchange`.\n * @param {Node} node\n * @param {Node=} forcedSlot\n *\n */\n\n }, {\n key: \"_distributeNodeToSlot\",\n value: function _distributeNodeToSlot(node, forcedSlot) {\n var nodeData = ensureShadyDataForNode(node);\n var oldSlot = nodeData._prevAssignedSlot;\n nodeData._prevAssignedSlot = null;\n var slot = forcedSlot;\n\n if (!slot) {\n var name = node.slot || CATCHALL_NAME;\n var list = this._slotMap[name];\n slot = list && list[0];\n }\n\n if (slot) {\n var slotData = ensureShadyDataForNode(slot);\n slotData.assignedNodes.push(node);\n nodeData.assignedSlot = slot;\n } else {\n nodeData.assignedSlot = undefined;\n }\n\n if (oldSlot !== nodeData.assignedSlot) {\n if (nodeData.assignedSlot) {\n ensureShadyDataForNode(nodeData.assignedSlot).dirty = true;\n }\n }\n }\n /**\n * Clears the assignedNodes tracking data for a given `slot`. Note, the current\n * assigned node data is tracked (via _previouslyAssignedNodes and\n * _prevAssignedSlot) to see if `slotchange` should fire. This data may be out\n * of date at this time because the assigned nodes may have already been\n * distributed to another root. This is ok since this data is only used to\n * track changes.\n * @param {HTMLSlotElement} slot\n */\n\n }, {\n key: \"_clearSlotAssignedNodes\",\n value: function _clearSlotAssignedNodes(slot) {\n var slotData = shadyDataForNode(slot);\n var n$ = slotData.assignedNodes;\n slotData.assignedNodes = [];\n slotData.flattenedNodes = [];\n slotData._previouslyAssignedNodes = n$;\n\n if (n$) {\n for (var i = 0; i < n$.length; i++) {\n var n = shadyDataForNode(n$[i]);\n n._prevAssignedSlot = n.assignedSlot; // only clear if it was previously set to this slot;\n // this helps ensure that if the node has otherwise been distributed\n // ignore it.\n\n if (n.assignedSlot === slot) {\n n.assignedSlot = null;\n }\n }\n }\n }\n }, {\n key: \"_addAssignedToFlattenedNodes\",\n value: function _addAssignedToFlattenedNodes(flattened, assigned) {\n for (var i = 0, n; i < assigned.length && (n = assigned[i]); i++) {\n if (n.localName == 'slot') {\n var nestedAssigned = shadyDataForNode(n).assignedNodes;\n\n if (nestedAssigned && nestedAssigned.length) {\n this._addAssignedToFlattenedNodes(flattened, nestedAssigned);\n }\n } else {\n flattened.push(assigned[i]);\n }\n }\n }\n }, {\n key: \"_fireSlotChange\",\n value: function _fireSlotChange(slot) {\n // NOTE: cannot bubble correctly here so not setting bubbles: true\n // Safari tech preview does not bubble but chrome does\n // Spec says it bubbles (https://dom.spec.whatwg.org/#mutation-observers)\n native_methods_dispatchEvent.call(slot, new Event('slotchange'));\n var slotData = shadyDataForNode(slot);\n\n if (slotData.assignedSlot) {\n this._fireSlotChange(slotData.assignedSlot);\n }\n } // Reify dom such that it is at its correct rendering position\n // based on logical distribution.\n // NOTE: here we only compose parents of elements and not the\n // shadowRoot into the host. The latter is performend via a fast path\n // in the `logical-mutation`.insertBefore.\n\n }, {\n key: \"_compose\",\n value: function _compose() {\n var slots = this._slotList;\n var composeList = [];\n\n for (var i = 0; i < slots.length; i++) {\n var parent = slots[i].parentNode;\n /* compose node only if:\n (1) parent does not have a shadowRoot since shadowRoot has already\n composed into the host\n (2) we're not already composing it\n [consider (n^2) but rare better than Set]\n */\n\n var parentData = shadyDataForNode(parent);\n\n if (!(parentData && parentData.root) && composeList.indexOf(parent) < 0) {\n composeList.push(parent);\n }\n }\n\n for (var _i3 = 0; _i3 < composeList.length; _i3++) {\n var node = composeList[_i3];\n var targetNode = node === this ? this.host : node;\n\n this._updateChildNodes(targetNode, this._composeNode(node));\n }\n } // Returns the list of nodes which should be rendered inside `node`.\n\n }, {\n key: \"_composeNode\",\n value: function _composeNode(node) {\n var children = [];\n var c$ = node.childNodes;\n\n for (var i = 0; i < c$.length; i++) {\n var child = c$[i]; // Note: if we see a slot here, the nodes are guaranteed to need to be\n // composed here. This is because if there is redistribution, it has\n // already been handled by this point.\n\n if (this._isInsertionPoint(child)) {\n var flattenedNodes = shadyDataForNode(child).flattenedNodes;\n\n for (var j = 0; j < flattenedNodes.length; j++) {\n var distributedNode = flattenedNodes[j];\n children.push(distributedNode);\n }\n } else {\n children.push(child);\n }\n }\n\n return children;\n }\n }, {\n key: \"_isInsertionPoint\",\n value: function _isInsertionPoint(node) {\n return node.localName == 'slot';\n } // Ensures that the rendered node list inside `container` is `children`.\n\n }, {\n key: \"_updateChildNodes\",\n value: function _updateChildNodes(container, children) {\n var composed = attach_shadow_childNodes(container);\n var splices = calculateSplices(children, composed); // process removals\n\n for (var i = 0, d = 0, s; i < splices.length && (s = splices[i]); i++) {\n for (var j = 0, n; j < s.removed.length && (n = s.removed[j]); j++) {\n // check if the node is still where we expect it is before trying\n // to remove it; this can happen if we move a node and\n // then schedule its previous host for distribution resulting in\n // the node being removed here.\n if (attach_shadow_parentNode(n) === container) {\n native_methods_removeChild.call(container, n);\n } // TODO(sorvell): avoid the need for splicing here.\n\n\n composed.splice(s.index + d, 1);\n }\n\n d -= s.addedCount;\n } // process adds\n\n\n for (var _i4 = 0, _s, next; _i4 < splices.length && (_s = splices[_i4]); _i4++) {\n //eslint-disable-line no-redeclare\n next = composed[_s.index];\n\n for (var _j = _s.index, _n2; _j < _s.index + _s.addedCount; _j++) {\n _n2 = children[_j];\n native_methods_insertBefore.call(container, _n2, next);\n composed.splice(_j, 0, _n2);\n }\n }\n }\n }, {\n key: \"_ensureSlotData\",\n value: function _ensureSlotData() {\n this._pendingSlots = this._pendingSlots || [];\n this._slotList = this._slotList || [];\n this._slotMap = this._slotMap || {};\n }\n }, {\n key: \"_addSlots\",\n value: function _addSlots(slots) {\n var _this$_pendingSlots;\n\n this._ensureSlotData();\n\n (_this$_pendingSlots = this._pendingSlots).push.apply(_this$_pendingSlots, _toConsumableArray(slots));\n }\n }, {\n key: \"_validateSlots\",\n value: function _validateSlots() {\n if (this._pendingSlots && this._pendingSlots.length) {\n this._mapSlots(this._pendingSlots);\n\n this._pendingSlots = [];\n }\n }\n /**\n * Adds the given slots. Slots are maintained in an dom-ordered list.\n * In addition a map of name to slot is updated.\n */\n\n }, {\n key: \"_mapSlots\",\n value: function _mapSlots(slots) {\n var slotNamesToSort;\n\n for (var i = 0; i < slots.length; i++) {\n var slot = slots[i]; // ensure insertionPoints's and their parents have logical dom info.\n // save logical tree info\n // a. for shadyRoot\n // b. for insertion points (fallback)\n // c. for parents of insertion points\n\n recordChildNodes(slot);\n recordChildNodes(slot.parentNode);\n\n var name = this._nameForSlot(slot);\n\n if (this._slotMap[name]) {\n slotNamesToSort = slotNamesToSort || {};\n slotNamesToSort[name] = true;\n\n this._slotMap[name].push(slot);\n } else {\n this._slotMap[name] = [slot];\n }\n\n this._slotList.push(slot);\n }\n\n if (slotNamesToSort) {\n for (var n in slotNamesToSort) {\n this._slotMap[n] = this._sortSlots(this._slotMap[n]);\n }\n }\n }\n }, {\n key: \"_nameForSlot\",\n value: function _nameForSlot(slot) {\n var name = slot['name'] || slot.getAttribute('name') || CATCHALL_NAME;\n slot.__slotName = name;\n return name;\n }\n /**\n * Slots are kept in an ordered list. Slots with the same name\n * are sorted here by tree order.\n */\n\n }, {\n key: \"_sortSlots\",\n value: function _sortSlots(slots) {\n // NOTE: Cannot use `compareDocumentPosition` because it's not polyfilled,\n // but the code here could be used to polyfill the preceeding/following info\n // in `compareDocumentPosition`.\n return slots.sort(function (a, b) {\n var listA = ancestorList(a);\n var listB = ancestorList(b);\n\n for (var i = 0; i < listA.length; i++) {\n var nA = listA[i];\n var nB = listB[i];\n\n if (nA !== nB) {\n var c$ = Array.from(nA.parentNode.childNodes);\n return c$.indexOf(nA) - c$.indexOf(nB);\n }\n }\n });\n }\n /**\n * Removes from tracked slot data any slots contained within `container` and\n * then updates the tracked data (_slotList and _slotMap).\n * Any removed slots also have their `assignedNodes` removed from comopsed dom.\n */\n\n }, {\n key: \"_removeContainedSlots\",\n value: function _removeContainedSlots(container) {\n if (!this._slotList) {\n return;\n }\n\n this._validateSlots();\n\n var didRemove;\n var map = this._slotMap;\n\n for (var n in map) {\n var slots = map[n];\n\n for (var i = 0; i < slots.length; i++) {\n var slot = slots[i];\n\n if (utils_contains(container, slot)) {\n slots.splice(i, 1);\n\n var x = this._slotList.indexOf(slot);\n\n if (x >= 0) {\n this._slotList.splice(x, 1);\n }\n\n i--;\n\n this._removeFlattenedNodes(slot);\n\n didRemove = true;\n }\n }\n }\n\n return didRemove;\n }\n }, {\n key: \"_updateSlotName\",\n value: function _updateSlotName(slot) {\n if (!this._slotList) {\n return;\n } // make sure slotMap is initialized with this slot\n\n\n this._validateSlots();\n\n var oldName = slot.__slotName;\n\n var name = this._nameForSlot(slot);\n\n if (name === oldName) {\n return;\n } // remove from existing tracking\n\n\n var slots = this._slotMap[oldName];\n var i = slots.indexOf(slot);\n\n if (i >= 0) {\n slots.splice(i, 1);\n } // add to new location and sort if nedessary\n\n\n var list = this._slotMap[name] || (this._slotMap[name] = []);\n list.push(slot);\n\n if (list.length > 1) {\n this._slotMap[name] = this._sortSlots(list);\n }\n }\n }, {\n key: \"_removeFlattenedNodes\",\n value: function _removeFlattenedNodes(slot) {\n var data = shadyDataForNode(slot);\n var n$ = data.flattenedNodes;\n\n if (n$) {\n for (var i = 0; i < n$.length; i++) {\n var node = n$[i];\n var parent = attach_shadow_parentNode(node);\n\n if (parent) {\n native_methods_removeChild.call(parent, node);\n }\n }\n }\n\n data.flattenedNodes = [];\n data.assignedNodes = [];\n }\n }, {\n key: \"_hasInsertionPoint\",\n value: function _hasInsertionPoint() {\n this._validateSlots();\n\n return Boolean(this._slotList && this._slotList.length);\n }\n }]);\n\n return ShadyRoot;\n}();\n\n\n/**\n Implements a pared down version of ShadowDOM's scoping, which is easy to\n polyfill across browsers.\n*/\n\nfunction attach_shadow_attachShadow(host, options) {\n if (!host) {\n throw 'Must provide a host.';\n }\n\n if (!options) {\n throw 'Not enough arguments.';\n }\n\n return new attach_shadow_ShadyRoot(ShadyRootConstructionToken, host, options);\n} // Mitigate connect/disconnect spam by wrapping custom element classes.\n\nif (window['customElements'] && settings.inUse) {\n // process connect/disconnect after roots have rendered to avoid\n // issues with reaction stack.\n var connectMap = new Map();\n\n rootRendered = function rootRendered() {\n // allow elements to connect\n var map = Array.from(connectMap);\n connectMap.clear();\n\n for (var _i5 = 0; _i5 < map.length; _i5++) {\n var _map$_i = _slicedToArray(map[_i5], 2),\n e = _map$_i[0],\n value = _map$_i[1];\n\n if (value) {\n e.__shadydom_connectedCallback();\n } else {\n e.__shadydom_disconnectedCallback();\n }\n }\n }; // Document is in loading state and flag is set (deferConnectionCallbacks)\n // so process connection stack when `readystatechange` fires.\n\n\n if (isRendering) {\n document.addEventListener('readystatechange', function () {\n isRendering = false;\n rootRendered();\n }, {\n once: true\n });\n }\n /*\n * (1) elements can only be connected/disconnected if they are in the expected\n * state.\n * (2) never run connect/disconnect during rendering to avoid reaction stack issues.\n */\n\n\n var ManageConnect = function ManageConnect(base, connected, disconnected) {\n var counter = 0;\n var connectFlag = \"__isConnected\".concat(counter++);\n\n if (connected || disconnected) {\n base.prototype.connectedCallback = base.prototype.__shadydom_connectedCallback = function () {\n // if rendering defer connected\n // otherwise connect only if we haven't already\n if (isRendering) {\n connectMap.set(this, true);\n } else if (!this[connectFlag]) {\n this[connectFlag] = true;\n\n if (connected) {\n connected.call(this);\n }\n }\n };\n\n base.prototype.disconnectedCallback = base.prototype.__shadydom_disconnectedCallback = function () {\n // if rendering, cancel a pending connection and queue disconnect,\n // otherwise disconnect only if a connection has been allowed\n if (isRendering) {\n // This is necessary only because calling removeChild\n // on a node that requires distribution leaves it in the DOM tree\n // until distribution.\n // NOTE: remember this is checking the patched isConnected to determine\n // if the node is in the logical tree.\n if (!this.isConnected) {\n connectMap.set(this, false);\n }\n } else if (this[connectFlag]) {\n this[connectFlag] = false;\n\n if (disconnected) {\n disconnected.call(this);\n }\n }\n };\n }\n\n return base;\n };\n\n var define = window['customElements']['define']; // NOTE: Instead of patching customElements.define,\n // re-define on the CustomElementRegistry.prototype.define\n // for Safari 10 compatibility (it's flakey otherwise).\n\n Object.defineProperty(window['CustomElementRegistry'].prototype, 'define', {\n value: function value(name, constructor) {\n var connected = constructor.prototype.connectedCallback;\n var disconnected = constructor.prototype.disconnectedCallback;\n define.call(window['customElements'], name, ManageConnect(constructor, connected, disconnected)); // unpatch connected/disconnected on class; custom elements tears this off\n // so the patch is maintained, but if the user calls these methods for\n // e.g. testing, they will be as expected.\n\n constructor.prototype.connectedCallback = connected;\n constructor.prototype.disconnectedCallback = disconnected;\n }\n });\n}\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/patch-builtins.js\nfunction patch_builtins_typeof(obj) { if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { patch_builtins_typeof = function _typeof(obj) { return typeof obj; }; } else { patch_builtins_typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return patch_builtins_typeof(obj); }\n\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n\n\n\n\n\n\n\n\n\nfunction getAssignedSlot(node) {\n renderRootNode(node);\n var nodeData = shadyDataForNode(node);\n return nodeData && nodeData.assignedSlot || null;\n}\n\nvar windowMixin = {\n // NOTE: ensure these methods are bound to `window` so that `this` is correct\n // when called directly from global context without a receiver; e.g.\n // `addEventListener(...)`.\n addEventListener: patch_events_addEventListener.bind(window),\n removeEventListener: patch_events_removeEventListener.bind(window)\n};\nvar nodeMixin = {\n addEventListener: patch_events_addEventListener,\n removeEventListener: patch_events_removeEventListener,\n appendChild: function appendChild(node) {\n return logical_mutation_insertBefore(this, node);\n },\n insertBefore: function insertBefore(node, ref_node) {\n return logical_mutation_insertBefore(this, node, ref_node);\n },\n removeChild: function removeChild(node) {\n return logical_mutation_removeChild(this, node);\n },\n\n /**\n * @this {Node}\n */\n replaceChild: function replaceChild(node, ref_node) {\n logical_mutation_insertBefore(this, node, ref_node);\n logical_mutation_removeChild(this, ref_node);\n return node;\n },\n\n /**\n * @this {Node}\n */\n cloneNode: function cloneNode(deep) {\n return logical_mutation_cloneNode(this, deep);\n },\n\n /**\n * @this {Node}\n */\n getRootNode: function getRootNode(options) {\n return logical_mutation_getRootNode(this, options);\n },\n contains: function contains(node) {\n return utils_contains(this, node);\n },\n\n /**\n * @this {Node}\n */\n dispatchEvent: function dispatchEvent(event) {\n flush();\n return native_methods_dispatchEvent.call(this, event);\n }\n}; // NOTE: we can do this regardless of the browser supporting native accessors\n// since this is always \"new\" in that case.\n\nObject.defineProperties(nodeMixin, IsConnectedAccessor); // NOTE: For some reason 'Text' redefines 'assignedSlot'\n\nvar textMixin = {\n /**\n * @this {Text}\n */\n get assignedSlot() {\n return getAssignedSlot(this);\n }\n\n};\nvar fragmentMixin = {\n // TODO(sorvell): consider doing native QSA and filtering results.\n\n /**\n * @this {DocumentFragment}\n */\n querySelector: function querySelector(selector) {\n // match selector and halt on first result.\n var result = query(this, function (n) {\n return matchesSelector(n, selector);\n }, function (n) {\n return Boolean(n);\n })[0];\n return result || null;\n },\n\n /**\n * @this {DocumentFragment}\n */\n // TODO(sorvell): `useNative` option relies on native querySelectorAll and\n // misses distributed nodes, see\n // https://github.com/webcomponents/shadydom/pull/210#issuecomment-361435503\n querySelectorAll: function querySelectorAll(selector, useNative) {\n if (useNative) {\n var o = Array.prototype.slice.call(native_methods_querySelectorAll.call(this, selector));\n var root = this.getRootNode();\n return o.filter(function (e) {\n return e.getRootNode() == root;\n });\n }\n\n return query(this, function (n) {\n return matchesSelector(n, selector);\n });\n }\n};\nvar slotMixin = {\n /**\n * @this {HTMLSlotElement}\n */\n assignedNodes: function assignedNodes(options) {\n if (this.localName === 'slot') {\n renderRootNode(this);\n var nodeData = shadyDataForNode(this);\n return nodeData ? (options && options.flatten ? nodeData.flattenedNodes : nodeData.assignedNodes) || [] : [];\n }\n }\n};\nvar elementMixin = extendAll({\n /**\n * @this {HTMLElement}\n */\n setAttribute: function setAttribute(name, value) {\n logical_mutation_setAttribute(this, name, value);\n },\n\n /**\n * @this {HTMLElement}\n */\n removeAttribute: function removeAttribute(name) {\n logical_mutation_removeAttribute(this, name);\n },\n\n /**\n * @this {HTMLElement}\n */\n attachShadow: function attachShadow(options) {\n return attach_shadow_attachShadow(this, options);\n },\n\n /**\n * @this {HTMLElement}\n */\n get slot() {\n return this.getAttribute('slot');\n },\n\n /**\n * @this {HTMLElement}\n */\n set slot(value) {\n logical_mutation_setAttribute(this, 'slot', value);\n },\n\n /**\n * @this {HTMLElement}\n */\n get assignedSlot() {\n return getAssignedSlot(this);\n }\n\n}, fragmentMixin, slotMixin);\nObject.defineProperties(elementMixin, ShadowRootAccessor);\nvar documentMixin = extendAll({\n /**\n * @this {Document}\n */\n importNode: function importNode(node, deep) {\n return logical_mutation_importNode(node, deep);\n },\n\n /**\n * @this {Document}\n */\n getElementById: function getElementById(id) {\n var result = query(this, function (n) {\n return n.id == id;\n }, function (n) {\n return Boolean(n);\n })[0];\n return result || null;\n }\n}, fragmentMixin);\nObject.defineProperties(documentMixin, {\n '_activeElement': ActiveElementAccessor.activeElement\n});\nvar nativeBlur = HTMLElement.prototype.blur;\nvar htmlElementMixin = {\n /**\n * @this {HTMLElement}\n */\n blur: function blur() {\n var nodeData = shadyDataForNode(this);\n var root = nodeData && nodeData.root;\n var shadowActive = root && root.activeElement;\n\n if (shadowActive) {\n shadowActive.blur();\n } else {\n nativeBlur.call(this);\n }\n }\n};\nvar _iteratorNormalCompletion = true;\nvar _didIteratorError = false;\nvar _iteratorError = undefined;\n\ntry {\n var patch_builtins_loop = function _loop() {\n var property = _step.value;\n\n if (property.substring(0, 2) === 'on') {\n Object.defineProperty(htmlElementMixin, property, {\n /** @this {HTMLElement} */\n set: function set(fn) {\n var shadyData = ensureShadyDataForNode(this);\n var eventName = property.substring(2);\n shadyData.__onCallbackListeners[property] && this.removeEventListener(eventName, shadyData.__onCallbackListeners[property]);\n this.addEventListener(eventName, fn, {});\n shadyData.__onCallbackListeners[property] = fn;\n },\n\n /** @this {HTMLElement} */\n get: function get() {\n var shadyData = shadyDataForNode(this);\n return shadyData && shadyData.__onCallbackListeners[property];\n },\n configurable: true\n });\n }\n };\n\n for (var _iterator = Object.getOwnPropertyNames(Document.prototype)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {\n patch_builtins_loop();\n }\n} catch (err) {\n _didIteratorError = true;\n _iteratorError = err;\n} finally {\n try {\n if (!_iteratorNormalCompletion && _iterator.return != null) {\n _iterator.return();\n }\n } finally {\n if (_didIteratorError) {\n throw _iteratorError;\n }\n }\n}\n\nvar shadowRootMixin = {\n /**\n * @this {ShadowRoot}\n */\n addEventListener: function addEventListener(type, fn, optionsOrCapture) {\n if (patch_builtins_typeof(optionsOrCapture) !== 'object') {\n optionsOrCapture = {\n capture: Boolean(optionsOrCapture)\n };\n }\n\n optionsOrCapture.__shadyTarget = this;\n this.host.addEventListener(type, fn, optionsOrCapture);\n },\n\n /**\n * @this {ShadowRoot}\n */\n removeEventListener: function removeEventListener(type, fn, optionsOrCapture) {\n if (patch_builtins_typeof(optionsOrCapture) !== 'object') {\n optionsOrCapture = {\n capture: Boolean(optionsOrCapture)\n };\n }\n\n optionsOrCapture.__shadyTarget = this;\n this.host.removeEventListener(type, fn, optionsOrCapture);\n },\n\n /**\n * @this {ShadowRoot}\n */\n getElementById: function getElementById(id) {\n var result = query(this, function (n) {\n return n.id == id;\n }, function (n) {\n return Boolean(n);\n })[0];\n return result || null;\n }\n};\n\nfunction patchBuiltin(proto, obj) {\n var n$ = Object.getOwnPropertyNames(obj);\n\n for (var i = 0; i < n$.length; i++) {\n var n = n$[i];\n var d = Object.getOwnPropertyDescriptor(obj, n); // NOTE: we prefer writing directly here because some browsers\n // have descriptors that are writable but not configurable (e.g.\n // `appendChild` on older browsers)\n\n if (d.value) {\n proto[n] = d.value;\n } else {\n Object.defineProperty(proto, n, d);\n }\n }\n} // Apply patches to builtins (e.g. Element.prototype). Some of these patches\n// can be done unconditionally (mostly methods like\n// `Element.prototype.appendChild`) and some can only be done when the browser\n// has proper descriptors on the builtin prototype\n// (e.g. `Element.prototype.firstChild`)`. When descriptors are not available,\n// elements are individually patched when needed (see e.g.\n// `patchInside/OutsideElementAccessors` in `patch-accessors.js`).\n\n\nfunction patchBuiltins() {\n var nativeHTMLElement = window['customElements'] && window['customElements']['nativeHTMLElement'] || HTMLElement; // These patches can always be done, for all supported browsers.\n\n patchBuiltin(attach_shadow_ShadyRoot.prototype, shadowRootMixin);\n patchBuiltin(window.Node.prototype, nodeMixin);\n patchBuiltin(window.Window.prototype, windowMixin);\n patchBuiltin(window.Text.prototype, textMixin);\n patchBuiltin(window.DocumentFragment.prototype, fragmentMixin);\n patchBuiltin(window.Element.prototype, elementMixin);\n patchBuiltin(window.Document.prototype, documentMixin);\n\n if (window.HTMLSlotElement) {\n patchBuiltin(window.HTMLSlotElement.prototype, slotMixin);\n }\n\n patchBuiltin(nativeHTMLElement.prototype, htmlElementMixin); // These patches can *only* be done\n // on browsers that have proper property descriptors on builtin prototypes.\n // This includes: IE11, Edge, Chrome >= 4?; Safari >= 10, Firefox\n // On older browsers (Chrome <= 4?, Safari 9), a per element patching\n // strategy is used for patching accessors.\n\n if (settings.hasDescriptors) {\n patchAccessors(window.Node.prototype);\n patchAccessors(window.Text.prototype);\n patchAccessors(window.DocumentFragment.prototype);\n patchAccessors(window.Element.prototype);\n patchAccessors(nativeHTMLElement.prototype);\n patchAccessors(window.Document.prototype);\n\n if (window.HTMLSlotElement) {\n patchAccessors(window.HTMLSlotElement.prototype);\n }\n }\n\n patchShadowRootAccessors(attach_shadow_ShadyRoot.prototype);\n}\n// CONCATENATED MODULE: ./node_modules/@webcomponents/shadydom/src/shadydom.js\n/**\n@license\nCopyright (c) 2016 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\nThe complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\nThe complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\nCode distributed by Google as part of the polymer project is also\nsubject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n*/\n\n/**\n * Patches elements that interacts with ShadyDOM\n * such that tree traversal and mutation apis act like they would under\n * ShadowDOM.\n *\n * This import enables seemless interaction with ShadyDOM powered\n * custom elements, enabling better interoperation with 3rd party code,\n * libraries, and frameworks that use DOM tree manipulation apis.\n */\n\n\n\n\n\n\n\n\n\n\nif (settings.inUse) {\n var ShadyDOM = {\n // TODO(sorvell): remove when Polymer does not depend on this.\n 'inUse': settings.inUse,\n // NOTE: old browsers without prototype accessors (very old Chrome\n // and Safari) need manually patched accessors to properly set\n // `innerHTML` and `textContent` when an element is:\n // (1) inside a shadowRoot\n // (2) does not have special (slot) children itself\n // (3) and setting the property needs to provoke distribution (because\n // a nested slot is added/removed)\n 'patch': function patch(node) {\n patchInsideElementAccessors(node);\n patchOutsideElementAccessors(node);\n return node;\n },\n 'isShadyRoot': utils_isShadyRoot,\n 'enqueue': enqueue,\n 'flush': flush,\n 'settings': settings,\n 'filterMutations': filterMutations,\n 'observeChildren': observe_changes_observeChildren,\n 'unobserveChildren': observe_changes_unobserveChildren,\n 'nativeMethods': native_methods_namespaceObject,\n 'nativeTree': accessors,\n // Set to true to defer native custom elements connection until the\n // document has fully parsed. This enables custom elements that create\n // shadowRoots to be defined while the document is loading. Elements\n // customized as they are created by the parser will successfully\n // render with this flag on.\n 'deferConnectionCallbacks': settings['deferConnectionCallbacks'],\n // Integration point with ShadyCSS to disable styling MutationObserver,\n // as ShadyDOM will now handle dynamic scoping.\n 'handlesDynamicScoping': true\n };\n window['ShadyDOM'] = ShadyDOM; // Apply patches to events...\n\n patchEvents(); // Apply patches to builtins (e.g. Element.prototype) where applicable.\n\n patchBuiltins();\n window.ShadowRoot = attach_shadow_ShadyRoot;\n}\n\n//# sourceURL=webpack:///./node_modules/@webcomponents/shadydom/src/shadydom.js_+_16_modules?"); - -/***/ }) - -}]); \ No newline at end of file diff --git a/packages/uikit-workshop/dist/styleguide/js/1-chunk-162a89af2e10f9bdb50b.js b/packages/uikit-workshop/dist/styleguide/js/1-chunk-162a89af2e10f9bdb50b.js deleted file mode 100644 index 4ca1c7004..000000000 --- a/packages/uikit-workshop/dist/styleguide/js/1-chunk-162a89af2e10f9bdb50b.js +++ /dev/null @@ -1,15 +0,0 @@ -(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],{ - -/***/ "./node_modules/document-register-element/build/document-register-element.node.js": -/*!****************************************************************************************!*\ - !*** ./node_modules/document-register-element/build/document-register-element.node.js ***! - \****************************************************************************************/ -/*! no static exports found */ -/*! ModuleConcatenation bailout: Module is not an ECMAScript module */ -/***/ (function(module, exports, __webpack_require__) { - -eval("/* WEBPACK VAR INJECTION */(function(global) {function _typeof(obj) { if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\n/*!\nISC License\n\nCopyright (c) 2014-2018, Andrea Giammarchi, @WebReflection\n\nPermission to use, copy, modify, and/or distribute this software for any\npurpose with or without fee is hereby granted, provided that the above\ncopyright notice and this permission notice appear in all copies.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\nREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY\nAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\nINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM\nLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE\nOR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR\nPERFORMANCE OF THIS SOFTWARE.\n\n*/\n// global window Object\n// optional polyfill info\n// 'auto' used by default, everything is feature detected\n// 'force' use the polyfill even if not fully needed\nfunction installCustomElements(window, polyfill) {\n 'use strict'; // DO NOT USE THIS FILE DIRECTLY, IT WON'T WORK\n // THIS IS A PROJECT BASED ON A BUILD SYSTEM\n // THIS FILE IS JUST WRAPPED UP RESULTING IN\n // build/document-register-element.node.js\n\n var document = window.document,\n Object = window.Object;\n\n var htmlClass = function (info) {\n // (C) Andrea Giammarchi - @WebReflection - MIT Style\n var catchClass = /^[A-Z]+[a-z]/,\n filterBy = function filterBy(re) {\n var arr = [],\n tag;\n\n for (tag in register) {\n if (re.test(tag)) arr.push(tag);\n }\n\n return arr;\n },\n add = function add(Class, tag) {\n tag = tag.toLowerCase();\n\n if (!(tag in register)) {\n register[Class] = (register[Class] || []).concat(tag);\n register[tag] = register[tag.toUpperCase()] = Class;\n }\n },\n register = (Object.create || Object)(null),\n htmlClass = {},\n i,\n section,\n tags,\n Class;\n\n for (section in info) {\n for (Class in info[section]) {\n tags = info[section][Class];\n register[Class] = tags;\n\n for (i = 0; i < tags.length; i++) {\n register[tags[i].toLowerCase()] = register[tags[i].toUpperCase()] = Class;\n }\n }\n }\n\n htmlClass.get = function get(tagOrClass) {\n return typeof tagOrClass === 'string' ? register[tagOrClass] || (catchClass.test(tagOrClass) ? [] : '') : filterBy(tagOrClass);\n };\n\n htmlClass.set = function set(tag, Class) {\n return catchClass.test(tag) ? add(tag, Class) : add(Class, tag), htmlClass;\n };\n\n return htmlClass;\n }({\n \"collections\": {\n \"HTMLAllCollection\": [\"all\"],\n \"HTMLCollection\": [\"forms\"],\n \"HTMLFormControlsCollection\": [\"elements\"],\n \"HTMLOptionsCollection\": [\"options\"]\n },\n \"elements\": {\n \"Element\": [\"element\"],\n \"HTMLAnchorElement\": [\"a\"],\n \"HTMLAppletElement\": [\"applet\"],\n \"HTMLAreaElement\": [\"area\"],\n \"HTMLAttachmentElement\": [\"attachment\"],\n \"HTMLAudioElement\": [\"audio\"],\n \"HTMLBRElement\": [\"br\"],\n \"HTMLBaseElement\": [\"base\"],\n \"HTMLBodyElement\": [\"body\"],\n \"HTMLButtonElement\": [\"button\"],\n \"HTMLCanvasElement\": [\"canvas\"],\n \"HTMLContentElement\": [\"content\"],\n \"HTMLDListElement\": [\"dl\"],\n \"HTMLDataElement\": [\"data\"],\n \"HTMLDataListElement\": [\"datalist\"],\n \"HTMLDetailsElement\": [\"details\"],\n \"HTMLDialogElement\": [\"dialog\"],\n \"HTMLDirectoryElement\": [\"dir\"],\n \"HTMLDivElement\": [\"div\"],\n \"HTMLDocument\": [\"document\"],\n \"HTMLElement\": [\"element\", \"abbr\", \"address\", \"article\", \"aside\", \"b\", \"bdi\", \"bdo\", \"cite\", \"code\", \"command\", \"dd\", \"dfn\", \"dt\", \"em\", \"figcaption\", \"figure\", \"footer\", \"header\", \"i\", \"kbd\", \"mark\", \"nav\", \"noscript\", \"rp\", \"rt\", \"ruby\", \"s\", \"samp\", \"section\", \"small\", \"strong\", \"sub\", \"summary\", \"sup\", \"u\", \"var\", \"wbr\"],\n \"HTMLEmbedElement\": [\"embed\"],\n \"HTMLFieldSetElement\": [\"fieldset\"],\n \"HTMLFontElement\": [\"font\"],\n \"HTMLFormElement\": [\"form\"],\n \"HTMLFrameElement\": [\"frame\"],\n \"HTMLFrameSetElement\": [\"frameset\"],\n \"HTMLHRElement\": [\"hr\"],\n \"HTMLHeadElement\": [\"head\"],\n \"HTMLHeadingElement\": [\"h1\", \"h2\", \"h3\", \"h4\", \"h5\", \"h6\"],\n \"HTMLHtmlElement\": [\"html\"],\n \"HTMLIFrameElement\": [\"iframe\"],\n \"HTMLImageElement\": [\"img\"],\n \"HTMLInputElement\": [\"input\"],\n \"HTMLKeygenElement\": [\"keygen\"],\n \"HTMLLIElement\": [\"li\"],\n \"HTMLLabelElement\": [\"label\"],\n \"HTMLLegendElement\": [\"legend\"],\n \"HTMLLinkElement\": [\"link\"],\n \"HTMLMapElement\": [\"map\"],\n \"HTMLMarqueeElement\": [\"marquee\"],\n \"HTMLMediaElement\": [\"media\"],\n \"HTMLMenuElement\": [\"menu\"],\n \"HTMLMenuItemElement\": [\"menuitem\"],\n \"HTMLMetaElement\": [\"meta\"],\n \"HTMLMeterElement\": [\"meter\"],\n \"HTMLModElement\": [\"del\", \"ins\"],\n \"HTMLOListElement\": [\"ol\"],\n \"HTMLObjectElement\": [\"object\"],\n \"HTMLOptGroupElement\": [\"optgroup\"],\n \"HTMLOptionElement\": [\"option\"],\n \"HTMLOutputElement\": [\"output\"],\n \"HTMLParagraphElement\": [\"p\"],\n \"HTMLParamElement\": [\"param\"],\n \"HTMLPictureElement\": [\"picture\"],\n \"HTMLPreElement\": [\"pre\"],\n \"HTMLProgressElement\": [\"progress\"],\n \"HTMLQuoteElement\": [\"blockquote\", \"q\", \"quote\"],\n \"HTMLScriptElement\": [\"script\"],\n \"HTMLSelectElement\": [\"select\"],\n \"HTMLShadowElement\": [\"shadow\"],\n \"HTMLSlotElement\": [\"slot\"],\n \"HTMLSourceElement\": [\"source\"],\n \"HTMLSpanElement\": [\"span\"],\n \"HTMLStyleElement\": [\"style\"],\n \"HTMLTableCaptionElement\": [\"caption\"],\n \"HTMLTableCellElement\": [\"td\", \"th\"],\n \"HTMLTableColElement\": [\"col\", \"colgroup\"],\n \"HTMLTableElement\": [\"table\"],\n \"HTMLTableRowElement\": [\"tr\"],\n \"HTMLTableSectionElement\": [\"thead\", \"tbody\", \"tfoot\"],\n \"HTMLTemplateElement\": [\"template\"],\n \"HTMLTextAreaElement\": [\"textarea\"],\n \"HTMLTimeElement\": [\"time\"],\n \"HTMLTitleElement\": [\"title\"],\n \"HTMLTrackElement\": [\"track\"],\n \"HTMLUListElement\": [\"ul\"],\n \"HTMLUnknownElement\": [\"unknown\", \"vhgroupv\", \"vkeygen\"],\n \"HTMLVideoElement\": [\"video\"]\n },\n \"nodes\": {\n \"Attr\": [\"node\"],\n \"Audio\": [\"audio\"],\n \"CDATASection\": [\"node\"],\n \"CharacterData\": [\"node\"],\n \"Comment\": [\"#comment\"],\n \"Document\": [\"#document\"],\n \"DocumentFragment\": [\"#document-fragment\"],\n \"DocumentType\": [\"node\"],\n \"HTMLDocument\": [\"#document\"],\n \"Image\": [\"img\"],\n \"Option\": [\"option\"],\n \"ProcessingInstruction\": [\"node\"],\n \"ShadowRoot\": [\"#shadow-root\"],\n \"Text\": [\"#text\"],\n \"XMLDocument\": [\"xml\"]\n }\n }); // passed at runtime, configurable via nodejs module\n\n\n if (_typeof(polyfill) !== 'object') polyfill = {\n type: polyfill || 'auto'\n };\n\n var // V0 polyfill entry\n REGISTER_ELEMENT = 'registerElement',\n // IE < 11 only + old WebKit for attributes + feature detection\n EXPANDO_UID = '__' + REGISTER_ELEMENT + (window.Math.random() * 10e4 >> 0),\n // shortcuts and costants\n ADD_EVENT_LISTENER = 'addEventListener',\n ATTACHED = 'attached',\n CALLBACK = 'Callback',\n DETACHED = 'detached',\n EXTENDS = 'extends',\n ATTRIBUTE_CHANGED_CALLBACK = 'attributeChanged' + CALLBACK,\n ATTACHED_CALLBACK = ATTACHED + CALLBACK,\n CONNECTED_CALLBACK = 'connected' + CALLBACK,\n DISCONNECTED_CALLBACK = 'disconnected' + CALLBACK,\n CREATED_CALLBACK = 'created' + CALLBACK,\n DETACHED_CALLBACK = DETACHED + CALLBACK,\n ADDITION = 'ADDITION',\n MODIFICATION = 'MODIFICATION',\n REMOVAL = 'REMOVAL',\n DOM_ATTR_MODIFIED = 'DOMAttrModified',\n DOM_CONTENT_LOADED = 'DOMContentLoaded',\n DOM_SUBTREE_MODIFIED = 'DOMSubtreeModified',\n PREFIX_TAG = '<',\n PREFIX_IS = '=',\n // valid and invalid node names\n validName = /^[A-Z][A-Z0-9]*(?:-[A-Z0-9]+)+$/,\n invalidNames = ['ANNOTATION-XML', 'COLOR-PROFILE', 'FONT-FACE', 'FONT-FACE-SRC', 'FONT-FACE-URI', 'FONT-FACE-FORMAT', 'FONT-FACE-NAME', 'MISSING-GLYPH'],\n // registered types and their prototypes\n types = [],\n protos = [],\n // to query subnodes\n query = '',\n // html shortcut used to feature detect\n documentElement = document.documentElement,\n // ES5 inline helpers || basic patches\n indexOf = types.indexOf || function (v) {\n for (var i = this.length; i-- && this[i] !== v;) {}\n\n return i;\n },\n // other helpers / shortcuts\n OP = Object.prototype,\n hOP = OP.hasOwnProperty,\n iPO = OP.isPrototypeOf,\n defineProperty = Object.defineProperty,\n empty = [],\n gOPD = Object.getOwnPropertyDescriptor,\n gOPN = Object.getOwnPropertyNames,\n gPO = Object.getPrototypeOf,\n sPO = Object.setPrototypeOf,\n // jshint proto: true\n hasProto = !!Object.__proto__,\n // V1 helpers\n fixGetClass = false,\n DRECEV1 = '__dreCEv1',\n customElements = window.customElements,\n usableCustomElements = !/^force/.test(polyfill.type) && !!(customElements && customElements.define && customElements.get && customElements.whenDefined),\n Dict = Object.create || Object,\n Map = window.Map || function Map() {\n var K = [],\n V = [],\n i;\n return {\n get: function get(k) {\n return V[indexOf.call(K, k)];\n },\n set: function set(k, v) {\n i = indexOf.call(K, k);\n if (i < 0) V[K.push(k) - 1] = v;else V[i] = v;\n }\n };\n },\n Promise = window.Promise || function (fn) {\n var notify = [],\n done = false,\n p = {\n 'catch': function _catch() {\n return p;\n },\n 'then': function then(cb) {\n notify.push(cb);\n if (done) setTimeout(resolve, 1);\n return p;\n }\n };\n\n function resolve(value) {\n done = true;\n\n while (notify.length) {\n notify.shift()(value);\n }\n }\n\n fn(resolve);\n return p;\n },\n justCreated = false,\n constructors = Dict(null),\n waitingList = Dict(null),\n nodeNames = new Map(),\n secondArgument = function secondArgument(is) {\n return is.toLowerCase();\n },\n // used to create unique instances\n create = Object.create || function Bridge(proto) {\n // silly broken polyfill probably ever used but short enough to work\n return proto ? (Bridge.prototype = proto, new Bridge()) : this;\n },\n // will set the prototype if possible\n // or copy over all properties\n setPrototype = sPO || (hasProto ? function (o, p) {\n o.__proto__ = p;\n return o;\n } : gOPN && gOPD ? function () {\n function setProperties(o, p) {\n for (var key, names = gOPN(p), i = 0, length = names.length; i < length; i++) {\n key = names[i];\n\n if (!hOP.call(o, key)) {\n defineProperty(o, key, gOPD(p, key));\n }\n }\n }\n\n return function (o, p) {\n do {\n setProperties(o, p);\n } while ((p = gPO(p)) && !iPO.call(p, o));\n\n return o;\n };\n }() : function (o, p) {\n for (var key in p) {\n o[key] = p[key];\n }\n\n return o;\n }),\n // DOM shortcuts and helpers, if any\n MutationObserver = window.MutationObserver || window.WebKitMutationObserver,\n HTMLAnchorElement = window.HTMLAnchorElement,\n HTMLElementPrototype = (window.HTMLElement || window.Element || window.Node).prototype,\n IE8 = !iPO.call(HTMLElementPrototype, documentElement),\n safeProperty = IE8 ? function (o, k, d) {\n o[k] = d.value;\n return o;\n } : defineProperty,\n isValidNode = IE8 ? function (node) {\n return node.nodeType === 1;\n } : function (node) {\n return iPO.call(HTMLElementPrototype, node);\n },\n targets = IE8 && [],\n attachShadow = HTMLElementPrototype.attachShadow,\n cloneNode = HTMLElementPrototype.cloneNode,\n dispatchEvent = HTMLElementPrototype.dispatchEvent,\n getAttribute = HTMLElementPrototype.getAttribute,\n hasAttribute = HTMLElementPrototype.hasAttribute,\n removeAttribute = HTMLElementPrototype.removeAttribute,\n setAttribute = HTMLElementPrototype.setAttribute,\n // replaced later on\n createElement = document.createElement,\n importNode = document.importNode,\n patchedCreateElement = createElement,\n // shared observer for all attributes\n attributesObserver = MutationObserver && {\n attributes: true,\n characterData: true,\n attributeOldValue: true\n },\n // useful to detect only if there's no MutationObserver\n DOMAttrModified = MutationObserver || function (e) {\n doesNotSupportDOMAttrModified = false;\n documentElement.removeEventListener(DOM_ATTR_MODIFIED, DOMAttrModified);\n },\n // will both be used to make DOMNodeInserted asynchronous\n asapQueue,\n asapTimer = 0,\n // internal flags\n V0 = REGISTER_ELEMENT in document && !/^force-all/.test(polyfill.type),\n setListener = true,\n justSetup = false,\n doesNotSupportDOMAttrModified = true,\n dropDomContentLoaded = true,\n // needed for the innerHTML helper\n notFromInnerHTMLHelper = true,\n // optionally defined later on\n onSubtreeModified,\n callDOMAttrModified,\n getAttributesMirror,\n observer,\n observe,\n // based on setting prototype capability\n // will check proto or the expando attribute\n // in order to setup the node once\n patchIfNotAlready,\n patch,\n // used for tests\n tmp; // IE11 disconnectedCallback issue #\n // to be tested before any createElement patch\n\n\n if (MutationObserver) {\n // original fix:\n // https://github.com/javan/mutation-observer-inner-html-shim\n tmp = document.createElement('div');\n tmp.innerHTML = '
';\n new MutationObserver(function (mutations, observer) {\n if (mutations[0] && mutations[0].type == 'childList' && !mutations[0].removedNodes[0].childNodes.length) {\n tmp = gOPD(HTMLElementPrototype, 'innerHTML');\n\n var _set = tmp && tmp.set;\n\n if (_set) defineProperty(HTMLElementPrototype, 'innerHTML', {\n set: function set(value) {\n while (this.lastChild) {\n this.removeChild(this.lastChild);\n }\n\n _set.call(this, value);\n }\n });\n }\n\n observer.disconnect();\n tmp = null;\n }).observe(tmp, {\n childList: true,\n subtree: true\n });\n tmp.innerHTML = \"\";\n } // only if needed\n\n\n if (!V0) {\n if (sPO || hasProto) {\n patchIfNotAlready = function patchIfNotAlready(node, proto) {\n if (!iPO.call(proto, node)) {\n setupNode(node, proto);\n }\n };\n\n patch = setupNode;\n } else {\n patchIfNotAlready = function patchIfNotAlready(node, proto) {\n if (!node[EXPANDO_UID]) {\n node[EXPANDO_UID] = Object(true);\n setupNode(node, proto);\n }\n };\n\n patch = patchIfNotAlready;\n }\n\n if (IE8) {\n doesNotSupportDOMAttrModified = false;\n\n (function () {\n var descriptor = gOPD(HTMLElementPrototype, ADD_EVENT_LISTENER),\n addEventListener = descriptor.value,\n patchedRemoveAttribute = function patchedRemoveAttribute(name) {\n var e = new CustomEvent(DOM_ATTR_MODIFIED, {\n bubbles: true\n });\n e.attrName = name;\n e.prevValue = getAttribute.call(this, name);\n e.newValue = null;\n e[REMOVAL] = e.attrChange = 2;\n removeAttribute.call(this, name);\n dispatchEvent.call(this, e);\n },\n patchedSetAttribute = function patchedSetAttribute(name, value) {\n var had = hasAttribute.call(this, name),\n old = had && getAttribute.call(this, name),\n e = new CustomEvent(DOM_ATTR_MODIFIED, {\n bubbles: true\n });\n setAttribute.call(this, name, value);\n e.attrName = name;\n e.prevValue = had ? old : null;\n e.newValue = value;\n\n if (had) {\n e[MODIFICATION] = e.attrChange = 1;\n } else {\n e[ADDITION] = e.attrChange = 0;\n }\n\n dispatchEvent.call(this, e);\n },\n onPropertyChange = function onPropertyChange(e) {\n // jshint eqnull:true\n var node = e.currentTarget,\n superSecret = node[EXPANDO_UID],\n propertyName = e.propertyName,\n event;\n\n if (superSecret.hasOwnProperty(propertyName)) {\n superSecret = superSecret[propertyName];\n event = new CustomEvent(DOM_ATTR_MODIFIED, {\n bubbles: true\n });\n event.attrName = superSecret.name;\n event.prevValue = superSecret.value || null;\n event.newValue = superSecret.value = node[propertyName] || null;\n\n if (event.prevValue == null) {\n event[ADDITION] = event.attrChange = 0;\n } else {\n event[MODIFICATION] = event.attrChange = 1;\n }\n\n dispatchEvent.call(node, event);\n }\n };\n\n descriptor.value = function (type, handler, capture) {\n if (type === DOM_ATTR_MODIFIED && this[ATTRIBUTE_CHANGED_CALLBACK] && this.setAttribute !== patchedSetAttribute) {\n this[EXPANDO_UID] = {\n className: {\n name: 'class',\n value: this.className\n }\n };\n this.setAttribute = patchedSetAttribute;\n this.removeAttribute = patchedRemoveAttribute;\n addEventListener.call(this, 'propertychange', onPropertyChange);\n }\n\n addEventListener.call(this, type, handler, capture);\n };\n\n defineProperty(HTMLElementPrototype, ADD_EVENT_LISTENER, descriptor);\n })();\n } else if (!MutationObserver) {\n documentElement[ADD_EVENT_LISTENER](DOM_ATTR_MODIFIED, DOMAttrModified);\n documentElement.setAttribute(EXPANDO_UID, 1);\n documentElement.removeAttribute(EXPANDO_UID);\n\n if (doesNotSupportDOMAttrModified) {\n onSubtreeModified = function onSubtreeModified(e) {\n var node = this,\n oldAttributes,\n newAttributes,\n key;\n\n if (node === e.target) {\n oldAttributes = node[EXPANDO_UID];\n node[EXPANDO_UID] = newAttributes = getAttributesMirror(node);\n\n for (key in newAttributes) {\n if (!(key in oldAttributes)) {\n // attribute was added\n return callDOMAttrModified(0, node, key, oldAttributes[key], newAttributes[key], ADDITION);\n } else if (newAttributes[key] !== oldAttributes[key]) {\n // attribute was changed\n return callDOMAttrModified(1, node, key, oldAttributes[key], newAttributes[key], MODIFICATION);\n }\n } // checking if it has been removed\n\n\n for (key in oldAttributes) {\n if (!(key in newAttributes)) {\n // attribute removed\n return callDOMAttrModified(2, node, key, oldAttributes[key], newAttributes[key], REMOVAL);\n }\n }\n }\n };\n\n callDOMAttrModified = function callDOMAttrModified(attrChange, currentTarget, attrName, prevValue, newValue, action) {\n var e = {\n attrChange: attrChange,\n currentTarget: currentTarget,\n attrName: attrName,\n prevValue: prevValue,\n newValue: newValue\n };\n e[action] = attrChange;\n onDOMAttrModified(e);\n };\n\n getAttributesMirror = function getAttributesMirror(node) {\n for (var attr, name, result = {}, attributes = node.attributes, i = 0, length = attributes.length; i < length; i++) {\n attr = attributes[i];\n name = attr.name;\n\n if (name !== 'setAttribute') {\n result[name] = attr.value;\n }\n }\n\n return result;\n };\n }\n } // set as enumerable, writable and configurable\n\n\n document[REGISTER_ELEMENT] = function registerElement(type, options) {\n upperType = type.toUpperCase();\n\n if (setListener) {\n // only first time document.registerElement is used\n // we need to set this listener\n // setting it by default might slow down for no reason\n setListener = false;\n\n if (MutationObserver) {\n observer = function (attached, detached) {\n function checkEmAll(list, callback) {\n for (var i = 0, length = list.length; i < length; callback(list[i++])) {}\n }\n\n return new MutationObserver(function (records) {\n for (var current, node, newValue, i = 0, length = records.length; i < length; i++) {\n current = records[i];\n\n if (current.type === 'childList') {\n checkEmAll(current.addedNodes, attached);\n checkEmAll(current.removedNodes, detached);\n } else {\n node = current.target;\n\n if (notFromInnerHTMLHelper && node[ATTRIBUTE_CHANGED_CALLBACK] && current.attributeName !== 'style') {\n newValue = getAttribute.call(node, current.attributeName);\n\n if (newValue !== current.oldValue) {\n node[ATTRIBUTE_CHANGED_CALLBACK](current.attributeName, current.oldValue, newValue);\n }\n }\n }\n }\n });\n }(executeAction(ATTACHED), executeAction(DETACHED));\n\n observe = function observe(node) {\n observer.observe(node, {\n childList: true,\n subtree: true\n });\n return node;\n };\n\n observe(document);\n\n if (attachShadow) {\n HTMLElementPrototype.attachShadow = function () {\n return observe(attachShadow.apply(this, arguments));\n };\n }\n } else {\n asapQueue = [];\n document[ADD_EVENT_LISTENER]('DOMNodeInserted', onDOMNode(ATTACHED));\n document[ADD_EVENT_LISTENER]('DOMNodeRemoved', onDOMNode(DETACHED));\n }\n\n document[ADD_EVENT_LISTENER](DOM_CONTENT_LOADED, onReadyStateChange);\n document[ADD_EVENT_LISTENER]('readystatechange', onReadyStateChange);\n\n document.importNode = function (node, deep) {\n switch (node.nodeType) {\n case 1:\n return setupAll(document, importNode, [node, !!deep]);\n\n case 11:\n for (var fragment = document.createDocumentFragment(), childNodes = node.childNodes, length = childNodes.length, i = 0; i < length; i++) {\n fragment.appendChild(document.importNode(childNodes[i], !!deep));\n }\n\n return fragment;\n\n default:\n return cloneNode.call(node, !!deep);\n }\n };\n\n HTMLElementPrototype.cloneNode = function (deep) {\n return setupAll(this, cloneNode, [!!deep]);\n };\n }\n\n if (justSetup) return justSetup = false;\n\n if (-2 < indexOf.call(types, PREFIX_IS + upperType) + indexOf.call(types, PREFIX_TAG + upperType)) {\n throwTypeError(type);\n }\n\n if (!validName.test(upperType) || -1 < indexOf.call(invalidNames, upperType)) {\n throw new Error('The type ' + type + ' is invalid');\n }\n\n var constructor = function constructor() {\n return extending ? document.createElement(nodeName, upperType) : document.createElement(nodeName);\n },\n opt = options || OP,\n extending = hOP.call(opt, EXTENDS),\n nodeName = extending ? options[EXTENDS].toUpperCase() : upperType,\n upperType,\n i;\n\n if (extending && -1 < indexOf.call(types, PREFIX_TAG + nodeName)) {\n throwTypeError(nodeName);\n }\n\n i = types.push((extending ? PREFIX_IS : PREFIX_TAG) + upperType) - 1;\n query = query.concat(query.length ? ',' : '', extending ? nodeName + '[is=\"' + type.toLowerCase() + '\"]' : nodeName);\n constructor.prototype = protos[i] = hOP.call(opt, 'prototype') ? opt.prototype : create(HTMLElementPrototype);\n if (query.length) loopAndVerify(document.querySelectorAll(query), ATTACHED);\n return constructor;\n };\n\n document.createElement = patchedCreateElement = function patchedCreateElement(localName, typeExtension) {\n var is = getIs(typeExtension),\n node = is ? createElement.call(document, localName, secondArgument(is)) : createElement.call(document, localName),\n name = '' + localName,\n i = indexOf.call(types, (is ? PREFIX_IS : PREFIX_TAG) + (is || name).toUpperCase()),\n setup = -1 < i;\n\n if (is) {\n node.setAttribute('is', is = is.toLowerCase());\n\n if (setup) {\n setup = isInQSA(name.toUpperCase(), is);\n }\n }\n\n notFromInnerHTMLHelper = !document.createElement.innerHTMLHelper;\n if (setup) patch(node, protos[i]);\n return node;\n };\n }\n\n function ASAP() {\n var queue = asapQueue.splice(0, asapQueue.length);\n asapTimer = 0;\n\n while (queue.length) {\n queue.shift().call(null, queue.shift());\n }\n }\n\n function loopAndVerify(list, action) {\n for (var i = 0, length = list.length; i < length; i++) {\n verifyAndSetupAndAction(list[i], action);\n }\n }\n\n function loopAndSetup(list) {\n for (var i = 0, length = list.length, node; i < length; i++) {\n node = list[i];\n patch(node, protos[getTypeIndex(node)]);\n }\n }\n\n function executeAction(action) {\n return function (node) {\n if (isValidNode(node)) {\n verifyAndSetupAndAction(node, action);\n if (query.length) loopAndVerify(node.querySelectorAll(query), action);\n }\n };\n }\n\n function getTypeIndex(target) {\n var is = getAttribute.call(target, 'is'),\n nodeName = target.nodeName.toUpperCase(),\n i = indexOf.call(types, is ? PREFIX_IS + is.toUpperCase() : PREFIX_TAG + nodeName);\n return is && -1 < i && !isInQSA(nodeName, is) ? -1 : i;\n }\n\n function isInQSA(name, type) {\n return -1 < query.indexOf(name + '[is=\"' + type + '\"]');\n }\n\n function onDOMAttrModified(e) {\n var node = e.currentTarget,\n attrChange = e.attrChange,\n attrName = e.attrName,\n target = e.target,\n addition = e[ADDITION] || 2,\n removal = e[REMOVAL] || 3;\n\n if (notFromInnerHTMLHelper && (!target || target === node) && node[ATTRIBUTE_CHANGED_CALLBACK] && attrName !== 'style' && (e.prevValue !== e.newValue || // IE9, IE10, and Opera 12 gotcha\n e.newValue === '' && (attrChange === addition || attrChange === removal))) {\n node[ATTRIBUTE_CHANGED_CALLBACK](attrName, attrChange === addition ? null : e.prevValue, attrChange === removal ? null : e.newValue);\n }\n }\n\n function onDOMNode(action) {\n var executor = executeAction(action);\n return function (e) {\n asapQueue.push(executor, e.target);\n if (asapTimer) clearTimeout(asapTimer);\n asapTimer = setTimeout(ASAP, 1);\n };\n }\n\n function onReadyStateChange(e) {\n if (dropDomContentLoaded) {\n dropDomContentLoaded = false;\n e.currentTarget.removeEventListener(DOM_CONTENT_LOADED, onReadyStateChange);\n }\n\n if (query.length) loopAndVerify((e.target || document).querySelectorAll(query), e.detail === DETACHED ? DETACHED : ATTACHED);\n if (IE8) purge();\n }\n\n function patchedSetAttribute(name, value) {\n // jshint validthis:true\n var self = this;\n setAttribute.call(self, name, value);\n onSubtreeModified.call(self, {\n target: self\n });\n }\n\n function setupAll(context, callback, args) {\n var node = callback.apply(context, args),\n i = getTypeIndex(node);\n if (-1 < i) patch(node, protos[i]);\n if (args.pop() && query.length) loopAndSetup(node.querySelectorAll(query));\n return node;\n }\n\n function setupNode(node, proto) {\n setPrototype(node, proto);\n\n if (observer) {\n observer.observe(node, attributesObserver);\n } else {\n if (doesNotSupportDOMAttrModified) {\n node.setAttribute = patchedSetAttribute;\n node[EXPANDO_UID] = getAttributesMirror(node);\n node[ADD_EVENT_LISTENER](DOM_SUBTREE_MODIFIED, onSubtreeModified);\n }\n\n node[ADD_EVENT_LISTENER](DOM_ATTR_MODIFIED, onDOMAttrModified);\n }\n\n if (node[CREATED_CALLBACK] && notFromInnerHTMLHelper) {\n node.created = true;\n node[CREATED_CALLBACK]();\n node.created = false;\n }\n }\n\n function purge() {\n for (var node, i = 0, length = targets.length; i < length; i++) {\n node = targets[i];\n\n if (!documentElement.contains(node)) {\n length--;\n targets.splice(i--, 1);\n verifyAndSetupAndAction(node, DETACHED);\n }\n }\n }\n\n function throwTypeError(type) {\n throw new Error('A ' + type + ' type is already registered');\n }\n\n function verifyAndSetupAndAction(node, action) {\n var fn,\n i = getTypeIndex(node),\n counterAction;\n\n if (-1 < i) {\n patchIfNotAlready(node, protos[i]);\n i = 0;\n\n if (action === ATTACHED && !node[ATTACHED]) {\n node[DETACHED] = false;\n node[ATTACHED] = true;\n counterAction = 'connected';\n i = 1;\n\n if (IE8 && indexOf.call(targets, node) < 0) {\n targets.push(node);\n }\n } else if (action === DETACHED && !node[DETACHED]) {\n node[ATTACHED] = false;\n node[DETACHED] = true;\n counterAction = 'disconnected';\n i = 1;\n }\n\n if (i && (fn = node[action + CALLBACK] || node[counterAction + CALLBACK])) fn.call(node);\n }\n } // V1 in da House!\n\n\n function CustomElementRegistry() {}\n\n CustomElementRegistry.prototype = {\n constructor: CustomElementRegistry,\n // a workaround for the stubborn WebKit\n define: usableCustomElements ? function (name, Class, options) {\n if (options) {\n CERDefine(name, Class, options);\n } else {\n var NAME = name.toUpperCase();\n constructors[NAME] = {\n constructor: Class,\n create: [NAME]\n };\n nodeNames.set(Class, NAME);\n customElements.define(name, Class);\n }\n } : CERDefine,\n get: usableCustomElements ? function (name) {\n return customElements.get(name) || get(name);\n } : get,\n whenDefined: usableCustomElements ? function (name) {\n return Promise.race([customElements.whenDefined(name), whenDefined(name)]);\n } : whenDefined\n };\n\n function CERDefine(name, Class, options) {\n var is = options && options[EXTENDS] || '',\n CProto = Class.prototype,\n proto = create(CProto),\n attributes = Class.observedAttributes || empty,\n definition = {\n prototype: proto\n }; // TODO: is this needed at all since it's inherited?\n // defineProperty(proto, 'constructor', {value: Class});\n\n safeProperty(proto, CREATED_CALLBACK, {\n value: function value() {\n if (justCreated) justCreated = false;else if (!this[DRECEV1]) {\n this[DRECEV1] = true;\n new Class(this);\n if (CProto[CREATED_CALLBACK]) CProto[CREATED_CALLBACK].call(this);\n var info = constructors[nodeNames.get(Class)];\n\n if (!usableCustomElements || info.create.length > 1) {\n notifyAttributes(this);\n }\n }\n }\n });\n safeProperty(proto, ATTRIBUTE_CHANGED_CALLBACK, {\n value: function value(name) {\n if (-1 < indexOf.call(attributes, name)) {\n if (CProto[ATTRIBUTE_CHANGED_CALLBACK]) CProto[ATTRIBUTE_CHANGED_CALLBACK].apply(this, arguments);\n }\n }\n });\n\n if (CProto[CONNECTED_CALLBACK]) {\n safeProperty(proto, ATTACHED_CALLBACK, {\n value: CProto[CONNECTED_CALLBACK]\n });\n }\n\n if (CProto[DISCONNECTED_CALLBACK]) {\n safeProperty(proto, DETACHED_CALLBACK, {\n value: CProto[DISCONNECTED_CALLBACK]\n });\n }\n\n if (is) definition[EXTENDS] = is;\n name = name.toUpperCase();\n constructors[name] = {\n constructor: Class,\n create: is ? [is, secondArgument(name)] : [name]\n };\n nodeNames.set(Class, name);\n document[REGISTER_ELEMENT](name.toLowerCase(), definition);\n whenDefined(name);\n waitingList[name].r();\n }\n\n function get(name) {\n var info = constructors[name.toUpperCase()];\n return info && info.constructor;\n }\n\n function getIs(options) {\n return typeof options === 'string' ? options : options && options.is || '';\n }\n\n function notifyAttributes(self) {\n var callback = self[ATTRIBUTE_CHANGED_CALLBACK],\n attributes = callback ? self.attributes : empty,\n i = attributes.length,\n attribute;\n\n while (i--) {\n attribute = attributes[i]; // || attributes.item(i);\n\n callback.call(self, attribute.name || attribute.nodeName, null, attribute.value || attribute.nodeValue);\n }\n }\n\n function whenDefined(name) {\n name = name.toUpperCase();\n\n if (!(name in waitingList)) {\n waitingList[name] = {};\n waitingList[name].p = new Promise(function (resolve) {\n waitingList[name].r = resolve;\n });\n }\n\n return waitingList[name].p;\n }\n\n function polyfillV1() {\n if (customElements) delete window.customElements;\n defineProperty(window, 'customElements', {\n configurable: true,\n value: new CustomElementRegistry()\n });\n defineProperty(window, 'CustomElementRegistry', {\n configurable: true,\n value: CustomElementRegistry\n });\n\n for (var patchClass = function patchClass(name) {\n var Class = window[name];\n\n if (Class) {\n window[name] = function CustomElementsV1(self) {\n var info, isNative;\n if (!self) self = this;\n\n if (!self[DRECEV1]) {\n justCreated = true;\n info = constructors[nodeNames.get(self.constructor)];\n isNative = usableCustomElements && info.create.length === 1;\n self = isNative ? Reflect.construct(Class, empty, info.constructor) : document.createElement.apply(document, info.create);\n self[DRECEV1] = true;\n justCreated = false;\n if (!isNative) notifyAttributes(self);\n }\n\n return self;\n };\n\n window[name].prototype = Class.prototype;\n\n try {\n Class.prototype.constructor = window[name];\n } catch (WebKit) {\n fixGetClass = true;\n defineProperty(Class, DRECEV1, {\n value: window[name]\n });\n }\n }\n }, Classes = htmlClass.get(/^HTML[A-Z]*[a-z]/), i = Classes.length; i--; patchClass(Classes[i])) {}\n\n document.createElement = function (name, options) {\n var is = getIs(options);\n return is ? patchedCreateElement.call(this, name, secondArgument(is)) : patchedCreateElement.call(this, name);\n };\n\n if (!V0) {\n justSetup = true;\n document[REGISTER_ELEMENT]('');\n }\n } // if customElements is not there at all\n\n\n if (!customElements || /^force/.test(polyfill.type)) polyfillV1();else if (!polyfill.noBuiltIn) {\n // if available test extends work as expected\n try {\n (function (DRE, options, name) {\n var re = new RegExp('^$');\n options[EXTENDS] = 'a';\n DRE.prototype = create(HTMLAnchorElement.prototype);\n DRE.prototype.constructor = DRE;\n window.customElements.define(name, DRE, options);\n\n if (!re.test(document.createElement('a', {\n is: name\n }).outerHTML) || !re.test(new DRE().outerHTML)) {\n throw options;\n }\n })(function DRE() {\n return Reflect.construct(HTMLAnchorElement, [], DRE);\n }, {}, 'document-register-element-a');\n } catch (o_O) {\n // or force the polyfill if not\n // and keep internal original reference\n polyfillV1();\n }\n } // FireFox only issue\n\n if (!polyfill.noBuiltIn) {\n try {\n createElement.call(document, 'a', 'a');\n } catch (FireFox) {\n secondArgument = function secondArgument(is) {\n return {\n is: is.toLowerCase()\n };\n };\n }\n }\n}\n\nmodule.exports = installCustomElements;\ninstallCustomElements(global);\n/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../../webpack/buildin/global.js */ \"./node_modules/webpack/buildin/global.js\")))\n\n//# sourceURL=webpack:///./node_modules/document-register-element/build/document-register-element.node.js?"); - -/***/ }) - -}]); \ No newline at end of file diff --git a/packages/uikit-workshop/dist/styleguide/js/2-chunk-e309c72e0e8f5783df94.js b/packages/uikit-workshop/dist/styleguide/js/2-chunk-e309c72e0e8f5783df94.js deleted file mode 100644 index de9e8f130..000000000 --- a/packages/uikit-workshop/dist/styleguide/js/2-chunk-e309c72e0e8f5783df94.js +++ /dev/null @@ -1,15 +0,0 @@ -(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[2],{ - -/***/ "./node_modules/@webcomponents/custom-elements/src/native-shim.js": -/*!************************************************************************!*\ - !*** ./node_modules/@webcomponents/custom-elements/src/native-shim.js ***! - \************************************************************************/ -/*! no static exports found */ -/*! ModuleConcatenation bailout: Module is not an ECMAScript module */ -/***/ (function(module, exports) { - -eval("/**\n * @license\n * Copyright (c) 2016 The Polymer Project Authors. All rights reserved.\n * This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\n * The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\n * The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\n * Code distributed by Google as part of the polymer project is also\n * subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\n */\n\n/**\n * This shim allows elements written in, or compiled to, ES5 to work on native\n * implementations of Custom Elements v1. It sets new.target to the value of\n * this.constructor so that the native HTMLElement constructor can access the\n * current under-construction element's definition.\n */\n(function () {\n if ( // No Reflect, no classes, no need for shim because native custom elements\n // require ES2015 classes or Reflect.\n window.Reflect === undefined || window.customElements === undefined || // The webcomponentsjs custom elements polyfill doesn't require\n // ES2015-compatible construction (`super()` or `Reflect.construct`).\n window.customElements.hasOwnProperty('polyfillWrapFlushCallback')) {\n return;\n }\n\n var BuiltInHTMLElement = HTMLElement;\n\n window.HTMLElement = function HTMLElement() {\n return Reflect.construct(BuiltInHTMLElement, [], this.constructor);\n };\n\n HTMLElement.prototype = BuiltInHTMLElement.prototype;\n HTMLElement.prototype.constructor = HTMLElement;\n Object.setPrototypeOf(HTMLElement, BuiltInHTMLElement);\n})();\n\n//# sourceURL=webpack:///./node_modules/@webcomponents/custom-elements/src/native-shim.js?"); - -/***/ }) - -}]); \ No newline at end of file diff --git a/packages/uikit-workshop/dist/styleguide/js/patternlab-pattern.js b/packages/uikit-workshop/dist/styleguide/js/patternlab-pattern.js index dddcc0cfc..d9dcdb3b7 100644 --- a/packages/uikit-workshop/dist/styleguide/js/patternlab-pattern.js +++ b/packages/uikit-workshop/dist/styleguide/js/patternlab-pattern.js @@ -1,228 +1 @@ -/******/ (function(modules) { // webpackBootstrap -/******/ // The module cache -/******/ var installedModules = {}; -/******/ -/******/ // The require function -/******/ function __webpack_require__(moduleId) { -/******/ -/******/ // Check if module is in cache -/******/ if(installedModules[moduleId]) { -/******/ return installedModules[moduleId].exports; -/******/ } -/******/ // Create a new module (and put it into the cache) -/******/ var module = installedModules[moduleId] = { -/******/ i: moduleId, -/******/ l: false, -/******/ exports: {} -/******/ }; -/******/ -/******/ // Execute the module function -/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); -/******/ -/******/ // Flag the module as loaded -/******/ module.l = true; -/******/ -/******/ // Return the exports of the module -/******/ return module.exports; -/******/ } -/******/ -/******/ -/******/ // expose the modules object (__webpack_modules__) -/******/ __webpack_require__.m = modules; -/******/ -/******/ // expose the module cache -/******/ __webpack_require__.c = installedModules; -/******/ -/******/ // define getter function for harmony exports -/******/ __webpack_require__.d = function(exports, name, getter) { -/******/ if(!__webpack_require__.o(exports, name)) { -/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); -/******/ } -/******/ }; -/******/ -/******/ // define __esModule on exports -/******/ __webpack_require__.r = function(exports) { -/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { -/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); -/******/ } -/******/ Object.defineProperty(exports, '__esModule', { value: true }); -/******/ }; -/******/ -/******/ // create a fake namespace object -/******/ // mode & 1: value is a module id, require it -/******/ // mode & 2: merge all properties of value into the ns -/******/ // mode & 4: return value when already ns object -/******/ // mode & 8|1: behave like require -/******/ __webpack_require__.t = function(value, mode) { -/******/ if(mode & 1) value = __webpack_require__(value); -/******/ if(mode & 8) return value; -/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; -/******/ var ns = Object.create(null); -/******/ __webpack_require__.r(ns); -/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); -/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); -/******/ return ns; -/******/ }; -/******/ -/******/ // getDefaultExport function for compatibility with non-harmony modules -/******/ __webpack_require__.n = function(module) { -/******/ var getter = module && module.__esModule ? -/******/ function getDefault() { return module['default']; } : -/******/ function getModuleExports() { return module; }; -/******/ __webpack_require__.d(getter, 'a', getter); -/******/ return getter; -/******/ }; -/******/ -/******/ // Object.prototype.hasOwnProperty.call -/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; -/******/ -/******/ // __webpack_public_path__ -/******/ __webpack_require__.p = "/styleguide/"; -/******/ -/******/ -/******/ // Load entry module and return exports -/******/ return __webpack_require__(__webpack_require__.s = "./src/scripts/patternlab-pattern.js"); -/******/ }) -/************************************************************************/ -/******/ ({ - -/***/ "./node_modules/clipboard/dist/clipboard.js": -/*!**************************************************!*\ - !*** ./node_modules/clipboard/dist/clipboard.js ***! - \**************************************************/ -/*! no static exports found */ -/*! ModuleConcatenation bailout: Module is not an ECMAScript module */ -/***/ (function(module, exports, __webpack_require__) { - -eval("/* WEBPACK VAR INJECTION */(function(module) {var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;function _typeof2(obj) { if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof2 = function _typeof2(obj) { return typeof obj; }; } else { _typeof2 = function _typeof2(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof2(obj); }\n\n/*!\n * clipboard.js v2.0.1\n * https://zenorocha.github.io/clipboard.js\n * \n * Licensed MIT © Zeno Rocha\n */\n(function webpackUniversalModuleDefinition(root, factory) {\n if (( false ? undefined : _typeof2(exports)) === 'object' && ( false ? undefined : _typeof2(module)) === 'object') module.exports = factory();else if (true) !(__WEBPACK_AMD_DEFINE_ARRAY__ = [], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory),\n\t\t\t\t__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?\n\t\t\t\t(__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__),\n\t\t\t\t__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));else {}\n})(this, function () {\n return (\n /******/\n function (modules) {\n // webpackBootstrap\n\n /******/\n // The module cache\n\n /******/\n var installedModules = {};\n /******/\n\n /******/\n // The require function\n\n /******/\n\n function __webpack_require__(moduleId) {\n /******/\n\n /******/\n // Check if module is in cache\n\n /******/\n if (installedModules[moduleId]) {\n /******/\n return installedModules[moduleId].exports;\n /******/\n }\n /******/\n // Create a new module (and put it into the cache)\n\n /******/\n\n\n var module = installedModules[moduleId] = {\n /******/\n i: moduleId,\n\n /******/\n l: false,\n\n /******/\n exports: {}\n /******/\n\n };\n /******/\n\n /******/\n // Execute the module function\n\n /******/\n\n modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n /******/\n\n /******/\n // Flag the module as loaded\n\n /******/\n\n module.l = true;\n /******/\n\n /******/\n // Return the exports of the module\n\n /******/\n\n return module.exports;\n /******/\n }\n /******/\n\n /******/\n\n /******/\n // expose the modules object (__webpack_modules__)\n\n /******/\n\n\n __webpack_require__.m = modules;\n /******/\n\n /******/\n // expose the module cache\n\n /******/\n\n __webpack_require__.c = installedModules;\n /******/\n\n /******/\n // identity function for calling harmony imports with the correct context\n\n /******/\n\n __webpack_require__.i = function (value) {\n return value;\n };\n /******/\n\n /******/\n // define getter function for harmony exports\n\n /******/\n\n\n __webpack_require__.d = function (exports, name, getter) {\n /******/\n if (!__webpack_require__.o(exports, name)) {\n /******/\n Object.defineProperty(exports, name, {\n /******/\n configurable: false,\n\n /******/\n enumerable: true,\n\n /******/\n get: getter\n /******/\n\n });\n /******/\n }\n /******/\n\n };\n /******/\n\n /******/\n // getDefaultExport function for compatibility with non-harmony modules\n\n /******/\n\n\n __webpack_require__.n = function (module) {\n /******/\n var getter = module && module.__esModule ?\n /******/\n function getDefault() {\n return module['default'];\n } :\n /******/\n function getModuleExports() {\n return module;\n };\n /******/\n\n __webpack_require__.d(getter, 'a', getter);\n /******/\n\n\n return getter;\n /******/\n };\n /******/\n\n /******/\n // Object.prototype.hasOwnProperty.call\n\n /******/\n\n\n __webpack_require__.o = function (object, property) {\n return Object.prototype.hasOwnProperty.call(object, property);\n };\n /******/\n\n /******/\n // __webpack_public_path__\n\n /******/\n\n\n __webpack_require__.p = \"\";\n /******/\n\n /******/\n // Load entry module and return exports\n\n /******/\n\n return __webpack_require__(__webpack_require__.s = 3);\n /******/\n }(\n /************************************************************************/\n\n /******/\n [\n /* 0 */\n\n /***/\n function (module, exports, __webpack_require__) {\n var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;\n\n (function (global, factory) {\n if (true) {\n !(__WEBPACK_AMD_DEFINE_ARRAY__ = [module, __webpack_require__(7)], __WEBPACK_AMD_DEFINE_FACTORY__ = factory, __WEBPACK_AMD_DEFINE_RESULT__ = typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ? __WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__) : __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));\n } else { var mod; }\n })(this, function (module, _select) {\n 'use strict';\n\n var _select2 = _interopRequireDefault(_select);\n\n function _interopRequireDefault(obj) {\n return obj && obj.__esModule ? obj : {\n default: obj\n };\n }\n\n var _typeof = typeof Symbol === \"function\" && _typeof2(Symbol.iterator) === \"symbol\" ? function (obj) {\n return _typeof2(obj);\n } : function (obj) {\n return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : _typeof2(obj);\n };\n\n function _classCallCheck(instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n }\n\n var _createClass = function () {\n function defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, descriptor.key, descriptor);\n }\n }\n\n return function (Constructor, protoProps, staticProps) {\n if (protoProps) defineProperties(Constructor.prototype, protoProps);\n if (staticProps) defineProperties(Constructor, staticProps);\n return Constructor;\n };\n }();\n\n var ClipboardAction = function () {\n /**\n * @param {Object} options\n */\n function ClipboardAction(options) {\n _classCallCheck(this, ClipboardAction);\n\n this.resolveOptions(options);\n this.initSelection();\n }\n /**\n * Defines base properties passed from constructor.\n * @param {Object} options\n */\n\n\n _createClass(ClipboardAction, [{\n key: 'resolveOptions',\n value: function resolveOptions() {\n var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n this.action = options.action;\n this.container = options.container;\n this.emitter = options.emitter;\n this.target = options.target;\n this.text = options.text;\n this.trigger = options.trigger;\n this.selectedText = '';\n }\n }, {\n key: 'initSelection',\n value: function initSelection() {\n if (this.text) {\n this.selectFake();\n } else if (this.target) {\n this.selectTarget();\n }\n }\n }, {\n key: 'selectFake',\n value: function selectFake() {\n var _this = this;\n\n var isRTL = document.documentElement.getAttribute('dir') == 'rtl';\n this.removeFake();\n\n this.fakeHandlerCallback = function () {\n return _this.removeFake();\n };\n\n this.fakeHandler = this.container.addEventListener('click', this.fakeHandlerCallback) || true;\n this.fakeElem = document.createElement('textarea'); // Prevent zooming on iOS\n\n this.fakeElem.style.fontSize = '12pt'; // Reset box model\n\n this.fakeElem.style.border = '0';\n this.fakeElem.style.padding = '0';\n this.fakeElem.style.margin = '0'; // Move element out of screen horizontally\n\n this.fakeElem.style.position = 'absolute';\n this.fakeElem.style[isRTL ? 'right' : 'left'] = '-9999px'; // Move element to the same position vertically\n\n var yPosition = window.pageYOffset || document.documentElement.scrollTop;\n this.fakeElem.style.top = yPosition + 'px';\n this.fakeElem.setAttribute('readonly', '');\n this.fakeElem.value = this.text;\n this.container.appendChild(this.fakeElem);\n this.selectedText = (0, _select2.default)(this.fakeElem);\n this.copyText();\n }\n }, {\n key: 'removeFake',\n value: function removeFake() {\n if (this.fakeHandler) {\n this.container.removeEventListener('click', this.fakeHandlerCallback);\n this.fakeHandler = null;\n this.fakeHandlerCallback = null;\n }\n\n if (this.fakeElem) {\n this.container.removeChild(this.fakeElem);\n this.fakeElem = null;\n }\n }\n }, {\n key: 'selectTarget',\n value: function selectTarget() {\n this.selectedText = (0, _select2.default)(this.target);\n this.copyText();\n }\n }, {\n key: 'copyText',\n value: function copyText() {\n var succeeded = void 0;\n\n try {\n succeeded = document.execCommand(this.action);\n } catch (err) {\n succeeded = false;\n }\n\n this.handleResult(succeeded);\n }\n }, {\n key: 'handleResult',\n value: function handleResult(succeeded) {\n this.emitter.emit(succeeded ? 'success' : 'error', {\n action: this.action,\n text: this.selectedText,\n trigger: this.trigger,\n clearSelection: this.clearSelection.bind(this)\n });\n }\n }, {\n key: 'clearSelection',\n value: function clearSelection() {\n if (this.trigger) {\n this.trigger.focus();\n }\n\n window.getSelection().removeAllRanges();\n }\n }, {\n key: 'destroy',\n value: function destroy() {\n this.removeFake();\n }\n }, {\n key: 'action',\n set: function set() {\n var action = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'copy';\n this._action = action;\n\n if (this._action !== 'copy' && this._action !== 'cut') {\n throw new Error('Invalid \"action\" value, use either \"copy\" or \"cut\"');\n }\n },\n get: function get() {\n return this._action;\n }\n }, {\n key: 'target',\n set: function set(target) {\n if (target !== undefined) {\n if (target && (typeof target === 'undefined' ? 'undefined' : _typeof(target)) === 'object' && target.nodeType === 1) {\n if (this.action === 'copy' && target.hasAttribute('disabled')) {\n throw new Error('Invalid \"target\" attribute. Please use \"readonly\" instead of \"disabled\" attribute');\n }\n\n if (this.action === 'cut' && (target.hasAttribute('readonly') || target.hasAttribute('disabled'))) {\n throw new Error('Invalid \"target\" attribute. You can\\'t cut text from elements with \"readonly\" or \"disabled\" attributes');\n }\n\n this._target = target;\n } else {\n throw new Error('Invalid \"target\" value, use a valid Element');\n }\n }\n },\n get: function get() {\n return this._target;\n }\n }]);\n\n return ClipboardAction;\n }();\n\n module.exports = ClipboardAction;\n });\n /***/\n\n },\n /* 1 */\n\n /***/\n function (module, exports, __webpack_require__) {\n var is = __webpack_require__(6);\n\n var delegate = __webpack_require__(5);\n /**\n * Validates all params and calls the right\n * listener function based on its target type.\n *\n * @param {String|HTMLElement|HTMLCollection|NodeList} target\n * @param {String} type\n * @param {Function} callback\n * @return {Object}\n */\n\n\n function listen(target, type, callback) {\n if (!target && !type && !callback) {\n throw new Error('Missing required arguments');\n }\n\n if (!is.string(type)) {\n throw new TypeError('Second argument must be a String');\n }\n\n if (!is.fn(callback)) {\n throw new TypeError('Third argument must be a Function');\n }\n\n if (is.node(target)) {\n return listenNode(target, type, callback);\n } else if (is.nodeList(target)) {\n return listenNodeList(target, type, callback);\n } else if (is.string(target)) {\n return listenSelector(target, type, callback);\n } else {\n throw new TypeError('First argument must be a String, HTMLElement, HTMLCollection, or NodeList');\n }\n }\n /**\n * Adds an event listener to a HTML element\n * and returns a remove listener function.\n *\n * @param {HTMLElement} node\n * @param {String} type\n * @param {Function} callback\n * @return {Object}\n */\n\n\n function listenNode(node, type, callback) {\n node.addEventListener(type, callback);\n return {\n destroy: function destroy() {\n node.removeEventListener(type, callback);\n }\n };\n }\n /**\n * Add an event listener to a list of HTML elements\n * and returns a remove listener function.\n *\n * @param {NodeList|HTMLCollection} nodeList\n * @param {String} type\n * @param {Function} callback\n * @return {Object}\n */\n\n\n function listenNodeList(nodeList, type, callback) {\n Array.prototype.forEach.call(nodeList, function (node) {\n node.addEventListener(type, callback);\n });\n return {\n destroy: function destroy() {\n Array.prototype.forEach.call(nodeList, function (node) {\n node.removeEventListener(type, callback);\n });\n }\n };\n }\n /**\n * Add an event listener to a selector\n * and returns a remove listener function.\n *\n * @param {String} selector\n * @param {String} type\n * @param {Function} callback\n * @return {Object}\n */\n\n\n function listenSelector(selector, type, callback) {\n return delegate(document.body, selector, type, callback);\n }\n\n module.exports = listen;\n /***/\n },\n /* 2 */\n\n /***/\n function (module, exports) {\n function E() {// Keep this empty so it's easier to inherit from\n // (via https://github.com/lipsmack from https://github.com/scottcorgan/tiny-emitter/issues/3)\n }\n\n E.prototype = {\n on: function on(name, callback, ctx) {\n var e = this.e || (this.e = {});\n (e[name] || (e[name] = [])).push({\n fn: callback,\n ctx: ctx\n });\n return this;\n },\n once: function once(name, callback, ctx) {\n var self = this;\n\n function listener() {\n self.off(name, listener);\n callback.apply(ctx, arguments);\n }\n\n ;\n listener._ = callback;\n return this.on(name, listener, ctx);\n },\n emit: function emit(name) {\n var data = [].slice.call(arguments, 1);\n var evtArr = ((this.e || (this.e = {}))[name] || []).slice();\n var i = 0;\n var len = evtArr.length;\n\n for (i; i < len; i++) {\n evtArr[i].fn.apply(evtArr[i].ctx, data);\n }\n\n return this;\n },\n off: function off(name, callback) {\n var e = this.e || (this.e = {});\n var evts = e[name];\n var liveEvents = [];\n\n if (evts && callback) {\n for (var i = 0, len = evts.length; i < len; i++) {\n if (evts[i].fn !== callback && evts[i].fn._ !== callback) liveEvents.push(evts[i]);\n }\n } // Remove event from queue to prevent memory leak\n // Suggested by https://github.com/lazd\n // Ref: https://github.com/scottcorgan/tiny-emitter/commit/c6ebfaa9bc973b33d110a84a307742b7cf94c953#commitcomment-5024910\n\n\n liveEvents.length ? e[name] = liveEvents : delete e[name];\n return this;\n }\n };\n module.exports = E;\n /***/\n },\n /* 3 */\n\n /***/\n function (module, exports, __webpack_require__) {\n var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;\n\n (function (global, factory) {\n if (true) {\n !(__WEBPACK_AMD_DEFINE_ARRAY__ = [module, __webpack_require__(0), __webpack_require__(2), __webpack_require__(1)], __WEBPACK_AMD_DEFINE_FACTORY__ = factory, __WEBPACK_AMD_DEFINE_RESULT__ = typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ? __WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__) : __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));\n } else { var mod; }\n })(this, function (module, _clipboardAction, _tinyEmitter, _goodListener) {\n 'use strict';\n\n var _clipboardAction2 = _interopRequireDefault(_clipboardAction);\n\n var _tinyEmitter2 = _interopRequireDefault(_tinyEmitter);\n\n var _goodListener2 = _interopRequireDefault(_goodListener);\n\n function _interopRequireDefault(obj) {\n return obj && obj.__esModule ? obj : {\n default: obj\n };\n }\n\n var _typeof = typeof Symbol === \"function\" && _typeof2(Symbol.iterator) === \"symbol\" ? function (obj) {\n return _typeof2(obj);\n } : function (obj) {\n return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : _typeof2(obj);\n };\n\n function _classCallCheck(instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n }\n\n var _createClass = function () {\n function defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, descriptor.key, descriptor);\n }\n }\n\n return function (Constructor, protoProps, staticProps) {\n if (protoProps) defineProperties(Constructor.prototype, protoProps);\n if (staticProps) defineProperties(Constructor, staticProps);\n return Constructor;\n };\n }();\n\n function _possibleConstructorReturn(self, call) {\n if (!self) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n\n return call && (_typeof2(call) === \"object\" || typeof call === \"function\") ? call : self;\n }\n\n function _inherits(subClass, superClass) {\n if (typeof superClass !== \"function\" && superClass !== null) {\n throw new TypeError(\"Super expression must either be null or a function, not \" + _typeof2(superClass));\n }\n\n subClass.prototype = Object.create(superClass && superClass.prototype, {\n constructor: {\n value: subClass,\n enumerable: false,\n writable: true,\n configurable: true\n }\n });\n if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;\n }\n\n var Clipboard = function (_Emitter) {\n _inherits(Clipboard, _Emitter);\n /**\n * @param {String|HTMLElement|HTMLCollection|NodeList} trigger\n * @param {Object} options\n */\n\n\n function Clipboard(trigger, options) {\n _classCallCheck(this, Clipboard);\n\n var _this = _possibleConstructorReturn(this, (Clipboard.__proto__ || Object.getPrototypeOf(Clipboard)).call(this));\n\n _this.resolveOptions(options);\n\n _this.listenClick(trigger);\n\n return _this;\n }\n /**\n * Defines if attributes would be resolved using internal setter functions\n * or custom functions that were passed in the constructor.\n * @param {Object} options\n */\n\n\n _createClass(Clipboard, [{\n key: 'resolveOptions',\n value: function resolveOptions() {\n var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n this.action = typeof options.action === 'function' ? options.action : this.defaultAction;\n this.target = typeof options.target === 'function' ? options.target : this.defaultTarget;\n this.text = typeof options.text === 'function' ? options.text : this.defaultText;\n this.container = _typeof(options.container) === 'object' ? options.container : document.body;\n }\n }, {\n key: 'listenClick',\n value: function listenClick(trigger) {\n var _this2 = this;\n\n this.listener = (0, _goodListener2.default)(trigger, 'click', function (e) {\n return _this2.onClick(e);\n });\n }\n }, {\n key: 'onClick',\n value: function onClick(e) {\n var trigger = e.delegateTarget || e.currentTarget;\n\n if (this.clipboardAction) {\n this.clipboardAction = null;\n }\n\n this.clipboardAction = new _clipboardAction2.default({\n action: this.action(trigger),\n target: this.target(trigger),\n text: this.text(trigger),\n container: this.container,\n trigger: trigger,\n emitter: this\n });\n }\n }, {\n key: 'defaultAction',\n value: function defaultAction(trigger) {\n return getAttributeValue('action', trigger);\n }\n }, {\n key: 'defaultTarget',\n value: function defaultTarget(trigger) {\n var selector = getAttributeValue('target', trigger);\n\n if (selector) {\n return document.querySelector(selector);\n }\n }\n }, {\n key: 'defaultText',\n value: function defaultText(trigger) {\n return getAttributeValue('text', trigger);\n }\n }, {\n key: 'destroy',\n value: function destroy() {\n this.listener.destroy();\n\n if (this.clipboardAction) {\n this.clipboardAction.destroy();\n this.clipboardAction = null;\n }\n }\n }], [{\n key: 'isSupported',\n value: function isSupported() {\n var action = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : ['copy', 'cut'];\n var actions = typeof action === 'string' ? [action] : action;\n var support = !!document.queryCommandSupported;\n actions.forEach(function (action) {\n support = support && !!document.queryCommandSupported(action);\n });\n return support;\n }\n }]);\n\n return Clipboard;\n }(_tinyEmitter2.default);\n /**\n * Helper function to retrieve attribute value.\n * @param {String} suffix\n * @param {Element} element\n */\n\n\n function getAttributeValue(suffix, element) {\n var attribute = 'data-clipboard-' + suffix;\n\n if (!element.hasAttribute(attribute)) {\n return;\n }\n\n return element.getAttribute(attribute);\n }\n\n module.exports = Clipboard;\n });\n /***/\n\n },\n /* 4 */\n\n /***/\n function (module, exports) {\n var DOCUMENT_NODE_TYPE = 9;\n /**\n * A polyfill for Element.matches()\n */\n\n if (typeof Element !== 'undefined' && !Element.prototype.matches) {\n var proto = Element.prototype;\n proto.matches = proto.matchesSelector || proto.mozMatchesSelector || proto.msMatchesSelector || proto.oMatchesSelector || proto.webkitMatchesSelector;\n }\n /**\n * Finds the closest parent that matches a selector.\n *\n * @param {Element} element\n * @param {String} selector\n * @return {Function}\n */\n\n\n function closest(element, selector) {\n while (element && element.nodeType !== DOCUMENT_NODE_TYPE) {\n if (typeof element.matches === 'function' && element.matches(selector)) {\n return element;\n }\n\n element = element.parentNode;\n }\n }\n\n module.exports = closest;\n /***/\n },\n /* 5 */\n\n /***/\n function (module, exports, __webpack_require__) {\n var closest = __webpack_require__(4);\n /**\n * Delegates event to a selector.\n *\n * @param {Element} element\n * @param {String} selector\n * @param {String} type\n * @param {Function} callback\n * @param {Boolean} useCapture\n * @return {Object}\n */\n\n\n function _delegate(element, selector, type, callback, useCapture) {\n var listenerFn = listener.apply(this, arguments);\n element.addEventListener(type, listenerFn, useCapture);\n return {\n destroy: function destroy() {\n element.removeEventListener(type, listenerFn, useCapture);\n }\n };\n }\n /**\n * Delegates event to a selector.\n *\n * @param {Element|String|Array} [elements]\n * @param {String} selector\n * @param {String} type\n * @param {Function} callback\n * @param {Boolean} useCapture\n * @return {Object}\n */\n\n\n function delegate(elements, selector, type, callback, useCapture) {\n // Handle the regular Element usage\n if (typeof elements.addEventListener === 'function') {\n return _delegate.apply(null, arguments);\n } // Handle Element-less usage, it defaults to global delegation\n\n\n if (typeof type === 'function') {\n // Use `document` as the first parameter, then apply arguments\n // This is a short way to .unshift `arguments` without running into deoptimizations\n return _delegate.bind(null, document).apply(null, arguments);\n } // Handle Selector-based usage\n\n\n if (typeof elements === 'string') {\n elements = document.querySelectorAll(elements);\n } // Handle Array-like based usage\n\n\n return Array.prototype.map.call(elements, function (element) {\n return _delegate(element, selector, type, callback, useCapture);\n });\n }\n /**\n * Finds closest match and invokes callback.\n *\n * @param {Element} element\n * @param {String} selector\n * @param {String} type\n * @param {Function} callback\n * @return {Function}\n */\n\n\n function listener(element, selector, type, callback) {\n return function (e) {\n e.delegateTarget = closest(e.target, selector);\n\n if (e.delegateTarget) {\n callback.call(element, e);\n }\n };\n }\n\n module.exports = delegate;\n /***/\n },\n /* 6 */\n\n /***/\n function (module, exports) {\n /**\n * Check if argument is a HTML element.\n *\n * @param {Object} value\n * @return {Boolean}\n */\n exports.node = function (value) {\n return value !== undefined && value instanceof HTMLElement && value.nodeType === 1;\n };\n /**\n * Check if argument is a list of HTML elements.\n *\n * @param {Object} value\n * @return {Boolean}\n */\n\n\n exports.nodeList = function (value) {\n var type = Object.prototype.toString.call(value);\n return value !== undefined && (type === '[object NodeList]' || type === '[object HTMLCollection]') && 'length' in value && (value.length === 0 || exports.node(value[0]));\n };\n /**\n * Check if argument is a string.\n *\n * @param {Object} value\n * @return {Boolean}\n */\n\n\n exports.string = function (value) {\n return typeof value === 'string' || value instanceof String;\n };\n /**\n * Check if argument is a function.\n *\n * @param {Object} value\n * @return {Boolean}\n */\n\n\n exports.fn = function (value) {\n var type = Object.prototype.toString.call(value);\n return type === '[object Function]';\n };\n /***/\n\n },\n /* 7 */\n\n /***/\n function (module, exports) {\n function select(element) {\n var selectedText;\n\n if (element.nodeName === 'SELECT') {\n element.focus();\n selectedText = element.value;\n } else if (element.nodeName === 'INPUT' || element.nodeName === 'TEXTAREA') {\n var isReadOnly = element.hasAttribute('readonly');\n\n if (!isReadOnly) {\n element.setAttribute('readonly', '');\n }\n\n element.select();\n element.setSelectionRange(0, element.value.length);\n\n if (!isReadOnly) {\n element.removeAttribute('readonly');\n }\n\n selectedText = element.value;\n } else {\n if (element.hasAttribute('contenteditable')) {\n element.focus();\n }\n\n var selection = window.getSelection();\n var range = document.createRange();\n range.selectNodeContents(element);\n selection.removeAllRanges();\n selection.addRange(range);\n selectedText = selection.toString();\n }\n\n return selectedText;\n }\n\n module.exports = select;\n /***/\n }])\n );\n});\n/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../../webpack/buildin/module.js */ \"./node_modules/webpack/buildin/module.js\")(module)))\n\n//# sourceURL=webpack:///./node_modules/clipboard/dist/clipboard.js?"); - -/***/ }), - -/***/ "./node_modules/iframe-resizer/js/iframeResizer.contentWindow.min.js": -/*!***************************************************************************!*\ - !*** ./node_modules/iframe-resizer/js/iframeResizer.contentWindow.min.js ***! - \***************************************************************************/ -/*! no static exports found */ -/*! ModuleConcatenation bailout: Module is not an ECMAScript module */ -/***/ (function(module, exports) { - -eval("function _typeof(obj) { if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\n/*! iFrame Resizer (iframeSizer.contentWindow.min.js) - v3.6.2 - 2018-09-16\n * Desc: Include this file in any page being loaded into an iframe\n * to force the iframe to resize to the content size.\n * Requires: iframeResizer.min.js on host page.\n * Copyright: (c) 2018 David J. Bradshaw - dave@bradshaw.net\n * License: MIT\n */\n!function (a) {\n \"use strict\";\n\n function b() {}\n\n function c(a, b, c, d) {\n \"addEventListener\" in window ? a.addEventListener(b, c, Ia ? d || {} : !1) : \"attachEvent\" in window && a.attachEvent(\"on\" + b, c);\n }\n\n function d(a, b, c) {\n \"removeEventListener\" in window ? a.removeEventListener(b, c, !1) : \"detachEvent\" in window && a.detachEvent(\"on\" + b, c);\n }\n\n function e(a) {\n return a.charAt(0).toUpperCase() + a.slice(1);\n }\n\n function f(a) {\n var b,\n c,\n d,\n e = null,\n f = 0,\n g = function g() {\n f = Ma(), e = null, d = a.apply(b, c), e || (b = c = null);\n };\n\n return function () {\n var h = Ma();\n f || (f = h);\n var i = ya - (h - f);\n return b = this, c = arguments, 0 >= i || i > ya ? (e && (clearTimeout(e), e = null), f = h, d = a.apply(b, c), e || (b = c = null)) : e || (e = setTimeout(g, i)), d;\n };\n }\n\n function g(a) {\n return na + \"[\" + pa + \"] \" + a;\n }\n\n function h(a) {\n ma && \"object\" == _typeof(window.console) && console.log(g(a));\n }\n\n function i(a) {\n \"object\" == _typeof(window.console) && console.warn(g(a));\n }\n\n function j() {\n k(), h(\"Initialising iFrame (\" + location.href + \")\"), l(), o(), n(\"background\", X), n(\"padding\", _), B(), t(), u(), p(), D(), v(), ja = C(), O(\"init\", \"Init message from host page\"), Ea();\n }\n\n function k() {\n function b(a) {\n return \"true\" === a ? !0 : !1;\n }\n\n var c = ia.substr(oa).split(\":\");\n pa = c[0], Y = a !== c[1] ? Number(c[1]) : Y, aa = a !== c[2] ? b(c[2]) : aa, ma = a !== c[3] ? b(c[3]) : ma, ka = a !== c[4] ? Number(c[4]) : ka, V = a !== c[6] ? b(c[6]) : V, Z = c[7], ga = a !== c[8] ? c[8] : ga, X = c[9], _ = c[10], va = a !== c[11] ? Number(c[11]) : va, ja.enable = a !== c[12] ? b(c[12]) : !1, ra = a !== c[13] ? c[13] : ra, Ba = a !== c[14] ? c[14] : Ba;\n }\n\n function l() {\n function a() {\n var a = window.iFrameResizer;\n h(\"Reading data from page: \" + JSON.stringify(a)), Da = \"messageCallback\" in a ? a.messageCallback : Da, Ea = \"readyCallback\" in a ? a.readyCallback : Ea, ua = \"targetOrigin\" in a ? a.targetOrigin : ua, ga = \"heightCalculationMethod\" in a ? a.heightCalculationMethod : ga, Ba = \"widthCalculationMethod\" in a ? a.widthCalculationMethod : Ba;\n }\n\n function b(a, b) {\n return \"function\" == typeof a && (h(\"Setup custom \" + b + \"CalcMethod\"), Ga[b] = a, a = \"custom\"), a;\n }\n\n \"iFrameResizer\" in window && Object === window.iFrameResizer.constructor && (a(), ga = b(ga, \"height\"), Ba = b(Ba, \"width\")), h(\"TargetOrigin for parent set to: \" + ua);\n }\n\n function m(a, b) {\n return -1 !== b.indexOf(\"-\") && (i(\"Negative CSS value ignored for \" + a), b = \"\"), b;\n }\n\n function n(b, c) {\n a !== c && \"\" !== c && \"null\" !== c && (document.body.style[b] = c, h(\"Body \" + b + ' set to \"' + c + '\"'));\n }\n\n function o() {\n a === Z && (Z = Y + \"px\"), n(\"margin\", m(\"margin\", Z));\n }\n\n function p() {\n document.documentElement.style.height = \"\", document.body.style.height = \"\", h('HTML & body height set to \"auto\"');\n }\n\n function q(a) {\n var b = {\n add: function add(b) {\n function d() {\n O(a.eventName, a.eventType);\n }\n\n Ha[b] = d, c(window, b, d, {\n passive: !0\n });\n },\n remove: function remove(a) {\n var b = Ha[a];\n delete Ha[a], d(window, a, b);\n }\n };\n a.eventNames && Array.prototype.map ? (a.eventName = a.eventNames[0], a.eventNames.map(b[a.method])) : b[a.method](a.eventName), h(e(a.method) + \" event listener: \" + a.eventType);\n }\n\n function r(a) {\n q({\n method: a,\n eventType: \"Animation Start\",\n eventNames: [\"animationstart\", \"webkitAnimationStart\"]\n }), q({\n method: a,\n eventType: \"Animation Iteration\",\n eventNames: [\"animationiteration\", \"webkitAnimationIteration\"]\n }), q({\n method: a,\n eventType: \"Animation End\",\n eventNames: [\"animationend\", \"webkitAnimationEnd\"]\n }), q({\n method: a,\n eventType: \"Input\",\n eventName: \"input\"\n }), q({\n method: a,\n eventType: \"Mouse Up\",\n eventName: \"mouseup\"\n }), q({\n method: a,\n eventType: \"Mouse Down\",\n eventName: \"mousedown\"\n }), q({\n method: a,\n eventType: \"Orientation Change\",\n eventName: \"orientationchange\"\n }), q({\n method: a,\n eventType: \"Print\",\n eventName: [\"afterprint\", \"beforeprint\"]\n }), q({\n method: a,\n eventType: \"Ready State Change\",\n eventName: \"readystatechange\"\n }), q({\n method: a,\n eventType: \"Touch Start\",\n eventName: \"touchstart\"\n }), q({\n method: a,\n eventType: \"Touch End\",\n eventName: \"touchend\"\n }), q({\n method: a,\n eventType: \"Touch Cancel\",\n eventName: \"touchcancel\"\n }), q({\n method: a,\n eventType: \"Transition Start\",\n eventNames: [\"transitionstart\", \"webkitTransitionStart\", \"MSTransitionStart\", \"oTransitionStart\", \"otransitionstart\"]\n }), q({\n method: a,\n eventType: \"Transition Iteration\",\n eventNames: [\"transitioniteration\", \"webkitTransitionIteration\", \"MSTransitionIteration\", \"oTransitionIteration\", \"otransitioniteration\"]\n }), q({\n method: a,\n eventType: \"Transition End\",\n eventNames: [\"transitionend\", \"webkitTransitionEnd\", \"MSTransitionEnd\", \"oTransitionEnd\", \"otransitionend\"]\n }), \"child\" === ra && q({\n method: a,\n eventType: \"IFrame Resized\",\n eventName: \"resize\"\n });\n }\n\n function s(a, b, c, d) {\n return b !== a && (a in c || (i(a + \" is not a valid option for \" + d + \"CalculationMethod.\"), a = b), h(d + ' calculation method set to \"' + a + '\"')), a;\n }\n\n function t() {\n ga = s(ga, fa, Na, \"height\");\n }\n\n function u() {\n Ba = s(Ba, Aa, Oa, \"width\");\n }\n\n function v() {\n !0 === V ? (r(\"add\"), G()) : h(\"Auto Resize disabled\");\n }\n\n function w() {\n h(\"Disable outgoing messages\"), sa = !1;\n }\n\n function x() {\n h(\"Remove event listener: Message\"), d(window, \"message\", T);\n }\n\n function y() {\n null !== $ && $.disconnect();\n }\n\n function z() {\n r(\"remove\"), y(), clearInterval(la);\n }\n\n function A() {\n w(), x(), !0 === V && z();\n }\n\n function B() {\n var a = document.createElement(\"div\");\n a.style.clear = \"both\", a.style.display = \"block\", document.body.appendChild(a);\n }\n\n function C() {\n function b() {\n return {\n x: window.pageXOffset !== a ? window.pageXOffset : document.documentElement.scrollLeft,\n y: window.pageYOffset !== a ? window.pageYOffset : document.documentElement.scrollTop\n };\n }\n\n function d(a) {\n var c = a.getBoundingClientRect(),\n d = b();\n return {\n x: parseInt(c.left, 10) + parseInt(d.x, 10),\n y: parseInt(c.top, 10) + parseInt(d.y, 10)\n };\n }\n\n function e(b) {\n function c(a) {\n var b = d(a);\n h(\"Moving to in page link (#\" + e + \") at x: \" + b.x + \" y: \" + b.y), S(b.y, b.x, \"scrollToOffset\");\n }\n\n var e = b.split(\"#\")[1] || b,\n f = decodeURIComponent(e),\n g = document.getElementById(f) || document.getElementsByName(f)[0];\n a !== g ? c(g) : (h(\"In page link (#\" + e + \") not found in iFrame, so sending to parent\"), S(0, 0, \"inPageLink\", \"#\" + e));\n }\n\n function f() {\n \"\" !== location.hash && \"#\" !== location.hash && e(location.href);\n }\n\n function g() {\n function a(a) {\n function b(a) {\n a.preventDefault(), e(this.getAttribute(\"href\"));\n }\n\n \"#\" !== a.getAttribute(\"href\") && c(a, \"click\", b);\n }\n\n Array.prototype.forEach.call(document.querySelectorAll('a[href^=\"#\"]'), a);\n }\n\n function j() {\n c(window, \"hashchange\", f);\n }\n\n function k() {\n setTimeout(f, ca);\n }\n\n function l() {\n Array.prototype.forEach && document.querySelectorAll ? (h(\"Setting up location.hash handlers\"), g(), j(), k()) : i(\"In page linking not fully supported in this browser! (See README.md for IE8 workaround)\");\n }\n\n return ja.enable ? l() : h(\"In page linking not enabled\"), {\n findTarget: e\n };\n }\n\n function D() {\n h(\"Enable public methods\"), Ca.parentIFrame = {\n autoResize: function autoResize(a) {\n return !0 === a && !1 === V ? (V = !0, v()) : !1 === a && !0 === V && (V = !1, z()), V;\n },\n close: function close() {\n S(0, 0, \"close\"), A();\n },\n getId: function getId() {\n return pa;\n },\n getPageInfo: function getPageInfo(a) {\n \"function\" == typeof a ? (Fa = a, S(0, 0, \"pageInfo\")) : (Fa = function Fa() {}, S(0, 0, \"pageInfoStop\"));\n },\n moveToAnchor: function moveToAnchor(a) {\n ja.findTarget(a);\n },\n reset: function reset() {\n R(\"parentIFrame.reset\");\n },\n scrollTo: function scrollTo(a, b) {\n S(b, a, \"scrollTo\");\n },\n scrollToOffset: function scrollToOffset(a, b) {\n S(b, a, \"scrollToOffset\");\n },\n sendMessage: function sendMessage(a, b) {\n S(0, 0, \"message\", JSON.stringify(a), b);\n },\n setHeightCalculationMethod: function setHeightCalculationMethod(a) {\n ga = a, t();\n },\n setWidthCalculationMethod: function setWidthCalculationMethod(a) {\n Ba = a, u();\n },\n setTargetOrigin: function setTargetOrigin(a) {\n h(\"Set targetOrigin: \" + a), ua = a;\n },\n size: function size(a, b) {\n var c = \"\" + (a ? a : \"\") + (b ? \",\" + b : \"\");\n O(\"size\", \"parentIFrame.size(\" + c + \")\", a, b);\n }\n };\n }\n\n function E() {\n 0 !== ka && (h(\"setInterval: \" + ka + \"ms\"), la = setInterval(function () {\n O(\"interval\", \"setInterval: \" + ka);\n }, Math.abs(ka)));\n }\n\n function F() {\n function b(a) {\n function b(a) {\n !1 === a.complete && (h(\"Attach listeners to \" + a.src), a.addEventListener(\"load\", f, !1), a.addEventListener(\"error\", g, !1), k.push(a));\n }\n\n \"attributes\" === a.type && \"src\" === a.attributeName ? b(a.target) : \"childList\" === a.type && Array.prototype.forEach.call(a.target.querySelectorAll(\"img\"), b);\n }\n\n function c(a) {\n k.splice(k.indexOf(a), 1);\n }\n\n function d(a) {\n h(\"Remove listeners from \" + a.src), a.removeEventListener(\"load\", f, !1), a.removeEventListener(\"error\", g, !1), c(a);\n }\n\n function e(b, c, e) {\n d(b.target), O(c, e + \": \" + b.target.src, a, a);\n }\n\n function f(a) {\n e(a, \"imageLoad\", \"Image loaded\");\n }\n\n function g(a) {\n e(a, \"imageLoadFailed\", \"Image load failed\");\n }\n\n function i(a) {\n O(\"mutationObserver\", \"mutationObserver: \" + a[0].target + \" \" + a[0].type), a.forEach(b);\n }\n\n function j() {\n var a = document.querySelector(\"body\"),\n b = {\n attributes: !0,\n attributeOldValue: !1,\n characterData: !0,\n characterDataOldValue: !1,\n childList: !0,\n subtree: !0\n };\n return m = new l(i), h(\"Create body MutationObserver\"), m.observe(a, b), m;\n }\n\n var k = [],\n l = window.MutationObserver || window.WebKitMutationObserver,\n m = j();\n return {\n disconnect: function disconnect() {\n \"disconnect\" in m && (h(\"Disconnect body MutationObserver\"), m.disconnect(), k.forEach(d));\n }\n };\n }\n\n function G() {\n var a = 0 > ka;\n window.MutationObserver || window.WebKitMutationObserver ? a ? E() : $ = F() : (h(\"MutationObserver not supported in this browser!\"), E());\n }\n\n function H(a, b) {\n function c(a) {\n var c = /^\\d+(px)?$/i;\n if (c.test(a)) return parseInt(a, W);\n var d = b.style.left,\n e = b.runtimeStyle.left;\n return b.runtimeStyle.left = b.currentStyle.left, b.style.left = a || 0, a = b.style.pixelLeft, b.style.left = d, b.runtimeStyle.left = e, a;\n }\n\n var d = 0;\n return b = b || document.body, \"defaultView\" in document && \"getComputedStyle\" in document.defaultView ? (d = document.defaultView.getComputedStyle(b, null), d = null !== d ? d[a] : 0) : d = c(b.currentStyle[a]), parseInt(d, W);\n }\n\n function I(a) {\n a > ya / 2 && (ya = 2 * a, h(\"Event throttle increased to \" + ya + \"ms\"));\n }\n\n function J(a, b) {\n for (var c = b.length, d = 0, f = 0, g = e(a), i = Ma(), j = 0; c > j; j++) {\n d = b[j].getBoundingClientRect()[a] + H(\"margin\" + g, b[j]), d > f && (f = d);\n }\n\n return i = Ma() - i, h(\"Parsed \" + c + \" HTML elements\"), h(\"Element position calculated in \" + i + \"ms\"), I(i), f;\n }\n\n function K(a) {\n return [a.bodyOffset(), a.bodyScroll(), a.documentElementOffset(), a.documentElementScroll()];\n }\n\n function L(a, b) {\n function c() {\n return i(\"No tagged elements (\" + b + \") found on page\"), document.querySelectorAll(\"body *\");\n }\n\n var d = document.querySelectorAll(\"[\" + b + \"]\");\n return 0 === d.length && c(), J(a, d);\n }\n\n function M() {\n return document.querySelectorAll(\"body *\");\n }\n\n function N(b, c, d, e) {\n function f() {\n ea = m, za = n, S(ea, za, b);\n }\n\n function g() {\n function b(a, b) {\n var c = Math.abs(a - b) <= va;\n return !c;\n }\n\n return m = a !== d ? d : Na[ga](), n = a !== e ? e : Oa[Ba](), b(ea, m) || aa && b(za, n);\n }\n\n function i() {\n return !(b in {\n init: 1,\n interval: 1,\n size: 1\n });\n }\n\n function j() {\n return ga in qa || aa && Ba in qa;\n }\n\n function k() {\n h(\"No change in size detected\");\n }\n\n function l() {\n i() && j() ? R(c) : b in {\n interval: 1\n } || k();\n }\n\n var m, n;\n g() || \"init\" === b ? (P(), f()) : l();\n }\n\n function O(a, b, c, d) {\n function e() {\n a in {\n reset: 1,\n resetPage: 1,\n init: 1\n } || h(\"Trigger event: \" + b);\n }\n\n function f() {\n return wa && a in ba;\n }\n\n f() ? h(\"Trigger event cancelled: \" + a) : (e(), \"init\" === a ? N(a, b, c, d) : Pa(a, b, c, d));\n }\n\n function P() {\n wa || (wa = !0, h(\"Trigger event lock on\")), clearTimeout(xa), xa = setTimeout(function () {\n wa = !1, h(\"Trigger event lock off\"), h(\"--\");\n }, ca);\n }\n\n function Q(a) {\n ea = Na[ga](), za = Oa[Ba](), S(ea, za, a);\n }\n\n function R(a) {\n var b = ga;\n ga = fa, h(\"Reset trigger event: \" + a), P(), Q(\"reset\"), ga = b;\n }\n\n function S(b, c, d, e, f) {\n function g() {\n a === f ? f = ua : h(\"Message targetOrigin: \" + f);\n }\n\n function i() {\n var g = b + \":\" + c,\n i = pa + \":\" + g + \":\" + d + (a !== e ? \":\" + e : \"\");\n h(\"Sending message to host page (\" + i + \")\"), ta.postMessage(na + i, f);\n }\n\n !0 === sa && (g(), i());\n }\n\n function T(a) {\n function b() {\n return na === (\"\" + a.data).substr(0, oa);\n }\n\n function c() {\n return a.data.split(\"]\")[1].split(\":\")[0];\n }\n\n function d() {\n return a.data.substr(a.data.indexOf(\":\") + 1);\n }\n\n function e() {\n return !(\"undefined\" != typeof module && module.exports) && \"iFrameResize\" in window || \"jQuery\" in window && \"iFrameResize\" in window.jQuery.prototype;\n }\n\n function f() {\n return a.data.split(\":\")[2] in {\n \"true\": 1,\n \"false\": 1\n };\n }\n\n function g() {\n var b = c();\n b in l ? l[b]() : e() || f() || i(\"Unexpected message (\" + a.data + \")\");\n }\n\n function k() {\n !1 === da ? g() : f() ? l.init() : h('Ignored message of type \"' + c() + '\". Received before initialization.');\n }\n\n var l = {\n init: function init() {\n ia = a.data, ta = a.source, j(), da = !1, setTimeout(function () {\n ha = !1;\n }, ca);\n },\n reset: function reset() {\n ha ? h(\"Page reset ignored by init\") : (h(\"Page size reset by host page\"), Q(\"resetPage\"));\n },\n resize: function resize() {\n O(\"resizeParent\", \"Parent window requested size check\");\n },\n moveToAnchor: function moveToAnchor() {\n ja.findTarget(d());\n },\n inPageLink: function inPageLink() {\n this.moveToAnchor();\n },\n pageInfo: function pageInfo() {\n var a = d();\n h(\"PageInfoFromParent called from parent: \" + a), Fa(JSON.parse(a)), h(\" --\");\n },\n message: function message() {\n var a = d();\n h(\"MessageCallback called from parent: \" + a), Da(JSON.parse(a)), h(\" --\");\n }\n };\n b() && k();\n }\n\n function U() {\n \"loading\" !== document.readyState && window.parent.postMessage(\"[iFrameResizerChild]Ready\", \"*\");\n }\n\n if (\"undefined\" != typeof window) {\n var V = !0,\n W = 10,\n X = \"\",\n Y = 0,\n Z = \"\",\n $ = null,\n _ = \"\",\n aa = !1,\n ba = {\n resize: 1,\n click: 1\n },\n ca = 128,\n da = !0,\n ea = 1,\n fa = \"bodyOffset\",\n ga = fa,\n ha = !0,\n ia = \"\",\n ja = {},\n ka = 32,\n la = null,\n ma = !1,\n na = \"[iFrameSizer]\",\n oa = na.length,\n pa = \"\",\n qa = {\n max: 1,\n min: 1,\n bodyScroll: 1,\n documentElementScroll: 1\n },\n ra = \"child\",\n sa = !0,\n ta = window.parent,\n ua = \"*\",\n va = 0,\n wa = !1,\n xa = null,\n ya = 16,\n za = 1,\n Aa = \"scroll\",\n Ba = Aa,\n Ca = window,\n Da = function Da() {\n i(\"MessageCallback function not defined\");\n },\n Ea = function Ea() {},\n Fa = function Fa() {},\n Ga = {\n height: function height() {\n return i(\"Custom height calculation function not defined\"), document.documentElement.offsetHeight;\n },\n width: function width() {\n return i(\"Custom width calculation function not defined\"), document.body.scrollWidth;\n }\n },\n Ha = {},\n Ia = !1,\n Ja = !1;\n\n try {\n var Ka = Object.create({}, {\n passive: {\n get: function get() {\n Ia = !0;\n }\n },\n once: {\n get: function get() {\n Ja = !0;\n }\n }\n });\n window.addEventListener(\"test\", b, Ka), window.removeEventListener(\"test\", b, Ka);\n } catch (La) {}\n\n var Ma = Date.now || function () {\n return new Date().getTime();\n },\n Na = {\n bodyOffset: function bodyOffset() {\n return document.body.offsetHeight + H(\"marginTop\") + H(\"marginBottom\");\n },\n offset: function offset() {\n return Na.bodyOffset();\n },\n bodyScroll: function bodyScroll() {\n return document.body.scrollHeight;\n },\n custom: function custom() {\n return Ga.height();\n },\n documentElementOffset: function documentElementOffset() {\n return document.documentElement.offsetHeight;\n },\n documentElementScroll: function documentElementScroll() {\n return document.documentElement.scrollHeight;\n },\n max: function max() {\n return Math.max.apply(null, K(Na));\n },\n min: function min() {\n return Math.min.apply(null, K(Na));\n },\n grow: function grow() {\n return Na.max();\n },\n lowestElement: function lowestElement() {\n return Math.max(Na.bodyOffset() || Na.documentElementOffset(), J(\"bottom\", M()));\n },\n taggedElement: function taggedElement() {\n return L(\"bottom\", \"data-iframe-height\");\n }\n },\n Oa = {\n bodyScroll: function bodyScroll() {\n return document.body.scrollWidth;\n },\n bodyOffset: function bodyOffset() {\n return document.body.offsetWidth;\n },\n custom: function custom() {\n return Ga.width();\n },\n documentElementScroll: function documentElementScroll() {\n return document.documentElement.scrollWidth;\n },\n documentElementOffset: function documentElementOffset() {\n return document.documentElement.offsetWidth;\n },\n scroll: function scroll() {\n return Math.max(Oa.bodyScroll(), Oa.documentElementScroll());\n },\n max: function max() {\n return Math.max.apply(null, K(Oa));\n },\n min: function min() {\n return Math.min.apply(null, K(Oa));\n },\n rightMostElement: function rightMostElement() {\n return J(\"right\", M());\n },\n taggedElement: function taggedElement() {\n return L(\"right\", \"data-iframe-width\");\n }\n },\n Pa = f(N);\n\n c(window, \"message\", T), c(window, \"readystatechange\", U), U();\n }\n}();\n\n//# sourceURL=webpack:///./node_modules/iframe-resizer/js/iframeResizer.contentWindow.min.js?"); - -/***/ }), - -/***/ "./node_modules/js-cookie/src/js.cookie.js": -/*!*************************************************!*\ - !*** ./node_modules/js-cookie/src/js.cookie.js ***! - \*************************************************/ -/*! no static exports found */ -/*! ModuleConcatenation bailout: Module is not an ECMAScript module */ -/***/ (function(module, exports, __webpack_require__) { - -eval("var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_RESULT__;function _typeof(obj) { if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\n/*!\n * JavaScript Cookie v2.2.0\n * https://github.com/js-cookie/js-cookie\n *\n * Copyright 2006, 2015 Klaus Hartl & Fagner Brack\n * Released under the MIT license\n */\n;\n\n(function (factory) {\n var registeredInModuleLoader = false;\n\n if (true) {\n !(__WEBPACK_AMD_DEFINE_FACTORY__ = (factory),\n\t\t\t\t__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?\n\t\t\t\t(__WEBPACK_AMD_DEFINE_FACTORY__.call(exports, __webpack_require__, exports, module)) :\n\t\t\t\t__WEBPACK_AMD_DEFINE_FACTORY__),\n\t\t\t\t__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));\n registeredInModuleLoader = true;\n }\n\n if (( false ? undefined : _typeof(exports)) === 'object') {\n module.exports = factory();\n registeredInModuleLoader = true;\n }\n\n if (!registeredInModuleLoader) {\n var OldCookies = window.Cookies;\n var api = window.Cookies = factory();\n\n api.noConflict = function () {\n window.Cookies = OldCookies;\n return api;\n };\n }\n})(function () {\n function extend() {\n var i = 0;\n var result = {};\n\n for (; i < arguments.length; i++) {\n var attributes = arguments[i];\n\n for (var key in attributes) {\n result[key] = attributes[key];\n }\n }\n\n return result;\n }\n\n function init(converter) {\n function api(key, value, attributes) {\n var result;\n\n if (typeof document === 'undefined') {\n return;\n } // Write\n\n\n if (arguments.length > 1) {\n attributes = extend({\n path: '/'\n }, api.defaults, attributes);\n\n if (typeof attributes.expires === 'number') {\n var expires = new Date();\n expires.setMilliseconds(expires.getMilliseconds() + attributes.expires * 864e+5);\n attributes.expires = expires;\n } // We're using \"expires\" because \"max-age\" is not supported by IE\n\n\n attributes.expires = attributes.expires ? attributes.expires.toUTCString() : '';\n\n try {\n result = JSON.stringify(value);\n\n if (/^[\\{\\[]/.test(result)) {\n value = result;\n }\n } catch (e) {}\n\n if (!converter.write) {\n value = encodeURIComponent(String(value)).replace(/%(23|24|26|2B|3A|3C|3E|3D|2F|3F|40|5B|5D|5E|60|7B|7D|7C)/g, decodeURIComponent);\n } else {\n value = converter.write(value, key);\n }\n\n key = encodeURIComponent(String(key));\n key = key.replace(/%(23|24|26|2B|5E|60|7C)/g, decodeURIComponent);\n key = key.replace(/[\\(\\)]/g, escape);\n var stringifiedAttributes = '';\n\n for (var attributeName in attributes) {\n if (!attributes[attributeName]) {\n continue;\n }\n\n stringifiedAttributes += '; ' + attributeName;\n\n if (attributes[attributeName] === true) {\n continue;\n }\n\n stringifiedAttributes += '=' + attributes[attributeName];\n }\n\n return document.cookie = key + '=' + value + stringifiedAttributes;\n } // Read\n\n\n if (!key) {\n result = {};\n } // To prevent the for loop in the first place assign an empty array\n // in case there are no cookies at all. Also prevents odd result when\n // calling \"get()\"\n\n\n var cookies = document.cookie ? document.cookie.split('; ') : [];\n var rdecode = /(%[0-9A-Z]{2})+/g;\n var i = 0;\n\n for (; i < cookies.length; i++) {\n var parts = cookies[i].split('=');\n var cookie = parts.slice(1).join('=');\n\n if (!this.json && cookie.charAt(0) === '\"') {\n cookie = cookie.slice(1, -1);\n }\n\n try {\n var name = parts[0].replace(rdecode, decodeURIComponent);\n cookie = converter.read ? converter.read(cookie, name) : converter(cookie, name) || cookie.replace(rdecode, decodeURIComponent);\n\n if (this.json) {\n try {\n cookie = JSON.parse(cookie);\n } catch (e) {}\n }\n\n if (key === name) {\n result = cookie;\n break;\n }\n\n if (!key) {\n result[name] = cookie;\n }\n } catch (e) {}\n }\n\n return result;\n }\n\n api.set = api;\n\n api.get = function (key) {\n return api.call(api, key);\n };\n\n api.getJSON = function () {\n return api.apply({\n json: true\n }, [].slice.call(arguments));\n };\n\n api.defaults = {};\n\n api.remove = function (key, attributes) {\n api(key, '', extend(attributes, {\n expires: -1\n }));\n };\n\n api.withConverter = init;\n return api;\n }\n\n return init(function () {});\n});\n\n//# sourceURL=webpack:///./node_modules/js-cookie/src/js.cookie.js?"); - -/***/ }), - -/***/ "./node_modules/mousetrap/mousetrap.js": -/*!*********************************************!*\ - !*** ./node_modules/mousetrap/mousetrap.js ***! - \*********************************************/ -/*! no static exports found */ -/*! ModuleConcatenation bailout: Module is not an ECMAScript module */ -/***/ (function(module, exports, __webpack_require__) { - -eval("var __WEBPACK_AMD_DEFINE_RESULT__;/*global define:false */\n\n/**\n * Copyright 2012-2017 Craig Campbell\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n *\n * Mousetrap is a simple keyboard shortcut library for Javascript with\n * no external dependencies\n *\n * @version 1.6.2\n * @url craig.is/killing/mice\n */\n(function (window, document, undefined) {\n // Check if mousetrap is used inside browser, if not, return\n if (!window) {\n return;\n }\n /**\n * mapping of special keycodes to their corresponding keys\n *\n * everything in this dictionary cannot use keypress events\n * so it has to be here to map to the correct keycodes for\n * keyup/keydown events\n *\n * @type {Object}\n */\n\n\n var _MAP = {\n 8: 'backspace',\n 9: 'tab',\n 13: 'enter',\n 16: 'shift',\n 17: 'ctrl',\n 18: 'alt',\n 20: 'capslock',\n 27: 'esc',\n 32: 'space',\n 33: 'pageup',\n 34: 'pagedown',\n 35: 'end',\n 36: 'home',\n 37: 'left',\n 38: 'up',\n 39: 'right',\n 40: 'down',\n 45: 'ins',\n 46: 'del',\n 91: 'meta',\n 93: 'meta',\n 224: 'meta'\n };\n /**\n * mapping for special characters so they can support\n *\n * this dictionary is only used incase you want to bind a\n * keyup or keydown event to one of these keys\n *\n * @type {Object}\n */\n\n var _KEYCODE_MAP = {\n 106: '*',\n 107: '+',\n 109: '-',\n 110: '.',\n 111: '/',\n 186: ';',\n 187: '=',\n 188: ',',\n 189: '-',\n 190: '.',\n 191: '/',\n 192: '`',\n 219: '[',\n 220: '\\\\',\n 221: ']',\n 222: '\\''\n };\n /**\n * this is a mapping of keys that require shift on a US keypad\n * back to the non shift equivelents\n *\n * this is so you can use keyup events with these keys\n *\n * note that this will only work reliably on US keyboards\n *\n * @type {Object}\n */\n\n var _SHIFT_MAP = {\n '~': '`',\n '!': '1',\n '@': '2',\n '#': '3',\n '$': '4',\n '%': '5',\n '^': '6',\n '&': '7',\n '*': '8',\n '(': '9',\n ')': '0',\n '_': '-',\n '+': '=',\n ':': ';',\n '\\\"': '\\'',\n '<': ',',\n '>': '.',\n '?': '/',\n '|': '\\\\'\n };\n /**\n * this is a list of special strings you can use to map\n * to modifier keys when you specify your keyboard shortcuts\n *\n * @type {Object}\n */\n\n var _SPECIAL_ALIASES = {\n 'option': 'alt',\n 'command': 'meta',\n 'return': 'enter',\n 'escape': 'esc',\n 'plus': '+',\n 'mod': /Mac|iPod|iPhone|iPad/.test(navigator.platform) ? 'meta' : 'ctrl'\n };\n /**\n * variable to store the flipped version of _MAP from above\n * needed to check if we should use keypress or not when no action\n * is specified\n *\n * @type {Object|undefined}\n */\n\n var _REVERSE_MAP;\n /**\n * loop through the f keys, f1 to f19 and add them to the map\n * programatically\n */\n\n\n for (var i = 1; i < 20; ++i) {\n _MAP[111 + i] = 'f' + i;\n }\n /**\n * loop through to map numbers on the numeric keypad\n */\n\n\n for (i = 0; i <= 9; ++i) {\n // This needs to use a string cause otherwise since 0 is falsey\n // mousetrap will never fire for numpad 0 pressed as part of a keydown\n // event.\n //\n // @see https://github.com/ccampbell/mousetrap/pull/258\n _MAP[i + 96] = i.toString();\n }\n /**\n * cross browser add event method\n *\n * @param {Element|HTMLDocument} object\n * @param {string} type\n * @param {Function} callback\n * @returns void\n */\n\n\n function _addEvent(object, type, callback) {\n if (object.addEventListener) {\n object.addEventListener(type, callback, false);\n return;\n }\n\n object.attachEvent('on' + type, callback);\n }\n /**\n * takes the event and returns the key character\n *\n * @param {Event} e\n * @return {string}\n */\n\n\n function _characterFromEvent(e) {\n // for keypress events we should return the character as is\n if (e.type == 'keypress') {\n var character = String.fromCharCode(e.which); // if the shift key is not pressed then it is safe to assume\n // that we want the character to be lowercase. this means if\n // you accidentally have caps lock on then your key bindings\n // will continue to work\n //\n // the only side effect that might not be desired is if you\n // bind something like 'A' cause you want to trigger an\n // event when capital A is pressed caps lock will no longer\n // trigger the event. shift+a will though.\n\n if (!e.shiftKey) {\n character = character.toLowerCase();\n }\n\n return character;\n } // for non keypress events the special maps are needed\n\n\n if (_MAP[e.which]) {\n return _MAP[e.which];\n }\n\n if (_KEYCODE_MAP[e.which]) {\n return _KEYCODE_MAP[e.which];\n } // if it is not in the special map\n // with keydown and keyup events the character seems to always\n // come in as an uppercase character whether you are pressing shift\n // or not. we should make sure it is always lowercase for comparisons\n\n\n return String.fromCharCode(e.which).toLowerCase();\n }\n /**\n * checks if two arrays are equal\n *\n * @param {Array} modifiers1\n * @param {Array} modifiers2\n * @returns {boolean}\n */\n\n\n function _modifiersMatch(modifiers1, modifiers2) {\n return modifiers1.sort().join(',') === modifiers2.sort().join(',');\n }\n /**\n * takes a key event and figures out what the modifiers are\n *\n * @param {Event} e\n * @returns {Array}\n */\n\n\n function _eventModifiers(e) {\n var modifiers = [];\n\n if (e.shiftKey) {\n modifiers.push('shift');\n }\n\n if (e.altKey) {\n modifiers.push('alt');\n }\n\n if (e.ctrlKey) {\n modifiers.push('ctrl');\n }\n\n if (e.metaKey) {\n modifiers.push('meta');\n }\n\n return modifiers;\n }\n /**\n * prevents default for this event\n *\n * @param {Event} e\n * @returns void\n */\n\n\n function _preventDefault(e) {\n if (e.preventDefault) {\n e.preventDefault();\n return;\n }\n\n e.returnValue = false;\n }\n /**\n * stops propogation for this event\n *\n * @param {Event} e\n * @returns void\n */\n\n\n function _stopPropagation(e) {\n if (e.stopPropagation) {\n e.stopPropagation();\n return;\n }\n\n e.cancelBubble = true;\n }\n /**\n * determines if the keycode specified is a modifier key or not\n *\n * @param {string} key\n * @returns {boolean}\n */\n\n\n function _isModifier(key) {\n return key == 'shift' || key == 'ctrl' || key == 'alt' || key == 'meta';\n }\n /**\n * reverses the map lookup so that we can look for specific keys\n * to see what can and can't use keypress\n *\n * @return {Object}\n */\n\n\n function _getReverseMap() {\n if (!_REVERSE_MAP) {\n _REVERSE_MAP = {};\n\n for (var key in _MAP) {\n // pull out the numeric keypad from here cause keypress should\n // be able to detect the keys from the character\n if (key > 95 && key < 112) {\n continue;\n }\n\n if (_MAP.hasOwnProperty(key)) {\n _REVERSE_MAP[_MAP[key]] = key;\n }\n }\n }\n\n return _REVERSE_MAP;\n }\n /**\n * picks the best action based on the key combination\n *\n * @param {string} key - character for key\n * @param {Array} modifiers\n * @param {string=} action passed in\n */\n\n\n function _pickBestAction(key, modifiers, action) {\n // if no action was picked in we should try to pick the one\n // that we think would work best for this key\n if (!action) {\n action = _getReverseMap()[key] ? 'keydown' : 'keypress';\n } // modifier keys don't work as expected with keypress,\n // switch to keydown\n\n\n if (action == 'keypress' && modifiers.length) {\n action = 'keydown';\n }\n\n return action;\n }\n /**\n * Converts from a string key combination to an array\n *\n * @param {string} combination like \"command+shift+l\"\n * @return {Array}\n */\n\n\n function _keysFromString(combination) {\n if (combination === '+') {\n return ['+'];\n }\n\n combination = combination.replace(/\\+{2}/g, '+plus');\n return combination.split('+');\n }\n /**\n * Gets info for a specific key combination\n *\n * @param {string} combination key combination (\"command+s\" or \"a\" or \"*\")\n * @param {string=} action\n * @returns {Object}\n */\n\n\n function _getKeyInfo(combination, action) {\n var keys;\n var key;\n var i;\n var modifiers = []; // take the keys from this pattern and figure out what the actual\n // pattern is all about\n\n keys = _keysFromString(combination);\n\n for (i = 0; i < keys.length; ++i) {\n key = keys[i]; // normalize key names\n\n if (_SPECIAL_ALIASES[key]) {\n key = _SPECIAL_ALIASES[key];\n } // if this is not a keypress event then we should\n // be smart about using shift keys\n // this will only work for US keyboards however\n\n\n if (action && action != 'keypress' && _SHIFT_MAP[key]) {\n key = _SHIFT_MAP[key];\n modifiers.push('shift');\n } // if this key is a modifier then add it to the list of modifiers\n\n\n if (_isModifier(key)) {\n modifiers.push(key);\n }\n } // depending on what the key combination is\n // we will try to pick the best event for it\n\n\n action = _pickBestAction(key, modifiers, action);\n return {\n key: key,\n modifiers: modifiers,\n action: action\n };\n }\n\n function _belongsTo(element, ancestor) {\n if (element === null || element === document) {\n return false;\n }\n\n if (element === ancestor) {\n return true;\n }\n\n return _belongsTo(element.parentNode, ancestor);\n }\n\n function Mousetrap(targetElement) {\n var self = this;\n targetElement = targetElement || document;\n\n if (!(self instanceof Mousetrap)) {\n return new Mousetrap(targetElement);\n }\n /**\n * element to attach key events to\n *\n * @type {Element}\n */\n\n\n self.target = targetElement;\n /**\n * a list of all the callbacks setup via Mousetrap.bind()\n *\n * @type {Object}\n */\n\n self._callbacks = {};\n /**\n * direct map of string combinations to callbacks used for trigger()\n *\n * @type {Object}\n */\n\n self._directMap = {};\n /**\n * keeps track of what level each sequence is at since multiple\n * sequences can start out with the same sequence\n *\n * @type {Object}\n */\n\n var _sequenceLevels = {};\n /**\n * variable to store the setTimeout call\n *\n * @type {null|number}\n */\n\n var _resetTimer;\n /**\n * temporary state where we will ignore the next keyup\n *\n * @type {boolean|string}\n */\n\n\n var _ignoreNextKeyup = false;\n /**\n * temporary state where we will ignore the next keypress\n *\n * @type {boolean}\n */\n\n var _ignoreNextKeypress = false;\n /**\n * are we currently inside of a sequence?\n * type of action (\"keyup\" or \"keydown\" or \"keypress\") or false\n *\n * @type {boolean|string}\n */\n\n var _nextExpectedAction = false;\n /**\n * resets all sequence counters except for the ones passed in\n *\n * @param {Object} doNotReset\n * @returns void\n */\n\n function _resetSequences(doNotReset) {\n doNotReset = doNotReset || {};\n var activeSequences = false,\n key;\n\n for (key in _sequenceLevels) {\n if (doNotReset[key]) {\n activeSequences = true;\n continue;\n }\n\n _sequenceLevels[key] = 0;\n }\n\n if (!activeSequences) {\n _nextExpectedAction = false;\n }\n }\n /**\n * finds all callbacks that match based on the keycode, modifiers,\n * and action\n *\n * @param {string} character\n * @param {Array} modifiers\n * @param {Event|Object} e\n * @param {string=} sequenceName - name of the sequence we are looking for\n * @param {string=} combination\n * @param {number=} level\n * @returns {Array}\n */\n\n\n function _getMatches(character, modifiers, e, sequenceName, combination, level) {\n var i;\n var callback;\n var matches = [];\n var action = e.type; // if there are no events related to this keycode\n\n if (!self._callbacks[character]) {\n return [];\n } // if a modifier key is coming up on its own we should allow it\n\n\n if (action == 'keyup' && _isModifier(character)) {\n modifiers = [character];\n } // loop through all callbacks for the key that was pressed\n // and see if any of them match\n\n\n for (i = 0; i < self._callbacks[character].length; ++i) {\n callback = self._callbacks[character][i]; // if a sequence name is not specified, but this is a sequence at\n // the wrong level then move onto the next match\n\n if (!sequenceName && callback.seq && _sequenceLevels[callback.seq] != callback.level) {\n continue;\n } // if the action we are looking for doesn't match the action we got\n // then we should keep going\n\n\n if (action != callback.action) {\n continue;\n } // if this is a keypress event and the meta key and control key\n // are not pressed that means that we need to only look at the\n // character, otherwise check the modifiers as well\n //\n // chrome will not fire a keypress if meta or control is down\n // safari will fire a keypress if meta or meta+shift is down\n // firefox will fire a keypress if meta or control is down\n\n\n if (action == 'keypress' && !e.metaKey && !e.ctrlKey || _modifiersMatch(modifiers, callback.modifiers)) {\n // when you bind a combination or sequence a second time it\n // should overwrite the first one. if a sequenceName or\n // combination is specified in this call it does just that\n //\n // @todo make deleting its own method?\n var deleteCombo = !sequenceName && callback.combo == combination;\n var deleteSequence = sequenceName && callback.seq == sequenceName && callback.level == level;\n\n if (deleteCombo || deleteSequence) {\n self._callbacks[character].splice(i, 1);\n }\n\n matches.push(callback);\n }\n }\n\n return matches;\n }\n /**\n * actually calls the callback function\n *\n * if your callback function returns false this will use the jquery\n * convention - prevent default and stop propogation on the event\n *\n * @param {Function} callback\n * @param {Event} e\n * @returns void\n */\n\n\n function _fireCallback(callback, e, combo, sequence) {\n // if this event should not happen stop here\n if (self.stopCallback(e, e.target || e.srcElement, combo, sequence)) {\n return;\n }\n\n if (callback(e, combo) === false) {\n _preventDefault(e);\n\n _stopPropagation(e);\n }\n }\n /**\n * handles a character key event\n *\n * @param {string} character\n * @param {Array} modifiers\n * @param {Event} e\n * @returns void\n */\n\n\n self._handleKey = function (character, modifiers, e) {\n var callbacks = _getMatches(character, modifiers, e);\n\n var i;\n var doNotReset = {};\n var maxLevel = 0;\n var processedSequenceCallback = false; // Calculate the maxLevel for sequences so we can only execute the longest callback sequence\n\n for (i = 0; i < callbacks.length; ++i) {\n if (callbacks[i].seq) {\n maxLevel = Math.max(maxLevel, callbacks[i].level);\n }\n } // loop through matching callbacks for this key event\n\n\n for (i = 0; i < callbacks.length; ++i) {\n // fire for all sequence callbacks\n // this is because if for example you have multiple sequences\n // bound such as \"g i\" and \"g t\" they both need to fire the\n // callback for matching g cause otherwise you can only ever\n // match the first one\n if (callbacks[i].seq) {\n // only fire callbacks for the maxLevel to prevent\n // subsequences from also firing\n //\n // for example 'a option b' should not cause 'option b' to fire\n // even though 'option b' is part of the other sequence\n //\n // any sequences that do not match here will be discarded\n // below by the _resetSequences call\n if (callbacks[i].level != maxLevel) {\n continue;\n }\n\n processedSequenceCallback = true; // keep a list of which sequences were matches for later\n\n doNotReset[callbacks[i].seq] = 1;\n\n _fireCallback(callbacks[i].callback, e, callbacks[i].combo, callbacks[i].seq);\n\n continue;\n } // if there were no sequence matches but we are still here\n // that means this is a regular match so we should fire that\n\n\n if (!processedSequenceCallback) {\n _fireCallback(callbacks[i].callback, e, callbacks[i].combo);\n }\n } // if the key you pressed matches the type of sequence without\n // being a modifier (ie \"keyup\" or \"keypress\") then we should\n // reset all sequences that were not matched by this event\n //\n // this is so, for example, if you have the sequence \"h a t\" and you\n // type \"h e a r t\" it does not match. in this case the \"e\" will\n // cause the sequence to reset\n //\n // modifier keys are ignored because you can have a sequence\n // that contains modifiers such as \"enter ctrl+space\" and in most\n // cases the modifier key will be pressed before the next key\n //\n // also if you have a sequence such as \"ctrl+b a\" then pressing the\n // \"b\" key will trigger a \"keypress\" and a \"keydown\"\n //\n // the \"keydown\" is expected when there is a modifier, but the\n // \"keypress\" ends up matching the _nextExpectedAction since it occurs\n // after and that causes the sequence to reset\n //\n // we ignore keypresses in a sequence that directly follow a keydown\n // for the same character\n\n\n var ignoreThisKeypress = e.type == 'keypress' && _ignoreNextKeypress;\n\n if (e.type == _nextExpectedAction && !_isModifier(character) && !ignoreThisKeypress) {\n _resetSequences(doNotReset);\n }\n\n _ignoreNextKeypress = processedSequenceCallback && e.type == 'keydown';\n };\n /**\n * handles a keydown event\n *\n * @param {Event} e\n * @returns void\n */\n\n\n function _handleKeyEvent(e) {\n // normalize e.which for key events\n // @see http://stackoverflow.com/questions/4285627/javascript-keycode-vs-charcode-utter-confusion\n if (typeof e.which !== 'number') {\n e.which = e.keyCode;\n }\n\n var character = _characterFromEvent(e); // no character found then stop\n\n\n if (!character) {\n return;\n } // need to use === for the character check because the character can be 0\n\n\n if (e.type == 'keyup' && _ignoreNextKeyup === character) {\n _ignoreNextKeyup = false;\n return;\n }\n\n self.handleKey(character, _eventModifiers(e), e);\n }\n /**\n * called to set a 1 second timeout on the specified sequence\n *\n * this is so after each key press in the sequence you have 1 second\n * to press the next key before you have to start over\n *\n * @returns void\n */\n\n\n function _resetSequenceTimer() {\n clearTimeout(_resetTimer);\n _resetTimer = setTimeout(_resetSequences, 1000);\n }\n /**\n * binds a key sequence to an event\n *\n * @param {string} combo - combo specified in bind call\n * @param {Array} keys\n * @param {Function} callback\n * @param {string=} action\n * @returns void\n */\n\n\n function _bindSequence(combo, keys, callback, action) {\n // start off by adding a sequence level record for this combination\n // and setting the level to 0\n _sequenceLevels[combo] = 0;\n /**\n * callback to increase the sequence level for this sequence and reset\n * all other sequences that were active\n *\n * @param {string} nextAction\n * @returns {Function}\n */\n\n function _increaseSequence(nextAction) {\n return function () {\n _nextExpectedAction = nextAction;\n ++_sequenceLevels[combo];\n\n _resetSequenceTimer();\n };\n }\n /**\n * wraps the specified callback inside of another function in order\n * to reset all sequence counters as soon as this sequence is done\n *\n * @param {Event} e\n * @returns void\n */\n\n\n function _callbackAndReset(e) {\n _fireCallback(callback, e, combo); // we should ignore the next key up if the action is key down\n // or keypress. this is so if you finish a sequence and\n // release the key the final key will not trigger a keyup\n\n\n if (action !== 'keyup') {\n _ignoreNextKeyup = _characterFromEvent(e);\n } // weird race condition if a sequence ends with the key\n // another sequence begins with\n\n\n setTimeout(_resetSequences, 10);\n } // loop through keys one at a time and bind the appropriate callback\n // function. for any key leading up to the final one it should\n // increase the sequence. after the final, it should reset all sequences\n //\n // if an action is specified in the original bind call then that will\n // be used throughout. otherwise we will pass the action that the\n // next key in the sequence should match. this allows a sequence\n // to mix and match keypress and keydown events depending on which\n // ones are better suited to the key provided\n\n\n for (var i = 0; i < keys.length; ++i) {\n var isFinal = i + 1 === keys.length;\n var wrappedCallback = isFinal ? _callbackAndReset : _increaseSequence(action || _getKeyInfo(keys[i + 1]).action);\n\n _bindSingle(keys[i], wrappedCallback, action, combo, i);\n }\n }\n /**\n * binds a single keyboard combination\n *\n * @param {string} combination\n * @param {Function} callback\n * @param {string=} action\n * @param {string=} sequenceName - name of sequence if part of sequence\n * @param {number=} level - what part of the sequence the command is\n * @returns void\n */\n\n\n function _bindSingle(combination, callback, action, sequenceName, level) {\n // store a direct mapped reference for use with Mousetrap.trigger\n self._directMap[combination + ':' + action] = callback; // make sure multiple spaces in a row become a single space\n\n combination = combination.replace(/\\s+/g, ' ');\n var sequence = combination.split(' ');\n var info; // if this pattern is a sequence of keys then run through this method\n // to reprocess each pattern one key at a time\n\n if (sequence.length > 1) {\n _bindSequence(combination, sequence, callback, action);\n\n return;\n }\n\n info = _getKeyInfo(combination, action); // make sure to initialize array if this is the first time\n // a callback is added for this key\n\n self._callbacks[info.key] = self._callbacks[info.key] || []; // remove an existing match if there is one\n\n _getMatches(info.key, info.modifiers, {\n type: info.action\n }, sequenceName, combination, level); // add this call back to the array\n // if it is a sequence put it at the beginning\n // if not put it at the end\n //\n // this is important because the way these are processed expects\n // the sequence ones to come first\n\n\n self._callbacks[info.key][sequenceName ? 'unshift' : 'push']({\n callback: callback,\n modifiers: info.modifiers,\n action: info.action,\n seq: sequenceName,\n level: level,\n combo: combination\n });\n }\n /**\n * binds multiple combinations to the same callback\n *\n * @param {Array} combinations\n * @param {Function} callback\n * @param {string|undefined} action\n * @returns void\n */\n\n\n self._bindMultiple = function (combinations, callback, action) {\n for (var i = 0; i < combinations.length; ++i) {\n _bindSingle(combinations[i], callback, action);\n }\n }; // start!\n\n\n _addEvent(targetElement, 'keypress', _handleKeyEvent);\n\n _addEvent(targetElement, 'keydown', _handleKeyEvent);\n\n _addEvent(targetElement, 'keyup', _handleKeyEvent);\n }\n /**\n * binds an event to mousetrap\n *\n * can be a single key, a combination of keys separated with +,\n * an array of keys, or a sequence of keys separated by spaces\n *\n * be sure to list the modifier keys first to make sure that the\n * correct key ends up getting bound (the last key in the pattern)\n *\n * @param {string|Array} keys\n * @param {Function} callback\n * @param {string=} action - 'keypress', 'keydown', or 'keyup'\n * @returns void\n */\n\n\n Mousetrap.prototype.bind = function (keys, callback, action) {\n var self = this;\n keys = keys instanceof Array ? keys : [keys];\n\n self._bindMultiple.call(self, keys, callback, action);\n\n return self;\n };\n /**\n * unbinds an event to mousetrap\n *\n * the unbinding sets the callback function of the specified key combo\n * to an empty function and deletes the corresponding key in the\n * _directMap dict.\n *\n * TODO: actually remove this from the _callbacks dictionary instead\n * of binding an empty function\n *\n * the keycombo+action has to be exactly the same as\n * it was defined in the bind method\n *\n * @param {string|Array} keys\n * @param {string} action\n * @returns void\n */\n\n\n Mousetrap.prototype.unbind = function (keys, action) {\n var self = this;\n return self.bind.call(self, keys, function () {}, action);\n };\n /**\n * triggers an event that has already been bound\n *\n * @param {string} keys\n * @param {string=} action\n * @returns void\n */\n\n\n Mousetrap.prototype.trigger = function (keys, action) {\n var self = this;\n\n if (self._directMap[keys + ':' + action]) {\n self._directMap[keys + ':' + action]({}, keys);\n }\n\n return self;\n };\n /**\n * resets the library back to its initial state. this is useful\n * if you want to clear out the current keyboard shortcuts and bind\n * new ones - for example if you switch to another page\n *\n * @returns void\n */\n\n\n Mousetrap.prototype.reset = function () {\n var self = this;\n self._callbacks = {};\n self._directMap = {};\n return self;\n };\n /**\n * should we stop this event before firing off callbacks\n *\n * @param {Event} e\n * @param {Element} element\n * @return {boolean}\n */\n\n\n Mousetrap.prototype.stopCallback = function (e, element) {\n var self = this; // if the element has the class \"mousetrap\" then no need to stop\n\n if ((' ' + element.className + ' ').indexOf(' mousetrap ') > -1) {\n return false;\n }\n\n if (_belongsTo(element, self.target)) {\n return false;\n } // stop for input, select, and textarea\n\n\n return element.tagName == 'INPUT' || element.tagName == 'SELECT' || element.tagName == 'TEXTAREA' || element.isContentEditable;\n };\n /**\n * exposes _handleKey publicly so it can be overwritten by extensions\n */\n\n\n Mousetrap.prototype.handleKey = function () {\n var self = this;\n return self._handleKey.apply(self, arguments);\n };\n /**\n * allow custom key mappings\n */\n\n\n Mousetrap.addKeycodes = function (object) {\n for (var key in object) {\n if (object.hasOwnProperty(key)) {\n _MAP[key] = object[key];\n }\n }\n\n _REVERSE_MAP = null;\n };\n /**\n * Init the global mousetrap functions\n *\n * This method is needed to allow the global mousetrap functions to work\n * now that mousetrap is a constructor function.\n */\n\n\n Mousetrap.init = function () {\n var documentMousetrap = Mousetrap(document);\n\n for (var method in documentMousetrap) {\n if (method.charAt(0) !== '_') {\n Mousetrap[method] = function (method) {\n return function () {\n return documentMousetrap[method].apply(documentMousetrap, arguments);\n };\n }(method);\n }\n }\n };\n\n Mousetrap.init(); // expose mousetrap to the global object\n\n window.Mousetrap = Mousetrap; // expose as a common js module\n\n if (typeof module !== 'undefined' && module.exports) {\n module.exports = Mousetrap;\n } // expose mousetrap as an AMD module\n\n\n if (true) {\n !(__WEBPACK_AMD_DEFINE_RESULT__ = (function () {\n return Mousetrap;\n }).call(exports, __webpack_require__, exports, module),\n\t\t\t\t__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));\n }\n})(typeof window !== 'undefined' ? window : null, typeof window !== 'undefined' ? document : null);\n\n//# sourceURL=webpack:///./node_modules/mousetrap/mousetrap.js?"); - -/***/ }), - -/***/ "./node_modules/webpack/buildin/module.js": -/*!***********************************!*\ - !*** (webpack)/buildin/module.js ***! - \***********************************/ -/*! no static exports found */ -/*! ModuleConcatenation bailout: Module is not an ECMAScript module */ -/***/ (function(module, exports) { - -eval("module.exports = function (module) {\n if (!module.webpackPolyfill) {\n module.deprecate = function () {};\n\n module.paths = []; // module.parent = undefined by default\n\n if (!module.children) module.children = [];\n Object.defineProperty(module, \"loaded\", {\n enumerable: true,\n get: function get() {\n return module.l;\n }\n });\n Object.defineProperty(module, \"id\", {\n enumerable: true,\n get: function get() {\n return module.i;\n }\n });\n module.webpackPolyfill = 1;\n }\n\n return module;\n};\n\n//# sourceURL=webpack:///(webpack)/buildin/module.js?"); - -/***/ }), - -/***/ "./node_modules/wolfy87-eventemitter/EventEmitter.js": -/*!***********************************************************!*\ - !*** ./node_modules/wolfy87-eventemitter/EventEmitter.js ***! - \***********************************************************/ -/*! no static exports found */ -/*! ModuleConcatenation bailout: Module is not an ECMAScript module */ -/***/ (function(module, exports, __webpack_require__) { - -eval("var __WEBPACK_AMD_DEFINE_RESULT__;function _typeof(obj) { if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\n/*!\n * EventEmitter v5.2.5 - git.io/ee\n * Unlicense - http://unlicense.org/\n * Oliver Caldwell - http://oli.me.uk/\n * @preserve\n */\n;\n\n(function (exports) {\n 'use strict';\n /**\n * Class for managing events.\n * Can be extended to provide event functionality in other classes.\n *\n * @class EventEmitter Manages event registering and emitting.\n */\n\n function EventEmitter() {} // Shortcuts to improve speed and size\n\n\n var proto = EventEmitter.prototype;\n var originalGlobalValue = exports.EventEmitter;\n /**\n * Finds the index of the listener for the event in its storage array.\n *\n * @param {Function[]} listeners Array of listeners to search through.\n * @param {Function} listener Method to look for.\n * @return {Number} Index of the specified listener, -1 if not found\n * @api private\n */\n\n function indexOfListener(listeners, listener) {\n var i = listeners.length;\n\n while (i--) {\n if (listeners[i].listener === listener) {\n return i;\n }\n }\n\n return -1;\n }\n /**\n * Alias a method while keeping the context correct, to allow for overwriting of target method.\n *\n * @param {String} name The name of the target method.\n * @return {Function} The aliased method\n * @api private\n */\n\n\n function alias(name) {\n return function aliasClosure() {\n return this[name].apply(this, arguments);\n };\n }\n /**\n * Returns the listener array for the specified event.\n * Will initialise the event object and listener arrays if required.\n * Will return an object if you use a regex search. The object contains keys for each matched event. So /ba[rz]/ might return an object containing bar and baz. But only if you have either defined them with defineEvent or added some listeners to them.\n * Each property in the object response is an array of listener functions.\n *\n * @param {String|RegExp} evt Name of the event to return the listeners from.\n * @return {Function[]|Object} All listener functions for the event.\n */\n\n\n proto.getListeners = function getListeners(evt) {\n var events = this._getEvents();\n\n var response;\n var key; // Return a concatenated array of all matching events if\n // the selector is a regular expression.\n\n if (evt instanceof RegExp) {\n response = {};\n\n for (key in events) {\n if (events.hasOwnProperty(key) && evt.test(key)) {\n response[key] = events[key];\n }\n }\n } else {\n response = events[evt] || (events[evt] = []);\n }\n\n return response;\n };\n /**\n * Takes a list of listener objects and flattens it into a list of listener functions.\n *\n * @param {Object[]} listeners Raw listener objects.\n * @return {Function[]} Just the listener functions.\n */\n\n\n proto.flattenListeners = function flattenListeners(listeners) {\n var flatListeners = [];\n var i;\n\n for (i = 0; i < listeners.length; i += 1) {\n flatListeners.push(listeners[i].listener);\n }\n\n return flatListeners;\n };\n /**\n * Fetches the requested listeners via getListeners but will always return the results inside an object. This is mainly for internal use but others may find it useful.\n *\n * @param {String|RegExp} evt Name of the event to return the listeners from.\n * @return {Object} All listener functions for an event in an object.\n */\n\n\n proto.getListenersAsObject = function getListenersAsObject(evt) {\n var listeners = this.getListeners(evt);\n var response;\n\n if (listeners instanceof Array) {\n response = {};\n response[evt] = listeners;\n }\n\n return response || listeners;\n };\n\n function isValidListener(listener) {\n if (typeof listener === 'function' || listener instanceof RegExp) {\n return true;\n } else if (listener && _typeof(listener) === 'object') {\n return isValidListener(listener.listener);\n } else {\n return false;\n }\n }\n /**\n * Adds a listener function to the specified event.\n * The listener will not be added if it is a duplicate.\n * If the listener returns true then it will be removed after it is called.\n * If you pass a regular expression as the event name then the listener will be added to all events that match it.\n *\n * @param {String|RegExp} evt Name of the event to attach the listener to.\n * @param {Function} listener Method to be called when the event is emitted. If the function returns true then it will be removed after calling.\n * @return {Object} Current instance of EventEmitter for chaining.\n */\n\n\n proto.addListener = function addListener(evt, listener) {\n if (!isValidListener(listener)) {\n throw new TypeError('listener must be a function');\n }\n\n var listeners = this.getListenersAsObject(evt);\n var listenerIsWrapped = _typeof(listener) === 'object';\n var key;\n\n for (key in listeners) {\n if (listeners.hasOwnProperty(key) && indexOfListener(listeners[key], listener) === -1) {\n listeners[key].push(listenerIsWrapped ? listener : {\n listener: listener,\n once: false\n });\n }\n }\n\n return this;\n };\n /**\n * Alias of addListener\n */\n\n\n proto.on = alias('addListener');\n /**\n * Semi-alias of addListener. It will add a listener that will be\n * automatically removed after its first execution.\n *\n * @param {String|RegExp} evt Name of the event to attach the listener to.\n * @param {Function} listener Method to be called when the event is emitted. If the function returns true then it will be removed after calling.\n * @return {Object} Current instance of EventEmitter for chaining.\n */\n\n proto.addOnceListener = function addOnceListener(evt, listener) {\n return this.addListener(evt, {\n listener: listener,\n once: true\n });\n };\n /**\n * Alias of addOnceListener.\n */\n\n\n proto.once = alias('addOnceListener');\n /**\n * Defines an event name. This is required if you want to use a regex to add a listener to multiple events at once. If you don't do this then how do you expect it to know what event to add to? Should it just add to every possible match for a regex? No. That is scary and bad.\n * You need to tell it what event names should be matched by a regex.\n *\n * @param {String} evt Name of the event to create.\n * @return {Object} Current instance of EventEmitter for chaining.\n */\n\n proto.defineEvent = function defineEvent(evt) {\n this.getListeners(evt);\n return this;\n };\n /**\n * Uses defineEvent to define multiple events.\n *\n * @param {String[]} evts An array of event names to define.\n * @return {Object} Current instance of EventEmitter for chaining.\n */\n\n\n proto.defineEvents = function defineEvents(evts) {\n for (var i = 0; i < evts.length; i += 1) {\n this.defineEvent(evts[i]);\n }\n\n return this;\n };\n /**\n * Removes a listener function from the specified event.\n * When passed a regular expression as the event name, it will remove the listener from all events that match it.\n *\n * @param {String|RegExp} evt Name of the event to remove the listener from.\n * @param {Function} listener Method to remove from the event.\n * @return {Object} Current instance of EventEmitter for chaining.\n */\n\n\n proto.removeListener = function removeListener(evt, listener) {\n var listeners = this.getListenersAsObject(evt);\n var index;\n var key;\n\n for (key in listeners) {\n if (listeners.hasOwnProperty(key)) {\n index = indexOfListener(listeners[key], listener);\n\n if (index !== -1) {\n listeners[key].splice(index, 1);\n }\n }\n }\n\n return this;\n };\n /**\n * Alias of removeListener\n */\n\n\n proto.off = alias('removeListener');\n /**\n * Adds listeners in bulk using the manipulateListeners method.\n * If you pass an object as the first argument you can add to multiple events at once. The object should contain key value pairs of events and listeners or listener arrays. You can also pass it an event name and an array of listeners to be added.\n * You can also pass it a regular expression to add the array of listeners to all events that match it.\n * Yeah, this function does quite a bit. That's probably a bad thing.\n *\n * @param {String|Object|RegExp} evt An event name if you will pass an array of listeners next. An object if you wish to add to multiple events at once.\n * @param {Function[]} [listeners] An optional array of listener functions to add.\n * @return {Object} Current instance of EventEmitter for chaining.\n */\n\n proto.addListeners = function addListeners(evt, listeners) {\n // Pass through to manipulateListeners\n return this.manipulateListeners(false, evt, listeners);\n };\n /**\n * Removes listeners in bulk using the manipulateListeners method.\n * If you pass an object as the first argument you can remove from multiple events at once. The object should contain key value pairs of events and listeners or listener arrays.\n * You can also pass it an event name and an array of listeners to be removed.\n * You can also pass it a regular expression to remove the listeners from all events that match it.\n *\n * @param {String|Object|RegExp} evt An event name if you will pass an array of listeners next. An object if you wish to remove from multiple events at once.\n * @param {Function[]} [listeners] An optional array of listener functions to remove.\n * @return {Object} Current instance of EventEmitter for chaining.\n */\n\n\n proto.removeListeners = function removeListeners(evt, listeners) {\n // Pass through to manipulateListeners\n return this.manipulateListeners(true, evt, listeners);\n };\n /**\n * Edits listeners in bulk. The addListeners and removeListeners methods both use this to do their job. You should really use those instead, this is a little lower level.\n * The first argument will determine if the listeners are removed (true) or added (false).\n * If you pass an object as the second argument you can add/remove from multiple events at once. The object should contain key value pairs of events and listeners or listener arrays.\n * You can also pass it an event name and an array of listeners to be added/removed.\n * You can also pass it a regular expression to manipulate the listeners of all events that match it.\n *\n * @param {Boolean} remove True if you want to remove listeners, false if you want to add.\n * @param {String|Object|RegExp} evt An event name if you will pass an array of listeners next. An object if you wish to add/remove from multiple events at once.\n * @param {Function[]} [listeners] An optional array of listener functions to add/remove.\n * @return {Object} Current instance of EventEmitter for chaining.\n */\n\n\n proto.manipulateListeners = function manipulateListeners(remove, evt, listeners) {\n var i;\n var value;\n var single = remove ? this.removeListener : this.addListener;\n var multiple = remove ? this.removeListeners : this.addListeners; // If evt is an object then pass each of its properties to this method\n\n if (_typeof(evt) === 'object' && !(evt instanceof RegExp)) {\n for (i in evt) {\n if (evt.hasOwnProperty(i) && (value = evt[i])) {\n // Pass the single listener straight through to the singular method\n if (typeof value === 'function') {\n single.call(this, i, value);\n } else {\n // Otherwise pass back to the multiple function\n multiple.call(this, i, value);\n }\n }\n }\n } else {\n // So evt must be a string\n // And listeners must be an array of listeners\n // Loop over it and pass each one to the multiple method\n i = listeners.length;\n\n while (i--) {\n single.call(this, evt, listeners[i]);\n }\n }\n\n return this;\n };\n /**\n * Removes all listeners from a specified event.\n * If you do not specify an event then all listeners will be removed.\n * That means every event will be emptied.\n * You can also pass a regex to remove all events that match it.\n *\n * @param {String|RegExp} [evt] Optional name of the event to remove all listeners for. Will remove from every event if not passed.\n * @return {Object} Current instance of EventEmitter for chaining.\n */\n\n\n proto.removeEvent = function removeEvent(evt) {\n var type = _typeof(evt);\n\n var events = this._getEvents();\n\n var key; // Remove different things depending on the state of evt\n\n if (type === 'string') {\n // Remove all listeners for the specified event\n delete events[evt];\n } else if (evt instanceof RegExp) {\n // Remove all events matching the regex.\n for (key in events) {\n if (events.hasOwnProperty(key) && evt.test(key)) {\n delete events[key];\n }\n }\n } else {\n // Remove all listeners in all events\n delete this._events;\n }\n\n return this;\n };\n /**\n * Alias of removeEvent.\n *\n * Added to mirror the node API.\n */\n\n\n proto.removeAllListeners = alias('removeEvent');\n /**\n * Emits an event of your choice.\n * When emitted, every listener attached to that event will be executed.\n * If you pass the optional argument array then those arguments will be passed to every listener upon execution.\n * Because it uses `apply`, your array of arguments will be passed as if you wrote them out separately.\n * So they will not arrive within the array on the other side, they will be separate.\n * You can also pass a regular expression to emit to all events that match it.\n *\n * @param {String|RegExp} evt Name of the event to emit and execute listeners for.\n * @param {Array} [args] Optional array of arguments to be passed to each listener.\n * @return {Object} Current instance of EventEmitter for chaining.\n */\n\n proto.emitEvent = function emitEvent(evt, args) {\n var listenersMap = this.getListenersAsObject(evt);\n var listeners;\n var listener;\n var i;\n var key;\n var response;\n\n for (key in listenersMap) {\n if (listenersMap.hasOwnProperty(key)) {\n listeners = listenersMap[key].slice(0);\n\n for (i = 0; i < listeners.length; i++) {\n // If the listener returns true then it shall be removed from the event\n // The function is executed either with a basic call or an apply if there is an args array\n listener = listeners[i];\n\n if (listener.once === true) {\n this.removeListener(evt, listener.listener);\n }\n\n response = listener.listener.apply(this, args || []);\n\n if (response === this._getOnceReturnValue()) {\n this.removeListener(evt, listener.listener);\n }\n }\n }\n }\n\n return this;\n };\n /**\n * Alias of emitEvent\n */\n\n\n proto.trigger = alias('emitEvent');\n /**\n * Subtly different from emitEvent in that it will pass its arguments on to the listeners, as opposed to taking a single array of arguments to pass on.\n * As with emitEvent, you can pass a regex in place of the event name to emit to all events that match it.\n *\n * @param {String|RegExp} evt Name of the event to emit and execute listeners for.\n * @param {...*} Optional additional arguments to be passed to each listener.\n * @return {Object} Current instance of EventEmitter for chaining.\n */\n\n proto.emit = function emit(evt) {\n var args = Array.prototype.slice.call(arguments, 1);\n return this.emitEvent(evt, args);\n };\n /**\n * Sets the current value to check against when executing listeners. If a\n * listeners return value matches the one set here then it will be removed\n * after execution. This value defaults to true.\n *\n * @param {*} value The new value to check for when executing listeners.\n * @return {Object} Current instance of EventEmitter for chaining.\n */\n\n\n proto.setOnceReturnValue = function setOnceReturnValue(value) {\n this._onceReturnValue = value;\n return this;\n };\n /**\n * Fetches the current value to check against when executing listeners. If\n * the listeners return value matches this one then it should be removed\n * automatically. It will return true by default.\n *\n * @return {*|Boolean} The current value to check for or the default, true.\n * @api private\n */\n\n\n proto._getOnceReturnValue = function _getOnceReturnValue() {\n if (this.hasOwnProperty('_onceReturnValue')) {\n return this._onceReturnValue;\n } else {\n return true;\n }\n };\n /**\n * Fetches the events object and creates one if required.\n *\n * @return {Object} The events storage object.\n * @api private\n */\n\n\n proto._getEvents = function _getEvents() {\n return this._events || (this._events = {});\n };\n /**\n * Reverts the global {@link EventEmitter} to its previous value and returns a reference to this version.\n *\n * @return {Function} Non conflicting EventEmitter class.\n */\n\n\n EventEmitter.noConflict = function noConflict() {\n exports.EventEmitter = originalGlobalValue;\n return EventEmitter;\n }; // Expose the class either via AMD, CommonJS or the global object\n\n\n if (true) {\n !(__WEBPACK_AMD_DEFINE_RESULT__ = (function () {\n return EventEmitter;\n }).call(exports, __webpack_require__, exports, module),\n\t\t\t\t__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));\n } else {}\n})(typeof window !== 'undefined' ? window : this || {});\n\n//# sourceURL=webpack:///./node_modules/wolfy87-eventemitter/EventEmitter.js?"); - -/***/ }), - -/***/ "./src/scripts/components/copy-to-clipboard.js": -/*!*****************************************************!*\ - !*** ./src/scripts/components/copy-to-clipboard.js ***! - \*****************************************************/ -/*! no exports provided */ -/***/ (function(module, __webpack_exports__, __webpack_require__) { - -"use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var clipboard__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! clipboard */ \"./node_modules/clipboard/dist/clipboard.js\");\n/* harmony import */ var clipboard__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(clipboard__WEBPACK_IMPORTED_MODULE_0__);\n/**\n * Copy to clipboard functionality for code snippet examples\n */\n\nvar clipboard = new clipboard__WEBPACK_IMPORTED_MODULE_0___default.a('.pl-js-code-copy-btn');\nclipboard.on('success', function (e) {\n var copyButton = document.querySelectorAll('.pl-js-code-copy-btn');\n\n for (var i = 0; i < copyButton.length; i++) {\n copyButton[i].innerText = 'Copy';\n }\n\n e.trigger.textContent = 'Copied';\n});\n\n//# sourceURL=webpack:///./src/scripts/components/copy-to-clipboard.js?"); - -/***/ }), - -/***/ "./src/scripts/components/panels-util.js": -/*!***********************************************!*\ - !*** ./src/scripts/components/panels-util.js ***! - \***********************************************/ -/*! exports provided: panelsUtil */ -/***/ (function(module, __webpack_exports__, __webpack_require__) { - -"use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"panelsUtil\", function() { return panelsUtil; });\n/**\n * Panels Util - for both styleguide and viewer\n */\nvar panelsUtil = {\n /**\n * Add click events to the template that was rendered\n * @param {String} the rendered template for the modal\n * @param {String} the pattern partial for the modal\n */\n addClickEvents: function addClickEvents(templateRendered, patternPartial) {\n var els = templateRendered.querySelectorAll('.pl-js-tab-link');\n\n for (var i = 0; i < els.length; ++i) {\n els[i].onclick = function (e) {\n e.preventDefault();\n var partial = this.getAttribute('data-patternpartial');\n var panelID = this.getAttribute('data-panelid');\n panelsUtil.show(partial, panelID);\n };\n }\n\n return templateRendered;\n },\n\n /**\n * Show a specific modal\n * @param {String} the pattern partial for the modal\n * @param {String} the ID of the panel to be shown\n */\n show: function show(patternPartial, panelID) {\n var activeTabClass = 'pl-is-active-tab'; // turn off all of the active tabs\n\n var allTabLinks = document.querySelectorAll(\".pl-js-tab-link\"); // hide all of the panels\n\n var allTabPanels = document.querySelectorAll(\".pl-js-tab-panel\"); // tabLink about to become active\n\n var activeTabLink = document.querySelector(\"#pl-\".concat(patternPartial, \"-\").concat(panelID, \"-tab\")); // tabPanelabout to become active\n\n var activeTabPanel = document.querySelector(\"#pl-\".concat(patternPartial, \"-\").concat(panelID, \"-panel\"));\n\n for (var i = 0; i < allTabLinks.length; ++i) {\n allTabLinks[i].classList.remove(activeTabClass);\n }\n\n for (var _i = 0; _i < allTabPanels.length; ++_i) {\n allTabPanels[_i].classList.remove(activeTabClass);\n }\n\n activeTabLink.classList.add(activeTabClass);\n activeTabPanel.classList.add(activeTabClass);\n }\n};\n\n//# sourceURL=webpack:///./src/scripts/components/panels-util.js?"); - -/***/ }), - -/***/ "./src/scripts/patternlab-pattern.js": -/*!*******************************************************!*\ - !*** ./src/scripts/patternlab-pattern.js + 2 modules ***! - \*******************************************************/ -/*! no exports provided */ -/*! ModuleConcatenation bailout: Cannot concat with ./node_modules/mousetrap/mousetrap.js (<- Module is not an ECMAScript module) */ -/*! ModuleConcatenation bailout: Cannot concat with ./src/scripts/components/copy-to-clipboard.js */ -/*! ModuleConcatenation bailout: Cannot concat with ./src/scripts/components/panels-util.js */ -/*! ModuleConcatenation bailout: Cannot concat with ./src/scripts/utils/index.js */ -/***/ (function(module, __webpack_exports__, __webpack_require__) { - -"use strict"; -eval("\n// EXTERNAL MODULE: ./src/scripts/utils/postmessage.js\nvar postmessage = __webpack_require__(\"./src/scripts/utils/postmessage.js\");\n\n// EXTERNAL MODULE: ./src/scripts/components/panels-util.js\nvar panels_util = __webpack_require__(\"./src/scripts/components/panels-util.js\");\n\n// EXTERNAL MODULE: ./src/scripts/components/copy-to-clipboard.js\nvar copy_to_clipboard = __webpack_require__(\"./src/scripts/components/copy-to-clipboard.js\");\n\n// CONCATENATED MODULE: ./src/scripts/components/modal-styleguide.js\n/**\n * \"Modal\" (aka Panel UI) for the Styleguide Layer - for both annotations and code/info\n */\n\n\nvar modalStyleguide = {\n // set up some defaults\n active: [],\n targetOrigin: window.location.protocol === 'file:' ? '*' : window.location.protocol + '//' + window.location.host,\n\n /**\n * initialize the modal window\n */\n onReady: function onReady() {\n console.log('onReady'); // go through the panel toggles and add click event to the pattern extra toggle button\n\n var els = document.querySelectorAll('.pl-js-pattern-extra-toggle');\n\n for (var i = 0; i < els.length; ++i) {\n els[i].addEventListener('click', function (e) {\n var patternPartial = this.getAttribute('data-patternpartial');\n console.log(patternPartial);\n modalStyleguide.toggle(patternPartial);\n });\n }\n },\n\n /**\n * toggle the modal window open and closed based on clicking the pip\n * @param {String} the patternPartial that identifies what needs to be toggled\n */\n toggle: function toggle(patternPartial) {\n console.log(patternPartial);\n console.log(modalStyleguide.active[patternPartial]);\n\n if (modalStyleguide.active[patternPartial] === undefined || !modalStyleguide.active[patternPartial]) {\n var el = document.getElementById('pl-pattern-data-' + patternPartial);\n console.log(el);\n modalStyleguide.collectAndSend(el, true, false);\n } else {\n modalStyleguide.highlightsHide();\n modalStyleguide.close(patternPartial);\n }\n },\n\n /**\n * open the modal window for a view-all entry\n * @param {String} the patternPartial that identifies what needs to be opened\n * @param {String} the content that should be inserted\n */\n open: function open(patternPartial, content) {\n // make sure templateRendered is modified to be an HTML element\n var div = document.createElement('div');\n div.innerHTML = content;\n content = document.createElement('div').appendChild(div).querySelector('div'); // add click events\n\n content = panels_util[\"panelsUtil\"].addClickEvents(content, patternPartial); // make sure the modal viewer and other options are off just in case\n\n modalStyleguide.close(patternPartial); // note it's turned on in the viewer\n\n modalStyleguide.active[patternPartial] = true; // make sure there's no content\n\n div = document.getElementById('pl-pattern-extra-' + patternPartial);\n\n if (div.childNodes.length > 0) {\n div.removeChild(div.childNodes[0]);\n } // add the content\n\n\n document.getElementById('pl-pattern-extra-' + patternPartial).appendChild(content); // show the modal\n\n document.getElementById('pl-pattern-extra-toggle-' + patternPartial).classList.add('pl-is-active');\n document.getElementById('pl-pattern-extra-' + patternPartial).classList.add('pl-is-active');\n },\n\n /**\n * close the modal window for a view-all entry\n * @param {String} the patternPartial that identifies what needs to be closed\n */\n close: function close(patternPartial) {\n // note that the modal viewer is no longer active\n modalStyleguide.active[patternPartial] = false; // hide the modal, look at info-panel.js\n\n document.getElementById('pl-pattern-extra-toggle-' + patternPartial).classList.remove('pl-is-active');\n document.getElementById('pl-pattern-extra-' + patternPartial).classList.remove('pl-is-active');\n },\n\n /**\n * get the data that needs to be send to the viewer for rendering\n * @param {Element} the identifier for the element that needs to be collected\n * @param {Boolean} if the refresh is of a view-all view and the content should be sent back\n * @param {Boolean} if the text in the dropdown should be switched\n */\n collectAndSend: function collectAndSend(el, iframePassback, switchText) {\n /**\n * Verify - - - - - - - - - - - - - - - - - - - - \ No newline at end of file + + Pattern Lab + + + + + + + + + + +
+ + +
+
+ + + + + + + + + + + + + + + diff --git a/packages/uikit-workshop/src/html/partials/base-template.html b/packages/uikit-workshop/src/html/partials/base-template.html old mode 100644 new mode 100755 diff --git a/packages/uikit-workshop/src/html/partials/controls.html b/packages/uikit-workshop/src/html/partials/controls.html deleted file mode 100644 index 533752058..000000000 --- a/packages/uikit-workshop/src/html/partials/controls.html +++ /dev/null @@ -1,87 +0,0 @@ - -
- - -
- -
    - {{^ ishControlsHide.s }} -
  • - -
  • - {{/ ishControlsHide.s }} - - {{^ ishControlsHide.m }} -
  • - -
  • - {{/ ishControlsHide.m }} - - {{^ ishControlsHide.l }} -
  • - -
  • - {{/ ishControlsHide.l }} - - {{^ ishControlsHide.full }} -
  • - -
  • - {{/ ishControlsHide.full }} - - {{^ ishControlsHide.random }} -
  • - -
  • - {{/ ishControlsHide.random }} - - {{^ ishControlsHide.disco }} -
  • - -
  • - {{/ ishControlsHide.disco }} - - {{^ ishControlsHide.hay }} -
  • - -
  • - {{/ ishControlsHide.hay }} -
- -{{^ ishControlsHide.tools-all }} -
- - -
    -
  • - - - -
  • -
  • - -
  • -
  • - -
  • - {{^ ishControlsHide.views-new }} -
  • - Open In New Tab -
  • - {{/ ishControlsHide.views-new }} - - {{^ ishControlsHide.tools-docs }} -
  • - Pattern Lab Docs -
  • - {{/ ishControlsHide.tools-docs }} -
-
-{{/ ishControlsHide.tools-all }} \ No newline at end of file diff --git a/packages/uikit-workshop/src/html/partials/header.html b/packages/uikit-workshop/src/html/partials/header.html deleted file mode 100644 index da990cf32..000000000 --- a/packages/uikit-workshop/src/html/partials/header.html +++ /dev/null @@ -1,25 +0,0 @@ - diff --git a/packages/uikit-workshop/src/html/partials/iframe-loader.html b/packages/uikit-workshop/src/html/partials/iframe-loader.html deleted file mode 100644 index 40086f8aa..000000000 --- a/packages/uikit-workshop/src/html/partials/iframe-loader.html +++ /dev/null @@ -1,15 +0,0 @@ - - -
-
-
Loading Pattern Lab
-
- - - - - -
-
-
diff --git a/packages/uikit-workshop/src/html/partials/iframe.html b/packages/uikit-workshop/src/html/partials/iframe.html deleted file mode 100644 index 0ae6a5752..000000000 --- a/packages/uikit-workshop/src/html/partials/iframe.html +++ /dev/null @@ -1,20 +0,0 @@ -
- -
- -
- - - -
- -
- -
- - -
- - -
- \ No newline at end of file diff --git a/packages/uikit-workshop/src/html/partials/modal.html b/packages/uikit-workshop/src/html/partials/modal.html deleted file mode 100644 index 724e6c667..000000000 --- a/packages/uikit-workshop/src/html/partials/modal.html +++ /dev/null @@ -1,20 +0,0 @@ -
-
-
-
-
- - - - -
-
-
-
-
-
diff --git a/packages/uikit-workshop/src/html/partials/pattern-nav.html b/packages/uikit-workshop/src/html/partials/pattern-nav.html deleted file mode 100644 index a3b17fae2..000000000 --- a/packages/uikit-workshop/src/html/partials/pattern-nav.html +++ /dev/null @@ -1,59 +0,0 @@ -{{# patternTypes }} -
  • - - - -
      - - {{# patternTypeItems }} -
    1. - - - -
        - - {{# patternSubtypeItems }} -
      1. - - - {{ patternName }} - - {{# patternState }} - - {{/ patternState }} - - - -
      2. - {{/ patternSubtypeItems }} - -
      - -
    2. - {{/ patternTypeItems }} - {{# patternItems }} -
    3. - - - {{ patternName }} - - {{# patternState }} - - {{/ patternState }} - - - -
    4. - {{/ patternItems }} - -
    - -
  • -{{/ patternTypes }} - -
  • - - All - -
  • - diff --git a/packages/uikit-workshop/src/sass/pattern-lab.scss b/packages/uikit-workshop/src/sass/pattern-lab.scss index d38ba1515..ea72bc5fb 100755 --- a/packages/uikit-workshop/src/sass/pattern-lab.scss +++ b/packages/uikit-workshop/src/sass/pattern-lab.scss @@ -44,36 +44,28 @@ #COMPONENTS \*------------------------------------*/ -/** - * Pattern Lab Header - */ -@import '../scripts/components/pl-search/pl-search.scss'; +@import '../scripts/components/pl-controls/pl-controls.scss'; +@import '../scripts/components/pl-drawer/pl-drawer.scss'; +@import '../scripts/components/pl-header/pl-header.scss'; @import '../scripts/components/pl-layout/pl-layout.scss'; -@import 'scss/04-components/header'; +@import '../scripts/components/pl-nav/pl-nav.scss'; +@import '../scripts/components/pl-search/pl-search.scss'; +@import '../scripts/components/pl-toggle-info/pl-toggle-info.scss'; +@import '../scripts/components/pl-toggle-layout/pl-toggle-layout.scss'; +@import '../scripts/components/pl-toggle-theme/pl-toggle-theme.scss'; +@import '../scripts/components/pl-tools-menu/pl-tools-menu.scss'; +@import '../scripts/components/pl-viewport/pl-viewport.scss'; +@import '../scripts/components/pl-viewport-size/pl-viewport-size.scss'; +@import '../scripts/components/pl-viewport-size-list/pl-viewport-size-list.scss'; +@import 'scss/04-components/annotations'; +@import 'scss/04-components/breadcrumbs'; @import 'scss/04-components/logo'; -@import 'scss/04-components/navigation'; -@import 'scss/04-components/ish-sizing'; -@import 'scss/04-components/controls'; -@import 'scss/04-components/tools'; - -/** - * Viewport - */ -@import 'scss/04-components/viewport'; - -/** - * Pattern Styles - */ -@import 'scss/04-components/pattern'; @import 'scss/04-components/pattern-category'; @import 'scss/04-components/pattern-info'; -@import 'scss/04-components/pattern-states'; @import 'scss/04-components/pattern-lineage'; -@import 'scss/04-components/breadcrumbs'; +@import 'scss/04-components/pattern-states'; +@import 'scss/04-components/pattern'; @import 'scss/04-components/tabs'; -@import 'scss/04-components/tools'; -@import 'scss/04-components/annotations'; -@import 'scss/04-components/modal'; @import 'scss/04-components/text-passage'; /*------------------------------------*\ diff --git a/packages/uikit-workshop/src/sass/scss/03-vendor/_prism.scss b/packages/uikit-workshop/src/sass/scss/03-vendor/_prism.scss index 6ab0ba455..1e7968b17 100644 --- a/packages/uikit-workshop/src/sass/scss/03-vendor/_prism.scss +++ b/packages/uikit-workshop/src/sass/scss/03-vendor/_prism.scss @@ -4,6 +4,30 @@ * Based on dabblet (http://dabblet.com) * @author Lea Verou */ +pre[class*='language-'] { + background-image: linear-gradient( + to right, + $pl-color-white, + rgba($pl-color-white, 0) + ), + linear-gradient(to left, $pl-color-white, rgba($pl-color-white, 0)), + linear-gradient(to right, #eaf0f6, rgba($pl-color-gray-07, 0)), + linear-gradient(to left, #eaf0f6, rgba($pl-color-gray-07, 0)), + linear-gradient(to bottom, $pl-color-white, rgba($pl-color-white, 0)), + linear-gradient(to top, $pl-color-white, rgba($pl-color-white, 0)), + linear-gradient(to bottom, #eaf0f6, rgba($pl-color-gray-07, 0)), + linear-gradient(to top, #eaf0f6, rgba($pl-color-gray-07, 0)); + background-color: $pl-color-white; + background-attachment: local, local, scroll, scroll, local, local, scroll, + scroll; + background-position: 0 0, 100% 0, 0 0, 100% 0, 0 0, 0 100%, 0 0, 0 100%; + background-size: 4em 100%, 4em 100%, 1em 100%, 1em 100%, 100% 4em, 100% 4em, + 100% 1em, 100% 1em; + background-repeat: no-repeat; + -ms-overflow-style: -ms-autohiding-scrollbar; + -webkit-overflow-scrolling: touch; + overflow: auto; +} code[class*='language-'], pre[class*='language-'] { diff --git a/packages/uikit-workshop/src/sass/scss/04-components/_pattern-info.scss b/packages/uikit-workshop/src/sass/scss/04-components/_pattern-info.scss index 606ad8055..c4e322a7f 100644 --- a/packages/uikit-workshop/src/sass/scss/04-components/_pattern-info.scss +++ b/packages/uikit-workshop/src/sass/scss/04-components/_pattern-info.scss @@ -20,8 +20,6 @@ * Pattern info inside the "view all" template */ .pl-c-pattern & { - max-height: 20rem; - min-height: 18rem; overflow: scroll; @include hideScrollBar(); display: flex; @@ -29,7 +27,6 @@ @media all and (min-width: $pl-bp-large) { max-height: none; - height: 18rem; overflow: visible; } } @@ -49,6 +46,7 @@ margin-bottom: 1rem; flex-grow: 1; max-width: 100%; + max-height: 30rem; min-width: 300px; // so panels stack automatically display: inline-flex; flex-direction: column; diff --git a/packages/uikit-workshop/src/sass/scss/04-components/_tabs.scss b/packages/uikit-workshop/src/sass/scss/04-components/_tabs.scss index d1458283f..09c36e122 100644 --- a/packages/uikit-workshop/src/sass/scss/04-components/_tabs.scss +++ b/packages/uikit-workshop/src/sass/scss/04-components/_tabs.scss @@ -30,7 +30,9 @@ list-style: none; margin: 0; padding: 0.5rem 0; + padding-bottom: 0; background-color: $pl-color-white; + border-bottom: 1px solid rgba(0, 0, 0, .1); } /** @@ -39,15 +41,15 @@ .pl-c-tabs__link { display: block; line-height: 1; - padding: 0.2rem 0.4rem; - border: 1px solid transparent; - border-radius: $pl-border-radius-med; + border-bottom: 4px solid transparent; color: $pl-color-gray-50; background-color: $pl-color-white; cursor: pointer; text-decoration: none; - text-transform: lowercase; + text-transform: uppercase; transition: all $pl-animate-quick ease-out; + padding: 8px; + font-size: 13px; &:hover { color: $pl-color-gray-87; @@ -60,8 +62,7 @@ */ &.pl-is-active-tab { color: $pl-color-gray-87; - background-color: $pl-color-gray-07; - border: 1px solid $pl-color-gray-13; + border-bottom-color: #bf6500; } } @@ -72,7 +73,9 @@ .pl-c-tabs__content { overflow: auto; -webkit-overflow-scrolling: touch; - padding-top: 0.5rem; + flex-grow: 1; + display: flex; + flex-direction: column; } /** @@ -82,10 +85,11 @@ */ .pl-c-tabs__panel { display: none; - // min-height: 12rem; &.pl-is-active-tab { - display: block; + display: flex; + height: 100%; + flex-grow: 1; } /** @@ -97,9 +101,13 @@ pre[class*='language-'] { background-color: transparent; margin: 0; - padding: 0; + padding-top: 1rem; + padding-right: 0.5rem; + padding-bottom: 0.5rem; + padding-left: 0.5rem; border: 0; display: block; + width: 100%; // fill parent container } code[class*='language-'] { diff --git a/packages/uikit-workshop/src/sass/scss/05-themes/_light-theme.scss b/packages/uikit-workshop/src/sass/scss/05-themes/_light-theme.scss index 038ae4390..b74379c37 100644 --- a/packages/uikit-workshop/src/sass/scss/05-themes/_light-theme.scss +++ b/packages/uikit-workshop/src/sass/scss/05-themes/_light-theme.scss @@ -7,14 +7,6 @@ * PL header and modal are light instead of dark */ .pl-c-body--theme-light { - /** - * Header - */ - .pl-c-header { - background-color: $pl-color-white; - border-bottom: 1px solid $pl-color-gray-20; - } - /** * Tools dropdown */ @@ -79,7 +71,6 @@ background-color: $pl-color-gray-13 !important; } - /** * Typeahead input */ @@ -101,20 +92,11 @@ } } - /** - * Modal inside a light theme - */ - .pl-c-modal { - background-color: $pl-color-white; - color: $pl-color-gray-70; - border-top: 1px solid $pl-color-gray-20; - } - /** * Modal close button * 1) Closes the modal popup */ - .pl-c-modal__close-btn, + .pl-c-drawer__close-btn, .pl-c-tools__action { background-color: $pl-color-white; diff --git a/packages/uikit-workshop/src/sass/scss/05-themes/_sidebar-theme.scss b/packages/uikit-workshop/src/sass/scss/05-themes/_sidebar-theme.scss index c271ad06a..9169d2577 100644 --- a/packages/uikit-workshop/src/sass/scss/05-themes/_sidebar-theme.scss +++ b/packages/uikit-workshop/src/sass/scss/05-themes/_sidebar-theme.scss @@ -7,33 +7,6 @@ * A theme that places displays the header as a sidebar */ .pl-c-body--theme-sidebar { - /** - * Header - * 1) Set width to sidebar width defined above - * 2) Make header 100% of the viewport height - * 3) Stack header items on top of each other - * 4) void bottom border for light theme - */ - .pl-c-header { - width: $pl-sidebar-width; /* 1 */ - height: 100vh; /* 2 */ - flex-direction: column; /* 3 */ - border-bottom: 0; /* 4 */ - padding: 1rem; - overflow: auto; - -webkit-overflow-scrolling: touch; - justify-content: space-between; - } - - /** - * Header within light theme - */ - &.pl-c-body--theme-light { - .pl-c-header { - border-right: 1px solid $pl-color-gray-20; - } - } - /** * Logo */ @@ -175,7 +148,7 @@ * so it fits in remaining available space * TODO: revisit to find ways to resize */ - .pl-c-modal { + .pl-c-drawer { right: 0; /* 1 */ width: auto; } diff --git a/packages/uikit-workshop/src/scripts/actions/app.js b/packages/uikit-workshop/src/scripts/actions/app.js index fa453303a..899efce21 100644 --- a/packages/uikit-workshop/src/scripts/actions/app.js +++ b/packages/uikit-workshop/src/scripts/actions/app.js @@ -1,5 +1,9 @@ export const UPDATE_THEME_MODE = 'UPDATE_THEME_MODE'; export const UPDATE_LAYOUT_MODE = 'UPDATE_LAYOUT_MODE'; +export const UPDATE_DRAWER_ANIMATION_STATE = 'UPDATE_DRAWER_ANIMATION_STATE'; +export const UPDATE_DRAWER_STATE = 'UPDATE_DRAWER_STATE'; +export const UPDATE_DRAWER_HEIGHT = 'UPDATE_DRAWER_HEIGHT'; +export const IS_VIEWALL_PAGE = 'IS_VIEWALL_PAGE'; export const updateLayoutMode = layoutMode => (dispatch, getState) => { if (getState().app.layoutMode !== layoutMode) { @@ -18,3 +22,42 @@ export const updateThemeMode = themeMode => (dispatch, getState) => { }); } }; + +export const updateDrawerState = opened => (dispatch, getState) => { + if (getState().app.drawerOpened !== opened) { + dispatch({ + type: UPDATE_DRAWER_STATE, + opened, + }); + } +}; + +export const updateDrawerAnimationState = drawerIsAnimating => ( + dispatch, + getState +) => { + if (getState().app.drawerIsAnimating !== drawerIsAnimating) { + dispatch({ + type: UPDATE_DRAWER_ANIMATION_STATE, + drawerIsAnimating, + }); + } +}; + +export const updateDrawerHeight = height => (dispatch, getState) => { + if (getState().app.drawerHeight !== height) { + dispatch({ + type: UPDATE_DRAWER_HEIGHT, + height, + }); + } +}; + +export const isViewallPage = isViewall => (dispatch, getState) => { + if (getState().app.isViewallPage !== isViewall) { + dispatch({ + type: IS_VIEWALL_PAGE, + isViewall, + }); + } +}; diff --git a/packages/uikit-workshop/src/scripts/components/modal-styleguide.js b/packages/uikit-workshop/src/scripts/components/modal-styleguide.js index a7a8e8254..7c31a3eba 100644 --- a/packages/uikit-workshop/src/scripts/components/modal-styleguide.js +++ b/packages/uikit-workshop/src/scripts/components/modal-styleguide.js @@ -3,7 +3,7 @@ */ import { panelsUtil } from './panels-util'; -import './copy-to-clipboard'; +import './pl-copy-to-clipboard/pl-copy-to-clipboard'; export const modalStyleguide = { // set up some defaults diff --git a/packages/uikit-workshop/src/scripts/components/modal-viewer.js b/packages/uikit-workshop/src/scripts/components/modal-viewer.js index c099711c8..c2bf7cabb 100644 --- a/packages/uikit-workshop/src/scripts/components/modal-viewer.js +++ b/packages/uikit-workshop/src/scripts/components/modal-viewer.js @@ -2,12 +2,16 @@ * "Modal" (aka Panel UI) for the Viewer Layer - for both annotations and code/info */ -import $ from 'jquery'; -import { urlHandler, DataSaver, Dispatcher } from '../utils'; +import Scroll from 'scroll-js'; +import { urlHandler, Dispatcher } from '../utils'; import { panelsViewer } from './panels-viewer'; +import { store } from '../store.js'; +// These are the actions needed by this element. +import { updateDrawerState, isViewallPage } from '../actions/app.js'; export const modalViewer = { // set up some defaults + iframeElement: document.querySelector('.pl-js-iframe'), active: false, switchText: true, template: 'info', @@ -24,51 +28,23 @@ export const modalViewer = { // make sure the listener for checkpanels is set-up Dispatcher.addListener('insertPanels', modalViewer.insert); - // add the info/code panel onclick handler - $('.pl-js-pattern-info-toggle').click(function(e) { - modalViewer.toggle(); - }); - - // make sure the close button handles the click - $('.pl-js-modal-close-btn').on('click', function(e) { - // hide any open annotations - const obj = JSON.stringify({ - event: 'patternLab.annotationsHighlightHide', - }); - document - .querySelector('.pl-js-iframe') - .contentWindow.postMessage(obj, modalViewer.targetOrigin); - - // hide the viewer - modalViewer.close(); - }); - - // see if the modal is already active, if so update attributes as appropriate - if (DataSaver.findValue('modalActive') === 'true') { - modalViewer.active = true; - $('.pl-js-pattern-info-toggle').html('Hide Pattern Info'); - } + modalViewer.__storeUnsubscribe = store.subscribe(() => + modalViewer._stateChanged(store.getState()) + ); + modalViewer._stateChanged(store.getState()); - // make sure the modal viewer is not viewable, it's always hidden by default. the pageLoad event determines when it actually opens - modalViewer.hide(); - - // review the query strings in case there is something the modal viewer is supposed to handle by default + // check query strings to handle auto-opening behavior const queryStringVars = urlHandler.getRequestVars(); // show the modal if code view is called via query string if ( queryStringVars.view !== undefined && - (queryStringVars.view === 'code' || queryStringVars.view === 'c') - ) { - modalViewer.queryPattern(); - } - - // show the modal if the old annotations view is called via query string - if ( - queryStringVars.view !== undefined && - (queryStringVars.view === 'annotations' || queryStringVars.view === 'a') + (queryStringVars.view === 'code' || + queryStringVars.view === 'c' || + queryStringVars.view === 'annotations' || + queryStringVars.view === 'a') ) { - modalViewer.queryPattern(); + store.dispatch(updateDrawerState(true)); } }, @@ -76,16 +52,10 @@ export const modalViewer = { * toggle the modal window open and closed */ toggle() { - if (modalViewer.active === false) { - modalViewer.queryPattern(); + if (modalViewer.active) { + store.dispatch(updateDrawerState(false)); } else { - const obj = JSON.stringify({ - event: 'patternLab.annotationsHighlightHide', - }); - document - .querySelector('.pl-js-iframe') - .contentWindow.postMessage(obj, modalViewer.targetOrigin); - modalViewer.close(); + store.dispatch(updateDrawerState(true)); } }, @@ -93,50 +63,46 @@ export const modalViewer = { * open the modal window */ open() { - // make sure the modal viewer and other options are off just in case - modalViewer.close(); - - // note it's turned on in the viewer - DataSaver.updateValue('modalActive', 'true'); - modalViewer.active = true; + modalViewer.queryPattern(); - // show the modal - modalViewer.show(); + // Show annotations if data is available and modal is open + if (modalViewer.patternData) { + if ( + modalViewer.patternData.annotations && + modalViewer.patternData.annotations.length > 0 + ) { + const obj = JSON.stringify({ + event: 'patternLab.annotationsHighlightShow', + annotations: modalViewer.patternData.annotations, + }); + modalViewer.iframeElement.contentWindow.postMessage( + obj, + modalViewer.targetOrigin + ); + } + } }, /** * close the modal window */ close() { - // note that the modal viewer is no longer active - DataSaver.updateValue('modalActive', 'false'); - modalViewer.active = false; - - //Remove active class to modal - $('.pl-js-modal').removeClass('pl-is-active'); - $('.pl-js-modal').removeAttr('style'); // remove inline height CSS - - // WIP: refactoring viewport panel to use CSS vars to resize - // $('html').css('--pl-viewport-height', window.innerHeight - 32 + 'px'); - - // update the wording - $('.pl-js-pattern-info-toggle').html('Show Pattern Info'); - // tell the styleguide to close const obj = JSON.stringify({ event: 'patternLab.patternModalClose', }); - document - .querySelector('.pl-js-iframe') - .contentWindow.postMessage(obj, modalViewer.targetOrigin); - }, + modalViewer.iframeElement.contentWindow.postMessage( + obj, + modalViewer.targetOrigin + ); - /** - * hide the modal window - */ - hide() { - $('.pl-js-modal').removeClass('pl-is-active'); - $('.pl-js-modal').removeAttr('style'); // remove inline height CSS + const obj2 = JSON.stringify({ + event: 'patternLab.annotationsHighlightHide', + }); + modalViewer.iframeElement.contentWindow.postMessage( + obj2, + modalViewer.targetOrigin + ); }, /** @@ -154,18 +120,19 @@ export const modalViewer = { patternPartial, modalContent: templateRendered.outerHTML, }); - document - .querySelector('.pl-js-iframe') - .contentWindow.postMessage(obj, modalViewer.targetOrigin); + modalViewer.iframeElement.contentWindow.postMessage( + obj, + modalViewer.targetOrigin + ); } else { - // insert the panels and open the viewer - $('.pl-js-modal-content').html(templateRendered); - modalViewer.open(); - } + const contentContainer = document.querySelector('.pl-js-drawer-content'); + + // Clear out any existing children before appending the new panel content + if (contentContainer.firstChild !== null) { + contentContainer.removeChild(contentContainer.firstChild); + } - // update the wording unless this is a default viewall opening - if (switchText === true) { - $('.pl-js-pattern-info-toggle').html('Hide Pattern Info'); + contentContainer.appendChild(templateRendered); } }, @@ -178,9 +145,11 @@ export const modalViewer = { refresh(patternData, iframePassback, switchText) { // if this is a styleguide view close the modal if (iframePassback) { - modalViewer.hide(); + modalViewer.close(); } + modalViewer.patternData = patternData; + // gather the data that will fill the modal window panelsViewer.gatherPanels(patternData, iframePassback, switchText); }, @@ -190,7 +159,7 @@ export const modalViewer = { * @param {Integer} where the modal window should be slide to */ slide(pos) { - $('.pl-js-modal').toggleClass('pl-is-active'); + modalViewer.toggle(); }, /** @@ -204,47 +173,39 @@ export const modalViewer = { els[i].classList.remove('pl-is-active'); } + const patternInfoElem = document.querySelector('.pl-js-pattern-info'); + const scroll = new Scroll(patternInfoElem); + // add active class to called element and scroll to it for (let i = 0; i < els.length; ++i) { if (i + 1 === pos) { els[i].classList.add('pl-is-active'); - $('.pl-js-pattern-info').animate( - { - scrollTop: els[i].offsetTop - 10, - }, - 600 - ); + + scroll + .to(patternInfoElem.offsetTop, els[i].offsetTop - 14, { + duration: 600, + }) + .then(function() { + // console.log('finished scrolling'); + }); } } }, - /** - * Show modal - */ - show() { - $('.pl-js-modal').addClass('pl-is-active'); - }, - /** * ask the pattern for info so we can open the modal window and populate it * @param {Boolean} if the dropdown text should be changed */ queryPattern(switchText) { - // note that the modal is active and set switchText - if (switchText === undefined || switchText) { - switchText = true; - DataSaver.updateValue('modalActive', 'true'); - modalViewer.active = true; - } - // send a message to the pattern const obj = JSON.stringify({ event: 'patternLab.patternQuery', switchText, }); - document - .querySelector('.pl-js-iframe') - .contentWindow.postMessage(obj, modalViewer.targetOrigin); + modalViewer.iframeElement.contentWindow.postMessage( + obj, + modalViewer.targetOrigin + ); }, /** @@ -271,6 +232,15 @@ export const modalViewer = { } if (data.event !== undefined && data.event === 'patternLab.pageLoad') { + if ( + data.patternpartial.indexOf('viewall-') === 0 || + data.patternpartial.indexOf('all') === 0 + ) { + store.dispatch(isViewallPage(true)); + } else { + store.dispatch(isViewallPage(false)); + } + if ( modalViewer.active === false && data.patternpartial !== undefined && @@ -286,12 +256,21 @@ export const modalViewer = { data.event !== undefined && data.event === 'patternLab.patternQueryInfo' ) { - // refresh the modal if a new pattern is loaded and the modal is active - modalViewer.refresh( - data.patternData, - data.iframePassback, - data.switchText - ); + if ( + !modalViewer.panelRendered || + modalViewer.previouslyRenderedPattern !== + data.patternData.patternPartial + ) { + // refresh the modal contents, but only when necessary (ex. when the page changes) -- prevents extra, unnecessary re-renders of content. + modalViewer.refresh( + data.patternData, + data.iframePassback, + data.switchText + ); + + modalViewer.panelRendered = true; + modalViewer.previouslyRenderedPattern = data.patternData.patternPartial; + } } else if ( data.event !== undefined && data.event === 'patternLab.annotationNumberClicked' @@ -300,11 +279,18 @@ export const modalViewer = { modalViewer.slideToAnnotation(data.displayNumber); } }, + + _stateChanged(state) { + modalViewer.active = state.app.drawerOpened; + + if (modalViewer.active) { + modalViewer.open(); + } else { + modalViewer.close(); + } + }, }; -// when the document is ready make sure the modal is ready -$(document).ready(function() { - modalViewer.onReady(); -}); +modalViewer.onReady(); window.addEventListener('message', modalViewer.receiveIframeMessage, false); diff --git a/packages/uikit-workshop/src/scripts/components/panels-viewer.js b/packages/uikit-workshop/src/scripts/components/panels-viewer.js index 273d17a5c..3471cd7ae 100644 --- a/packages/uikit-workshop/src/scripts/components/panels-viewer.js +++ b/packages/uikit-workshop/src/scripts/components/panels-viewer.js @@ -8,7 +8,7 @@ import Prism from 'prismjs'; import { Panels } from './panels'; import { panelsUtil } from './panels-util'; import { urlHandler, Dispatcher } from '../utils'; -import './copy-to-clipboard'; +import './pl-copy-to-clipboard/pl-copy-to-clipboard'; export const panelsViewer = { // set up some defaults diff --git a/packages/uikit-workshop/src/scripts/components/pl-controls/pl-controls.js b/packages/uikit-workshop/src/scripts/components/pl-controls/pl-controls.js new file mode 100644 index 000000000..eda96d7e0 --- /dev/null +++ b/packages/uikit-workshop/src/scripts/components/pl-controls/pl-controls.js @@ -0,0 +1,37 @@ +import { define, props } from 'skatejs'; +import { h } from 'preact'; +const classNames = require('classnames'); +import { urlHandler, patternName } from '../../utils'; + +import { store } from '../../store.js'; // connect to redux +import { BaseComponent } from '../base-component.js'; + +import { ViewportSize } from '../pl-viewport-size/pl-viewport-size'; +import { ViewportSizeList } from '../pl-viewport-size-list/pl-viewport-size-list'; + +@define +class Controls extends BaseComponent { + static is = 'pl-controls'; + + constructor(self) { + self = super(self); + this.useShadow = false; + return self; + } + + _stateChanged(state) {} + + render() { + const { ishControlsHide } = window.ishControls; + + return ( +
    + + + +
    + ); + } +} + +export { Controls }; diff --git a/packages/uikit-workshop/src/sass/scss/04-components/_controls.scss b/packages/uikit-workshop/src/scripts/components/pl-controls/pl-controls.scss similarity index 70% rename from packages/uikit-workshop/src/sass/scss/04-components/_controls.scss rename to packages/uikit-workshop/src/scripts/components/pl-controls/pl-controls.scss index 6a6a9e479..19d725145 100644 --- a/packages/uikit-workshop/src/sass/scss/04-components/_controls.scss +++ b/packages/uikit-workshop/src/scripts/components/pl-controls/pl-controls.scss @@ -2,6 +2,20 @@ #CONTROLS \*------------------------------------*/ +pl-controls { + margin-left: auto; /* 2 */ + display: flex; + flex-wrap: nowrap; + + .pl-c-body--theme-sidebar & { + display: block; + + @media all and (min-width: $pl-bp-med) { + width: 100%; + } + } +} + /** * 1) Controls contains viewport resizer and tools dropdown * 2) Right-align inside of header diff --git a/packages/uikit-workshop/src/scripts/components/copy-to-clipboard.js b/packages/uikit-workshop/src/scripts/components/pl-copy-to-clipboard/pl-copy-to-clipboard.js similarity index 100% rename from packages/uikit-workshop/src/scripts/components/copy-to-clipboard.js rename to packages/uikit-workshop/src/scripts/components/pl-copy-to-clipboard/pl-copy-to-clipboard.js diff --git a/packages/uikit-workshop/src/scripts/components/pl-drawer/pl-drawer.js b/packages/uikit-workshop/src/scripts/components/pl-drawer/pl-drawer.js new file mode 100644 index 000000000..2b496aecd --- /dev/null +++ b/packages/uikit-workshop/src/scripts/components/pl-drawer/pl-drawer.js @@ -0,0 +1,155 @@ +import { define, props } from 'skatejs'; +import { h } from 'preact'; +import { store } from '../../store.js'; // redux store +import { + updateDrawerState, + updateDrawerHeight, + updateDrawerAnimationState, + // updateAppHeight, + // updateViewportHeight, +} from '../../actions/app.js'; // redux actions needed by this element. +import { css } from '../../utils'; +import { BaseComponent } from '../base-component.js'; +import AnimateHeight from 'react-animate-height'; + +@define +export class Drawer extends BaseComponent { + static is = 'pl-drawer'; + + constructor(self) { + self = super(self); + this.onMouseDown = this.onMouseDown.bind(this); // fix bindings so "this" works properly + this.onMouseUp = this.onMouseUp.bind(this); // fix bindings so "this" works properly + this.onMouseMove = this.onMouseMove.bind(this); // fix bindings so "this" works properly + return self; + } + + state = { + isMouseDown: false, + isMouseUp: false, + isDragging: false, + hasDragged: false, + panelHeight: '50vh', + }; + + onMouseDown() { + this.setState({ + ...this.state, + isMouseDown: true, + }); + + store.dispatch(updateDrawerAnimationState(true)); + + document.addEventListener('mousemove', this.onMouseMove); + document.addEventListener('mouseup', this.onMouseUp); + } + + onMouseMove(event) { + // 1/2 the height of the UI being dragged. @todo: make sure this 7px is calculated + const clientHeight = event.targetTouches + ? event.targetTouches[0].clientY + : event.clientY; + const panelHeight = window.innerHeight - clientHeight + 7; + + store.dispatch(updateDrawerHeight(panelHeight)); + + this.setState({ + ...this.state, + isDragging: true, + panelHeight: `${panelHeight}px`, + }); + } + + onMouseUp() { + this.setState({ + ...this.state, + hasDragged: this.state.isDragging, + isDragging: false, + isMouseDown: false, + isMouseUp: true, + }); + + store.dispatch(updateDrawerAnimationState(false)); + + document.removeEventListener('mousemove', this.onMouseMove); + document.removeEventListener('mouseup', this.onMouseUp); + } + + static props = { + drawerOpened: props.boolean, + }; + + get renderRoot() { + return this; + } + + render({ drawerOpened, drawerHeight, isViewallPage }) { + const classes = css( + 'pl-c-drawer', + 'pl-js-drawer', + drawerOpened && !isViewallPage ? 'pl-is-active' : '' + ); + + const height = + drawerOpened && !isViewallPage + ? drawerHeight > 20 + ? drawerHeight + : 300 + : 0; + + return ( +
    +
    + +
    +
    +
    +
    + {/* @todo: look into why this isn't re-rendering correctly */} + +
    +
    +
    +
    + +
    + ); + } + + _stateChanged(state) { + this.drawerOpened = state.app.drawerOpened; + this.drawerHeight = state.app.drawerHeight; + this.isDragging = state.app.isDragging; + this.isViewallPage = state.app.isViewallPage; + } +} diff --git a/packages/uikit-workshop/src/sass/scss/04-components/_modal.scss b/packages/uikit-workshop/src/scripts/components/pl-drawer/pl-drawer.scss old mode 100644 new mode 100755 similarity index 72% rename from packages/uikit-workshop/src/sass/scss/04-components/_modal.scss rename to packages/uikit-workshop/src/scripts/components/pl-drawer/pl-drawer.scss index 384e44f86..375200769 --- a/packages/uikit-workshop/src/sass/scss/04-components/_modal.scss +++ b/packages/uikit-workshop/src/scripts/components/pl-drawer/pl-drawer.scss @@ -1,46 +1,46 @@ /*------------------------------------*\ - #MODAL + #drawer \*------------------------------------*/ -$pl-resizer-height: 14px; +$pl-drawer-resizer-height: 14px; -pl-modal { +pl-drawer { display: flex; flex-direction: column; position: relative; position: sticky; + top: auto; + bottom: 0; + left: 0; + right: 0; z-index: 20; - max-height: 100vh; - box-shadow: 0 0 2px 0 $pl-color-gray-70; overflow: visible; + + .pl-c-body--theme-light & { + // Modal / Drawer inside a light theme + background-color: $pl-color-white; + color: $pl-color-gray-70; + border-top: 1.1px solid $pl-color-gray-20; // sub-pixel bug in Chrome. border disappears sometimes when set to 1px + } } /** - * 1) The modal slides up from the bottom of the viewport when + * 1) The drawer slides up from the bottom of the viewport when * "show pattern info" is selected on the pattern detail screen. */ -.pl-c-modal { +.pl-c-drawer { display: flex; flex-direction: column; font-family: $pl-font; background-color: $pl-color-gray-87; color: $pl-color-gray-20; - position: sticky; - top: auto; - bottom: 0; - left: 0; - right: 0; - z-index: 5; width: 100%; - height: 0; - transition: transform 0.3s ease, height 0.3s ease; - transform: translate3d(0, 100%, 0); + height: 100%; + transform: translate3d(0, 0, 0); pointer-events: none; - will-change: height, transform; overflow: hidden; max-width: 100vw; - box-shadow: 0 -1px 2px rgba($pl-color-gray-70, 0.1); .pl-c-body--theme-sidebar & { @media all and (min-width: $pl-bp-med) { @@ -48,59 +48,66 @@ pl-modal { } } + .pl-c-body--theme-light & { + // Modal / Drawer inside a light theme + background-color: $pl-color-white; + color: $pl-color-gray-70; + } + /** - * Active modal + * Active drawer */ &.pl-is-active { - transform: translate3d(0, 0, 0); - height: 40vh; // default height unless manually resized - transition: transform 0.3s ease; pointer-events: auto; } } -.pl-c-modal__wrapper { +.pl-c-drawer__wrapper { transform: translate3d(0, 0, 0); } -.pl-c-modal__wrapper > * { +.pl-c-drawer__wrapper > * { height: 100%; } -.pl-c-modal__content { +.pl-c-drawer__content { flex-grow: 1; display: flex; width: 100%; overflow: hidden; // needed for IE 11 so scrollbars show up } -.pl-c-modal__toolbar { +.pl-c-drawer__toolbar { display: flex; flex-direction: column; flex-shrink: 0; // so that the resizer height doesn't change unexpectedly } -.pl-c-modal__content-wrapper { +.pl-c-drawer__content-wrapper { display: flex; flex-direction: column; flex-grow: 1; overflow: hidden; // needed for IE 11 so scrollbars show up + + @supports (padding: env(safe-area-inset-top)){ + padding-right: calc(env(safe-area-inset-right) - 0.9rem); + } } -.pl-c-modal__toolbar-controls { +.pl-c-drawer__toolbar-controls { display: flex; flex-direction: row; align-self: flex-end; position: relative; z-index: 10; - flex-shrink: 0; + flex-shrink: 0; // fix for IE 11 squishing UI controls } /** - * Modal close button - * 1) Closes the modal popup + * drawer close button + * 1) Closes the drawer popup */ -.pl-c-modal__close-btn { +.pl-c-drawer__close-btn { @include linkStyle; margin: 0; -webkit-appearance: none; @@ -128,17 +135,18 @@ pl-modal { } } - -.pl-c-modal__cover { +.pl-c-drawer__cover { width: 100%; height: 100%; + top: 0; + left: 0; display: none; - position: absolute; + position: fixed; z-index: 20; cursor: move; } -.pl-c-modal__resizer { +.pl-c-drawer__resizer { display: flex; position: absolute; top: 0; @@ -146,8 +154,7 @@ pl-modal { right: 0; align-items: center; justify-content: center; - left: 0; - height: $pl-resizer-height; + height: $pl-drawer-resizer-height; width: 100%; background-color: inherit; z-index: 2; @@ -163,7 +170,7 @@ pl-modal { opacity: 0.5; background-color: currentColor; border-radius: 3px; - display: block; + display: block; // IE 11 bug fix } &:hover:after { @@ -180,7 +187,7 @@ pl-modal { * Close button icon * 1) Displayed as an e */ -.pl-c-modal__close-btn-icon { +.pl-c-drawer__close-btn-icon { width: 12px; height: 12px; color: currentColor; diff --git a/packages/uikit-workshop/src/scripts/components/pl-header/pl-header.js b/packages/uikit-workshop/src/scripts/components/pl-header/pl-header.js new file mode 100644 index 000000000..1d56add10 --- /dev/null +++ b/packages/uikit-workshop/src/scripts/components/pl-header/pl-header.js @@ -0,0 +1,48 @@ +import { define, props } from 'skatejs'; +import { h } from 'preact'; +const classNames = require('classnames'); + +import { store } from '../../store.js'; // connect to redux +import { BaseComponent } from '../base-component.js'; + +@define +class Header extends BaseComponent { + static is = 'pl-header'; + + constructor(self) { + self = super(self); + this.useShadow = false; + this.toggleNav = this.toggleNav.bind(this); + return self; + } + + _stateChanged(state) {} + + toggleNav() { + const navTarget = this.querySelector('.pl-js-nav-target'); + navTarget.classList.toggle('pl-is-active'); // @todo: refactor to have this add based on the component's state + } + + render() { + return ( + + ); + } +} + +export { Header }; diff --git a/packages/uikit-workshop/src/sass/scss/04-components/_header.scss b/packages/uikit-workshop/src/scripts/components/pl-header/pl-header.scss similarity index 52% rename from packages/uikit-workshop/src/sass/scss/04-components/_header.scss rename to packages/uikit-workshop/src/scripts/components/pl-header/pl-header.scss index 2616b678f..bd275661e 100644 --- a/packages/uikit-workshop/src/sass/scss/04-components/_header.scss +++ b/packages/uikit-workshop/src/scripts/components/pl-header/pl-header.scss @@ -2,13 +2,7 @@ #HEADER \*------------------------------------*/ -/** -* 1) Pattern Lab's header is fixed across the top of the viewport and -* contains the primary pattern navigation, viewport resizing items, -* and tools. -* 2) Display nav and controls horizontally -*/ -.pl-c-header { +pl-header { position: fixed; position: sticky; top: 0; @@ -18,14 +12,58 @@ width: 100%; background-color: $pl-color-black; color: $pl-color-gray-50; + + @media all and (min-width: $pl-bp-med) { + .pl-c-body--theme-sidebar & { + /** + * Header + * 1) Set width to sidebar width defined above + * 2) Make header 100% of the viewport height + * 3) Stack header content stack on top of each other + * 4) void bottom border for light theme + */ + width: $pl-sidebar-width; /* 1 */ + height: 100vh; /* 2 */ + overflow: auto; + padding: 1rem; + -webkit-overflow-scrolling: touch; + border-bottom: 0; /* 4 */ + } + } + + .pl-c-body--theme-light & { + border-right: 1px solid $pl-color-gray-20; + background-color: $pl-color-white; + border-bottom: 1px solid $pl-color-gray-20; + } +} + +/** +* 1) Pattern Lab's header is fixed across the top of the viewport and +* contains the primary pattern navigation, viewport resizing items, +* and tools. +* 2) Display nav and controls horizontally +*/ +.pl-c-header { + display: flex; /* 2 */ + flex-direction: row; + width: 100%; font-family: $pl-font; font-size: $pl-font-size-sm; min-height: 30px; // magic number -- needed for initial skeleton screen styles used in the critical CSS + background-color: inherit; @supports(padding: max(0px)) { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); } + + @media all and (min-width: $pl-bp-med) { + .pl-c-body--theme-sidebar & { + flex-direction: column; /* 3 */ + justify-content: space-between; + } + } } /** diff --git a/packages/uikit-workshop/src/scripts/components/pl-layout/pl-layout.js b/packages/uikit-workshop/src/scripts/components/pl-layout/pl-layout.js index 504c4391e..31f04e710 100644 --- a/packages/uikit-workshop/src/scripts/components/pl-layout/pl-layout.js +++ b/packages/uikit-workshop/src/scripts/components/pl-layout/pl-layout.js @@ -1,6 +1,5 @@ import { define, props } from 'skatejs'; import { h } from 'preact'; -import Hogan from 'hogan.js'; const classNames = require('classnames'); import { store } from '../../store.js'; // connect to redux @@ -22,35 +21,7 @@ class Layout extends BaseComponent { constructor(self) { self = super(self); - try { - /* load pattern nav */ - const template = document.querySelector('.pl-js-pattern-nav-template'); - const templateCompiled = Hogan.compile(template.innerHTML); - const templateRendered = templateCompiled.render(window.navItems); - this.renderRoot.querySelector( - '.pl-js-pattern-nav-target' - ).innerHTML = templateRendered; - - /* load ish controls */ - const controlsTemplate = document.querySelector( - '.pl-js-ish-controls-template' - ); - const controlsTemplateCompiled = Hogan.compile( - controlsTemplate.innerHTML - ); - const controlsTemplateRendered = controlsTemplateCompiled.render( - window.ishControls - ); - this.renderRoot.querySelector( - '.pl-js-controls' - ).innerHTML = controlsTemplateRendered; - } catch (e) { - const message = - '

    Please generate your site before trying to view it.

    '; - this.renderRoot.querySelector( - '.pl-js-pattern-nav-target' - ).innerHTML = message; - } + this.useShadow = false; return self; } @@ -65,10 +36,6 @@ class Layout extends BaseComponent { this.themeMode = state.app.themeMode; } - get renderRoot() { - return this; - } - _stateChanged(state) { this.layoutMode = state.app.layoutMode; this.themeMode = state.app.themeMode; @@ -77,8 +44,7 @@ class Layout extends BaseComponent { [`pl-c-body--theme-${this.themeMode}`]: this.themeMode !== undefined, [`pl-c-body--theme-${ this.layoutMode === 'vertical' ? 'sidebar' : 'horizontal' - }`]: - this.layoutMode !== undefined, + }`]: this.layoutMode !== undefined, }); this.className = classes; diff --git a/packages/uikit-workshop/src/scripts/components/pl-layout/pl-layout.scss b/packages/uikit-workshop/src/scripts/components/pl-layout/pl-layout.scss index 00dde1208..1917cdf37 100644 --- a/packages/uikit-workshop/src/scripts/components/pl-layout/pl-layout.scss +++ b/packages/uikit-workshop/src/scripts/components/pl-layout/pl-layout.scss @@ -7,12 +7,16 @@ pl-layout { min-height: 100vh; max-width: 100vw; background-color: $pl-color-gray-13; - + // Prevent extra scrollbars in just IE 11 @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { overflow: hidden; } + .pl-c-layout { + flex-grow: 1; + } + &.pl-c-body--theme-sidebar { @media all and (min-width: $pl-bp-med) { flex-direction: row; diff --git a/packages/uikit-workshop/src/scripts/components/pl-nav/pl-nav.js b/packages/uikit-workshop/src/scripts/components/pl-nav/pl-nav.js new file mode 100644 index 000000000..f9d89e981 --- /dev/null +++ b/packages/uikit-workshop/src/scripts/components/pl-nav/pl-nav.js @@ -0,0 +1,175 @@ +import { define, props } from 'skatejs'; +import { h } from 'preact'; +const classNames = require('classnames'); + +import { BaseComponent } from '../base-component.js'; +import $ from 'jquery'; + +const Button = props => { + return ( + + ); +}; + +@define +class Nav extends BaseComponent { + static is = 'pl-nav'; + + _stateChanged(state) {} + + constructor() { + super(); + this.toggleNavPanel = this.toggleNavPanel.bind(this); + } + + toggleNavPanel(e) { + const $this = $(e.target); + const $panel = $this.next('.pl-js-acc-panel'); + const subnav = $this + .parent() + .parent() + .hasClass('pl-js-acc-panel'); + + //Close other panels if link isn't a subnavigation item + if (!subnav) { + $('.pl-js-acc-handle') + .not($this) + .removeClass('pl-is-active'); + $('.pl-js-acc-panel') + .not($panel) + .removeClass('pl-is-active'); + } + + //Activate selected panel + $this.toggleClass('pl-is-active'); + $panel.toggleClass('pl-is-active'); + } + + render() { + const patternTypes = window.navItems.patternTypes; + // const patternItems = window.navItems.patternItems; + + return ( +
      + {patternTypes.map((item, i) => { + const classes = classNames({ + [`pl-c-nav__item pl-c-nav__item--${item.patternTypeLC}`]: true, + }); + + const patternItems = item.patternItems; + + return ( +
    1. + + +
        + {item.patternTypeItems.map((patternSubtype, i) => { + return ( +
      1. + + +
          + {patternSubtype.patternSubtypeItems.map( + (patternSubtypeItem, i) => { + return ( +
        1. + + {patternSubtypeItem.patternName} + + {patternSubtypeItem.patternState && ( + + )} + +
        2. + ); + } + )} +
        +
      2. + ); + })} + + {patternItems && + patternItems.map((patternItem, i) => { + return ( +
      3. + + {patternItem.patternName} + + {patternItem.patternState && ( + + )} + +
      4. + ); + })} +
      +
    2. + ); + })} + +
    3. + + All + +
    4. +
    + ); + } +} + +export { Nav }; diff --git a/packages/uikit-workshop/src/sass/scss/04-components/_navigation.scss b/packages/uikit-workshop/src/scripts/components/pl-nav/pl-nav.scss similarity index 95% rename from packages/uikit-workshop/src/sass/scss/04-components/_navigation.scss rename to packages/uikit-workshop/src/scripts/components/pl-nav/pl-nav.scss index ee71746b4..79544f8d1 100644 --- a/packages/uikit-workshop/src/sass/scss/04-components/_navigation.scss +++ b/packages/uikit-workshop/src/scripts/components/pl-nav/pl-nav.scss @@ -2,6 +2,11 @@ #NAVIGATION \*------------------------------------*/ +pl-nav { + background-color: inherit; // so the inside of dropdowns inherits the correct color + display: flex; // vertically align children +} + /** * Navigation container * 1) Collapse height on small screens. Menu trigger button @@ -11,7 +16,7 @@ @include accordionPanel; background-color: inherit; // allows the nav's children inherit from the parent header position: absolute; - left: 0; // IE 11 layout broken + left: 0; // IE 11 layout broken top: 100%; width: 100%; display: flex; @@ -71,6 +76,8 @@ padding: 0; list-style: none; flex-shrink: 0; // helps prevent top-level nav items from occasionally wrapping to multiple lines + flex-grow: 1; // auto-fill extra space available + max-width: 100%; // so content doesn't won't spill out horizontally order: 2; background-color: inherit; // allows the nav's children inherit from the parent header diff --git a/packages/uikit-workshop/src/scripts/components/pl-search/pl-search.scss b/packages/uikit-workshop/src/scripts/components/pl-search/pl-search.scss index 94e6d3a4e..ebe88bc9f 100644 --- a/packages/uikit-workshop/src/scripts/components/pl-search/pl-search.scss +++ b/packages/uikit-workshop/src/scripts/components/pl-search/pl-search.scss @@ -13,17 +13,17 @@ $pl-clear-button-size-at-med: 1.4rem; pl-search { background-color: inherit; - order: 2; // Display after nav list items top: 0; z-index: 10; flex-shrink: 0; padding: 0.3rem 0.5rem; display: inline-block; - + @media screen and (min-width: $pl-bp-med) { margin-left: 1rem; flex-direction: row; flex-shrink: 1; + order: 2; // Display after nav list items on wider screens .pl-c-body--theme-sidebar & { flex-direction: column; @@ -91,7 +91,7 @@ pl-search { @media all and (min-width: 900px) { font-size: inherit; } - + // Remove the native clear button in IE 11 in lieu of JS-controlled clear button &::-ms-clear { display: none; @@ -111,7 +111,6 @@ pl-search { } @media all and (min-width: $pl-bp-med) { - .pl-c-body--theme-sidebar & { max-width: none; } diff --git a/packages/uikit-workshop/src/scripts/components/pl-toggle-info/pl-toggle-info.js b/packages/uikit-workshop/src/scripts/components/pl-toggle-info/pl-toggle-info.js new file mode 100644 index 000000000..748314da5 --- /dev/null +++ b/packages/uikit-workshop/src/scripts/components/pl-toggle-info/pl-toggle-info.js @@ -0,0 +1,40 @@ +import { define, props } from 'skatejs'; +import { h } from 'preact'; + +import { store } from '../../store.js'; // connect to the Redux store. +import { updateDrawerState } from '../../actions/app.js'; // redux actions +import { BaseComponent } from '../base-component.js'; + +@define +class InfoToggle extends BaseComponent { + static is = 'pl-toggle-info'; + + constructor(self) { + self = super(self); + return self; + } + + static props = { + _drawerOpened: props.boolean, + }; + + _stateChanged(state) { + this._drawerOpened = state.app.drawerOpened; + this.isViewallPage = state.app.isViewallPage; + } + + render({ _drawerOpened, isViewallPage }) { + return ( + + ); + } +} + +export { InfoToggle }; diff --git a/packages/uikit-workshop/src/scripts/components/pl-toggle-info/pl-toggle-info.scss b/packages/uikit-workshop/src/scripts/components/pl-toggle-info/pl-toggle-info.scss new file mode 100644 index 000000000..8896eb2aa --- /dev/null +++ b/packages/uikit-workshop/src/scripts/components/pl-toggle-info/pl-toggle-info.scss @@ -0,0 +1,16 @@ +@import '../../../sass/scss/core.scss'; + +pl-toggle-info { + display: flex; + align-self: center; + justify-content: center; + align-items: center; + z-index: 10; + width: 100%; + cursor: pointer; +} + +.pl-c-toggle-info, +.pl-c-toggle-info__action { + width: 100%; +} diff --git a/packages/uikit-workshop/src/scripts/components/pl-toggle-layout/pl-toggle-layout.js b/packages/uikit-workshop/src/scripts/components/pl-toggle-layout/pl-toggle-layout.js index 5c32b282b..24ab5402a 100644 --- a/packages/uikit-workshop/src/scripts/components/pl-toggle-layout/pl-toggle-layout.js +++ b/packages/uikit-workshop/src/scripts/components/pl-toggle-layout/pl-toggle-layout.js @@ -5,9 +5,6 @@ import { store } from '../../store.js'; // connect to the Redux store. import { updateLayoutMode } from '../../actions/app.js'; // redux actions import { BaseComponent } from '../base-component.js'; -import './pl-toggle-layout.scss?external'; -import styles from './pl-toggle-layout.scss'; - @define class LayoutToggle extends BaseComponent { static is = 'pl-toggle-layout'; @@ -40,7 +37,6 @@ class LayoutToggle extends BaseComponent { layoutMode !== 'vertical' ? 'vertical' : 'horizontal'; return (
    - {this._renderStyles([styles])} + +
    + ); + } +} diff --git a/packages/uikit-workshop/src/sass/scss/04-components/_tools.scss b/packages/uikit-workshop/src/scripts/components/pl-tools-menu/pl-tools-menu.scss similarity index 90% rename from packages/uikit-workshop/src/sass/scss/04-components/_tools.scss rename to packages/uikit-workshop/src/scripts/components/pl-tools-menu/pl-tools-menu.scss index cc9d9b657..7510d9214 100644 --- a/packages/uikit-workshop/src/sass/scss/04-components/_tools.scss +++ b/packages/uikit-workshop/src/scripts/components/pl-tools-menu/pl-tools-menu.scss @@ -2,6 +2,13 @@ #TOOLS \*------------------------------------*/ +// vertical align in container +pl-tools-menu { + display: flex; + flex-direction: column; + justify-content: center; +} + /** * The tools dropdown contains more utilities such as show/hide * pattern info and pattern search, and also links to open in a @@ -36,6 +43,7 @@ */ .pl-c-tools__toggle-icon { transition: inherit; // inherit transition styles from parent toggle + // pointer-events: none; } /** diff --git a/packages/uikit-workshop/src/scripts/components/pl-viewport-size-list/pl-viewport-size-list.js b/packages/uikit-workshop/src/scripts/components/pl-viewport-size-list/pl-viewport-size-list.js new file mode 100644 index 000000000..1b5f8ab78 --- /dev/null +++ b/packages/uikit-workshop/src/scripts/components/pl-viewport-size-list/pl-viewport-size-list.js @@ -0,0 +1,57 @@ +import { h } from 'preact'; + +export const ViewportSizeList = ishControlsHide => { + return ( +
      + {!ishControlsHide.s && ( +
    • + +
    • + )} + {!ishControlsHide.m && ( +
    • + +
    • + )} + {!ishControlsHide.l && ( +
    • + +
    • + )} + {!ishControlsHide.full && ( +
    • + +
    • + )} + {!ishControlsHide.random && ( +
    • + +
    • + )} + {!ishControlsHide.disco && ( +
    • + +
    • + )} + {!ishControlsHide.hay && ( +
    • + +
    • + )} +
    + ); +}; diff --git a/packages/uikit-workshop/src/scripts/components/pl-viewport-size-list/pl-viewport-size-list.scss b/packages/uikit-workshop/src/scripts/components/pl-viewport-size-list/pl-viewport-size-list.scss new file mode 100644 index 000000000..2a5091d09 --- /dev/null +++ b/packages/uikit-workshop/src/scripts/components/pl-viewport-size-list/pl-viewport-size-list.scss @@ -0,0 +1,42 @@ +/** + * Size options + * 1) This holds the S, M, L, Rand, Disco links + * 2) Depending on the config, these number of options may be + * larger or smaller. + */ +.pl-c-size-list { + display: none; + list-style: none; + margin: 0; + padding: 0; + overflow-x: auto; + padding: 0 0.25rem; + + @media all and (min-width: $pl-bp-med) { + align-items: center; + -webkit-overflow-scrolling: touch; + + } + + @media all and (min-width: $pl-bp-large) { + display: block; + display: flex; + } +} + +/** + * Size actions + * 1) These are the buttons that control the viewport resizing + */ +.pl-c-size-list__action { + @include linkStyle(); +} + +// Force list items to center align if not overflow scrolling +.pl-c-size-list__item:first-child { + margin-left: auto; +} + +.pl-c-size-list__item:last-child { + margin-right: auto; +} \ No newline at end of file diff --git a/packages/uikit-workshop/src/scripts/components/pl-viewport-size/pl-viewport-size.js b/packages/uikit-workshop/src/scripts/components/pl-viewport-size/pl-viewport-size.js new file mode 100644 index 000000000..8a405cead --- /dev/null +++ b/packages/uikit-workshop/src/scripts/components/pl-viewport-size/pl-viewport-size.js @@ -0,0 +1,26 @@ +import { h } from 'preact'; + +export const ViewportSize = ishControlsHide => { + return ( +
    + + + + +
    + ); +}; diff --git a/packages/uikit-workshop/src/sass/scss/04-components/_ish-sizing.scss b/packages/uikit-workshop/src/scripts/components/pl-viewport-size/pl-viewport-size.scss similarity index 57% rename from packages/uikit-workshop/src/sass/scss/04-components/_ish-sizing.scss rename to packages/uikit-workshop/src/scripts/components/pl-viewport-size/pl-viewport-size.scss index 5435c4537..b485d9cee 100644 --- a/packages/uikit-workshop/src/sass/scss/04-components/_ish-sizing.scss +++ b/packages/uikit-workshop/src/scripts/components/pl-viewport-size/pl-viewport-size.scss @@ -59,45 +59,3 @@ padding: 0; } -/** - * Size options - * 1) This holds the S, M, L, Rand, Disco links - * 2) Depending on the config, these number of options may be - * larger or smaller. - */ -.pl-c-size-list { - display: none; - list-style: none; - margin: 0; - padding: 0; - overflow-x: auto; - padding: 0 0.25rem; - - @media all and (min-width: $pl-bp-med) { - align-items: center; - -webkit-overflow-scrolling: touch; - - } - - @media all and (min-width: $pl-bp-large) { - display: block; - display: flex; - } -} - -/** - * Size actions - * 1) These are the buttons that control the viewport resizing - */ -.pl-c-size-list__action { - @include linkStyle(); -} - -// Force list items to center align if not overflow scrolling -.pl-c-size-list__item:first-child { - margin-left: auto; -} - -.pl-c-size-list__item:last-child { - margin-right: auto; -} \ No newline at end of file diff --git a/packages/uikit-workshop/src/scripts/components/pl-viewport/pl-viewport.js b/packages/uikit-workshop/src/scripts/components/pl-viewport/pl-viewport.js new file mode 100644 index 000000000..5de9f575a --- /dev/null +++ b/packages/uikit-workshop/src/scripts/components/pl-viewport/pl-viewport.js @@ -0,0 +1,78 @@ +import { define, props } from 'skatejs'; +import { h } from 'preact'; +const classNames = require('classnames'); +import render from 'preact-render-to-string'; + +import { store } from '../../store.js'; // connect to redux +import { BaseComponent } from '../base-component.js'; + +import styles from '../../../sass/pattern-lab--iframe-loader.scss'; + +@define +class IFrame extends BaseComponent { + static is = 'pl-iframe'; + + constructor(self) { + self = super(self); + this.useShadow = false; + self.styleguideReady = false; + return self; + } + + _stateChanged(state) {} + + render() { + const IframeInner = () => { + return ( +
    + +
    +
    +
    Loading Pattern Lab
    +
    + + + + + +
    +
    +
    +
    + ); + }; + + return ( +
    +
    +
    +