ngx-mask 19.0.7 → 20.0.0
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.
- package/README.md +187 -146
- package/fesm2022/ngx-mask.mjs +44 -44
- package/fesm2022/ngx-mask.mjs.map +1 -1
- package/index.d.ts +270 -5
- package/package.json +1 -1
- package/lib/custom-keyboard-event.d.ts +0 -1
- package/lib/ngx-mask-applier.service.d.ts +0 -55
- package/lib/ngx-mask-expression.enum.d.ts +0 -43
- package/lib/ngx-mask.config.d.ts +0 -40
- package/lib/ngx-mask.directive.d.ts +0 -78
- package/lib/ngx-mask.pipe.d.ts +0 -13
- package/lib/ngx-mask.providers.d.ts +0 -4
- package/lib/ngx-mask.service.d.ts +0 -83
package/README.md
CHANGED
|
@@ -1,214 +1,255 @@
|
|
|
1
|
-
<
|
|
2
|
-
<h1 align="center">NGX MASK</h1>
|
|
3
|
-
</a>
|
|
1
|
+
<h1 align="center">NGX-MASK</h1>
|
|
4
2
|
|
|
5
3
|
<p align="center">
|
|
6
|
-
|
|
4
|
+
A powerful Angular directive for input masking with customizable patterns
|
|
7
5
|
</p>
|
|
8
6
|
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
7
|
+
<p align="center">
|
|
8
|
+
Created with ❤️ by
|
|
9
|
+
</p>
|
|
12
10
|
|
|
13
|
-
|
|
11
|
+
<p align="center">
|
|
12
|
+
<a href="https://jsdaddy.io">
|
|
13
|
+
<img src="http://jsdaddy.io/assets/images/shared/logo.svg" alt="JSDaddy" width="75">
|
|
14
|
+
</a>
|
|
15
|
+
</p>
|
|
14
16
|
|
|
15
|
-
|
|
17
|
+
<p align="center">
|
|
18
|
+
<a href="https://github.com/JsDaddy/ngx-mask/actions/workflows/quality-check.yml">
|
|
19
|
+
<img src="https://github.com/JsDaddy/ngx-mask/actions/workflows/quality-check.yml/badge.svg?branch=develop" alt="CI">
|
|
20
|
+
</a>
|
|
21
|
+
<a href="https://www.npmjs.com/package/ngx-mask">
|
|
22
|
+
<img src="https://img.shields.io/npm/v/ngx-mask.svg" alt="npm version">
|
|
23
|
+
</a>
|
|
24
|
+
<a href="https://npmjs.org/ngx-mask">
|
|
25
|
+
<img src="https://img.shields.io/npm/dt/ngx-mask.svg" alt="npm downloads">
|
|
26
|
+
</a>
|
|
27
|
+
<a href="https://www.npmjs.com/package/ngx-mask">
|
|
28
|
+
<img src="https://img.shields.io/npm/dm/ngx-mask.svg" alt="npm monthly downloads">
|
|
29
|
+
</a>
|
|
30
|
+
<a href="https://github.com/JSDaddy/ngx-mask">
|
|
31
|
+
<img src="https://img.shields.io/github/contributors/JSDaddy/ngx-mask.svg?style=flat" alt="GitHub contributors">
|
|
32
|
+
</a>
|
|
33
|
+
<a href="https://github.com/JSDaddy/ngx-mask">
|
|
34
|
+
<img src="https://img.shields.io/github/stars/JSDaddy/ngx-mask.svg?label=GitHub%20Stars&style=flat" alt="GitHub Stars">
|
|
35
|
+
</a>
|
|
36
|
+
</p>
|
|
16
37
|
|
|
17
|
-
|
|
38
|
+
## Table of Contents
|
|
18
39
|
|
|
19
|
-
|
|
20
|
-
|
|
40
|
+
- [Features](#features)
|
|
41
|
+
- [Demo](#demo)
|
|
42
|
+
- [Installation](#installation)
|
|
43
|
+
- [Version Compatibility](#version-compatibility)
|
|
44
|
+
- [Quick Start](#quick-start)
|
|
45
|
+
- [For Angular 15+ (Standalone)](#for-angular-15-standalone)
|
|
46
|
+
- [For Angular Modules](#for-angular-modules)
|
|
47
|
+
- [Related Projects](#related-projects)
|
|
48
|
+
- [Contributing](#contributing)
|
|
21
49
|
|
|
22
|
-
|
|
50
|
+
## Features
|
|
23
51
|
|
|
24
|
-
|
|
52
|
+
NGX-MASK is a feature-rich input mask directive for Angular applications that provides:
|
|
25
53
|
|
|
26
|
-
|
|
54
|
+
<table>
|
|
55
|
+
<tr>
|
|
56
|
+
<td width="33%" valign="top">
|
|
27
57
|
|
|
28
|
-
|
|
58
|
+
### 🎯 Masking Patterns
|
|
29
59
|
|
|
30
|
-
|
|
31
|
-
$ npm install --save ngx-mask
|
|
32
|
-
```
|
|
60
|
+
• Custom patterns & expressions
|
|
33
61
|
|
|
34
|
-
|
|
62
|
+
• Multiple mask patterns (|)
|
|
35
63
|
|
|
36
|
-
|
|
37
|
-
$ bun install --save ngx-mask
|
|
38
|
-
```
|
|
64
|
+
• Built-in common patterns
|
|
39
65
|
|
|
40
|
-
|
|
66
|
+
• Prefix & suffix support
|
|
41
67
|
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
```
|
|
68
|
+
</td>
|
|
69
|
+
<td width="33%" valign="top">
|
|
45
70
|
|
|
46
|
-
|
|
71
|
+
### 🔢 Number Formatting
|
|
47
72
|
|
|
48
|
-
|
|
49
|
-
$ npm install --save ngx-mask@15.2.3
|
|
50
|
-
```
|
|
73
|
+
• Thousand separators
|
|
51
74
|
|
|
52
|
-
|
|
75
|
+
• Decimal markers
|
|
53
76
|
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
77
|
+
• Negative numbers
|
|
78
|
+
|
|
79
|
+
• Leading zeros
|
|
80
|
+
|
|
81
|
+
</td>
|
|
82
|
+
<td width="33%" valign="top">
|
|
83
|
+
|
|
84
|
+
### ⚡ Input Control
|
|
85
|
+
|
|
86
|
+
• Real-time validation
|
|
87
|
+
|
|
88
|
+
• Clear on non-match
|
|
89
|
+
|
|
90
|
+
• Show/hide mask typing
|
|
91
|
+
|
|
92
|
+
• Keep character positions
|
|
93
|
+
|
|
94
|
+
</td>
|
|
95
|
+
</tr>
|
|
96
|
+
<tr>
|
|
97
|
+
<td width="33%" valign="top">
|
|
98
|
+
|
|
99
|
+
### 📅 Date & Time
|
|
100
|
+
|
|
101
|
+
• Leading zero handling
|
|
102
|
+
|
|
103
|
+
• AM/PM support
|
|
104
|
+
|
|
105
|
+
• Custom separators
|
|
106
|
+
|
|
107
|
+
• Multiple formats
|
|
108
|
+
|
|
109
|
+
</td>
|
|
110
|
+
<td width="33%" valign="top">
|
|
111
|
+
|
|
112
|
+
### 🛠️ Customization
|
|
113
|
+
|
|
114
|
+
• Custom placeholders
|
|
115
|
+
|
|
116
|
+
• Special characters
|
|
117
|
+
|
|
118
|
+
• Transform functions
|
|
57
119
|
|
|
58
|
-
|
|
120
|
+
• Custom validation
|
|
121
|
+
|
|
122
|
+
</td>
|
|
123
|
+
<td width="33%" valign="top">
|
|
124
|
+
|
|
125
|
+
### 📋 Form Integration
|
|
126
|
+
|
|
127
|
+
• Reactive Forms
|
|
128
|
+
|
|
129
|
+
• ControlValueAccessor
|
|
130
|
+
|
|
131
|
+
• Built-in validation
|
|
132
|
+
|
|
133
|
+
• Standalone support
|
|
134
|
+
|
|
135
|
+
</td>
|
|
136
|
+
</tr>
|
|
137
|
+
</table>
|
|
138
|
+
|
|
139
|
+
## Demo
|
|
140
|
+
|
|
141
|
+
Check out our [live documentation and examples](https://jsdaddy.github.io/ngx-mask/)
|
|
142
|
+
|
|
143
|
+
## Installation
|
|
59
144
|
|
|
60
145
|
```bash
|
|
61
|
-
|
|
146
|
+
# For Angular 17 and above
|
|
147
|
+
$ npm install ngx-mask # Using npm
|
|
148
|
+
$ bun add ngx-mask # Using bun
|
|
149
|
+
|
|
150
|
+
# For specific Angular versions:
|
|
151
|
+
# Angular 16.x.x
|
|
152
|
+
$ npm install ngx-mask@16.4.2 # Using npm
|
|
153
|
+
$ bun add ngx-mask@16.4.2 # Using bun
|
|
154
|
+
|
|
155
|
+
# Angular 15.x.x
|
|
156
|
+
$ npm install ngx-mask@15.2.3 # Using npm
|
|
157
|
+
$ bun add ngx-mask@15.2.3 # Using bun
|
|
158
|
+
|
|
159
|
+
# Angular 14.x.x
|
|
160
|
+
$ npm install ngx-mask@14.3.3 # Using npm
|
|
161
|
+
$ bun add ngx-mask@14.3.3 # Using bun
|
|
162
|
+
|
|
163
|
+
# Angular 13.x.x or 12.x.x
|
|
164
|
+
$ npm install ngx-mask@13.2.2 # Using npm
|
|
165
|
+
$ bun add ngx-mask@13.2.2 # Using bun
|
|
62
166
|
```
|
|
63
167
|
|
|
64
|
-
|
|
168
|
+
> **Package Manager Note**: You can use either npm or bun based on your preference. Both package managers will work equally well with ngx-mask.
|
|
65
169
|
|
|
66
|
-
|
|
170
|
+
## Version Compatibility
|
|
67
171
|
|
|
68
|
-
|
|
172
|
+
NGX-MASK follows Angular's official support policy, supporting Active and LTS versions. Currently supported:
|
|
69
173
|
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
provideEnvironmentNgxMask(),
|
|
75
|
-
(...)
|
|
76
|
-
],
|
|
77
|
-
}).catch((err) => console.error(err));
|
|
78
|
-
```
|
|
174
|
+
- Angular 17 and newer (latest features and updates)
|
|
175
|
+
- For older Angular versions, use the corresponding NGX-MASK version as specified above
|
|
176
|
+
|
|
177
|
+
> **Note**: Versions for Angular older than v17 will not receive new features or updates.
|
|
79
178
|
|
|
80
|
-
|
|
179
|
+
## Quick Start
|
|
180
|
+
|
|
181
|
+
### For Angular 15+ (Standalone)
|
|
182
|
+
|
|
183
|
+
#### Application-wide Setup with Default Config
|
|
81
184
|
|
|
82
185
|
```typescript
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
validation: false,
|
|
87
|
-
};
|
|
88
|
-
|
|
89
|
-
bootstrapApplication(AppComponent, {
|
|
90
|
-
providers: [
|
|
91
|
-
(...)
|
|
92
|
-
provideEnvironmentNgxMask(maskConfig),
|
|
93
|
-
(...)
|
|
94
|
-
],
|
|
95
|
-
}).catch((err) => console.error(err));
|
|
186
|
+
bootstrapApplication(AppComponent, { providers: [provideEnvironmentNgxMask()] }).catch((err) =>
|
|
187
|
+
console.error(err)
|
|
188
|
+
);
|
|
96
189
|
```
|
|
97
190
|
|
|
98
|
-
|
|
191
|
+
#### With Custom Configuration
|
|
99
192
|
|
|
100
193
|
```typescript
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
providers: [
|
|
109
|
-
(...)
|
|
110
|
-
provideEnvironmentNgxMask(maskConfigFunction),
|
|
111
|
-
(...)
|
|
112
|
-
],
|
|
113
|
-
}).catch((err) => console.error(err));
|
|
194
|
+
import { NgxMaskConfig } from 'ngx-mask';
|
|
195
|
+
|
|
196
|
+
const maskConfig: Partial<NgxMaskConfig> = { validation: false };
|
|
197
|
+
|
|
198
|
+
bootstrapApplication(AppComponent, { providers: [provideEnvironmentNgxMask(maskConfig)] }).catch(
|
|
199
|
+
(err) => console.error(err)
|
|
200
|
+
);
|
|
114
201
|
```
|
|
115
202
|
|
|
116
|
-
|
|
203
|
+
#### Feature-level Configuration
|
|
117
204
|
|
|
118
205
|
```typescript
|
|
119
206
|
@Component({
|
|
120
207
|
selector: 'my-feature',
|
|
121
|
-
templateUrl: './my-feature.component.html',
|
|
122
|
-
styleUrls: ['./my-feature.component.css'],
|
|
123
208
|
standalone: true,
|
|
124
|
-
imports: [NgxMaskDirective
|
|
125
|
-
providers: [
|
|
126
|
-
(...)
|
|
127
|
-
provideNgxMask(),
|
|
128
|
-
(...)
|
|
129
|
-
],
|
|
209
|
+
imports: [NgxMaskDirective],
|
|
210
|
+
providers: [provideNgxMask()],
|
|
130
211
|
})
|
|
131
212
|
export class MyFeatureComponent {}
|
|
132
213
|
```
|
|
133
214
|
|
|
134
|
-
|
|
215
|
+
### For Angular < 15 (NgModule)
|
|
135
216
|
|
|
136
|
-
|
|
217
|
+
#### Application-wide Setup with Default Config
|
|
137
218
|
|
|
138
219
|
```typescript
|
|
139
|
-
|
|
140
|
-
imports: [
|
|
141
|
-
NgxMaskDirective, NgxMaskPipe
|
|
142
|
-
],
|
|
143
|
-
providers: [provideNgxMask()]
|
|
144
|
-
})
|
|
145
|
-
```
|
|
146
|
-
|
|
147
|
-
## Quickstart if ngx-mask version < 15.0.0
|
|
148
|
-
|
|
149
|
-
For version ngx-mask < 15.0.0
|
|
150
|
-
Import **ngx-mask** module in Angular app.
|
|
151
|
-
|
|
152
|
-
### With default mask config options
|
|
153
|
-
|
|
154
|
-
```typescript
|
|
155
|
-
import { NgxMaskModule, NgxMaskConfig } from 'ngx-mask'
|
|
156
|
-
|
|
157
|
-
export const options: Partial<null | NgxMaskConfig> | (() => Partial<NgxMaskConfig>) = null;
|
|
220
|
+
import { NgxMaskModule } from 'ngx-mask';
|
|
158
221
|
|
|
159
|
-
@NgModule({
|
|
160
|
-
|
|
161
|
-
NgxMaskModule.forRoot(),
|
|
162
|
-
],
|
|
163
|
-
})
|
|
222
|
+
@NgModule({ imports: [NgxMaskModule.forRoot()] })
|
|
223
|
+
export class AppModule {}
|
|
164
224
|
```
|
|
165
225
|
|
|
166
|
-
|
|
226
|
+
#### With Custom Configuration
|
|
167
227
|
|
|
168
228
|
```typescript
|
|
169
|
-
import { NgxMaskModule, NgxMaskConfig } from 'ngx-mask'
|
|
229
|
+
import { NgxMaskModule, NgxMaskConfig } from 'ngx-mask';
|
|
170
230
|
|
|
171
|
-
const maskConfig: Partial<NgxMaskConfig> = {
|
|
172
|
-
validation: false,
|
|
173
|
-
};
|
|
231
|
+
const maskConfig: Partial<NgxMaskConfig> = { validation: false };
|
|
174
232
|
|
|
175
|
-
@NgModule({
|
|
176
|
-
|
|
177
|
-
NgxMaskModule.forRoot(maskConfig),
|
|
178
|
-
],
|
|
179
|
-
})
|
|
233
|
+
@NgModule({ imports: [NgxMaskModule.forRoot(maskConfig)] })
|
|
234
|
+
export class AppModule {}
|
|
180
235
|
```
|
|
181
236
|
|
|
182
|
-
|
|
237
|
+
#### Feature-level Configuration
|
|
183
238
|
|
|
184
239
|
```typescript
|
|
185
|
-
|
|
186
|
-
return {
|
|
187
|
-
validation: false,
|
|
188
|
-
};
|
|
189
|
-
};
|
|
190
|
-
|
|
191
|
-
@NgModule({
|
|
192
|
-
imports: [
|
|
193
|
-
NgxMaskModule.forRoot(maskConfigFunction),
|
|
194
|
-
],
|
|
195
|
-
})
|
|
196
|
-
```
|
|
240
|
+
import { NgxMaskModule } from 'ngx-mask';
|
|
197
241
|
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
ngx-mask follows the official Angular support policy, supporting the Active and LTS (Long-Term Support) versions of Angular. As of the latest release, Angular v17 and newer are supported.
|
|
203
|
-
|
|
204
|
-
Projects using Angular versions outside the supported range (e.g., older than v17) should use the last compatible version of ngx-mask. However, these versions will no longer receive updates, bug fixes, or new features.
|
|
242
|
+
@NgModule({ imports: [NgxMaskModule.forChild()] })
|
|
243
|
+
export class FeatureModule {}
|
|
244
|
+
```
|
|
205
245
|
|
|
206
|
-
|
|
246
|
+
## Related Projects
|
|
207
247
|
|
|
208
|
-
|
|
248
|
+
Check out other projects by JSDaddy:
|
|
209
249
|
|
|
210
|
-
|
|
250
|
+
- [ngx-copypaste](https://github.com/JsDaddy/ngx-copypaste)
|
|
251
|
+
- [ngx-loader-indicator](https://github.com/JsDaddy/ngx-loader-indicator)
|
|
211
252
|
|
|
212
253
|
## Contributing
|
|
213
254
|
|
|
214
|
-
We
|
|
255
|
+
We welcome contributions! Please read our [contributing guidelines](CONTRIBUTING.md) to learn about our development process and how you can propose bugfixes and improvements.
|
package/fesm2022/ngx-mask.mjs
CHANGED
|
@@ -901,10 +901,10 @@ class NgxMaskApplierService {
|
|
|
901
901
|
nonZeroIndex,
|
|
902
902
|
};
|
|
903
903
|
}
|
|
904
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
905
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
904
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: NgxMaskApplierService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
905
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: NgxMaskApplierService });
|
|
906
906
|
}
|
|
907
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
907
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: NgxMaskApplierService, decorators: [{
|
|
908
908
|
type: Injectable
|
|
909
909
|
}] });
|
|
910
910
|
|
|
@@ -1550,10 +1550,10 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1550
1550
|
currentLocaleDecimalMarker() {
|
|
1551
1551
|
return (1.1).toLocaleString().substring(1, 2);
|
|
1552
1552
|
}
|
|
1553
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1554
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1553
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: NgxMaskService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
|
|
1554
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: NgxMaskService });
|
|
1555
1555
|
}
|
|
1556
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1556
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: NgxMaskService, decorators: [{
|
|
1557
1557
|
type: Injectable
|
|
1558
1558
|
}] });
|
|
1559
1559
|
|
|
@@ -1589,40 +1589,40 @@ function provideEnvironmentNgxMask(configValue) {
|
|
|
1589
1589
|
}
|
|
1590
1590
|
|
|
1591
1591
|
class NgxMaskDirective {
|
|
1592
|
-
mask = input('');
|
|
1593
|
-
specialCharacters = input([]);
|
|
1594
|
-
patterns = input({});
|
|
1595
|
-
prefix = input('');
|
|
1596
|
-
suffix = input('');
|
|
1597
|
-
thousandSeparator = input(' ');
|
|
1598
|
-
decimalMarker = input('.');
|
|
1599
|
-
dropSpecialCharacters = input(null);
|
|
1600
|
-
hiddenInput = input(null);
|
|
1601
|
-
showMaskTyped = input(null);
|
|
1602
|
-
placeHolderCharacter = input(null);
|
|
1603
|
-
shownMaskExpression = input(null);
|
|
1604
|
-
clearIfNotMatch = input(null);
|
|
1605
|
-
validation = input(null);
|
|
1606
|
-
separatorLimit = input('');
|
|
1607
|
-
allowNegativeNumbers = input(null);
|
|
1608
|
-
leadZeroDateTime = input(null);
|
|
1609
|
-
leadZero = input(null);
|
|
1610
|
-
triggerOnMaskChange = input(null);
|
|
1611
|
-
apm = input(null);
|
|
1612
|
-
inputTransformFn = input(null);
|
|
1613
|
-
outputTransformFn = input(null);
|
|
1614
|
-
keepCharacterPositions = input(null);
|
|
1615
|
-
instantPrefix = input(null);
|
|
1592
|
+
mask = input('', ...(ngDevMode ? [{ debugName: "mask" }] : []));
|
|
1593
|
+
specialCharacters = input([], ...(ngDevMode ? [{ debugName: "specialCharacters" }] : []));
|
|
1594
|
+
patterns = input({}, ...(ngDevMode ? [{ debugName: "patterns" }] : []));
|
|
1595
|
+
prefix = input('', ...(ngDevMode ? [{ debugName: "prefix" }] : []));
|
|
1596
|
+
suffix = input('', ...(ngDevMode ? [{ debugName: "suffix" }] : []));
|
|
1597
|
+
thousandSeparator = input(' ', ...(ngDevMode ? [{ debugName: "thousandSeparator" }] : []));
|
|
1598
|
+
decimalMarker = input('.', ...(ngDevMode ? [{ debugName: "decimalMarker" }] : []));
|
|
1599
|
+
dropSpecialCharacters = input(null, ...(ngDevMode ? [{ debugName: "dropSpecialCharacters" }] : []));
|
|
1600
|
+
hiddenInput = input(null, ...(ngDevMode ? [{ debugName: "hiddenInput" }] : []));
|
|
1601
|
+
showMaskTyped = input(null, ...(ngDevMode ? [{ debugName: "showMaskTyped" }] : []));
|
|
1602
|
+
placeHolderCharacter = input(null, ...(ngDevMode ? [{ debugName: "placeHolderCharacter" }] : []));
|
|
1603
|
+
shownMaskExpression = input(null, ...(ngDevMode ? [{ debugName: "shownMaskExpression" }] : []));
|
|
1604
|
+
clearIfNotMatch = input(null, ...(ngDevMode ? [{ debugName: "clearIfNotMatch" }] : []));
|
|
1605
|
+
validation = input(null, ...(ngDevMode ? [{ debugName: "validation" }] : []));
|
|
1606
|
+
separatorLimit = input('', ...(ngDevMode ? [{ debugName: "separatorLimit" }] : []));
|
|
1607
|
+
allowNegativeNumbers = input(null, ...(ngDevMode ? [{ debugName: "allowNegativeNumbers" }] : []));
|
|
1608
|
+
leadZeroDateTime = input(null, ...(ngDevMode ? [{ debugName: "leadZeroDateTime" }] : []));
|
|
1609
|
+
leadZero = input(null, ...(ngDevMode ? [{ debugName: "leadZero" }] : []));
|
|
1610
|
+
triggerOnMaskChange = input(null, ...(ngDevMode ? [{ debugName: "triggerOnMaskChange" }] : []));
|
|
1611
|
+
apm = input(null, ...(ngDevMode ? [{ debugName: "apm" }] : []));
|
|
1612
|
+
inputTransformFn = input(null, ...(ngDevMode ? [{ debugName: "inputTransformFn" }] : []));
|
|
1613
|
+
outputTransformFn = input(null, ...(ngDevMode ? [{ debugName: "outputTransformFn" }] : []));
|
|
1614
|
+
keepCharacterPositions = input(null, ...(ngDevMode ? [{ debugName: "keepCharacterPositions" }] : []));
|
|
1615
|
+
instantPrefix = input(null, ...(ngDevMode ? [{ debugName: "instantPrefix" }] : []));
|
|
1616
1616
|
maskFilled = output();
|
|
1617
|
-
_maskValue = signal('');
|
|
1618
|
-
_inputValue = signal('');
|
|
1619
|
-
_position = signal(null);
|
|
1620
|
-
_code = signal('');
|
|
1621
|
-
_maskExpressionArray = signal([]);
|
|
1622
|
-
_justPasted = signal(false);
|
|
1623
|
-
_isFocused = signal(false);
|
|
1617
|
+
_maskValue = signal('', ...(ngDevMode ? [{ debugName: "_maskValue" }] : []));
|
|
1618
|
+
_inputValue = signal('', ...(ngDevMode ? [{ debugName: "_inputValue" }] : []));
|
|
1619
|
+
_position = signal(null, ...(ngDevMode ? [{ debugName: "_position" }] : []));
|
|
1620
|
+
_code = signal('', ...(ngDevMode ? [{ debugName: "_code" }] : []));
|
|
1621
|
+
_maskExpressionArray = signal([], ...(ngDevMode ? [{ debugName: "_maskExpressionArray" }] : []));
|
|
1622
|
+
_justPasted = signal(false, ...(ngDevMode ? [{ debugName: "_justPasted" }] : []));
|
|
1623
|
+
_isFocused = signal(false, ...(ngDevMode ? [{ debugName: "_isFocused" }] : []));
|
|
1624
1624
|
/**For IME composition event */
|
|
1625
|
-
_isComposing = signal(false);
|
|
1625
|
+
_isComposing = signal(false, ...(ngDevMode ? [{ debugName: "_isComposing" }] : []));
|
|
1626
1626
|
_maskService = inject(NgxMaskService, { self: true });
|
|
1627
1627
|
document = inject(DOCUMENT);
|
|
1628
1628
|
_config = inject(NGX_MASK_CONFIG);
|
|
@@ -2461,8 +2461,8 @@ class NgxMaskDirective {
|
|
|
2461
2461
|
return uniqueCharacters.size === 1;
|
|
2462
2462
|
});
|
|
2463
2463
|
}
|
|
2464
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2465
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
2464
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: NgxMaskDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
2465
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.2", type: NgxMaskDirective, isStandalone: true, selector: "input[mask], textarea[mask]", inputs: { mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, specialCharacters: { classPropertyName: "specialCharacters", publicName: "specialCharacters", isSignal: true, isRequired: false, transformFunction: null }, patterns: { classPropertyName: "patterns", publicName: "patterns", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, thousandSeparator: { classPropertyName: "thousandSeparator", publicName: "thousandSeparator", isSignal: true, isRequired: false, transformFunction: null }, decimalMarker: { classPropertyName: "decimalMarker", publicName: "decimalMarker", isSignal: true, isRequired: false, transformFunction: null }, dropSpecialCharacters: { classPropertyName: "dropSpecialCharacters", publicName: "dropSpecialCharacters", isSignal: true, isRequired: false, transformFunction: null }, hiddenInput: { classPropertyName: "hiddenInput", publicName: "hiddenInput", isSignal: true, isRequired: false, transformFunction: null }, showMaskTyped: { classPropertyName: "showMaskTyped", publicName: "showMaskTyped", isSignal: true, isRequired: false, transformFunction: null }, placeHolderCharacter: { classPropertyName: "placeHolderCharacter", publicName: "placeHolderCharacter", isSignal: true, isRequired: false, transformFunction: null }, shownMaskExpression: { classPropertyName: "shownMaskExpression", publicName: "shownMaskExpression", isSignal: true, isRequired: false, transformFunction: null }, clearIfNotMatch: { classPropertyName: "clearIfNotMatch", publicName: "clearIfNotMatch", isSignal: true, isRequired: false, transformFunction: null }, validation: { classPropertyName: "validation", publicName: "validation", isSignal: true, isRequired: false, transformFunction: null }, separatorLimit: { classPropertyName: "separatorLimit", publicName: "separatorLimit", isSignal: true, isRequired: false, transformFunction: null }, allowNegativeNumbers: { classPropertyName: "allowNegativeNumbers", publicName: "allowNegativeNumbers", isSignal: true, isRequired: false, transformFunction: null }, leadZeroDateTime: { classPropertyName: "leadZeroDateTime", publicName: "leadZeroDateTime", isSignal: true, isRequired: false, transformFunction: null }, leadZero: { classPropertyName: "leadZero", publicName: "leadZero", isSignal: true, isRequired: false, transformFunction: null }, triggerOnMaskChange: { classPropertyName: "triggerOnMaskChange", publicName: "triggerOnMaskChange", isSignal: true, isRequired: false, transformFunction: null }, apm: { classPropertyName: "apm", publicName: "apm", isSignal: true, isRequired: false, transformFunction: null }, inputTransformFn: { classPropertyName: "inputTransformFn", publicName: "inputTransformFn", isSignal: true, isRequired: false, transformFunction: null }, outputTransformFn: { classPropertyName: "outputTransformFn", publicName: "outputTransformFn", isSignal: true, isRequired: false, transformFunction: null }, keepCharacterPositions: { classPropertyName: "keepCharacterPositions", publicName: "keepCharacterPositions", isSignal: true, isRequired: false, transformFunction: null }, instantPrefix: { classPropertyName: "instantPrefix", publicName: "instantPrefix", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { maskFilled: "maskFilled" }, host: { listeners: { "paste": "onPaste()", "focus": "onFocus($event)", "ngModelChange": "onModelChange($event)", "input": "onInput($event)", "compositionstart": "onCompositionStart($event)", "compositionend": "onCompositionEnd($event)", "blur": "onBlur($event)", "click": "onClick($event)", "keydown": "onKeyDown($event)" } }, providers: [
|
|
2466
2466
|
{
|
|
2467
2467
|
provide: NG_VALUE_ACCESSOR,
|
|
2468
2468
|
useExisting: NgxMaskDirective,
|
|
@@ -2476,7 +2476,7 @@ class NgxMaskDirective {
|
|
|
2476
2476
|
NgxMaskService,
|
|
2477
2477
|
], exportAs: ["mask", "ngxMask"], usesOnChanges: true, ngImport: i0 });
|
|
2478
2478
|
}
|
|
2479
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2479
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: NgxMaskDirective, decorators: [{
|
|
2480
2480
|
type: Directive,
|
|
2481
2481
|
args: [{
|
|
2482
2482
|
selector: 'input[mask], textarea[mask]',
|
|
@@ -2609,10 +2609,10 @@ class NgxMaskPipe {
|
|
|
2609
2609
|
});
|
|
2610
2610
|
}
|
|
2611
2611
|
}
|
|
2612
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2613
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
2612
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: NgxMaskPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
2613
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.1.2", ngImport: i0, type: NgxMaskPipe, isStandalone: true, name: "mask" });
|
|
2614
2614
|
}
|
|
2615
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2615
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.2", ngImport: i0, type: NgxMaskPipe, decorators: [{
|
|
2616
2616
|
type: Pipe,
|
|
2617
2617
|
args: [{
|
|
2618
2618
|
name: 'mask',
|