@duetds/components
Version:
This package includes Duet Core Components and related tools.
1 lines • 10.3 kB
JavaScript
var __awaiter=this&&this.__awaiter||function(e,t,n,i){function r(e){return e instanceof n?e:new n((function(t){t(e)}))}return new(n||(n=Promise))((function(n,a){function u(e){try{o(i.next(e))}catch(t){a(t)}}function s(e){try{o(i["throw"](e))}catch(t){a(t)}}function o(e){e.done?n(e.value):r(e.value).then(u,s)}o((i=i.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var n={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},i,r,a,u;return u={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(u[Symbol.iterator]=function(){return this}),u;function s(e){return function(t){return o([e,t])}}function o(u){if(i)throw new TypeError("Generator is already executing.");while(n)try{if(i=1,r&&(a=u[0]&2?r["return"]:u[0]?r["throw"]||((a=r["return"])&&a.call(r),0):r.next)&&!(a=a.call(r,u[1])).done)return a;if(r=0,a)u=[u[0]&2,a.value];switch(u[0]){case 0:case 1:a=u;break;case 4:n.label++;return{value:u[1],done:false};case 5:n.label++;r=u[1];u=[0];continue;case 7:u=n.ops.pop();n.trys.pop();continue;default:if(!(a=n.trys,a=a.length>0&&a[a.length-1])&&(u[0]===6||u[0]===2)){n=0;continue}if(u[0]===3&&(!a||u[1]>a[0]&&u[1]<a[3])){n.label=u[1];break}if(u[0]===6&&n.label<a[1]){n.label=a[1];a=u;break}if(a&&n.label<a[2]){n.label=a[2];n.ops.push(u);break}if(a[2])n.ops.pop();n.trys.pop();continue}u=t.call(e,n)}catch(s){u=[6,s];r=0}finally{i=a=0}if(u[0]&5)throw u[1];return{value:u[0]?u[1]:void 0,done:true}}};System.register(["./p-2c514bc6.system.js","./p-e008225b.system.js"],(function(e){"use strict";var t,n,i,r,a,u,s;return{setters:[function(e){t=e.r;n=e.d;i=e.h;r=e.H;a=e.c},function(e){u=e.a;s=e.c}],execute:function(){var o=e("duet_textarea",function(){function e(e){var i=this;t(this,e);this.textareaId=u("DuetTextarea");this.labelId=u("DuetLabel");this.errorId=u("DuetError");this.margin="auto";this.debounce=0;this.theme="";this.expand=false;this.disabled=false;this.required=false;this.label="label";this.labelHidden=false;this.error="";this.tooltip="";this.onInput=function(e){var t=e.target;if(t){i.value=t.value||""}i.duetInput.emit(e)};this.onBlur=function(){i.duetBlur.emit()};this.onFocus=function(){i.duetFocus.emit()};this.duetInput=n(this,"duetInput",7);this.duetChange=n(this,"duetChange",3);this.duetBlur=n(this,"duetBlur",7);this.duetFocus=n(this,"duetFocus",7)}e.prototype.debounceChanged=function(){this.duetChange=s(this.duetChange,this.debounce)};e.prototype.valueChanged=function(){this.duetChange.emit({value:this.value,component:"duet-textarea"})};e.prototype.componentWillLoad=function(){if(this.theme!=="default"&&document.documentElement.classList.contains("duet-theme-turva")){this.theme="turva"}};e.prototype.componentDidLoad=function(){this.debounceChanged()};e.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){var e;return __generator(this,(function(t){e=this.element.querySelector("textarea");if(e){e.focus()}return[2]}))}))};e.prototype.render=function(){if(this.expand){this.element.classList.add("duet-expand")}var e=this.identifier||this.textareaId;return i(r,{class:{"duet-m-0":this.margin==="none"}},i("div",{class:{"duet-textarea-container":true,"duet-theme-turva":this.theme==="turva","duet-label-hidden":this.labelHidden,"has-error":this.error!==""}},i("duet-label",{theme:this.theme==="turva"?"turva":"default",id:this.labelId,for:e},this.label),this.tooltip!==""?i("duet-tooltip",null,this.tooltip):"",i("textarea",{onInput:this.onInput,onBlur:this.onBlur,onFocus:this.onFocus,class:{"duet-textarea":true,disabled:this.disabled},value:this.value,disabled:this.disabled,"aria-labelledby":this.labelId+" "+this.errorId,"aria-controls":this.accessibleControls,"aria-autocomplete":this.accessibleAutocomplete,"aria-active-descendant":this.accessibleActiveDescendant,"aria-owns":this.accessibleOwns,placeholder:this.placeholder,spellcheck:"false",required:this.required,minlength:this.minlength,maxlength:this.maxlength,role:this.role,name:this.name,id:e}),i("span",{class:"duet-textarea-help",id:this.errorId,"aria-live":"assertive","aria-relevant":"additions removals"},this.error!==""?i("span",null,this.error):"")))};Object.defineProperty(e.prototype,"element",{get:function(){return a(this)},enumerable:true,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{debounce:["debounceChanged"],value:["valueChanged"]}},enumerable:true,configurable:true});Object.defineProperty(e,"style",{get:function(){return".sc-duet-textarea-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;text-align:left;max-width:100%;width:100%}.sc-duet-textarea-h:last-child, .sc-duet-textarea-h:last-of-type{margin-right:0!important}\@media only screen and (min-width:36em){.sc-duet-textarea-h{width:calc(50% - 16px - 3px)}.duet-expand.sc-duet-textarea-h{width:100%!important}}.duet-m-0.sc-duet-textarea-h{margin:0!important}duet-tooltip.sc-duet-textarea{position:absolute;top:8px;right:0}\@media only screen and (min-width:48em){duet-tooltip.sc-duet-textarea{position:relative;top:4px;right:auto}}.duet-textarea.sc-duet-textarea{-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;-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;min-height:160px;resize:vertical;width:100%;position:relative;display:block}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea{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;color:#111}.duet-textarea-container.sc-duet-textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;background:transparent;border:0;padding:0;margin:0;position:relative;width:100%;height:100%}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea{border-color:#de2362!important}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea{border-color:#e02a0d!important}.duet-textarea-help.sc-duet-textarea{-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-textarea-help.sc-duet-textarea span.sc-duet-textarea{display:block;margin-top:8px}.duet-theme-turva.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{color:#757575}.has-error.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{color:#de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{color:#e02a0d}.duet-textarea.sc-duet-textarea::-webkit-input-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea::-webkit-input-placeholder{color:#d1d1d1}.duet-textarea.sc-duet-textarea::-moz-placeholder{color:#cfd2d4;opacity:1!important}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea::-moz-placeholder{color:#d1d1d1}.duet-textarea.sc-duet-textarea:-ms-input-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:-ms-input-placeholder{color:#d1d1d1}.duet-textarea.disabled.sc-duet-textarea, .duet-textarea[disabled].sc-duet-textarea{cursor:not-allowed!important;border-color:#f5f8fa!important;background:#f5f8fa!important;color:#657787!important}.duet-theme-turva.sc-duet-textarea .duet-textarea.disabled.sc-duet-textarea, .duet-theme-turva.sc-duet-textarea .duet-textarea[disabled].sc-duet-textarea{border-color:#f7f7f7!important;background:#f7f7f7!important;color:#757575!important}.duet-textarea.sc-duet-textarea:hover{-webkit-box-shadow:0 0 0 1px #909599;box-shadow:0 0 0 1px #909599}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover{-webkit-box-shadow:0 0 0 1px #757575;box-shadow:0 0 0 1px #757575}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover{-webkit-box-shadow:0 0 0 1px #de2362;box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover{-webkit-box-shadow:0 0 0 1px #e02a0d;box-shadow:0 0 0 1px #e02a0d}.duet-textarea.sc-duet-textarea:focus{-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-textarea .duet-textarea.sc-duet-textarea:focus{border-color:#111;-webkit-box-shadow:0 0 0 1px #111;box-shadow:0 0 0 1px #111}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{-webkit-box-shadow:0 0 0 1px #de2362;box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{-webkit-box-shadow:0 0 0 1px #e02a0d;box-shadow:0 0 0 1px #e02a0d}.duet-textarea.sc-duet-textarea:not(:placeholder-shown):focus:required:invalid{border-color:#de2362}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:not(:placeholder-shown):focus:required:invalid{border-color:#e02a0d}.duet-textarea.sc-duet-textarea:focus:required:valid{border-color:#0077b3}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus:required:valid{border-color:#111}.duet-label-hidden.sc-duet-textarea duet-label.sc-duet-textarea{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}())}}}));