inviton-powerduck 0.0.175 → 0.0.176
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,3 +1,4 @@
|
|
|
1
|
+
import type { ValidationState } from '../../common/static-wrappers/interfaces/validation-interface';
|
|
1
2
|
import { Prop, toNative } from 'vue-facing-decorator';
|
|
2
3
|
import TsxComponent, { Component } from '../../app/vuetsx';
|
|
3
4
|
import { isNullOrEmpty } from '../../common/utils/is-null-or-empty';
|
|
@@ -11,15 +12,18 @@ export enum PinInputType {
|
|
|
11
12
|
}
|
|
12
13
|
|
|
13
14
|
interface PinInputArgs {
|
|
15
|
+
showValue?: boolean;
|
|
14
16
|
length: number;
|
|
15
17
|
cssClass?: string;
|
|
16
18
|
inputType?: PinInputType;
|
|
17
19
|
value: string[];
|
|
18
20
|
changed: (value: string[]) => void;
|
|
21
|
+
validationState?: ValidationState;
|
|
19
22
|
}
|
|
20
23
|
|
|
21
24
|
@Component
|
|
22
25
|
class PinInputComponent extends TsxComponent<PinInputArgs> implements PinInputArgs {
|
|
26
|
+
@Prop() showValue: boolean;
|
|
23
27
|
@Prop() length: number;
|
|
24
28
|
@Prop() cssClass!: string;
|
|
25
29
|
@Prop() inputType: PinInputType;
|
|
@@ -102,11 +106,17 @@ class PinInputComponent extends TsxComponent<PinInputArgs> implements PinInputAr
|
|
|
102
106
|
return this.$refs[`pin-${index}`] as typeof TextBox.prototype;
|
|
103
107
|
}
|
|
104
108
|
|
|
109
|
+
getTextType(): TextBoxTextType {
|
|
110
|
+
return this.showValue ? TextBoxTextType.Text : TextBoxTextType.Password;
|
|
111
|
+
}
|
|
112
|
+
|
|
105
113
|
render(h) {
|
|
106
114
|
if (!this.currentValue) {
|
|
107
115
|
return null;
|
|
108
116
|
}
|
|
109
117
|
|
|
118
|
+
const textType = this.getTextType();
|
|
119
|
+
|
|
110
120
|
return (
|
|
111
121
|
<div class={this.getCssClass()}>
|
|
112
122
|
{Array.from({ length: this.length }, (_, index) => (
|
|
@@ -120,7 +130,7 @@ class PinInputComponent extends TsxComponent<PinInputArgs> implements PinInputAr
|
|
|
120
130
|
cssClass="pin-input"
|
|
121
131
|
updateMode="input"
|
|
122
132
|
autoCompleteEnabled={false}
|
|
123
|
-
textType={
|
|
133
|
+
textType={textType}
|
|
124
134
|
value={this.currentValue[index]}
|
|
125
135
|
keyDown={(e) => {
|
|
126
136
|
if (e.key == 'Backspace') {
|