@duetds/components
Version:
This package includes Duet Core Components and related tools.
1 lines • 12.9 kB
JavaScript
var __awaiter=this&&this.__awaiter||function(e,t,i,n){function r(e){return e instanceof i?e:new i((function(t){t(e)}))}return new(i||(i=Promise))((function(i,s){function a(e){try{o(n.next(e))}catch(t){s(t)}}function l(e){try{o(n["throw"](e))}catch(t){s(t)}}function o(e){e.done?i(e.value):r(e.value).then(a,l)}o((n=n.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var i={label:0,sent:function(){if(s[0]&1)throw s[1];return s[1]},trys:[],ops:[]},n,r,s,a;return a={next:l(0),throw:l(1),return:l(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function l(e){return function(t){return o([e,t])}}function o(a){if(n)throw new TypeError("Generator is already executing.");while(i)try{if(n=1,r&&(s=a[0]&2?r["return"]:a[0]?r["throw"]||((s=r["return"])&&s.call(r),0):r.next)&&!(s=s.call(r,a[1])).done)return s;if(r=0,s)a=[a[0]&2,s.value];switch(a[0]){case 0:case 1:s=a;break;case 4:i.label++;return{value:a[1],done:false};case 5:i.label++;r=a[1];a=[0];continue;case 7:a=i.ops.pop();i.trys.pop();continue;default:if(!(s=i.trys,s=s.length>0&&s[s.length-1])&&(a[0]===6||a[0]===2)){i=0;continue}if(a[0]===3&&(!s||a[1]>s[0]&&a[1]<s[3])){i.label=a[1];break}if(a[0]===6&&i.label<s[1]){i.label=s[1];s=a;break}if(s&&i.label<s[2]){i.label=s[2];i.ops.push(a);break}if(s[2])i.ops.pop();i.trys.pop();continue}a=t.call(e,i)}catch(l){a=[6,l];r=0}finally{n=s=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};System.register(["./p-2c514bc6.system.js","./p-e008225b.system.js"],(function(e){"use strict";var t,i,n,r,s,a;return{setters:[function(e){t=e.r;i=e.d;n=e.h;r=e.H;s=e.c},function(e){a=e.a}],execute:function(){var l=e("duet_select",function(){function e(e){var n=this;t(this,e);this.selectId=a("DuetSelect");this.errorId=a("DuetError");this.labelId=a("DuetLabel");this.margin="auto";this.error="";this.expand=false;this.theme="";this.labelHidden=false;this.disabled=false;this.label="label";this.tooltip="";this.onClick=function(e){e.stopPropagation()};this.onChange=function(e){var t=n.element.querySelector("select").value;n.value=t;n.duetChange.emit({originalEvent:e,value:n.value,component:"duet-select"})};this.onFocus=function(){n.duetFocus.emit()};this.onBlur=function(){n.duetBlur.emit()};this.duetChange=i(this,"duetChange",3);this.duetFocus=i(this,"duetFocus",7);this.duetBlur=i(this,"duetBlur",7)}e.prototype.valueChanged=function(e){this.duetChange.emit({originalEvent:e,value:this.value,component:"duet-select"})};e.prototype.componentWillLoad=function(){if(this.theme!=="default"&&document.documentElement.classList.contains("duet-theme-turva")){this.theme="turva"}};e.prototype.getSelectedItemLabel=function(){var e=this;if(!this.hasValidItems()){return""}var t=this.items.find((function(t){return t["value"]+""===e.value}));if(!t){return""}return t["label"]};e.prototype.hasValidItems=function(){return Array.isArray(this.items)};e.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){var e;return __generator(this,(function(t){e=this.element.querySelector("select");if(e){e.focus()}return[2]}))}))};e.prototype.render=function(){if(this.expand){this.element.classList.add("duet-expand")}var e=this.identifier||this.selectId;var t=""+this.value;return n(r,{onClick:this.onClick,class:{"duet-m-0":this.margin==="none"}},n("div",{class:{"duet-select-container":true,"duet-label-hidden":this.labelHidden,"duet-theme-turva":this.theme==="turva","has-error":this.error!==""}},n("duet-label",{theme:this.theme==="turva"?"turva":"default",id:this.labelId,for:e},this.label),this.tooltip!==""?n("duet-tooltip",null,this.tooltip):"",n("div",{class:"duet-select-wrapper"},n("select",{disabled:this.disabled,name:this.name,id:e,role:this.role,"aria-labelledby":this.labelId+" "+this.errorId,"aria-controls":this.accessibleControls,"aria-active-descendant":this.accessibleActiveDescendant,"aria-owns":this.accessibleOwns,onFocus:this.onFocus,onBlur:this.onBlur,onChange:this.onChange},!this.hasValidItems()?n("option",null,"No options available"):this.items.map((function(e){return n("option",{value:e["value"],selected:t===e["value"]?true:false},e["label"])}))),n("div",{class:"duet-select","aria-hidden":"true"},this.getSelectedItemLabel(),n("svg",{role:"img",class:"duet-select-icon",fill:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg"},n("path",{d:"m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z"})))),n("span",{class:"duet-select-help",id:this.errorId,"aria-live":"assertive","aria-relevant":"additions removals"},this.error!==""?n("span",null,this.error):"")))};Object.defineProperty(e.prototype,"element",{get:function(){return s(this)},enumerable:true,configurable:true});Object.defineProperty(e,"style",{get:function(){return"\@charset \"UTF-8\";.sc-duet-select-h{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;padding:0;margin:0;margin-right:16px!important;margin-bottom:12px!important;display:-ms-inline-flexbox;display:inline-flex;vertical-align:bottom;max-width:100%;width:100%}.sc-duet-select-h:last-child, .sc-duet-select-h:last-of-type{margin-right:0!important}\@media only screen and (min-width:36em){.sc-duet-select-h{width:calc(50% - 16px - 3px)}.duet-expand.sc-duet-select-h{width:100%!important}}.duet-m-0.sc-duet-select-h{margin:0!important}duet-tooltip.sc-duet-select{position:absolute;top:12px;right:0}\@media only screen and (min-width:48em){duet-tooltip.sc-duet-select{position:relative;top:4px;right:auto}}.duet-select-container.sc-duet-select{padding:0}.duet-select-container.sc-duet-select, .duet-select-wrapper.sc-duet-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;margin:0;position:relative;width:100%}.duet-select-wrapper.sc-duet-select{padding:0;padding:16px!important;font-family:localtapiola-sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;font-size:1rem;font-weight:400;line-height:1.25}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select{font-family:turva-sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol}.duet-select-wrapper.sc-duet-select:after{content:\" \"}.duet-select-wrapper.sc-duet-select select.sc-duet-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;top:0;left:0;margin:0;right:0;bottom:0;padding:0;position:absolute;font-size:1rem;font-family:localtapiola-sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;z-index:200;border:0;height:100%;width:100%;cursor:pointer;outline:none;opacity:0}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select{font-family:turva-sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol}.duet-select-wrapper.sc-duet-select select.sc-duet-select:hover + .duet-select.sc-duet-select{border-color:#909599;-webkit-box-shadow:0 0 0 1px #909599;box-shadow:0 0 0 1px #909599}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover + .duet-select.sc-duet-select{border-color:#757575;-webkit-box-shadow:0 0 0 1px #757575;box-shadow:0 0 0 1px #757575}.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover + .duet-select.sc-duet-select{-webkit-box-shadow:0 0 0 1px #de2362;box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover + .duet-select.sc-duet-select{-webkit-box-shadow:0 0 0 1px #e02a0d;box-shadow:0 0 0 1px #e02a0d}.duet-select-wrapper.sc-duet-select select.sc-duet-select:focus + .duet-select.sc-duet-select{-webkit-transition:none;transition:none;border-color:#0077b3;-webkit-box-shadow:0 0 0 1px #0077b3;box-shadow:0 0 0 1px #0077b3;outline:0}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus + .duet-select.sc-duet-select{border-color:#111;-webkit-box-shadow:0 0 0 1px #111;box-shadow:0 0 0 1px #111}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus + .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#111}.duet-select-wrapper.sc-duet-select select.sc-duet-select:focus + .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#0077b3}.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus + .duet-select.sc-duet-select{-webkit-box-shadow:0 0 0 1px #de2362;box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus + .duet-select.sc-duet-select{-webkit-box-shadow:0 0 0 1px #e02a0d;box-shadow:0 0 0 1px #e02a0d}.duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select{cursor:not-allowed!important}.duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select + .duet-select.sc-duet-select{cursor:not-allowed!important;border-color:#f5f8fa!important;background:#f5f8fa!important;color:#657787!important;-webkit-text-fill-color:#657787!important;opacity:1!important}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select + .duet-select.sc-duet-select{border-color:#f7f7f7!important;background:#f7f7f7!important;color:#757575!important;-webkit-text-fill-color:#757575!important}.duet-select.sc-duet-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;padding:0;margin:0;padding:15px!important;position:absolute;text-align:left;left:0;top:0;bottom:0;right:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-variant-numeric:tabular-nums;font-family:localtapiola-sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;border:1px solid #909599;border-radius:4px;font-size:1rem;background:#fff;color:#00294d;font-weight:400;line-height:1.25;-webkit-transition:.15s ease;transition:.15s ease;z-index:100;min-width:8rem;width:100%;display:block}.has-error.sc-duet-select .duet-select.sc-duet-select{border-color:#de2362!important}.has-error.sc-duet-select .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#de2362!important}.duet-theme-turva.has-error.sc-duet-select .duet-select.sc-duet-select{border-color:#e02a0d!important}.duet-theme-turva.has-error.sc-duet-select .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#e02a0d!important}.duet-theme-turva.sc-duet-select .duet-select.sc-duet-select{color:#111;font-family:turva-sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;border-color:#757575}.duet-select-help.sc-duet-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;padding:0;margin:0;font-family:localtapiola-sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;border-radius:4px;font-size:.875rem;color:#657787;font-weight:400;line-height:1.25;display:block}.duet-select-help.sc-duet-select span.sc-duet-select{display:block;margin-top:8px}.duet-theme-turva.sc-duet-select .duet-select-help.sc-duet-select{color:#757575}.has-error.sc-duet-select .duet-select-help.sc-duet-select{color:#de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-help.sc-duet-select{color:#e02a0d}.duet-select.sc-duet-select svg.sc-duet-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;padding:0;margin:0;pointer-events:none;z-index:200;width:20px;height:20px;color:#00294d;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);right:16px}.duet-theme-turva.sc-duet-select .duet-select.sc-duet-select svg.sc-duet-select{color:#111}.duet-label-hidden.sc-duet-select duet-label.sc-duet-select{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}"},enumerable:true,configurable:true});return e}())}}}));