@ncino/web-components 10.2.1 → 10.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- import{property as h}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{customElement as d}from"../../../../utils/decorators/custom-element-decorator.js";import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as p}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/lit-html.js";import"../../../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";import{str as c}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/internal/str-tag.js";import{msg as s}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/install.js";import{localized as y}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/internal/localized-decorator.js";import"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/runtime.js";import f from"../../../../packages/web-components/src/components/input/gator/input-currency/input-currency.gator.scss.js";import{NgcInputText as v}from"../input-text/input-text.gator.js";import{unsafeCSS as g}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var _=Object.defineProperty,b=Object.getOwnPropertyDescriptor,C=Object.getPrototypeOf,D=Reflect.get,u=(e,r,t,i)=>{for(var a=i>1?void 0:i?b(r,t):r,l=e.length-1,o;l>=0;l--)(o=e[l])&&(a=(i?o(r,t,a):o(a))||a);return i&&a&&_(r,t,a),a},I=(e,r,t)=>D(C(e),t,r);let n=class extends v{constructor(){super(...arguments),this.value="",this._value="",this.type="text",this.currencyIsoCode="USD"}render(){return p`
1
+ import{property as h}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{state as d}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";import{customElement as f}from"../../../../utils/decorators/custom-element-decorator.js";import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as y}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/lit-html.js";import"../../../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";import{str as c}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/internal/str-tag.js";import{msg as o}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/install.js";import{localized as g}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/internal/localized-decorator.js";import"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/runtime.js";import v from"../../../../packages/web-components/src/components/input/gator/input-currency/input-currency.gator.scss.js";import{NgcInputText as D}from"../input-text/input-text.gator.js";import{unsafeCSS as b}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var _=Object.defineProperty,C=Object.getOwnPropertyDescriptor,F=Object.getPrototypeOf,I=Reflect.get,u=(e,t,r,i)=>{for(var a=i>1?void 0:i?C(t,r):t,s=e.length-1,n;s>=0;s--)(n=e[s])&&(a=(i?n(t,r,a):n(a))||a);return i&&a&&_(t,r,a),a},N=(e,t,r)=>I(F(e),r,t);let l=class extends D{constructor(){super(...arguments),this.value="",this._value="",this.type="text",this.currencyIsoCode="USD",this._inputFocused=!1}render(){return y`
2
2
  ${super.render()}
3
3
  <div id="ngc-input-currency-descriptor">${this.currencyIsoCode}</div>
4
- `}connectedCallback(){super.connectedCallback(),this.startIcon="",this._startIconAsText=this.currencySymbol,this._value=this.format(this.value),this._inputMode="numeric",this._placeholder=this.placeholder||this.format("0"),this._ariaDescribedBy="ngc-input-currency-descriptor"}updated(e){if(super.updated(e),e.has("value")&&e.get("value")&&(this._value=this.value),e.has("currencyIsoCode")&&(this._startIconAsText=this.currencySymbol,this._placeholder=this.placeholder||this.format("0")),e.has("locale")){const r=this.isPeriodAsDecimalCurrency?".":",",t=this.isPeriodAsDecimalCurrency?",":".";this._value&&(this._value=this.format(this._value.replaceAll(t,r)));const i=new CustomEvent("change",{bubbles:!0,composed:!0,detail:{value:this._value}});this.dispatchEvent(i),this._placeholder=this.placeholder||this.format("0")}this.validateInput(this._value)}validateInput(e){if(/.*[^,\d.].*/.test(e))return this._internalValidationError=s("Invalid input. Only numbers, commas or periods are allowed."),!1;const t=this.isPeriodAsDecimalCurrency?".":",",i=(this._value.match(new RegExp("\\"+t,"g"))??[]).length;if(!(this.numDecimalPlaces>0)&&i>0)return this._internalValidationError=s("Invalid input. No decimals are allowed for this currency."),!1;if(i>1)return this._internalValidationError=s("Invalid input. Only one decimal character is allowed."),!1;const l=new RegExp("^[\\d,]+\\.\\d{"+(this.numDecimalPlaces+1)+",}$"),o=new RegExp("^[\\d.]+,\\d{"+(this.numDecimalPlaces+1)+",}$");if((this.isPeriodAsDecimalCurrency?l:o).test(e))return this._internalValidationError=s(c`Invalid input. Only ${this.numDecimalPlaces} decimal places are allowed.`),!1;if(this._value===t)return this._internalValidationError=s("Invalid input. Please enter a valid number value."),!1;const m=parseFloat(e.replaceAll(this.currencyThousandsSeparator,"").replaceAll(",","."));return this.min!==void 0&&!isNaN(Number(this.min))&&m<Number(this.min)?(this._internalValidationError=s(c`Invalid input. Value must be greater than or equal to ${this.format(this.min.toString())}.`),!1):this.max!==void 0&&!isNaN(Number(this.max))&&m>Number(this.max)?(this._internalValidationError=s(c`Invalid input. Value must be less than or equal to ${this.format(this.max.toString())}.`),!1):(this._internalValidationError="",!0)}handleChange(){if(this.displayedErrorText)return;let r=this.inputRef.value?.value.replaceAll(this.currencyThousandsSeparator,"");this.isPeriodAsDecimalCurrency||(r=r?.replaceAll(",","."));const t=this.format(r??"0.00"),i=new CustomEvent("change",{bubbles:!0,composed:!0,detail:{value:t}});this.dispatchEvent(i)}currencyNumberFormater(e={}){return new Intl.NumberFormat(this.locale||navigator.language,{style:"currency",currency:this.currencyIsoCode||"USD",currencyDisplay:"narrowSymbol",...e})}format(e){return e?this.currencyNumberFormater({useGrouping:!1}).format(parseFloat(e)).replaceAll(this.currencySymbol,"").trim():""}get currencySymbol(){return this.currencyNumberFormater({currencyDisplay:"narrowSymbol"}).formatToParts(1).find(e=>e.type==="currency")?.value??"$"}get currencyThousandsSeparator(){return this.currencyNumberFormater().formatToParts(1e3).find(e=>e.type==="group")?.value??","}get numDecimalPlaces(){return(this.currencyNumberFormater().format(1).match(/0/g)||[]).length}get isPeriodAsDecimalCurrency(){return this.currencyThousandsSeparator===","}};n.styles=[...I(n,n,"styles"),g(f)];u([h({attribute:"currency-iso-code"})],n.prototype,"currencyIsoCode",2);u([h()],n.prototype,"locale",2);n=u([y(),d("ngc-input-currency")],n);export{n as NgcInputCurrency};
4
+ `}connectedCallback(){super.connectedCallback(),this.startIcon="",this._startIconAsText=this.currencySymbol,this._value=this.formatValue(this.value||""),this.syncCurrencyInputMode(),this._placeholder=this.placeholder||this.formatCanonical("0"),this._ariaDescribedBy="ngc-input-currency-descriptor"}updated(e){if(super.updated(e),e.has("value")&&e.get("value")&&(this._value=this.formatValue(this.value)),e.has("currencyIsoCode")&&(this._startIconAsText=this.currencySymbol,this._placeholder=this.placeholder||this.formatCanonical("0"),this.syncCurrencyInputMode()),e.has("locale")){const t=this.isPeriodAsDecimalCurrency?".":",",r=this.isPeriodAsDecimalCurrency?",":".";this._value&&(this._value=this.formatValue(this._value.replaceAll(r,t)));const i=this._value?this.filterToInternalDecimalString(this._value):"",a=new CustomEvent("change",{bubbles:!0,composed:!0,detail:{value:i?this.formatCanonical(i):""}});this.dispatchEvent(a),this._placeholder=this.placeholder||this.formatCanonical("0")}this.validateInput(this._value)}handleInputFocusIn(){super.handleInputFocusIn(),this._inputFocused=!0,this._value=this.formatValue(this.value)}handleInputFocusOut(){super.handleInputFocusOut(),this._inputFocused=!1,this._value=this.formatValue(this._value)}validateInput(e){if(/.*[^,\d.].*/.test(e))return this._internalValidationError=o("Invalid input. Only numbers, commas or periods are allowed."),!1;const r=this.isPeriodAsDecimalCurrency?".":",",i=(e.match(new RegExp("\\"+r,"g"))??[]).length;if(!(this.numDecimalPlaces>0)&&i>0)return this._internalValidationError=o("Invalid input. No decimals are allowed for this currency."),!1;if(i>1)return this._internalValidationError=o("Invalid input. Only one decimal character is allowed."),!1;const s=new RegExp("^[\\d,]+\\.\\d{"+(this.numDecimalPlaces+1)+",}$"),n=new RegExp("^[\\d.]+,\\d{"+(this.numDecimalPlaces+1)+",}$");if((this.isPeriodAsDecimalCurrency?s:n).test(e))return this._internalValidationError=o(c`Invalid input. Only ${this.numDecimalPlaces} decimal places are allowed.`),!1;if(e===r)return this._internalValidationError=o("Invalid input. Please enter a valid number value."),!1;const m=parseFloat(e.replaceAll(this.currencyThousandsSeparator,"").replaceAll(",","."));return this.min!==void 0&&!isNaN(Number(this.min))&&m<Number(this.min)?(this._internalValidationError=o(c`Invalid input. Value must be greater than or equal to ${this.formatCanonical(this.min.toString())}.`),!1):this.max!==void 0&&!isNaN(Number(this.max))&&m>Number(this.max)?(this._internalValidationError=o(c`Invalid input. Value must be less than or equal to ${this.formatCanonical(this.max.toString())}.`),!1):(this._internalValidationError="",!0)}formatValue(e){if(!this.validateInput(e))return e;const t=this.filterToInternalDecimalString(e);return this._inputFocused?this.formatWhileFocused(t):t===""?"":this.formatGrouped(t,!0)}handleInputEvent(e){e.preventDefault(),e.stopPropagation();const r=e.target.value,i=this.formatValue(r),a=this.inputEventDetailValue(r);this.internals.setFormValue(i),this._value=i,this._showErrors=!0,this.syncValidity(),this.updateRequiredValidity(),this.dispatchEvent(new CustomEvent("input",{bubbles:!0,composed:!0,detail:{value:a}}))}inputEventDetailValue(e){if(!this.validateInput(e))return e;const t=this.filterToInternalDecimalString(e);if(t==="")return"";const r=(t.match(/\./g)??[]).length;if(this.numDecimalPlaces>0&&r===1&&t.endsWith(".")){const s=t.slice(0,-1);if(s==="")return this.localeDecimalSeparator;const n=parseFloat(s);return Number.isNaN(n)?t:this.currencyNumberFormater({useGrouping:!1,minimumFractionDigits:0,maximumFractionDigits:this.numDecimalPlaces}).format(n).replaceAll(this.currencySymbol,"").trim()+this.localeDecimalSeparator}const a=parseFloat(t);return Number.isNaN(a)?t:this.currencyNumberFormater({useGrouping:!1,minimumFractionDigits:0,maximumFractionDigits:this.numDecimalPlaces}).format(a).replaceAll(this.currencySymbol,"").trim()}handleChange(){if(this.displayedErrorText)return;let t=this.inputRef.value?.value.replaceAll(this.currencyThousandsSeparator,"");this.isPeriodAsDecimalCurrency||(t=t?.replaceAll(",","."));const r=this.formatCanonical(t??"0.00");this._value=this.formatGrouped(t??"0.00",!0);const i=new CustomEvent("change",{bubbles:!0,composed:!0,detail:{value:r}});this.dispatchEvent(i)}syncCurrencyInputMode(){this._inputMode=this.numDecimalPlaces>0?"decimal":"numeric"}filterToInternalDecimalString(e){let t=e.replaceAll(this.currencyThousandsSeparator,"");return this.isPeriodAsDecimalCurrency||(t=t.replaceAll(",",".")),t}get localeDecimalSeparator(){return this.currencyNumberFormater({useGrouping:!1}).formatToParts(1.1).find(e=>e.type==="decimal")?.value??"."}formatWhileFocused(e){if(e==="")return"";const t=(e.match(/\./g)??[]).length<=1,r=e.endsWith(".")&&t,i=r?e.slice(0,-1):e;if(r&&i==="")return this.numDecimalPlaces>0?this.localeDecimalSeparator:"";if(r&&this.numDecimalPlaces===0||i!==""&&Number.isNaN(parseFloat(i)))return e;const a=parseFloat(i);let s=this.currencyNumberFormater({useGrouping:!0,minimumFractionDigits:0,maximumFractionDigits:this.numDecimalPlaces}).format(a).replaceAll(this.currencySymbol,"").trim();return r&&this.numDecimalPlaces>0&&!s.endsWith(this.localeDecimalSeparator)&&(s+=this.localeDecimalSeparator),s}formatCanonical(e){return e?this.currencyNumberFormater({useGrouping:!1}).format(parseFloat(e)).replaceAll(this.currencySymbol,"").trim():""}formatGrouped(e,t){if(!e)return"";const r=parseFloat(e);return Number.isNaN(r)?e:this.currencyNumberFormater({useGrouping:!0,minimumFractionDigits:t?this.numDecimalPlaces:0,maximumFractionDigits:this.numDecimalPlaces}).format(r).replaceAll(this.currencySymbol,"").trim()}currencyNumberFormater(e={}){return new Intl.NumberFormat(this.locale||navigator.language,{style:"currency",currency:this.currencyIsoCode||"USD",currencyDisplay:"narrowSymbol",...e})}get currencySymbol(){return this.currencyNumberFormater({currencyDisplay:"narrowSymbol"}).formatToParts(1).find(e=>e.type==="currency")?.value??"$"}get currencyThousandsSeparator(){return this.currencyNumberFormater().formatToParts(1e3).find(e=>e.type==="group")?.value??","}get numDecimalPlaces(){return(this.currencyNumberFormater().format(1).match(/0/g)||[]).length}get isPeriodAsDecimalCurrency(){return this.currencyThousandsSeparator===","}};l.styles=[...N(l,l,"styles"),b(v)];u([h({attribute:"currency-iso-code"})],l.prototype,"currencyIsoCode",2);u([h()],l.prototype,"locale",2);u([d()],l.prototype,"_inputFocused",2);l=u([g(),f("ngc-input-currency")],l);export{l as NgcInputCurrency};
@@ -1 +1 @@
1
- import{property as u}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{state as p}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";import{customElement as c}from"../../../../utils/decorators/custom-element-decorator.js";import{KEY_CONSTANTS as h}from"../../../../consts/key-constants.js";import{NgcInputText as v}from"../input-text/input-text.gator.js";var m=Object.defineProperty,_=Object.getOwnPropertyDescriptor,d=Object.getPrototypeOf,f=Reflect.get,l=(t,e,s,a)=>{for(var r=a>1?void 0:a?_(e,s):e,n=t.length-1,o;n>=0;n--)(o=t[n])&&(r=(a?o(e,s,r):o(r))||r);return a&&r&&m(e,s,r),r},g=(t,e,s)=>f(d(t),s,e);let i=class extends v{constructor(){super(...arguments),this.maskPreset=null,this.maskPattern="",this.acceptedCharType="numeric",this.variableMaxLength=10,this.value="",this._value="",this._inputFocused=!1,this._cursorPosition=null}updated(t){super.updated(t),t.has("value")&&(this._value=this.formatValue(this.value),this.inputRef.value?.setSelectionRange(this._cursorPosition,this._cursorPosition)),t.has("errorText")&&!this.errorText&&this.validateChars(this.value),t.get("_cursorPosition")&&this.inputRef.value?.setSelectionRange(this._cursorPosition,this._cursorPosition),t.has("maskPreset")&&(this._placeholder=this.placeholder?this.placeholder:this._maskPattern.split("").map((e,s)=>e==="#"?((s+1)%10).toString():e).join(""),this.maskPreset==="variable"?this._maxLength=this.variableMaxLength:this._maxLength=this._maskPattern.length,this._value=this.formatValue(this.value))}handleInputEvent(t){t.preventDefault(),t.stopPropagation();const e=t.target,s=e.selectionStart??0,a=this.formatValue(e.value),r=this._value.length<e.value.length,n=!!this.displayedErrorText,o=new CustomEvent("input",{bubbles:!0,composed:!0,detail:{formatted:a,raw:n?a:a.replaceAll("-","")}});r&&e.value[s]!=="-"&&a[s-1]==="-"?this._cursorPosition=s+1:this._cursorPosition=s,this._value=a,this.dispatchEvent(o)}handleKeyup(t){if(t.key===h.LEFT||t.key===h.RIGHT){const e=t.target;this._cursorPosition=e.selectionStart??0}}handleClick(t){const e=t.target;this._cursorPosition=e.selectionStart??0}handleInputFocusIn(){super.handleInputFocusIn(),this._inputFocused=!0,this._value=this.formatValue(this.value)}handleInputFocusOut(){super.handleInputFocusOut(),this._inputFocused=!1,this._value=this.formatValue(this._value)}get _maskPattern(){switch(this.maskPreset){case"ssn":return"XXX-XX-####";case"ein":return"XX-XXX####";case"variable":return this.variableMaskPattern();default:return this.maskPattern}}variableMaskPattern(){const t=this._value.length+1;return t<=5?"#".repeat(t):"X".repeat(t-5)+"#".repeat(5)}validateChars(t){const e={numeric:{regex:/^[0-9]*$/,errText:"numbers"},alpha:{regex:/^[a-zA-Z]*$/,errText:"letters"},alphanumeric:{regex:/^[a-zA-Z0-9]*$/,errText:"letters, numbers,"}};return e[this.acceptedCharType].regex.test(t.replaceAll("-",""))?(this._internalValidationError="",!0):(this._internalValidationError=`Invalid input. Use only ${e[this.acceptedCharType].errText} and dashes in this field.`,!1)}formatValue(t){if(!this.validateChars(t))return t;const e=t.replaceAll(/[^a-zA-Z0-9]/g,"").substring(0,this._maskPattern.length);let s="",a=0;for(let r=0;r<this._maskPattern.length&&a!==e.length;++r){const n=e[a],o=this._maskPattern[r];switch(o){case"X":{this._inputFocused?s+=n:s+="X",a++;break}case"#":{s+=n,a++;break}default:s+=o}}return s}};i.styles=[...g(i,i,"styles")];l([u({attribute:"mask-preset"})],i.prototype,"maskPreset",2);l([u({attribute:"mask-pattern"})],i.prototype,"maskPattern",2);l([u({attribute:"accepted-char-type"})],i.prototype,"acceptedCharType",2);l([u({attribute:"variable-max-length"})],i.prototype,"variableMaxLength",2);l([p()],i.prototype,"_inputFocused",2);l([p()],i.prototype,"_cursorPosition",2);i=l([c("ngc-input-masked")],i);export{i as NgcInputMasked};
1
+ import{property as p}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{state as m}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";import{customElement as d}from"../../../../utils/decorators/custom-element-decorator.js";import{KEY_CONSTANTS as c}from"../../../../consts/key-constants.js";import{NgcInputText as _}from"../input-text/input-text.gator.js";var v=Object.defineProperty,k=Object.getOwnPropertyDescriptor,P=Object.getPrototypeOf,g=Reflect.get,l=(t,e,a,s)=>{for(var r=s>1?void 0:s?k(e,a):e,n=t.length-1,o;n>=0;n--)(o=t[n])&&(r=(s?o(e,a,r):o(r))||r);return s&&r&&v(e,a,r),r},b=(t,e,a)=>g(P(t),a,e);let i=class extends _{constructor(){super(...arguments),this.maskPreset=null,this.maskPattern="",this.acceptedCharType="numeric",this.variableMaxLength=10,this.value="",this._value="",this._inputFocused=!1,this._cursorPosition=null}willUpdate(t){super.willUpdate(t),(t.has("maskPreset")||t.has("acceptedCharType"))&&this.applyMaskInputMode()}updated(t){if(super.updated(t),t.has("value")&&(this._value=this.formatValue(this.value),this.inputRef.value?.setSelectionRange(this._cursorPosition,this._cursorPosition)),t.has("errorText")&&!this.errorText&&this.validateChars(this.value),t.has("_cursorPosition")&&this.inputRef.value?.setSelectionRange(this._cursorPosition,this._cursorPosition),t.has("maskPreset")||t.has("maskPattern")){this.applyMaskSizingAndPlaceholder();const e=t.has("maskPreset"),a=t.has("maskPattern");if(e&&a)this._value=this.formatValue(this.value??"");else if(e)this._value=this.formatValue(this.value??"");else{const s=this.inputRef.value?.value,r=String(this._value??""),n=s!=null&&s!==""?s:r!==""?r:this.value??"";this._value=this.formatValue(n)}}}applyMaskSizingAndPlaceholder(){if(this._placeholder=this.placeholder?this.placeholder:this._maskPattern.split("").map((t,e)=>t==="#"?((e+1)%10).toString():t).join(""),this.maskPreset==="variable")this._maxLength=this.variableMaxLength;else{const t=this._maskPattern.length;this._maxLength=t>0?t:void 0}}handleInputEvent(t){t.preventDefault(),t.stopPropagation();const e=t.target,a=e.selectionStart??0,s=this.formatValue(e.value),r=this._value.length<e.value.length,n=!!this.displayedErrorText,o=new CustomEvent("input",{bubbles:!0,composed:!0,detail:{formatted:s,raw:n?s:this.stripMaskLiterals(s)}}),h=a-1,u=h>=0?this._maskPattern[h]:void 0,f=u!==void 0&&u!=="#"&&u!=="X"&&s[h]===u;r&&h>=0&&f&&e.value[a]!==u?this._cursorPosition=Math.min(a+1,s.length):this._cursorPosition=a,this._value=s,this.dispatchEvent(o)}handleKeyup(t){if(t.key===c.LEFT||t.key===c.RIGHT){const e=t.target;this._cursorPosition=e.selectionStart??0}}handleClick(t){const e=t.target;this._cursorPosition=e.selectionStart??0}handleInputFocusIn(){super.handleInputFocusIn(),this._inputFocused=!0,this._value=this.formatValue(this.value)}handleInputFocusOut(){super.handleInputFocusOut(),this._inputFocused=!1,this._value=this.formatValue(this._value)}applyMaskInputMode(){this._inputMode=this.acceptedCharType==="numeric"?"numeric":"text"}get _maskPattern(){switch(this.maskPreset){case"ssn":return"XXX-XX-####";case"ein":return"XX-XXX####";case"variable":return this.variableMaskPattern();default:return this.maskPattern}}variableMaskPattern(){const t=this._value.length+1;return t<=5?"#".repeat(t):"X".repeat(t-5)+"#".repeat(5)}stripMaskLiterals(t){if(!this._maskPattern)return t;const e=new Set;let a=t;for(const s of this._maskPattern)s==="#"||s==="X"||e.has(s)||(e.add(s),a=a.split(s).join(""));return a}validateChars(t){const e={numeric:{regex:/^[0-9]*$/,errText:"numbers"},alpha:{regex:/^[a-zA-Z]*$/,errText:"letters"},alphanumeric:{regex:/^[a-zA-Z0-9]*$/,errText:"letters, numbers,"}};return e[this.acceptedCharType].regex.test(this.stripMaskLiterals(t))?(this._internalValidationError="",!0):(this._internalValidationError=`Invalid input. Use only ${e[this.acceptedCharType].errText} and mask separator characters in this field.`,!1)}formatValue(t){if(!this.validateChars(t)||!this._maskPattern.length)return t;const e=t.replaceAll(/[^a-zA-Z0-9]/g,"").substring(0,this._maskPattern.length);let a="",s=0;for(let r=0;r<this._maskPattern.length&&s!==e.length;++r){const n=e[s],o=this._maskPattern[r];switch(o){case"X":{this._inputFocused?a+=n:a+="X",s++;break}case"#":{a+=n,s++;break}default:a+=o}}return a}};i.styles=[...b(i,i,"styles")];l([p({attribute:"mask-preset",converter:{fromAttribute(t){return t==null||t===""||t==="null"?null:t==="ssn"||t==="ein"||t==="variable"?t:null},toAttribute(t){return t??null}}})],i.prototype,"maskPreset",2);l([p({attribute:"mask-pattern"})],i.prototype,"maskPattern",2);l([p({attribute:"accepted-char-type"})],i.prototype,"acceptedCharType",2);l([p({attribute:"variable-max-length"})],i.prototype,"variableMaxLength",2);l([m()],i.prototype,"_inputFocused",2);l([m()],i.prototype,"_cursorPosition",2);i=l([d("ngc-input-masked")],i);export{i as NgcInputMasked};
@@ -23,6 +23,7 @@ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@
23
23
  ?disabled="${this.disabled}"
24
24
  type="text"
25
25
  id="phone-${this.id}"
26
+ inputmode="tel"
26
27
  @change="${this.handlePhoneInput}"
27
28
  ?readonly="${this.readonly}"
28
29
  >
@@ -1,11 +1,11 @@
1
- import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as o}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/lit-html.js";import"../../../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";import{property as u}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{state as a}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";import{customElement as f}from"../../../../utils/decorators/custom-element-decorator.js";import{createRef as v,ref as c}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/ref.js";import{ifDefined as h}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/if-defined.js";import{live as y}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/live.js";import{classMap as _}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/class-map.js";import{msg as g}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/install.js";import"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/runtime.js";import{NgcInputBase as m}from"../../base/input-base.gator.js";import"../input-label/input-label.gator.js";import"../help-text/help-text.gator.js";var $=Object.defineProperty,b=Object.getOwnPropertyDescriptor,s=(t,e,r,l)=>{for(var n=l>1?void 0:l?b(e,r):e,d=t.length-1,p;d>=0;d--)(p=t[d])&&(n=(l?p(e,r,n):p(n))||n);return l&&n&&$(e,r,n),n};let i=class extends m{constructor(){super(...arguments),this.inputRef=v(),this.controlRef=v(),this.for="",this._inputMode="text",this._showErrors=!1,this._onInvalid=t=>{this._showErrors=!0,this.requestUpdate()}}render(){return o`
1
+ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as h}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/lit-html.js";import"../../../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";import{property as l}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{state as a}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";import{customElement as f}from"../../../../utils/decorators/custom-element-decorator.js";import{createRef as v,ref as c}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/ref.js";import{ifDefined as u}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/if-defined.js";import{live as y}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/live.js";import{classMap as _}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/class-map.js";import{msg as g}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/install.js";import"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/runtime.js";import{NgcInputBase as m}from"../../base/input-base.gator.js";import"../input-label/input-label.gator.js";import"../help-text/help-text.gator.js";var b=Object.defineProperty,$=Object.getOwnPropertyDescriptor,s=(t,i,r,o)=>{for(var n=o>1?void 0:o?$(i,r):i,p=t.length-1,d;p>=0;p--)(d=t[p])&&(n=(o?d(i,r,n):d(n))||n);return o&&n&&b(i,r,n),n};let e=class extends m{constructor(){super(...arguments),this.inputRef=v(),this.controlRef=v(),this.for="",this._inputMode="text",this._showErrors=!1,this._onInvalid=t=>{this._showErrors=!0,this.requestUpdate()}}render(){return h`
2
2
  <div class="gator-form-element">
3
3
  <slot name="label">
4
4
  ${this.label&&!this.iconAsLabel?this.labelMarkup:null}
5
5
  </slot>
6
6
  <div ${c(this.controlRef)} class="${_(this.controlClasses)}">
7
7
  <div class="gator-input-container">
8
- ${this.shouldHaveStartMarkup?o`
8
+ ${this.shouldHaveStartMarkup?h`
9
9
  <div class="gator-input-start">
10
10
  ${this.startIconMarkup||this._startIconAsText}
11
11
  </div>`:null}
@@ -13,7 +13,7 @@ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@
13
13
  ${c(this.inputRef)}
14
14
  type="${this.type}"
15
15
  id="${this.id}-input"
16
- data-testid=${h(this.dataTestid)}-input
16
+ data-testid=${u(this.dataTestid)}-input
17
17
  .placeholder="${y(this._placeholder)}"
18
18
  .required="${this.required}"
19
19
  .disabled="${this.disabled}"
@@ -24,13 +24,13 @@ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@
24
24
  aria-labelledby="${this.ariaLabelledbyValue}"
25
25
  aria-describedby="${this.ariaDescribedby}"
26
26
  .value="${y(this._value)}"
27
- minlength="${h(this.minLength)}"
28
- maxlength="${h(this._maxLength)}"
27
+ minlength="${u(this.minLength)}"
28
+ maxlength="${u(this._maxLength)}"
29
29
  .min="${this.min}"
30
30
  .max="${this.max}"
31
- .step="${h(this.step)}"
31
+ .step="${u(this.step)}"
32
32
  inputmode="${this._inputMode}"
33
- .pattern="${h(this.pattern)}"
33
+ .pattern="${u(this.pattern)}"
34
34
  @input="${this.handleInputEvent}"
35
35
  @change="${this.handleChange}"
36
36
  @click="${this.handleClick}"
@@ -42,7 +42,7 @@ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@
42
42
  @wheel="${this.handleWheel}"
43
43
  />
44
44
  <slot name="end-slot">
45
- ${this.shouldHaveEndMarkup?o`
45
+ ${this.shouldHaveEndMarkup?h`
46
46
  <div class="gator-input-end">
47
47
  ${this.passwordVisibilityMarkup}
48
48
  ${this.endIconMarkup}
@@ -53,8 +53,8 @@ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@
53
53
 
54
54
  ${this.bottomText}
55
55
  </div>
56
- `}updateRequiredValidity(){const t=this.inputRef.value;this.required&&(!t?.value||t.value==="")?(this._nativeInputError=t?.validationMessage||g("This field is required"),this.internals.setValidity({valueMissing:!0},this._nativeInputError,t??void 0)):(this._nativeInputError="",this.internals.setValidity({}))}updated(t){t.has("disabled")&&(this.disabled?this.internals.states.add("disabled"):this.internals.states.delete("disabled")),t.has("readonly")&&(this.readonly?this.internals.states.add("readonly"):this.internals.states.delete("readonly")),t.has("value")&&(this._value=this.value),t.has("placeholder")&&(this._placeholder=this.placeholder),t.has("ariaLabelledByElements")&&this.ariaLabelledByElements&&(this.inputRef.value.ariaLabelledByElements=this.ariaLabelledByElements),(t.has("required")||t.has("value"))&&this.updateRequiredValidity()}get displayedErrorText(){if(!(!this._showErrors&&!this.errorText))return this.errorText||this._internalValidationError||this._nativeInputError}get isAriaInvalid(){return this.displayedErrorText?"true":"false"}get passwordVisibilityMarkup(){return this.endIconMarkup||this.type!=="password"?null:o`
57
- <ngc-icon name="eye-crossed" @click="${this.togglePasswordVisibility}"></ngc-icon>`}connectedCallback(){super.connectedCallback(),this._value=this.value,this._maxLength=this.maxLength,this._placeholder=this.placeholder,this.updateRequiredValidity(),this.addEventListener("invalid",this._onInvalid,!0)}handleNativeInputValidation(t){t.preventDefault(),t.stopPropagation();const e=this.inputRef.value;if(!e)return;this._showErrors=!0;const r=e.validity,l=e.validationMessage;r.valid?this._nativeInputError="":this._nativeInputError=l}handleWheel(){if(this.type=="number"){this.inputRef.value?.blur();return}}handleInputEvent(t){t.preventDefault(),t.stopPropagation();const e=t.target;this.internals.setFormValue(e.value),this._value=e.value,this._showErrors=!0,this.syncValidity(),this.updateRequiredValidity();const r=new CustomEvent("input",{bubbles:!0,composed:!0,detail:{value:e.value}});this.dispatchEvent(r)}handleChange(t){t.preventDefault(),t.stopPropagation();const e=t.target;this._showErrors=!0;const r=new CustomEvent("change",{composed:!0,bubbles:!0,detail:{value:e.value}});this._value=e.value,this.dispatchEvent(r)}togglePasswordVisibility(){const t=this.inputRef.value;t&&(t.type=t.type==="password"?"text":"password")}syncValidity(){const t=this.inputRef.value;if(!t)return;if(t.checkValidity())this._nativeInputError="",this.internals.setValidity({});else{const r=t.validationMessage;this._nativeInputError=r,this.internals.setValidity({customError:!0},r,t)}}handleInputFocusOut(){super.handleInputFocusOut(),this.inputRef.value?.checkValidity()&&!this.readonly&&(this._nativeInputError=""),this._showErrors=!0,this.syncValidity()}get errorTextMarkup(){return this.displayedErrorText?o`
56
+ `}updateRequiredValidity(){const t=this.inputRef.value;this.required&&(!t?.value||t.value==="")?(this._nativeInputError=t?.validationMessage||g("This field is required"),this.internals.setValidity({valueMissing:!0},this._nativeInputError,t??void 0)):(this._nativeInputError="",this.internals.setValidity({}))}updated(t){t.has("disabled")&&(this.disabled?this.internals.states.add("disabled"):this.internals.states.delete("disabled")),t.has("readonly")&&(this.readonly?this.internals.states.add("readonly"):this.internals.states.delete("readonly")),t.has("value")&&(this._value=this.value),t.has("placeholder")&&(this._placeholder=this.placeholder),t.has("ariaLabelledByElements")&&this.ariaLabelledByElements&&(this.inputRef.value.ariaLabelledByElements=this.ariaLabelledByElements),(t.has("required")||t.has("value"))&&this.updateRequiredValidity()}get displayedErrorText(){if(!(!this._showErrors&&!this.errorText))return this.errorText||this._internalValidationError||this._nativeInputError}get isAriaInvalid(){return this.displayedErrorText?"true":"false"}get passwordVisibilityMarkup(){return this.endIconMarkup||this.type!=="password"?null:h`
57
+ <ngc-icon name="eye-crossed" @click="${this.togglePasswordVisibility}"></ngc-icon>`}willUpdate(t){super.willUpdate(t),t.has("hostInputMode")&&this.hostInputMode&&(this._inputMode=this.hostInputMode)}connectedCallback(){super.connectedCallback(),this.hostInputMode&&(this._inputMode=this.hostInputMode),this._value=this.value,this._maxLength=this.maxLength,this._placeholder=this.placeholder,this.updateRequiredValidity(),this.addEventListener("invalid",this._onInvalid,!0)}handleNativeInputValidation(t){t.preventDefault(),t.stopPropagation();const i=this.inputRef.value;if(!i)return;this._showErrors=!0;const r=i.validity,o=i.validationMessage;r.valid?this._nativeInputError="":this._nativeInputError=o}handleWheel(){if(this.type=="number"){this.inputRef.value?.blur();return}}handleInputEvent(t){t.preventDefault(),t.stopPropagation();const i=t.target;this.internals.setFormValue(i.value),this._value=i.value,this._showErrors=!0,this.syncValidity(),this.updateRequiredValidity();const r=new CustomEvent("input",{bubbles:!0,composed:!0,detail:{value:i.value}});this.dispatchEvent(r)}handleChange(t){t.preventDefault(),t.stopPropagation();const i=t.target;this._showErrors=!0;const r=new CustomEvent("change",{composed:!0,bubbles:!0,detail:{value:i.value}});this._value=i.value,this.dispatchEvent(r)}togglePasswordVisibility(){const t=this.inputRef.value;t&&(t.type=t.type==="password"?"text":"password")}syncValidity(){const t=this.inputRef.value;if(!t)return;if(t.checkValidity())this._nativeInputError="",this.internals.setValidity({});else{const r=t.validationMessage;this._nativeInputError=r,this.internals.setValidity({customError:!0},r,t)}}handleInputFocusOut(){super.handleInputFocusOut(),this.inputRef.value?.checkValidity()&&!this.readonly&&(this._nativeInputError=""),this._showErrors=!0,this.syncValidity()}get errorTextMarkup(){return this.displayedErrorText?h`
58
58
  <ngc-help-text
59
59
  icon
60
60
  error
@@ -63,4 +63,4 @@ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@
63
63
  >
64
64
  ${this.displayedErrorText}
65
65
  </ngc-help-text>
66
- `:null}};i.shadowRootOptions={...m.shadowRootOptions,delegatesFocus:!0};s([u()],i.prototype,"for",2);s([u({type:Number})],i.prototype,"min",2);s([u({type:Number})],i.prototype,"max",2);s([u({type:Number})],i.prototype,"step",2);s([u({type:String})],i.prototype,"pattern",2);s([a()],i.prototype,"_value",2);s([a()],i.prototype,"_inputMode",2);s([a()],i.prototype,"_placeholder",2);s([a()],i.prototype,"_minLength",2);s([a()],i.prototype,"_maxLength",2);s([a()],i.prototype,"_errorText",2);s([a()],i.prototype,"_internalValidationError",2);s([a()],i.prototype,"_nativeInputError",2);s([a()],i.prototype,"_showErrors",2);i=s([f("ngc-input-text")],i);export{i as NgcInputText};
66
+ `:null}};e.shadowRootOptions={...m.shadowRootOptions,delegatesFocus:!0};s([l()],e.prototype,"for",2);s([l({type:Number})],e.prototype,"min",2);s([l({type:Number})],e.prototype,"max",2);s([l({type:Number})],e.prototype,"step",2);s([l({type:String})],e.prototype,"pattern",2);s([l({type:String,attribute:"inputmode"})],e.prototype,"hostInputMode",2);s([a()],e.prototype,"_value",2);s([a()],e.prototype,"_inputMode",2);s([a()],e.prototype,"_placeholder",2);s([a()],e.prototype,"_minLength",2);s([a()],e.prototype,"_maxLength",2);s([a()],e.prototype,"_errorText",2);s([a()],e.prototype,"_internalValidationError",2);s([a()],e.prototype,"_nativeInputError",2);s([a()],e.prototype,"_showErrors",2);e=s([f("ngc-input-text")],e);export{e as NgcInputText};
@@ -6,13 +6,24 @@ export declare class NgcInputCurrency extends NgcInputText {
6
6
  type: string;
7
7
  currencyIsoCode: string;
8
8
  locale: string | undefined;
9
+ private _inputFocused;
9
10
  render(): import('lit').TemplateResult<1>;
10
11
  connectedCallback(): void;
11
12
  protected updated(changedProperties: Map<string, string>): void;
13
+ handleInputFocusIn(): void;
14
+ handleInputFocusOut(): void;
12
15
  private validateInput;
16
+ private formatValue;
17
+ handleInputEvent(e: Event): void;
18
+ private inputEventDetailValue;
13
19
  handleChange(): void;
20
+ private syncCurrencyInputMode;
21
+ private filterToInternalDecimalString;
22
+ private get localeDecimalSeparator();
23
+ private formatWhileFocused;
24
+ private formatCanonical;
25
+ private formatGrouped;
14
26
  private currencyNumberFormater;
15
- private format;
16
27
  private get currencySymbol();
17
28
  private get currencyThousandsSeparator();
18
29
  private get numDecimalPlaces();
@@ -1,3 +1,4 @@
1
+ import { PropertyValueMap } from 'lit';
1
2
  import { NgcInputText } from '../input-text/input-text.gator.ts';
2
3
  type NGC_MASKED_INPUT_ACCEPTED_CHAR_TYPE = 'numeric' | 'alpha' | 'alphanumeric';
3
4
  type NGC_MASKED_INPUT_MASK_PRESET = 'ssn' | 'ein' | 'variable' | null;
@@ -27,14 +28,20 @@ export declare class NgcInputMasked extends NgcInputText {
27
28
  _value: string;
28
29
  private _inputFocused;
29
30
  private _cursorPosition;
31
+ protected willUpdate(changedProperties: PropertyValueMap<this>): void;
30
32
  updated(changedProperties: Map<string, string>): void;
33
+ /** Placeholder and `maxlength` from the active mask (does not reset `_value` by itself). */
34
+ private applyMaskSizingAndPlaceholder;
31
35
  handleInputEvent(e: Event): void;
32
36
  handleKeyup(e: KeyboardEvent): void;
33
37
  handleClick(e: Event): void;
34
38
  handleInputFocusIn(): void;
35
39
  handleInputFocusOut(): void;
40
+ private applyMaskInputMode;
36
41
  private get _maskPattern();
37
42
  private variableMaskPattern;
43
+ /** Removes characters that are literals in the current mask (anything other than # / X slots). */
44
+ private stripMaskLiterals;
38
45
  private validateChars;
39
46
  private formatValue;
40
47
  }
@@ -34,6 +34,7 @@ export declare class NgcInputText extends NgcInputBase {
34
34
  * @type {string}
35
35
  */
36
36
  pattern: string | undefined;
37
+ hostInputMode: INPUT_MODE_TYPE | undefined;
37
38
  protected _value: unknown;
38
39
  protected _inputMode: INPUT_MODE_TYPE;
39
40
  protected _placeholder: string | undefined;
@@ -42,13 +43,14 @@ export declare class NgcInputText extends NgcInputBase {
42
43
  protected _errorText: string | undefined;
43
44
  protected _internalValidationError: string | undefined;
44
45
  protected _nativeInputError: string | undefined;
45
- private _showErrors;
46
+ protected _showErrors: boolean;
46
47
  render(): import('lit').TemplateResult<1>;
47
- private updateRequiredValidity;
48
+ protected updateRequiredValidity(): void;
48
49
  protected updated(changedProperties: Map<string, string> | PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
49
50
  get displayedErrorText(): string | undefined;
50
51
  get isAriaInvalid(): "true" | "false";
51
52
  get passwordVisibilityMarkup(): import('lit').TemplateResult<1> | null;
53
+ protected willUpdate(changedProperties: PropertyValueMap<this>): void;
52
54
  connectedCallback(): void;
53
55
  private _onInvalid;
54
56
  handleNativeInputValidation(e: Event): void;
@@ -56,7 +58,7 @@ export declare class NgcInputText extends NgcInputBase {
56
58
  handleInputEvent(e: Event): void;
57
59
  handleChange(e: Event): void;
58
60
  togglePasswordVisibility(): void;
59
- private syncValidity;
61
+ protected syncValidity(): void;
60
62
  handleInputFocusOut(): void;
61
63
  get errorTextMarkup(): import('lit').TemplateResult<1> | null;
62
64
  }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ncino/web-components",
3
3
  "author": "nCino",
4
- "version": "10.2.1",
4
+ "version": "10.2.2",
5
5
  "license": "(c) Copyright 2023 nCino, Inc., all rights reserved",
6
6
  "publishConfig": {
7
7
  "registry": "https://registry.npmjs.org/"
@@ -100,7 +100,7 @@
100
100
  "vite-plugin-static-copy": "^3.3.0",
101
101
  "vitest": "^4.1.0",
102
102
  "yaml-eslint-parser": "^2.0.0",
103
- "@ncino/styles": "10.2.1"
103
+ "@ncino/styles": "10.2.2"
104
104
  },
105
105
  "peerDependencies": {
106
106
  "@ncino/styles": ">=8.0.0-preview.0"
package/web-types.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
3
3
  "name": "@ncino/web-components",
4
- "version": "10.2.0",
4
+ "version": "10.2.1",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
@@ -925,6 +925,12 @@
925
925
  { "name": "max", "value": { "type": "string" } },
926
926
  { "name": "step", "value": { "type": "number" } },
927
927
  { "name": "pattern", "value": { "type": "string" } },
928
+ {
929
+ "name": "inputmode",
930
+ "value": {
931
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
932
+ }
933
+ },
928
934
  { "name": "id", "value": { "type": "string", "default": "''" } },
929
935
  {
930
936
  "name": "required",
@@ -1020,6 +1026,10 @@
1020
1026
  { "name": "max", "type": "string" },
1021
1027
  { "name": "step", "type": "number" },
1022
1028
  { "name": "pattern", "type": "string" },
1029
+ {
1030
+ "name": "hostInputMode",
1031
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
1032
+ },
1023
1033
  { "name": "displayedErrorText" },
1024
1034
  { "name": "isAriaInvalid" },
1025
1035
  { "name": "passwordVisibilityMarkup" },
@@ -1101,6 +1111,12 @@
1101
1111
  { "name": "max", "value": { "type": "string" } },
1102
1112
  { "name": "step", "value": { "type": "number" } },
1103
1113
  { "name": "pattern", "value": { "type": "string" } },
1114
+ {
1115
+ "name": "inputmode",
1116
+ "value": {
1117
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
1118
+ }
1119
+ },
1104
1120
  { "name": "id", "value": { "type": "string", "default": "''" } },
1105
1121
  {
1106
1122
  "name": "required",
@@ -1204,6 +1220,10 @@
1204
1220
  { "name": "max", "type": "string" },
1205
1221
  { "name": "step", "type": "number" },
1206
1222
  { "name": "pattern", "type": "string" },
1223
+ {
1224
+ "name": "hostInputMode",
1225
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
1226
+ },
1207
1227
  { "name": "displayedErrorText" },
1208
1228
  { "name": "isAriaInvalid" },
1209
1229
  { "name": "passwordVisibilityMarkup" },
@@ -1272,6 +1292,12 @@
1272
1292
  { "name": "max", "value": { "type": "string" } },
1273
1293
  { "name": "step", "value": { "type": "number" } },
1274
1294
  { "name": "pattern", "value": { "type": "string" } },
1295
+ {
1296
+ "name": "inputmode",
1297
+ "value": {
1298
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
1299
+ }
1300
+ },
1275
1301
  { "name": "id", "value": { "type": "string", "default": "''" } },
1276
1302
  {
1277
1303
  "name": "required",
@@ -1373,6 +1399,10 @@
1373
1399
  { "name": "max", "type": "string" },
1374
1400
  { "name": "step", "type": "number" },
1375
1401
  { "name": "pattern", "type": "string" },
1402
+ {
1403
+ "name": "hostInputMode",
1404
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
1405
+ },
1376
1406
  { "name": "displayedErrorText" },
1377
1407
  { "name": "isAriaInvalid" },
1378
1408
  { "name": "passwordVisibilityMarkup" },
@@ -1445,6 +1475,12 @@
1445
1475
  { "name": "max", "value": { "type": "string" } },
1446
1476
  { "name": "step", "value": { "type": "number" } },
1447
1477
  { "name": "pattern", "value": { "type": "string" } },
1478
+ {
1479
+ "name": "inputmode",
1480
+ "value": {
1481
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
1482
+ }
1483
+ },
1448
1484
  { "name": "id", "value": { "type": "string", "default": "''" } },
1449
1485
  {
1450
1486
  "name": "required",
@@ -1545,6 +1581,10 @@
1545
1581
  { "name": "max", "type": "string" },
1546
1582
  { "name": "step", "type": "number" },
1547
1583
  { "name": "pattern", "type": "string" },
1584
+ {
1585
+ "name": "hostInputMode",
1586
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
1587
+ },
1548
1588
  { "name": "displayedErrorText" },
1549
1589
  { "name": "isAriaInvalid" },
1550
1590
  { "name": "passwordVisibilityMarkup" },
@@ -2462,6 +2502,12 @@
2462
2502
  { "name": "max", "value": { "type": "string" } },
2463
2503
  { "name": "step", "value": { "type": "number" } },
2464
2504
  { "name": "pattern", "value": { "type": "string" } },
2505
+ {
2506
+ "name": "inputmode",
2507
+ "value": {
2508
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
2509
+ }
2510
+ },
2465
2511
  { "name": "id", "value": { "type": "string", "default": "''" } },
2466
2512
  {
2467
2513
  "name": "required",
@@ -2564,6 +2610,10 @@
2564
2610
  { "name": "max", "type": "string" },
2565
2611
  { "name": "step", "type": "number" },
2566
2612
  { "name": "pattern", "type": "string" },
2613
+ {
2614
+ "name": "hostInputMode",
2615
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
2616
+ },
2567
2617
  { "name": "displayedErrorText" },
2568
2618
  { "name": "isAriaInvalid" },
2569
2619
  { "name": "passwordVisibilityMarkup" },
@@ -2635,6 +2685,12 @@
2635
2685
  { "name": "max", "value": { "type": "string" } },
2636
2686
  { "name": "step", "value": { "type": "number" } },
2637
2687
  { "name": "pattern", "value": { "type": "string" } },
2688
+ {
2689
+ "name": "inputmode",
2690
+ "value": {
2691
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
2692
+ }
2693
+ },
2638
2694
  { "name": "id", "value": { "type": "string", "default": "''" } },
2639
2695
  {
2640
2696
  "name": "required",
@@ -2736,6 +2792,10 @@
2736
2792
  { "name": "max", "type": "string" },
2737
2793
  { "name": "step", "type": "number" },
2738
2794
  { "name": "pattern", "type": "string" },
2795
+ {
2796
+ "name": "hostInputMode",
2797
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
2798
+ },
2739
2799
  { "name": "displayedErrorText" },
2740
2800
  { "name": "isAriaInvalid" },
2741
2801
  { "name": "passwordVisibilityMarkup" },
@@ -3677,7 +3737,7 @@
3677
3737
  },
3678
3738
  {
3679
3739
  "name": "ngc-input-currency",
3680
- "description": "\n---\n\n\n### **Events:**\n - **change**\n- **input**",
3740
+ "description": "\n---\n\n\n### **Events:**\n - **input**\n- **change**",
3681
3741
  "doc-url": "",
3682
3742
  "attributes": [
3683
3743
  {
@@ -3690,6 +3750,12 @@
3690
3750
  { "name": "max", "value": { "type": "string" } },
3691
3751
  { "name": "step", "value": { "type": "number" } },
3692
3752
  { "name": "pattern", "value": { "type": "string" } },
3753
+ {
3754
+ "name": "inputmode",
3755
+ "value": {
3756
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
3757
+ }
3758
+ },
3693
3759
  { "name": "id", "value": { "type": "string", "default": "''" } },
3694
3760
  {
3695
3761
  "name": "required",
@@ -3773,8 +3839,8 @@
3773
3839
  }
3774
3840
  ],
3775
3841
  "events": [
3776
- { "name": "change", "type": "CustomEvent" },
3777
- { "name": "input", "type": "CustomEvent" }
3842
+ { "name": "input", "type": "CustomEvent" },
3843
+ { "name": "change", "type": "CustomEvent" }
3778
3844
  ],
3779
3845
  "js": {
3780
3846
  "properties": [
@@ -3789,6 +3855,10 @@
3789
3855
  { "name": "max", "type": "string" },
3790
3856
  { "name": "step", "type": "number" },
3791
3857
  { "name": "pattern", "type": "string" },
3858
+ {
3859
+ "name": "hostInputMode",
3860
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
3861
+ },
3792
3862
  { "name": "displayedErrorText" },
3793
3863
  { "name": "isAriaInvalid" },
3794
3864
  { "name": "passwordVisibilityMarkup" },
@@ -3837,8 +3907,8 @@
3837
3907
  { "name": "errorMessageDataTestid" }
3838
3908
  ],
3839
3909
  "events": [
3840
- { "name": "change", "type": "CustomEvent" },
3841
- { "name": "input", "type": "CustomEvent" }
3910
+ { "name": "input", "type": "CustomEvent" },
3911
+ { "name": "change", "type": "CustomEvent" }
3842
3912
  ]
3843
3913
  }
3844
3914
  },
@@ -4058,6 +4128,12 @@
4058
4128
  { "name": "max", "value": { "type": "string" } },
4059
4129
  { "name": "step", "value": { "type": "number" } },
4060
4130
  { "name": "pattern", "value": { "type": "string" } },
4131
+ {
4132
+ "name": "inputmode",
4133
+ "value": {
4134
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
4135
+ }
4136
+ },
4061
4137
  { "name": "id", "value": { "type": "string", "default": "''" } },
4062
4138
  {
4063
4139
  "name": "required",
@@ -4182,6 +4258,10 @@
4182
4258
  { "name": "max", "type": "string" },
4183
4259
  { "name": "step", "type": "number" },
4184
4260
  { "name": "pattern", "type": "string" },
4261
+ {
4262
+ "name": "hostInputMode",
4263
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
4264
+ },
4185
4265
  { "name": "displayedErrorText" },
4186
4266
  { "name": "isAriaInvalid" },
4187
4267
  { "name": "passwordVisibilityMarkup" },
@@ -4254,6 +4334,12 @@
4254
4334
  { "name": "max", "value": { "type": "string" } },
4255
4335
  { "name": "step", "value": { "type": "number" } },
4256
4336
  { "name": "pattern", "value": { "type": "string" } },
4337
+ {
4338
+ "name": "inputmode",
4339
+ "value": {
4340
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
4341
+ }
4342
+ },
4257
4343
  { "name": "id", "value": { "type": "string", "default": "''" } },
4258
4344
  {
4259
4345
  "name": "required",
@@ -4355,6 +4441,10 @@
4355
4441
  { "name": "max", "type": "string" },
4356
4442
  { "name": "step", "type": "number" },
4357
4443
  { "name": "pattern", "type": "string" },
4444
+ {
4445
+ "name": "hostInputMode",
4446
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
4447
+ },
4358
4448
  { "name": "displayedErrorText" },
4359
4449
  { "name": "isAriaInvalid" },
4360
4450
  { "name": "passwordVisibilityMarkup" },
@@ -4444,6 +4534,12 @@
4444
4534
  { "name": "max", "value": { "type": "string" } },
4445
4535
  { "name": "step", "value": { "type": "number" } },
4446
4536
  { "name": "pattern", "value": { "type": "string" } },
4537
+ {
4538
+ "name": "inputmode",
4539
+ "value": {
4540
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
4541
+ }
4542
+ },
4447
4543
  { "name": "id", "value": { "type": "string", "default": "''" } },
4448
4544
  {
4449
4545
  "name": "required",
@@ -4550,6 +4646,10 @@
4550
4646
  { "name": "max", "type": "string" },
4551
4647
  { "name": "step", "type": "number" },
4552
4648
  { "name": "pattern", "type": "string" },
4649
+ {
4650
+ "name": "hostInputMode",
4651
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
4652
+ },
4553
4653
  { "name": "displayedErrorText" },
4554
4654
  { "name": "isAriaInvalid" },
4555
4655
  { "name": "passwordVisibilityMarkup" },
@@ -4614,6 +4714,12 @@
4614
4714
  { "name": "max", "value": { "type": "string" } },
4615
4715
  { "name": "step", "value": { "type": "number" } },
4616
4716
  { "name": "pattern", "value": { "type": "string" } },
4717
+ {
4718
+ "name": "inputmode",
4719
+ "value": {
4720
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
4721
+ }
4722
+ },
4617
4723
  { "name": "id", "value": { "type": "string", "default": "''" } },
4618
4724
  {
4619
4725
  "name": "required",
@@ -4709,6 +4815,10 @@
4709
4815
  { "name": "max", "type": "string" },
4710
4816
  { "name": "step", "type": "number" },
4711
4817
  { "name": "pattern", "type": "string" },
4818
+ {
4819
+ "name": "hostInputMode",
4820
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
4821
+ },
4712
4822
  { "name": "displayedErrorText" },
4713
4823
  { "name": "isAriaInvalid" },
4714
4824
  { "name": "passwordVisibilityMarkup" },
@@ -5641,6 +5751,12 @@
5641
5751
  { "name": "max", "value": { "type": "string" } },
5642
5752
  { "name": "step", "value": { "type": "number" } },
5643
5753
  { "name": "pattern", "value": { "type": "string" } },
5754
+ {
5755
+ "name": "inputmode",
5756
+ "value": {
5757
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
5758
+ }
5759
+ },
5644
5760
  { "name": "id", "value": { "type": "string", "default": "''" } },
5645
5761
  {
5646
5762
  "name": "required",
@@ -5742,6 +5858,10 @@
5742
5858
  { "name": "max", "type": "string" },
5743
5859
  { "name": "step", "type": "number" },
5744
5860
  { "name": "pattern", "type": "string" },
5861
+ {
5862
+ "name": "hostInputMode",
5863
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
5864
+ },
5745
5865
  { "name": "displayedErrorText" },
5746
5866
  { "name": "isAriaInvalid" },
5747
5867
  { "name": "passwordVisibilityMarkup" },
@@ -6962,6 +7082,12 @@
6962
7082
  { "name": "max", "value": { "type": "string" } },
6963
7083
  { "name": "step", "value": { "type": "number" } },
6964
7084
  { "name": "pattern", "value": { "type": "string" } },
7085
+ {
7086
+ "name": "inputmode",
7087
+ "value": {
7088
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
7089
+ }
7090
+ },
6965
7091
  { "name": "id", "value": { "type": "string", "default": "''" } },
6966
7092
  {
6967
7093
  "name": "required",
@@ -7068,6 +7194,10 @@
7068
7194
  { "name": "max", "type": "string" },
7069
7195
  { "name": "step", "type": "number" },
7070
7196
  { "name": "pattern", "type": "string" },
7197
+ {
7198
+ "name": "hostInputMode",
7199
+ "type": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url' | undefined"
7200
+ },
7071
7201
  { "name": "displayedErrorText" },
7072
7202
  { "name": "isAriaInvalid" },
7073
7203
  { "name": "passwordVisibilityMarkup" },