@clevercloud/components - npm Package Compare versions

Comparing version 1.0.5 to 1.0.6

CHANGELOG.md

 # Clever Components changelog
 
+## 1.0.6 (2019-07-10)
+
+- cc-input-text: update monospace font
+
 ## 1.0.5 (2019-07-10)
@@ -4,0 +8,0 @@

dist/atoms/cc-input-text.js

@@ -1,2 +0,2 @@
-import{css as e,html as t,LitElement as i}from"lit-element";import{classMap as o}from"lit-html/directives/class-map.js";import{dispatchCustomEvent as s}from"../lib/events.js";import{pulse as n}from"../styles/animations.js";export class CcInputText extends i{static get properties(){return{disabled:{type:Boolean},readonly:{type:Boolean},skeleton:{type:Boolean},multi:{type:Boolean},value:{type:String},name:{type:String},placeholder:{type:String}}}constructor(){super(),this.name="",this.value="",this.placeholder=""}focus(){this.shadowRoot.querySelector(".input").focus()}t(e){this.value=e.target.value,s(this,"input",this.value)}i(e){this.readonly&&e.target.select()}o(e){e.stopPropagation()}render(){const e=(this.value||"").split("\n").length;return this.multi?t`<textarea class="${o({input:!0,skeleton:this.skeleton})}" style="--rows:${e}" rows="${e}" ?disabled="${this.disabled||this.skeleton}" ?readonly="${this.readonly}" .value="${this.value}" name="${this.name}" placeholder="${this.placeholder}" @input="${this.t}" @focus="${this.i}" spellcheck="false" @keydown="${this.o}" @keypress="${this.o}"></textarea>`:t`<input type="text" class="${o({input:!0,skeleton:this.skeleton})}" ?disabled="${this.disabled||this.skeleton}" ?readonly="${this.readonly}" .value="${this.value}" name="${this.name}" placeholder="${this.placeholder}" @input="${this.t}" @focus="${this.i}" spellcheck="false" @keydown="${this.o}" @keypress="${this.o}">`}static get styles(){return[n,e`:host{display:inline-block;box-sizing:border-box;padding:.2rem;vertical-align:top}:host([multi]){display:block}:host([skeleton]){cursor:progress}.input{background:#fff;border:1px solid #aaa;box-sizing:border-box;display:block;font-family:monospace;font-size:14px;margin:0;padding:.15rem .5rem;resize:none;width:100%;border-radius:.25rem;height:2rem;line-height:1.7rem;overflow:hidden;box-shadow:0 0 0 0 rgba(255,255,255,0);transition:75ms ease-in-out,height}.input:focus{box-shadow:0 0 0 .2em rgba(50,115,220,.25);border-color:#777;outline:0}.input:hover{border-color:#777}.input:active{outline:0}.input[disabled]{background:#eee;border-color:#eee;cursor:default;opacity:.75;pointer-events:none}.input[readonly]{background:#eee}.input.skeleton{animation-direction:alternate;animation-duration:.5s;animation-iteration-count:infinite;animation-name:pulse;background:#eee;border-color:#eee;color:transparent}.input.skeleton::placeholder{color:transparent}.input[rows]{height:calc(calc(calc(var(--rows,1) * 1.7rem) + .3rem) + 2px);white-space:pre}.input[rows="1"]{height:2rem}`]}}window.customElements.define("cc-input-text",CcInputText);
+import{css as e,html as t,LitElement as i}from"lit-element";import{classMap as o}from"lit-html/directives/class-map.js";import{dispatchCustomEvent as s}from"../lib/events.js";import{pulse as n}from"../styles/animations.js";export class CcInputText extends i{static get properties(){return{disabled:{type:Boolean},readonly:{type:Boolean},skeleton:{type:Boolean},multi:{type:Boolean},value:{type:String},name:{type:String},placeholder:{type:String}}}constructor(){super(),this.name="",this.value="",this.placeholder=""}focus(){this.shadowRoot.querySelector(".input").focus()}t(e){this.value=e.target.value,s(this,"input",this.value)}i(e){this.readonly&&e.target.select()}o(e){e.stopPropagation()}render(){const e=(this.value||"").split("\n").length;return this.multi?t`<textarea class="${o({input:!0,skeleton:this.skeleton})}" style="--rows:${e}" rows="${e}" ?disabled="${this.disabled||this.skeleton}" ?readonly="${this.readonly}" .value="${this.value}" name="${this.name}" placeholder="${this.placeholder}" @input="${this.t}" @focus="${this.i}" spellcheck="false" @keydown="${this.o}" @keypress="${this.o}"></textarea>`:t`<input type="text" class="${o({input:!0,skeleton:this.skeleton})}" ?disabled="${this.disabled||this.skeleton}" ?readonly="${this.readonly}" .value="${this.value}" name="${this.name}" placeholder="${this.placeholder}" @input="${this.t}" @focus="${this.i}" spellcheck="false" @keydown="${this.o}" @keypress="${this.o}">`}static get styles(){return[n,e`:host{display:inline-block;box-sizing:border-box;padding:.2rem;vertical-align:top}:host([multi]){display:block}:host([skeleton]){cursor:progress}.input{background:#fff;border:1px solid #aaa;box-sizing:border-box;display:block;font-family:SourceCodePro,monaco,monospace;font-size:14px;margin:0;padding:.15rem .5rem;resize:none;width:100%;border-radius:.25rem;height:2rem;line-height:1.7rem;overflow:hidden;box-shadow:0 0 0 0 rgba(255,255,255,0);transition:75ms ease-in-out,height}.input:focus{box-shadow:0 0 0 .2em rgba(50,115,220,.25);border-color:#777;outline:0}.input:hover{border-color:#777}.input:active{outline:0}.input[disabled]{background:#eee;border-color:#eee;cursor:default;opacity:.75;pointer-events:none}.input[readonly]{background:#eee}.input.skeleton{animation-direction:alternate;animation-duration:.5s;animation-iteration-count:infinite;animation-name:pulse;background:#eee;border-color:#eee;color:transparent}.input.skeleton::placeholder{color:transparent}.input[rows]{height:calc(calc(calc(var(--rows,1) * 1.7rem) + .3rem) + 2px);white-space:pre}.input[rows="1"]{height:2rem}`]}}window.customElements.define("cc-input-text",CcInputText);
 //# sourceMappingURL=cc-input-text.js.map

package.json

 {
   "name": "@clevercloud/components",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "This is a Work In Progress to introduce Web Components in our Clever Cloud Web based UIs.",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

No alert changes

Improved metrics

Total package byte prevSize

120672

increased by0.1%

Lines of code

123

increased by0.82%

No dependency changes