ngx-transforms 0.3.1 → 0.3.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.
- package/README.md +23 -5
- package/fesm2022/ngx-transforms.mjs +288 -288
- package/fesm2022/ngx-transforms.mjs.map +1 -1
- package/package.json +5 -4
- package/types/ngx-transforms.d.ts +12 -12
package/README.md
CHANGED
|
@@ -2,9 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
[](https://www.npmjs.com/package/ngx-transforms)
|
|
4
4
|
[](https://angular.dev)
|
|
5
|
+
[](#bundle-size)
|
|
5
6
|
[](https://opensource.org/licenses/MIT)
|
|
6
7
|
|
|
7
|
-
>
|
|
8
|
+
> 90 standalone, tree-shakable Angular pipes for text, arrays, math, objects, and more.
|
|
8
9
|
|
|
9
10
|
**[Docs & live playground →](https://ngx-transforms.vercel.app)**
|
|
10
11
|
|
|
@@ -20,11 +21,11 @@ npm install ngx-transforms
|
|
|
20
21
|
|
|
21
22
|
```ts
|
|
22
23
|
import { Component } from '@angular/core';
|
|
23
|
-
import { TruncatePipe,
|
|
24
|
+
import { TruncatePipe, TimeAgoPipe } from 'ngx-transforms';
|
|
24
25
|
|
|
25
26
|
@Component({
|
|
26
27
|
standalone: true,
|
|
27
|
-
imports: [TruncatePipe,
|
|
28
|
+
imports: [TruncatePipe, TimeAgoPipe],
|
|
28
29
|
template: `
|
|
29
30
|
<p>{{ post.body | truncate:80 }}</p>
|
|
30
31
|
<small>{{ post.createdAt | timeAgo }}</small>
|
|
@@ -33,7 +34,7 @@ import { TruncatePipe, TimeAgoPipePipe } from 'ngx-transforms';
|
|
|
33
34
|
export class PostCard {}
|
|
34
35
|
```
|
|
35
36
|
|
|
36
|
-
Every pipe is standalone
|
|
37
|
+
Every pipe is standalone meaning you import only what you use, the rest is tree-shaken.
|
|
37
38
|
|
|
38
39
|
## What's inside
|
|
39
40
|
|
|
@@ -43,13 +44,30 @@ Every pipe is standalone — import only what you use, the rest is tree-shaken.
|
|
|
43
44
|
| **Array** | 20 | `groupBy`, `orderBy`, `unique`, `chunk`, `intersection` |
|
|
44
45
|
| **Math** | 13 | `min`, `max`, `sum`, `average`, `bytes`, `percentage` |
|
|
45
46
|
| **Object** | 8 | `keys`, `pairs`, `pick`, `omit`, `invert`, `diffObj` |
|
|
47
|
+
| **Boolean** | 8 | `isDefined`, `isString`, `isArray`, `isObject`, `isEmpty` |
|
|
46
48
|
| **Data** | 5 | `count`, `timeAgo`, `jsonPretty`, `device`, `textToSpeech` |
|
|
47
49
|
| **Security** | 5 | `htmlSanitize`, `creditCardMask`, `emailMask`, `ipAddressMask` |
|
|
48
50
|
| **Media** | 4 | `qrCode`, `barcode`, `gravatar`, `colorConvert` |
|
|
49
|
-
| **Boolean** | 4 | `isDefined`, `isNull`, `isString`, `isNumber` |
|
|
50
51
|
|
|
51
52
|
Full API reference at **[ngx-transforms.vercel.app](https://ngx-transforms.vercel.app)**.
|
|
52
53
|
|
|
54
|
+
## Bundle size
|
|
55
|
+
|
|
56
|
+
The complete library includes all 90 pipes, and it is **27.9 KB gzipped** / **23.3 KB brotli**. What you actually ship is much smaller, because Angular's CLI tree-shakes any pipe you don't import.
|
|
57
|
+
|
|
58
|
+
| Measure | Size |
|
|
59
|
+
| -------------------- | -------- |
|
|
60
|
+
| FESM bundle (raw) | 169 KB |
|
|
61
|
+
| FESM bundle (gzip) | 27.9 KB |
|
|
62
|
+
| FESM bundle (brotli) | 23.3 KB |
|
|
63
|
+
|
|
64
|
+
```ts
|
|
65
|
+
// Only TruncatePipe and its transitive imports lands in your bundle.
|
|
66
|
+
import { TruncatePipe } from 'ngx-transforms';
|
|
67
|
+
```
|
|
68
|
+
|
|
69
|
+
A handful of pipes pull their own dependencies — `qrCode` (qrcode), `barcode` (jsbarcode), `gravatar` (js-md5), `asciiArt` (ts-ascii-engine). If you skip those, the rest of the library is pure standalone-pipe code.
|
|
70
|
+
|
|
53
71
|
## Provide all at once
|
|
54
72
|
|
|
55
73
|
```ts
|