soft-components
Version:
Simple soft flexible set of web components
1 lines • 81.3 kB
JavaScript
var __awaiter=this&&this.__awaiter||function(t,a,c,s){function i(t){return t instanceof c?t:new c((function(a){a(t)}))}return new(c||(c=Promise))((function(c,r){function o(t){try{l(s.next(t))}catch(t){r(t)}}function e(t){try{l(s["throw"](t))}catch(t){r(t)}}function l(t){t.done?c(t.value):i(t.value).then(o,e)}l((s=s.apply(t,a||[])).next())}))};var __generator=this&&this.__generator||function(t,a){var c={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},s,i,r,o;return o={next:e(0),throw:e(1),return:e(2)},typeof Symbol==="function"&&(o[Symbol.iterator]=function(){return this}),o;function e(t){return function(a){return l([t,a])}}function l(o){if(s)throw new TypeError("Generator is already executing.");while(c)try{if(s=1,i&&(r=o[0]&2?i["return"]:o[0]?i["throw"]||((r=i["return"])&&r.call(i),0):i.next)&&!(r=r.call(i,o[1])).done)return r;if(i=0,r)o=[o[0]&2,r.value];switch(o[0]){case 0:case 1:r=o;break;case 4:c.label++;return{value:o[1],done:false};case 5:c.label++;i=o[1];o=[0];continue;case 7:o=c.ops.pop();c.trys.pop();continue;default:if(!(r=c.trys,r=r.length>0&&r[r.length-1])&&(o[0]===6||o[0]===2)){c=0;continue}if(o[0]===3&&(!r||o[1]>r[0]&&o[1]<r[3])){c.label=o[1];break}if(o[0]===6&&c.label<r[1]){c.label=r[1];r=o;break}if(r&&c.label<r[2]){c.label=r[2];c.ops.push(o);break}if(r[2])c.ops.pop();c.trys.pop();continue}o=a.call(t,c)}catch(t){o=[6,t];i=0}finally{s=r=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:true}}};import{r as registerInstance,h,H as Host,g as getElement,c as createEvent}from"./index-d081c54b.js";var scAccordionCss=":host{--sc-accordion-animation-duration:var(--sc-animation-duration, 0.2s);--sc-accordion-animation-timing-function:var(\n --sc-animation-timing-function,\n ease-in-out\n );--sc-accordion-item-heading-padding-x:calc(var(--sc-root-spacing, 8px) * 2);--sc-accordion-item-heading-padding-x:calc(var(--sc-root-spacing, 0.5rem) * 2);--sc-accordion-item-heading-padding-y:calc(var(--sc-root-spacing, 8px) * 2);--sc-accordion-item-heading-padding-y:calc(var(--sc-root-spacing, 0.5rem) * 2);--sc-accordion-item-body-padding-x:calc(var(--sc-root-spacing, 8px) * 2);--sc-accordion-item-body-padding-x:calc(var(--sc-root-spacing, 0.5rem) * 2);--sc-accordion-item-body-padding-y:calc(var(--sc-root-spacing, 8px) * 2);--sc-accordion-item-body-padding-y:calc(var(--sc-root-spacing, 0.5rem) * 2);--sc-accordion-item-body-max-height:100vh;--sc-accordion-item-heading-text-color:var(--sc-text-color, #333333);--sc-accordion-item-heading-bg-color:var(--sc-bg-color, #f1f1f1);--sc-accordion-item-body-bg-color:var(--sc-bg-color, #f1f1f1);--sc-accordion-item-heading-border-bottom:1px solid\n var(--sc-shadow-color, rgba(0, 0, 0, 0.2));--sc-accordion-item-heading-border-bottom:0.0625rem solid\n var(--sc-shadow-color, rgba(0, 0, 0, 0.2))}";var ScAccordion=function(){function t(t){registerInstance(this,t);this.multiple=false}t.prototype.componentWillLoad=function(){this.items=this.el.querySelectorAll(":scope > sc-accordion-item");if(!this.multiple){this.activeItem=this.el.querySelector(":scope > sc-accordion-item[active]");if(this.activeItem){this.activeItem.open()}this.closeNonActive()}};t.prototype.openHandler=function(t){t.stopPropagation();var a=t.target;if(!this.multiple){this.activeItem=a;this.closeNonActive()}};t.prototype.closeNonActive=function(){var t=this;this.items.forEach((function(a){if(!a.isEqualNode(t.activeItem)){a.close()}}))};t.prototype.render=function(){return h(Host,null,h("slot",null))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();ScAccordion.style=scAccordionCss;var hasSlot=function(t,a){return!!t.querySelector(':scope > [slot="'+a+'"')};var scAccordionItemCss=":host{display:block}:host .heading{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;width:100%;-webkit-box-shadow:calc(var(--sc-highlight-dist-x) * 0.2) calc(var(--sc-highlight-dist-y) * 0.2) calc(30px * 0.2) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 0.2) calc(var(--sc-shadow-dist-y) * 0.2) calc(30px * 0.2) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:calc(var(--sc-highlight-dist-x) * 0.2) calc(var(--sc-highlight-dist-y) * 0.2) calc(30px * 0.2) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 0.2) calc(var(--sc-shadow-dist-y) * 0.2) calc(30px * 0.2) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:calc(var(--sc-highlight-dist-x) * 0.2) calc(var(--sc-highlight-dist-y) * 0.2) calc(1.875rem * 0.2) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 0.2) calc(var(--sc-shadow-dist-y) * 0.2) calc(1.875rem * 0.2) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:calc(var(--sc-highlight-dist-x) * 0.2) calc(var(--sc-highlight-dist-y) * 0.2) calc(1.875rem * 0.2) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 0.2) calc(var(--sc-shadow-dist-y) * 0.2) calc(1.875rem * 0.2) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));border-radius:var(--sc-border-radius, 1em);border:none;text-align:left;padding:var(--sc-accordion-item-heading-padding-y) var(--sc-accordion-item-heading-padding-x);cursor:pointer;-webkit-transition:border-radius var(--sc-accordion-animation-duration) ease var(--sc-accordion-animation-duration);transition:border-radius var(--sc-accordion-animation-duration) ease var(--sc-accordion-animation-duration);background:var(--sc-accordion-item-heading-bg-color)}:host .heading .heading-text{color:var(--sc-accordion-item-heading-text-color);margin:0;-ms-flex:1;flex:1}:host .heading .arrow{color:var(--sc-text-color);-webkit-transition:-webkit-transform var(--sc-accordion-animation-duration) var(--sc-accordion-animation-timing-function);transition:-webkit-transform var(--sc-accordion-animation-duration) var(--sc-accordion-animation-timing-function);transition:transform var(--sc-accordion-animation-duration) var(--sc-accordion-animation-timing-function);transition:transform var(--sc-accordion-animation-duration) var(--sc-accordion-animation-timing-function), -webkit-transform var(--sc-accordion-animation-duration) var(--sc-accordion-animation-timing-function)}:host .heading .arrow svg{width:calc(var(--sc-root-spacing, 8px) * 4);width:calc(var(--sc-root-spacing, 0.5rem) * 4);height:calc(var(--sc-root-spacing, 8px) * 4);height:calc(var(--sc-root-spacing, 0.5rem) * 4)}:host .heading .arrow svg path{fill:currentColor}:host .body-container{overflow:hidden;max-height:0;-webkit-transition:max-height var(--sc-accordion-animation-duration) var(--sc-accordion-animation-timing-function);transition:max-height var(--sc-accordion-animation-duration) var(--sc-accordion-animation-timing-function);background:var(--sc-accordion-item-body-bg-color)}:host .body-container .body{border-radius:var(--sc-border-radius, 1em);-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.2) calc(var(--sc-highlight-dist-y) * 0.2) calc(30px * 0.2) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.2) calc(var(--sc-shadow-dist-y) * 0.2) calc(30px * 0.2) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.2) calc(var(--sc-highlight-dist-y) * 0.2) calc(30px * 0.2) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.2) calc(var(--sc-shadow-dist-y) * 0.2) calc(30px * 0.2) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));border-top-left-radius:0;border-top-right-radius:0;overflow:hidden;padding:var(--sc-accordion-item-body-padding-y) var(--sc-accordion-item-body-padding-x)}:host(.autoHeight) .body-container{overflow:hidden}:host(.active) .heading{border-bottom-left-radius:0;border-bottom-right-radius:0;-webkit-transition:border-radius 0s ease;transition:border-radius 0s ease;border-bottom:var(--sc-accordion-item-heading-border-bottom)}:host(.active) .heading .arrow{-webkit-transform:rotate(180deg);transform:rotate(180deg)}:host(.active) .body-container{max-height:var(--sc-accordion-item-body-max-height)}";var ScAccordionItem=function(){function t(t){registerInstance(this,t);this.opened=createEvent(this,"opened",7);this.opening=createEvent(this,"opening",7);this.closed=createEvent(this,"closed",7);this.closing=createEvent(this,"closing",7);this.heading=null;this.headingTag="h3";this.autoHeight=true;this.active=false;this.hasHeadingSlot=true;this.hasArrowSlot=true}t.prototype.componentWillLoad=function(){this.hasHeadingSlot=hasSlot(this.el,"heading");this.hasArrowSlot=hasSlot(this.el,"arrow")};t.prototype.componentDidLoad=function(){var t=this;if(this.autoHeight){this.bodyEl.style.setProperty("--sc-accordion-item-body-max-height",this.bodyEl.scrollHeight+2+"px")}this.onTransitionEnd();this.bodyEl.addEventListener("transitionstart",(function(){t.onTransitionStart()}));this.bodyEl.addEventListener("transitionend",(function(){t.onTransitionEnd()}))};t.prototype.onTransitionEnd=function(){if(this.active){this.bodyEl.style.overflow="auto";this.opened.emit()}else{this.bodyEl.style.overflow="hidden";this.bodyEl.style.visibility="hidden";this.closed.emit()}};t.prototype.onTransitionStart=function(){if(this.active){this.bodyEl.style.visibility="visible";this.opening.emit()}else{this.closing.emit()}};t.prototype.toggle=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){if(this.active){this.close()}else{this.open()}return[2]}))}))};t.prototype.close=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.active=false;return[2]}))}))};t.prototype.open=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.active=true;return[2]}))}))};t.prototype.render=function(){var t=this;var a=this,c=a.active,s=a.autoHeight,i=a.headingTag;return h(Host,{class:{active:c,autoHeight:s}},h("button",{class:"heading",role:"button",onClick:function(){return t.toggle()}},this.hasHeadingSlot?h("slot",{name:"heading"}):h(i,{class:"heading-text"},this.heading),h("span",{class:"arrow"},this.hasArrowSlot?h("slot",{name:"arrow"}):h("svg",{focusable:"false",viewBox:"0 0 24 24","aria-hidden":"true"},h("path",{d:"M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"})))),h("div",{class:"body-container",ref:function(a){return t.bodyEl=a}},h("div",{class:"body"},h("slot",null))))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();ScAccordionItem.style=scAccordionItemCss;var scButtonCss='sc-button{--sc-button-bg-color:var(--sc-bg-color, #f6f6f8);--sc-button-text-color:var(--sc-text-color, #333333);--sc-button-border-radius:var(--sc-border-radius, 1em);--sc-button-padding-y:calc(var(--sc-root-spacing, 8px) * 2);--sc-button-padding-y:calc(var(--sc-root-spacing, 0.5rem) * 2);--sc-button-padding-x:calc(var(--sc-root-spacing, 8px) * 4);--sc-button-padding-x:calc(var(--sc-root-spacing, 0.5rem) * 4);--sc-button-icon-size:calc(var(--sc-root-spacing, 8px) * 6);--sc-button-icon-size:calc(var(--sc-root-spacing, 0.5rem) * 6);--sc-button-circle-size:calc(var(--sc-root-spacing, 8px) * 6);--sc-button-circle-size:calc(var(--sc-root-spacing, 0.5rem) * 6);--sc-button-bordered-border-radius:var(--sc-button-border-radius);--sc-button-bordered-border-width:2px;--sc-button-bordered-border-width:0.125rem;--sc-button-text-hover-color:var(--sc-secondary-color, #646695);--sc-button-text-active-color:var(--sc-active-color, #c586c0);--sc-button-width:auto;--sc-button-edge-width:4px;--sc-button-edge-width:0.25rem;--sc-button-vertical-align:top;display:inline-block;vertical-align:var(--sc-button-vertical-align)}sc-button[type]{-webkit-appearance:none}sc-button *{-webkit-box-sizing:border-box;box-sizing:border-box}sc-button:not(.flat) a,sc-button:not(.flat) button{-webkit-box-shadow:calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2))}sc-button a,sc-button button{cursor:pointer;border:none;text-decoration:none;display:block;background-color:var(--sc-button-bg-color);color:var(--sc-button-text-color);border-radius:var(--sc-button-border-radius);position:relative;padding:var(--sc-button-edge-width);font-size:1em;font-family:inherit;width:var(--sc-button-width)}sc-button a .button-inner,sc-button button .button-inner{overflow:hidden;-webkit-transition:all 0.4s ease;transition:all 0.4s ease;display:block;padding:var(--sc-button-padding-y) var(--sc-button-padding-x);border-radius:calc(var(--sc-button-border-radius) - 4px);border-radius:calc(var(--sc-button-border-radius) - 0.25rem);width:var(--sc-button-width)}sc-button a:hover,sc-button a:focus,sc-button button:hover,sc-button button:focus{color:var(--sc-button-text-hover-color)}sc-button a:hover .button-inner,sc-button a:focus .button-inner,sc-button button:hover .button-inner,sc-button button:focus .button-inner{-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.5) calc(var(--sc-highlight-dist-y) * 0.5) calc(30px * 0.5) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.5) calc(var(--sc-shadow-dist-y) * 0.5) calc(30px * 0.5) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.5) calc(var(--sc-highlight-dist-y) * 0.5) calc(30px * 0.5) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.5) calc(var(--sc-shadow-dist-y) * 0.5) calc(30px * 0.5) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.5) calc(var(--sc-highlight-dist-y) * 0.5) calc(1.875rem * 0.5) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.5) calc(var(--sc-shadow-dist-y) * 0.5) calc(1.875rem * 0.5) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.5) calc(var(--sc-highlight-dist-y) * 0.5) calc(1.875rem * 0.5) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.5) calc(var(--sc-shadow-dist-y) * 0.5) calc(1.875rem * 0.5) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2))}sc-button a:active .button-inner,sc-button button:active .button-inner{-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2))}sc-button.block{display:block}sc-button.block a,sc-button.block button{width:100%}sc-button.block a .button-inner,sc-button.block button .button-inner{width:100%;text-align:center;-ms-flex-pack:center;justify-content:center}sc-button.icon a,sc-button.icon button{width:var(--sc-button-icon-size);height:var(--sc-button-icon-size);padding:var(--sc-button-edge-width);font-size:calc(var(--sc-button-icon-size) * 0.4)}sc-button.icon a .button-inner,sc-button.icon button .button-inner{padding:0;width:100%;height:100%;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}sc-button.icon-text .button-inner{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}sc-button.bordered a,sc-button.bordered button{position:relative;padding:calc( var(--sc-button-edge-width) + var(--sc-button-bordered-border-width) )}sc-button.bordered a::before,sc-button.bordered button::before{content:"";position:absolute;top:calc(var(--sc-button-edge-width) - 1px);top:calc(var(--sc-button-edge-width) - 0.0625rem);left:calc(var(--sc-button-edge-width) - 1px);left:calc(var(--sc-button-edge-width) - 0.0625rem);bottom:calc(var(--sc-button-edge-width) - 1px);bottom:calc(var(--sc-button-edge-width) - 0.0625rem);right:calc(var(--sc-button-edge-width) - 1px);right:calc(var(--sc-button-edge-width) - 0.0625rem);border-radius:var(--sc-button-bordered-border-radius);background-image:-webkit-gradient(linear, left top, right bottom, color-stop(-10%, var(--sc-border-color, var(--sc-shadow-color, rgba(0, 0, 0, 0.2)))), color-stop(55%, var(--sc-highlight-color, rgba(255, 255, 255, 0.2)))), -webkit-gradient(linear, left top, right bottom, color-stop(55%, var(--sc-highlight-color, rgba(255, 255, 255, 0.2))), color-stop(70%, var(--sc-border-color, var(--sc-shadow-color, rgba(0, 0, 0, 0.2)))));background-image:linear-gradient(to bottom right, var(--sc-border-color, var(--sc-shadow-color, rgba(0, 0, 0, 0.2))) -10%, var(--sc-highlight-color, rgba(255, 255, 255, 0.2)) 55%), linear-gradient(to bottom right, var(--sc-highlight-color, rgba(255, 255, 255, 0.2)) 55%, var(--sc-border-color, var(--sc-shadow-color, rgba(0, 0, 0, 0.2))) 70%)}sc-button.bordered a .button-inner,sc-button.bordered button .button-inner{position:relative;background-color:var(--sc-button-bg-color);border-radius:calc(var(--sc-button-bordered-border-radius) - 1px);border-radius:calc(var(--sc-button-bordered-border-radius) - 0.0625rem)}sc-button.bordered.icon a,sc-button.bordered.icon button{--sc-button-bordered-border-radius:50%;line-height:calc( var(--sc-button-icon-size) - (var(--sc-button-edge-width) * 2) - var(--sc-button-bordered-border-width) - var(--sc-button-bordered-border-width) )}sc-button.circle a,sc-button.circle button{width:var(--sc-button-circle-size);height:var(--sc-button-circle-size);border-radius:50%;padding:var(--sc-button-edge-width)}sc-button.circle a::before,sc-button.circle button::before{border-radius:50%}sc-button.circle a .button-inner,sc-button.circle button .button-inner{padding:0;width:100%;height:100%;display:-ms-flexbox;display:flex;border-radius:50%}sc-button.circle.bordered a,sc-button.circle.bordered button{padding:calc( var(--sc-button-edge-width) + var(--sc-button-bordered-border-width) )}sc-button.active a,sc-button.active button{color:var(--sc-button-text-active-color)}sc-button.active a .button-inner,sc-button.active button .button-inner{-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2))}sc-button.disabled a,sc-button.disabled button{-webkit-box-shadow:none;box-shadow:none;color:#999}sc-button.disabled a:hover .button-inner,sc-button.disabled a:focus .button-inner,sc-button.disabled button:hover .button-inner,sc-button.disabled button:focus .button-inner{-webkit-box-shadow:none;box-shadow:none}';var ScButton=function(){function t(t){var a=this;registerInstance(this,t);this.focusEvent=createEvent(this,"focusEvent",7);this.blurEvent=createEvent(this,"blurEvent",7);this.clickEvent=createEvent(this,"clickEvent",7);this.disabled=false;this.block=false;this.icon=false;this.bordered=false;this.type="button";this.iconText=false;this.active=false;this.flat=false;this.circle=false;this.rayTracing=false;this.onFocus=function(){a.focusEvent.emit()};this.onBlur=function(){a.blurEvent.emit()};this.onClick=function(){a.clickEvent.emit()}}t.prototype.render=function(){var t=this,a=t.type,c=t.disabled,s=t.rel,i=t.target,r=t.href,o=t.icon,e=t.block,l=t.bordered,n=t.iconText,d=t.flat,g=t.circle;var v=r===undefined?"button":"a";var b=v==="button"?{type:a}:{download:this.download,href:r,rel:s,target:i};return h(Host,{"aria-disabled":c?"true":null,role:"button",class:{icon:o,block:e,bordered:l,"icon-text":n,flat:d,circle:g,disabled:c}},this.rayTracing&&h("sc-ray-tracer",{element:this.el}),h(v,Object.assign({},b,{disabled:c,onFocus:this.onFocus,onBlur:this.onBlur,onClick:this.onClick}),h("span",{class:"button-inner"},h("slot",{name:"start"}),h("slot",null),h("slot",{name:"end"}))))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();ScButton.style=scButtonCss;var scCardCss=":host{--sc-card-outer-padding-x:calc(var(--sc-root-spacing) * 4);--sc-card-outer-padding-y:calc(var(--sc-root-spacing) * 4);--sc-card-inner-padding-y:calc(var(--sc-root-spacing) * 2);--sc-card-bg-color:var(--sc-bg-color, #f1f1f1);--sc-card-title-font-size:calc(var(--sc-root-spacing) * 3);--sc-card-title-font-weight:700;--sc-card-title-text-color:var(--sc-text-color, #333333);--sc-card-subtitle-font-size:calc(var(--sc-root-spacing) * 2);--sc-card-subtitle-font-weight:400;--sc-card-subtitle-text-color:var(--sc-text-color, #696969);--sc-card-border-width:2px;--sc-card-border-width:0.125rem;--sc-card-media-width:100%;--sc-card-media-height:calc(var(--sc-root-spacing, 8px) * 20);--sc-card-media-height:calc(var(--sc-root-spacing, 0.5rem) * 20);--sc-card-media-height:calc(var(--sc-root-spacing, 8px) * 20);--sc-card-media-object-position:center;display:block;-webkit-box-shadow:calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));background:var(--sc-card-bg-color);border-radius:var(--sc-border-radius, 1em);overflow:hidden}:host a{display:block;color:currentColor;text-decoration:none;-webkit-transition:-webkit-box-shadow 0.3s ease;transition:-webkit-box-shadow 0.3s ease;transition:box-shadow 0.3s ease;transition:box-shadow 0.3s ease, -webkit-box-shadow 0.3s ease}:host a:hover,:host a:focus{border-radius:var(--sc-border-radius, 1em);-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2))}:host .card-inner{border-radius:var(--sc-border-radius, 1em);padding:var(--sc-card-outer-padding-y) var(--sc-card-outer-padding-x);overflow:auto}:host .card-inner .card-title-container{padding-bottom:var(--sc-card-inner-padding-y)}:host .card-inner .card-title-container .card-title{font-size:var(--sc-card-title-font-size);font-weight:var(--sc-card-title-font-weight);color:var(--sc-card-title-text-color);line-height:1.5}:host .card-inner .card-title-container .card-subtitle{font-size:var(--sc-card-subtitle-font-size);font-weight:var(--sc-card-subtitle-font-weight);color:var(--sc-card-subtitle-text-color);line-height:1.5}:host .card-media{overflow:hidden;-ms-flex-negative:0;flex-shrink:0;-ms-flex-preferred-size:40%;flex-basis:40%}:host .card-media ::slotted(*){width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:var(--sc-card-media-object-position);object-position:var(--sc-card-media-object-position)}:host([media-position]){display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host([media-position=top]){-ms-flex-direction:column;flex-direction:column}:host([media-position=top]) .card-inner{border-top-left-radius:0;border-top-right-radius:0}:host([media-position=top]) .card-media{width:100%;height:var(--sc-card-media-height)}:host([media-position=bottom]){-ms-flex-direction:column-reverse;flex-direction:column-reverse}:host([media-position=bottom]) .card-inner{border-bottom-left-radius:0;border-bottom-right-radius:0}:host([media-position=bottom]) .card-media{width:100%;height:var(--sc-card-media-height)}:host([media-position=left]){-ms-flex-direction:row;flex-direction:row;-ms-flex-align:stretch;align-items:stretch}:host([media-position=left]) .card-media{width:var(--sc-card-media-width)}:host([media-position=right]){-ms-flex-direction:row-reverse;flex-direction:row-reverse;-ms-flex-align:stretch;align-items:stretch}:host([media-position=right]) .card-media{width:var(--sc-card-media-width)}:host(.engraved){-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2))}:host(.hoverable):hover{-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(30px * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(30px * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 1) calc(var(--sc-highlight-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 1) calc(var(--sc-shadow-dist-y) * 1) calc(1.875rem * 1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2))}:host(.bordered){background-image:-webkit-gradient(linear, left top, right bottom, color-stop(-10%, var(--sc-border-color, var(--sc-shadow-color, rgba(0, 0, 0, 0.2)))), color-stop(55%, var(--sc-highlight-color, rgba(255, 255, 255, 0.2)))), -webkit-gradient(linear, left top, right bottom, color-stop(55%, var(--sc-highlight-color, rgba(255, 255, 255, 0.2))), color-stop(70%, var(--sc-border-color, var(--sc-shadow-color, rgba(0, 0, 0, 0.2)))));background-image:linear-gradient(to bottom right, var(--sc-border-color, var(--sc-shadow-color, rgba(0, 0, 0, 0.2))) -10%, var(--sc-highlight-color, rgba(255, 255, 255, 0.2)) 55%), linear-gradient(to bottom right, var(--sc-highlight-color, rgba(255, 255, 255, 0.2)) 55%, var(--sc-border-color, var(--sc-shadow-color, rgba(0, 0, 0, 0.2))) 70%);padding:var(--sc-card-border-width)}:host(.bordered) .card-inner{background-color:var(--sc-card-bg-color)}:host(.ray-tracing){-webkit-transition:-webkit-box-shadow 0.1s ease;transition:-webkit-box-shadow 0.1s ease;transition:box-shadow 0.1s ease;transition:box-shadow 0.1s ease, -webkit-box-shadow 0.1s ease}";var Card=function(){function t(t){registerInstance(this,t);this.engraved=false;this.bordered=false;this.mediaPosition=null;this.rayTracing=false}t.prototype.componentWillLoad=function(){this.hasCustomTitle=hasSlot(this.el,"custom-title");this.hasOverflowMenu=hasSlot(this.el,"overflow-menu");this.hasMedia=hasSlot(this.el,"media-content")};t.prototype.render=function(){var t=this,a=t.engraved,c=t.bordered;return h(Host,{class:{engraved:a,bordered:c}},this.rayTracing&&h("sc-ray-tracer",{element:this.el}),this.hasMedia&&h("div",{class:"card-media"},h("slot",{name:"media-content"})),h("div",{class:"card-inner"},h("div",{class:"overflow-menu"},h("slot",{name:"overflow-menu"})),this.hasCustomTitle||this.cardTitle||this.cardSubtitle?h("div",{class:"card-title-container"},this.hasCustomTitle?h("slot",{name:"custom-title"}):h("div",null,this.cardTitle&&h("div",{class:"card-title"},this.cardTitle),this.cardSubtitle&&h("div",{class:"card-subtitle"},this.cardSubtitle))):null,h("div",{class:"card-content"},h("slot",null))))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();Card.style=scCardCss;var commonjsGlobal=typeof globalThis!=="undefined"?globalThis:typeof window!=="undefined"?window:typeof global!=="undefined"?global:typeof self!=="undefined"?self:{};var FUNC_ERROR_TEXT="Expected a function";var NAN=0/0;var symbolTag="[object Symbol]";var reTrim=/^\s+|\s+$/g;var reIsBadHex=/^[-+]0x[0-9a-f]+$/i;var reIsBinary=/^0b[01]+$/i;var reIsOctal=/^0o[0-7]+$/i;var freeParseInt=parseInt;var freeGlobal=typeof commonjsGlobal=="object"&&commonjsGlobal&&commonjsGlobal.Object===Object&&commonjsGlobal;var freeSelf=typeof self=="object"&&self&&self.Object===Object&&self;var root=freeGlobal||freeSelf||Function("return this")();var objectProto=Object.prototype;var objectToString=objectProto.toString;var nativeMax=Math.max,nativeMin=Math.min;var now=function(){return root.Date.now()};function debounce(t,a,c){var s,i,r,o,e,l,n=0,h=false,d=false,g=true;if(typeof t!="function"){throw new TypeError(FUNC_ERROR_TEXT)}a=toNumber(a)||0;if(isObject(c)){h=!!c.leading;d="maxWait"in c;r=d?nativeMax(toNumber(c.maxWait)||0,a):r;g="trailing"in c?!!c.trailing:g}function v(a){var c=s,r=i;s=i=undefined;n=a;o=t.apply(r,c);return o}function b(t){n=t;e=setTimeout(w,a);return h?v(t):o}function u(t){var c=t-l,s=t-n,i=a-c;return d?nativeMin(i,r-s):i}function p(t){var c=t-l,s=t-n;return l===undefined||c>=a||c<0||d&&s>=r}function w(){var t=now();if(p(t)){return x(t)}e=setTimeout(w,u(t))}function x(t){e=undefined;if(g&&s){return v(t)}s=i=undefined;return o}function m(){if(e!==undefined){clearTimeout(e)}n=0;s=l=i=e=undefined}function f(){return e===undefined?o:x(now())}function y(){var t=now(),c=p(t);s=arguments;i=this;l=t;if(c){if(e===undefined){return b(l)}if(d){e=setTimeout(w,a);return v(l)}}if(e===undefined){e=setTimeout(w,a)}return o}y.cancel=m;y.flush=f;return y}function throttle(t,a,c){var s=true,i=true;if(typeof t!="function"){throw new TypeError(FUNC_ERROR_TEXT)}if(isObject(c)){s="leading"in c?!!c.leading:s;i="trailing"in c?!!c.trailing:i}return debounce(t,a,{leading:s,maxWait:a,trailing:i})}function isObject(t){var a=typeof t;return!!t&&(a=="object"||a=="function")}function isObjectLike(t){return!!t&&typeof t=="object"}function isSymbol(t){return typeof t=="symbol"||isObjectLike(t)&&objectToString.call(t)==symbolTag}function toNumber(t){if(typeof t=="number"){return t}if(isSymbol(t)){return NAN}if(isObject(t)){var a=typeof t.valueOf=="function"?t.valueOf():t;t=isObject(a)?a+"":a}if(typeof t!="string"){return t===0?t:+t}t=t.replace(reTrim,"");var c=reIsBinary.test(t);return c||reIsOctal.test(t)?freeParseInt(t.slice(2),c?2:8):reIsBadHex.test(t)?NAN:+t}var lodash_throttle=throttle;var scDialCss=":host{--sc-dial-angle:0deg;--sc-dial-size:80px;--sc-dial-size:5rem;display:inline-block;height:var(--sc-dial-size);width:var(--sc-dial-size);-webkit-box-shadow:calc(var(--sc-highlight-dist-x) * 0.6) calc(var(--sc-highlight-dist-y) * 0.6) calc(30px * 0.6) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 0.6) calc(var(--sc-shadow-dist-y) * 0.6) calc(30px * 0.6) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:calc(var(--sc-highlight-dist-x) * 0.6) calc(var(--sc-highlight-dist-y) * 0.6) calc(30px * 0.6) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 0.6) calc(var(--sc-shadow-dist-y) * 0.6) calc(30px * 0.6) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:calc(var(--sc-highlight-dist-x) * 0.6) calc(var(--sc-highlight-dist-y) * 0.6) calc(1.875rem * 0.6) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 0.6) calc(var(--sc-shadow-dist-y) * 0.6) calc(1.875rem * 0.6) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:calc(var(--sc-highlight-dist-x) * 0.6) calc(var(--sc-highlight-dist-y) * 0.6) calc(1.875rem * 0.6) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 0.6) calc(var(--sc-shadow-dist-y) * 0.6) calc(1.875rem * 0.6) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));border-radius:50%}:host .dial-circle{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:block;-webkit-transform:rotate(-180deg);transform:rotate(-180deg);position:relative;width:100%;height:100%;cursor:pointer}:host .dial-circle .temp{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%) rotate(180deg);transform:translate(-50%, -50%) rotate(180deg)}:host .dial-circle .pointer{position:absolute;border-radius:50%;top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(var(--sc-dial-angle));transform:rotate(var(--sc-dial-angle));will-change:transform}:host .dial-circle .pointer-circle{margin:20px;margin:1.25rem;width:30px;width:1.875rem;height:30px;height:1.875rem;border-radius:50%;-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.15) calc(var(--sc-highlight-dist-y) * 0.15) calc(30px * 0.15) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.15) calc(var(--sc-shadow-dist-y) * 0.15) calc(30px * 0.15) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.15) calc(var(--sc-highlight-dist-y) * 0.15) calc(30px * 0.15) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.15) calc(var(--sc-shadow-dist-y) * 0.15) calc(30px * 0.15) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.15) calc(var(--sc-highlight-dist-y) * 0.15) calc(1.875rem * 0.15) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.15) calc(var(--sc-shadow-dist-y) * 0.15) calc(1.875rem * 0.15) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.15) calc(var(--sc-highlight-dist-y) * 0.15) calc(1.875rem * 0.15) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.15) calc(var(--sc-shadow-dist-y) * 0.15) calc(1.875rem * 0.15) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));--sc-shadow-color:rgba(0, 0, 0, 0.5);-webkit-transform:rotate(calc(180deg - var(--sc-dial-angle)));transform:rotate(calc(180deg - var(--sc-dial-angle)))}";var ScDial=function(){function t(t){registerInstance(this,t);this.inputEvent=createEvent(this,"inputEvent",7);this.changeEvent=createEvent(this,"changeEvent",7);this.blurEvent=createEvent(this,"blurEvent",7);this.focusEvent=createEvent(this,"focusEvent",7);this.keyDownEvent=createEvent(this,"keyDownEvent",7);this.value=50;this.size=80;this.step=1;this.error="";this.focused=false;this.percent=0;this.rotation=0;this.cycles=0;this.reachedMax=false;this.reachedMin=false;this.mouseDirectionX=null;this.mouseDirectionY=null;this.mousePrevX=0;this.mousePrevY=0}t.prototype.setValue=function(t){return __awaiter(this,void 0,void 0,(function(){var a,c,s,i;return __generator(this,(function(r){a=this,c=a.min,s=a.max,i=a.step;if(!isNaN(c)&&t<=c){this.reachedMin=true;this.value=c;return[2]}if(!isNaN(s)&&t>=s){this.reachedMax=true;this.value=s;return[2]}this.value=Math.ceil(t/i)*i;return[2]}))}))};t.prototype.setRotationByValue=function(t){this.rotation=t%this.total/this.total*360};t.prototype.handleScroll=function(t){t.preventDefault();var a=-t.detail||t.wheelDeltaX;var c=-t.detail||t.wheelDeltaY;var s=a>0||c<0?1:a<0||c>0?-1:0;s<0?this.stepUp():this.stepDown()};t.prototype.componentDidLoad=function(){var t=this;var a=this.hostEl.getBoundingClientRect();var c=this,s=c.min,i=c.max,r=c.step;this.total=36*r;if(typeof s!=="undefined"&&typeof i!=="undefined"){this.total=i-s}this.oneStepDeg=r/this.total*360;this.centerX=Math.floor(a.left)+document.body.scrollLeft+a.width/2;this.centerY=Math.floor(a.top)+document.body.scrollTop+a.height/2;this.setValue(this.value);this.setRotationByValue(this.value);this.hostEl.addEventListener("mousewheel",(function(a){return t.handleScroll(a)}));this.hostEl.addEventListener("touchstart",(function(a){return t.handleMoveStart(a,"touchmove","touchend")}));this.hostEl.addEventListener("mousedown",(function(a){return t.handleMoveStart(a,"mousemove","mouseup")}))};t.prototype.disconnectedCallback=function(){this.hostEl.removeEventListener("mousewheel",this.handleScroll.bind(this))};t.prototype.handleMoveStart=function(t,a,c){var s=lodash_throttle(this.updateOnMove.bind(this),40);var i=document.body;var r=this.getDegFromPointer(t).deg;this.startingDeg=r;this.startingValue=this.value;i.addEventListener(a,s,false);i.addEventListener(c,(function(){i.removeEventListener(a,s,false)}),false)};t.prototype.getDegFromPointer=function(t){var a=t.changedTouches?t.changedTouches[0]:t;var c=a.pageX;var s=a.pageY;if(c<this.mousePrevX){this.mouseDirectionX="left"}if(c>this.mousePrevX){this.mouseDirectionX="right"}if(s<this.mousePrevY){this.mouseDirectionY="up"}if(s>this.mousePrevY){this.mouseDirectionY="down"}this.mousePrevX=c;this.mousePrevY=s;var i=this.centerX-c;var r=this.centerY-s;var o=Math.atan2(r,i);var e=o*180/Math.PI+90;if(e<0){e+=360}return{deg:e,x:c,y:s,diffX:i,diffY:r}};t.prototype.updateOnMove=function(t){t.preventDefault();var a=this.getDegFromPointer(t),c=a.deg,s=a.x,i=a.y,r=a.diffX,o=a.diffY;this.degDiff=c-this.startingDeg;console.log({x:s,y:i,diffX:r,diffY:o});if(this.degDiff>this.oneStepDeg){if(s>this.centerX&&i>this.centerY&&this.mouseDirectionX==="left"){console.log(this.mouseDirectionY);console.log("yo")}this.stepUp(this.degDiff)}if(this.degDiff<-1*this.oneStepDeg){this.stepDown(this.degDiff)}};t.prototype.valueDiff=function(t){return Math.floor(t/this.oneStepDeg)*this.step};t.prototype.stepUp=function(t){if(t===void 0){t=null}if(this.reachedMax){return}var a=t?this.startingValue+this.valueDiff(t):this.value+this.step;this.setValue(a);this.setRotationByValue(a);this.reachedMin=false};t.prototype.stepDown=function(t){if(t===void 0){t=null}if(this.reachedMin){return}var a=t?this.startingValue+this.valueDiff(t):this.value-this.step;this.setValue(a);this.setRotationByValue(a);this.reachedMax=false};t.prototype.render=function(){var t=this,a=t.value,c=t.size,s=t.rotation,i=t.reachedMax,r=t.reachedMin;return h(Host,{style:{"--sc-dial-size":c+"px"}},h("div",{class:"dial-circle"},h("div",{class:"pointer",style:{"--sc-dial-angle":s+"deg"}},h("div",{class:"pointer-circle"})),h("div",{class:"temp"},a,h("div",null,"max? ",i?"true":"false"),h("div",null,"min? ",r?"true":"false"))))};Object.defineProperty(t.prototype,"hostEl",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();ScDial.style=scDialCss;var validityMessages=function(t){return{badInput:"Bad input.",patternMismatch:"Invalid format.",rangeOverflow:"Value must be smaller than "+t.max,rangeUnderflow:"Value must be greater or equal to "+t.min+".",stepMismatch:"Please enter a valid number.",tooLong:"Please enter no more than "+t.maxlength+" characters.",tooShort:"Please enter at least "+t.minlength+" characters.",typeMismatch:"Please enter a valid "+t.type,valueMissing:"This field is required."}};var scInputCss="sc-input{--sc-input-border-radius:var(--sc-border-radius, 1em);--sc-input-padding-y:1em;--sc-input-padding-x:1em;--sc-input-bg-color:var(--sc-bg-color, #f6f6f8);--sc-input-text-color:var(--sc-text-color, #333333);--sc-input-font-size:1em;--sc-input-error-text-color:var(--sc-error-color, #f70d1a);--sc-input-radio-size:32px;--sc-input-radio-size:2rem;--sc-input-active-color:var(--sc-highlight-color, #c586c0);display:inline-block;vertical-align:middle}sc-input input{-webkit-transition:all var(--sc-animation-duration, 0.3s) var(--sc-animation-timing-function, ease);transition:all var(--sc-animation-duration, 0.3s) var(--sc-animation-timing-function, ease);outline:none;border:none;border-radius:var(--sc-input-border-radius);padding:var(--sc-input-padding-y) var(--sc-input-padding-x);background-color:var(--sc-input-bg-color);color:var(--sc-input-text-color);font-size:var(--sc-input-font-size);width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}sc-input input ::-moz-placeholder{color:currentColor}sc-input input :-ms-input-placeholder{color:currentColor}sc-input input ::-webkit-input-placeholder{color:currentColor}sc-input input ::-ms-input-placeholder{color:currentColor}sc-input input ::placeholder{color:currentColor}sc-input input:invalid{color:var(--sc-input-error-text-color)}sc-input.has-error input{border:1px solid var(--sc-input-error-text-color);border:0.0625rem solid var(--sc-input-error-text-color)}sc-input.has-error .error-message{padding:4px var(--sc-input-padding-x);padding:0.25rem var(--sc-input-padding-x);color:var(--sc-input-error-text-color)}sc-input.block{display:block;width:100%}sc-input[type=radio]{border-radius:50%;position:relative}sc-input[type=radio] input,sc-input[type=radio] label{cursor:pointer}sc-input[type=radio][disabled] input,sc-input[type=radio][disabled] label{cursor:not-allowed}sc-input[type=radio] .after{--sc-input-radio-active-dot-gap:calc(var(--sc-input-radio-size) * 0.25);--sc-input-radio-active-dot-size:calc(\n var(--sc-input-radio-size) - (var(--sc-input-radio-active-dot-gap) * 2)\n );position:absolute;opacity:0;top:var(--sc-input-radio-active-dot-gap);right:var(--sc-input-radio-active-dot-gap);width:var(--sc-input-radio-active-dot-size);height:var(--sc-input-radio-active-dot-size);background:var(--sc-input-active-color);border-radius:50%;-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.1) calc(var(--sc-highlight-dist-y) * 0.1) calc(30px * 0.1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.1) calc(var(--sc-shadow-dist-y) * 0.1) calc(30px * 0.1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.1) calc(var(--sc-highlight-dist-y) * 0.1) calc(30px * 0.1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.1) calc(var(--sc-shadow-dist-y) * 0.1) calc(30px * 0.1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.1) calc(var(--sc-highlight-dist-y) * 0.1) calc(1.875rem * 0.1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.1) calc(var(--sc-shadow-dist-y) * 0.1) calc(1.875rem * 0.1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:inset calc(var(--sc-highlight-dist-x) * 0.1) calc(var(--sc-highlight-dist-y) * 0.1) calc(1.875rem * 0.1) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), inset calc(var(--sc-shadow-dist-x) * 0.1) calc(var(--sc-shadow-dist-y) * 0.1) calc(1.875rem * 0.1) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-transition:opacity var(--sc-animation-duration, 0.3s) var(--sc-animation-timing-function, ease);transition:opacity var(--sc-animation-duration, 0.3s) var(--sc-animation-timing-function, ease);pointer-events:none}sc-input[type=radio] input{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-shadow:calc(var(--sc-highlight-dist-x) * 0.2) calc(var(--sc-highlight-dist-y) * 0.2) calc(30px * 0.2) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 0.2) calc(var(--sc-shadow-dist-y) * 0.2) calc(30px * 0.2) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:calc(var(--sc-highlight-dist-x) * 0.2) calc(var(--sc-highlight-dist-y) * 0.2) calc(30px * 0.2) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 0.2) calc(var(--sc-shadow-dist-y) * 0.2) calc(30px * 0.2) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));-webkit-box-shadow:calc(var(--sc-highlight-dist-x) * 0.2) calc(var(--sc-highlight-dist-y) * 0.2) calc(1.875rem * 0.2) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 0.2) calc(var(--sc-shadow-dist-y) * 0.2) calc(1.875rem * 0.2) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));box-shadow:calc(var(--sc-highlight-dist-x) * 0.2) calc(var(--sc-highlight-dist-y) * 0.2) calc(1.875rem * 0.2) 0 var(--sc-highlight-color, rgba(255, 255, 255, 0.2)), calc(var(--sc-shadow-dist-x) * 0.2) calc(var(--sc-shadow-dist-y) * 0.2) calc(1.875rem * 0.2) 0 var(--sc-shadow-color, rgba(0, 0, 0, 0.2));margin:0;padding:0;width:var(--sc-input-radio-size, 1em);height:var(--sc-input-radio-size, 1em);vertical-align:middle}sc-input[type=radio] input:checked~.after{opacity:1}sc-input[type=range]{-webkit-appearance:none;width:100%;background:transparent;}";var Input=function(){function t(t){var a=this;registerInstance(this,t);this.inputEvent=createEvent(this,"inputEvent",7);this.changeEvent=createEvent(this,"changeEvent",7);this