@spectrum-web-components/textfield - npm Package Compare versions

Comparing version 0.42.4 to 0.42.5

custom-elements.json

@@ -388,2 +388,12 @@ {
               "kind": "method",
+              "name": "handleInputElementPointerdown",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
               "name": "renderStateIcons",
@@ -1134,2 +1144,16 @@ "privacy": "protected",
               "kind": "method",
+              "name": "handleInputElementPointerdown",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "inheritedFrom": {
+                "name": "TextfieldBase",
+                "module": "src/Textfield.js"
+              }
+            },
+            {
+              "kind": "method",
               "name": "renderStateIcons",
@@ -1136,0 +1160,0 @@ "privacy": "protected",

package.json

 {
     "name": "@spectrum-web-components/textfield",
-    "version": "0.42.4",
+    "version": "0.42.5",
     "publishConfig": {
@@ -60,8 +60,8 @@ "access": "public"
     "dependencies": {
-        "@spectrum-web-components/base": "^0.42.4",
-        "@spectrum-web-components/help-text": "^0.42.4",
-        "@spectrum-web-components/icon": "^0.42.4",
-        "@spectrum-web-components/icons-ui": "^0.42.4",
-        "@spectrum-web-components/icons-workflow": "^0.42.4",
-        "@spectrum-web-components/shared": "^0.42.4"
+        "@spectrum-web-components/base": "^0.42.5",
+        "@spectrum-web-components/help-text": "^0.42.5",
+        "@spectrum-web-components/icon": "^0.42.5",
+        "@spectrum-web-components/icons-ui": "^0.42.5",
+        "@spectrum-web-components/icons-workflow": "^0.42.5",
+        "@spectrum-web-components/shared": "^0.42.5"
     },
@@ -77,3 +77,3 @@ "devDependencies": {
     ],
-    "gitHead": "4924ffd06681ced537edaed873a9ce8b42cf155c"
+    "gitHead": "f29fd737947945de8cd6f5bc03fb389d386c9c3a"
 }

src/Textfield.d.ts

@@ -124,2 +124,3 @@ import { CSSResultArray, nothing, PropertyValues, TemplateResult } from '@spectrum-web-components/base';
     protected onBlur(_event: FocusEvent): void;
+    protected handleInputElementPointerdown(): void;
     protected renderStateIcons(): TemplateResult | typeof nothing;
@@ -126,0 +127,0 @@ protected get displayValue(): string;

src/Textfield.dev.js

@@ -136,2 +136,4 @@ "use strict";
   }
+  handleInputElementPointerdown() {
+  }
   renderStateIcons() {
@@ -213,2 +215,3 @@ if (this.invalid) {
                 @input=${this.handleInput}
+                @pointerdown=${this.handleInputElementPointerdown}
                 @focus=${this.onFocus}
@@ -215,0 +218,0 @@ @blur=${this.onBlur}

src/Textfield.js

@@ -1,2 +0,2 @@
-"use strict";var c=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var t=(p,a,e,l)=>{for(var r=l>1?void 0:l?m(a,e):a,u=p.length-1,h;u>=0;u--)(h=p[u])&&(r=(l?h(a,e,r):h(r))||r);return l&&r&&c(a,e,r),r};import{html as s,nothing as o,SizedMixin as v}from"@spectrum-web-components/base";import{ifDefined as n,live as y}from"@spectrum-web-components/base/src/directives.js";import{property as i,query as b,state as d}from"@spectrum-web-components/base/src/decorators.js";import{ManageHelpText as g}from"@spectrum-web-components/help-text/src/manage-help-text.js";import{Focusable as f}from"@spectrum-web-components/shared/src/focusable.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-checkmark100.js";import"@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js";import $ from"./textfield.css.js";import E from"@spectrum-web-components/icon/src/spectrum-icon-checkmark.css.js";const S=["text","url","tel","email","password"];export class TextfieldBase extends g(v(f,{noDefaultSize:!0})){constructor(){super(...arguments);this.allowedKeys="";this.focused=!1;this.invalid=!1;this.label="";this.placeholder="";this._type="text";this.grows=!1;this.maxlength=-1;this.minlength=-1;this.multiline=!1;this.readonly=!1;this.rows=-1;this.valid=!1;this._value="";this.quiet=!1;this.required=!1}static get styles(){return[$,E]}set type(e){const l=this._type;this._type=e,this.requestUpdate("type",l)}get type(){var e;return(e=S.find(l=>l===this._type))!=null?e:"text"}set value(e){if(e===this.value)return;const l=this._value;this._value=e,this.requestUpdate("value",l)}get value(){return this._value}get focusElement(){return this.inputElement}setSelectionRange(e,l,r="none"){this.inputElement.setSelectionRange(e,l,r)}select(){this.inputElement.select()}handleInput(e){if(this.allowedKeys&&this.inputElement.value&&!new RegExp(`^[${this.allowedKeys}]*$`,"u").test(this.inputElement.value)){const u=this.inputElement.selectionStart-1;this.inputElement.value=this.value.toString(),this.inputElement.setSelectionRange(u,u);return}this.value=this.inputElement.value}handleChange(){this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}onFocus(){this.focused=!this.readonly&&!0}onBlur(e){this.focused=!this.readonly&&!1}renderStateIcons(){return this.invalid?s`
+"use strict";var c=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var t=(p,a,e,n)=>{for(var r=n>1?void 0:n?m(a,e):a,u=p.length-1,h;u>=0;u--)(h=p[u])&&(r=(n?h(a,e,r):h(r))||r);return n&&r&&c(a,e,r),r};import{html as s,nothing as o,SizedMixin as v}from"@spectrum-web-components/base";import{ifDefined as l,live as y}from"@spectrum-web-components/base/src/directives.js";import{property as i,query as b,state as d}from"@spectrum-web-components/base/src/decorators.js";import{ManageHelpText as g}from"@spectrum-web-components/help-text/src/manage-help-text.js";import{Focusable as f}from"@spectrum-web-components/shared/src/focusable.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-checkmark100.js";import"@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js";import $ from"./textfield.css.js";import E from"@spectrum-web-components/icon/src/spectrum-icon-checkmark.css.js";const S=["text","url","tel","email","password"];export class TextfieldBase extends g(v(f,{noDefaultSize:!0})){constructor(){super(...arguments);this.allowedKeys="";this.focused=!1;this.invalid=!1;this.label="";this.placeholder="";this._type="text";this.grows=!1;this.maxlength=-1;this.minlength=-1;this.multiline=!1;this.readonly=!1;this.rows=-1;this.valid=!1;this._value="";this.quiet=!1;this.required=!1}static get styles(){return[$,E]}set type(e){const n=this._type;this._type=e,this.requestUpdate("type",n)}get type(){var e;return(e=S.find(n=>n===this._type))!=null?e:"text"}set value(e){if(e===this.value)return;const n=this._value;this._value=e,this.requestUpdate("value",n)}get value(){return this._value}get focusElement(){return this.inputElement}setSelectionRange(e,n,r="none"){this.inputElement.setSelectionRange(e,n,r)}select(){this.inputElement.select()}handleInput(e){if(this.allowedKeys&&this.inputElement.value&&!new RegExp(`^[${this.allowedKeys}]*$`,"u").test(this.inputElement.value)){const u=this.inputElement.selectionStart-1;this.inputElement.value=this.value.toString(),this.inputElement.setSelectionRange(u,u);return}this.value=this.inputElement.value}handleChange(){this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}onFocus(){this.focused=!this.readonly&&!0}onBlur(e){this.focused=!this.readonly&&!1}handleInputElementPointerdown(){}renderStateIcons(){return this.invalid?s`
                 <sp-icon-alert id="invalid" class="icon"></sp-icon-alert>
@@ -15,11 +15,11 @@ `:this.valid?s`
             <textarea
-                name=${n(this.name||void 0)}
+                name=${l(this.name||void 0)}
                 aria-describedby=${this.helpTextId}
                 aria-label=${this.label||this.appliedLabel||this.placeholder}
-                aria-invalid=${n(this.invalid||void 0)}
+                aria-invalid=${l(this.invalid||void 0)}
                 class="input"
-                maxlength=${n(this.maxlength>-1?this.maxlength:void 0)}
-                minlength=${n(this.minlength>-1?this.minlength:void 0)}
+                maxlength=${l(this.maxlength>-1?this.maxlength:void 0)}
+                minlength=${l(this.minlength>-1?this.minlength:void 0)}
                 title=${this.invalid?"":o}
-                pattern=${n(this.pattern)}
+                pattern=${l(this.pattern)}
                 placeholder=${this.placeholder}
@@ -34,4 +34,4 @@ .value=${this.displayValue}
                 ?readonly=${this.readonly}
-                rows=${n(this.rows>-1?this.rows:void 0)}
-                autocomplete=${n(this.autocomplete)}
+                rows=${l(this.rows>-1?this.rows:void 0)}
+                autocomplete=${l(this.autocomplete)}
             ></textarea>
@@ -41,12 +41,12 @@ `}get renderInput(){return s`
             <input
-                name=${n(this.name||void 0)}
+                name=${l(this.name||void 0)}
                 type=${this.type}
                 aria-describedby=${this.helpTextId}
                 aria-label=${this.label||this.appliedLabel||this.placeholder}
-                aria-invalid=${n(this.invalid||void 0)}
+                aria-invalid=${l(this.invalid||void 0)}
                 class="input"
                 title=${this.invalid?"":o}
-                maxlength=${n(this.maxlength>-1?this.maxlength:void 0)}
-                minlength=${n(this.minlength>-1?this.minlength:void 0)}
-                pattern=${n(this.pattern)}
+                maxlength=${l(this.maxlength>-1?this.maxlength:void 0)}
+                minlength=${l(this.minlength>-1?this.minlength:void 0)}
+                pattern=${l(this.pattern)}
                 placeholder=${this.placeholder}
@@ -56,2 +56,3 @@ .value=${y(this.displayValue)}
                 @input=${this.handleInput}
+                @pointerdown=${this.handleInputElementPointerdown}
                 @focus=${this.onFocus}
@@ -62,3 +63,3 @@ @blur=${this.onBlur}
                 ?readonly=${this.readonly}
-                autocomplete=${n(this.autocomplete)}
+                autocomplete=${l(this.autocomplete)}
             />
@@ -71,3 +72,3 @@ `}renderField(){return s`
             ${this.renderHelpText(this.invalid)}
-        `}update(e){(e.has("value")||e.has("required")&&this.required)&&this.updateComplete.then(()=>{this.checkValidity()}),super.update(e)}checkValidity(){let e=this.inputElement.checkValidity();return(this.required||this.value&&this.pattern)&&((this.disabled||this.multiline)&&this.pattern&&(e=new RegExp(`^${this.pattern}$`,"u").test(this.value.toString())),typeof this.minlength!="undefined"&&(e=e&&this.value.toString().length>=this.minlength),this.valid=e,this.invalid=!e),e}}t([d()],TextfieldBase.prototype,"appliedLabel",2),t([i({attribute:"allowed-keys"})],TextfieldBase.prototype,"allowedKeys",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"focused",2),t([b(".input:not(#sizer)")],TextfieldBase.prototype,"inputElement",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"invalid",2),t([i()],TextfieldBase.prototype,"label",2),t([i({type:String,reflect:!0})],TextfieldBase.prototype,"name",2),t([i()],TextfieldBase.prototype,"placeholder",2),t([d()],TextfieldBase.prototype,"type",1),t([i({attribute:"type",reflect:!0})],TextfieldBase.prototype,"_type",2),t([i()],TextfieldBase.prototype,"pattern",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"grows",2),t([i({type:Number})],TextfieldBase.prototype,"maxlength",2),t([i({type:Number})],TextfieldBase.prototype,"minlength",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"multiline",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"readonly",2),t([i({type:Number})],TextfieldBase.prototype,"rows",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"valid",2),t([i({type:String})],TextfieldBase.prototype,"value",1),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"quiet",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"required",2),t([i({type:String,reflect:!0})],TextfieldBase.prototype,"autocomplete",2);export class Textfield extends TextfieldBase{constructor(){super(...arguments);this._value=""}set value(e){if(e===this.value)return;const l=this._value;this._value=e,this.requestUpdate("value",l)}get value(){return this._value}}t([i({type:String})],Textfield.prototype,"value",1);
+        `}update(e){(e.has("value")||e.has("required")&&this.required)&&this.updateComplete.then(()=>{this.checkValidity()}),super.update(e)}checkValidity(){let e=this.inputElement.checkValidity();return(this.required||this.value&&this.pattern)&&((this.disabled||this.multiline)&&this.pattern&&(e=new RegExp(`^${this.pattern}$`,"u").test(this.value.toString())),typeof this.minlength!="undefined"&&(e=e&&this.value.toString().length>=this.minlength),this.valid=e,this.invalid=!e),e}}t([d()],TextfieldBase.prototype,"appliedLabel",2),t([i({attribute:"allowed-keys"})],TextfieldBase.prototype,"allowedKeys",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"focused",2),t([b(".input:not(#sizer)")],TextfieldBase.prototype,"inputElement",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"invalid",2),t([i()],TextfieldBase.prototype,"label",2),t([i({type:String,reflect:!0})],TextfieldBase.prototype,"name",2),t([i()],TextfieldBase.prototype,"placeholder",2),t([d()],TextfieldBase.prototype,"type",1),t([i({attribute:"type",reflect:!0})],TextfieldBase.prototype,"_type",2),t([i()],TextfieldBase.prototype,"pattern",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"grows",2),t([i({type:Number})],TextfieldBase.prototype,"maxlength",2),t([i({type:Number})],TextfieldBase.prototype,"minlength",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"multiline",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"readonly",2),t([i({type:Number})],TextfieldBase.prototype,"rows",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"valid",2),t([i({type:String})],TextfieldBase.prototype,"value",1),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"quiet",2),t([i({type:Boolean,reflect:!0})],TextfieldBase.prototype,"required",2),t([i({type:String,reflect:!0})],TextfieldBase.prototype,"autocomplete",2);export class Textfield extends TextfieldBase{constructor(){super(...arguments);this._value=""}set value(e){if(e===this.value)return;const n=this._value;this._value=e,this.requestUpdate("value",n)}get value(){return this._value}}t([i({type:String})],Textfield.prototype,"value",1);
 //# sourceMappingURL=Textfield.js.map

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

542273

increased by0.24%

Lines of code

4220

increased by0.69%

Dependency changes

• Updated@spectrum-web-components/base@^0.42.5

• Updated@spectrum-web-components/help-text@^0.42.5

• Updated@spectrum-web-components/icon@^0.42.5

• Updated@spectrum-web-components/icons-ui@^0.42.5

• Updated@spectrum-web-components/icons-workflow@^0.42.5

• Updated@spectrum-web-components/shared@^0.42.5