@flexzap/misc 0.0.1 → 0.0.3
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 +151 -31
- package/fesm2022/flexzap-misc.mjs +27 -22
- package/fesm2022/flexzap-misc.mjs.map +1 -1
- package/index.d.ts +15 -13
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,63 +1,183 @@
|
|
|
1
|
-
#
|
|
1
|
+
# @flexzap/misc
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Miscellaneous utility components for Angular applications, including spinners, progress bars, and other common UI elements. Part of the FlexZap Library ecosystem.
|
|
4
4
|
|
|
5
|
-
##
|
|
6
|
-
|
|
7
|
-
Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
|
|
5
|
+
## Installation
|
|
8
6
|
|
|
9
7
|
```bash
|
|
10
|
-
|
|
8
|
+
npm install @flexzap/misc
|
|
11
9
|
```
|
|
12
10
|
|
|
13
|
-
|
|
11
|
+
### Peer Dependencies
|
|
12
|
+
|
|
13
|
+
This library requires the following peer dependencies:
|
|
14
14
|
|
|
15
15
|
```bash
|
|
16
|
-
|
|
16
|
+
npm install @angular/common@^20.3.0 @angular/core@^20.3.0 @flexzap/pipes@^0.0.1
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
## Usage
|
|
20
|
+
|
|
21
|
+
### Basic Implementation
|
|
22
|
+
|
|
23
|
+
```typescript
|
|
24
|
+
import { Component } from '@angular/core';
|
|
25
|
+
import { ZapSpinner, ZapProgressBar } from '@flexzap/misc';
|
|
26
|
+
|
|
27
|
+
@Component({
|
|
28
|
+
standalone: true,
|
|
29
|
+
imports: [ZapSpinner, ZapProgressBar],
|
|
30
|
+
template: `
|
|
31
|
+
<!-- Simple spinner -->
|
|
32
|
+
<zap-spinner />
|
|
33
|
+
|
|
34
|
+
<!-- Progress bar with percentage -->
|
|
35
|
+
<zap-progress-bar
|
|
36
|
+
[value]="currentValue"
|
|
37
|
+
[min]="0"
|
|
38
|
+
[max]="100"
|
|
39
|
+
[format]="{ symbol: '%' }" />
|
|
40
|
+
|
|
41
|
+
<!-- Custom range progress bar -->
|
|
42
|
+
<zap-progress-bar
|
|
43
|
+
[value]="progress"
|
|
44
|
+
[min]="10"
|
|
45
|
+
[max]="50" />
|
|
46
|
+
`
|
|
47
|
+
})
|
|
48
|
+
export class MyComponent {
|
|
49
|
+
currentValue = 75;
|
|
50
|
+
progress = 30;
|
|
51
|
+
}
|
|
52
|
+
```
|
|
53
|
+
|
|
54
|
+
## API Reference
|
|
55
|
+
|
|
56
|
+
### ZapSpinner Component
|
|
57
|
+
|
|
58
|
+
A simple loading spinner component with customizable styling.
|
|
59
|
+
|
|
60
|
+
#### Features
|
|
61
|
+
|
|
62
|
+
- **OnPush Change Detection**: Optimized performance with OnPush strategy
|
|
63
|
+
- **SCSS Styling**: Customizable styles with SCSS support
|
|
64
|
+
- **Lightweight**: No inputs or outputs, pure visual component
|
|
65
|
+
- **Standalone Component**: No module imports required
|
|
66
|
+
|
|
67
|
+
### ZapProgressBar Component
|
|
68
|
+
|
|
69
|
+
An animated progress bar component with customizable range and formatting.
|
|
70
|
+
|
|
71
|
+
#### Inputs
|
|
72
|
+
|
|
73
|
+
| Property | Type | Default | Description |
|
|
74
|
+
|----------|------|---------|-------------|
|
|
75
|
+
| `value` | `number` | `0` | Current progress value |
|
|
76
|
+
| `min` | `number` | `0` | Minimum value for the progress range |
|
|
77
|
+
| `max` | `number` | `100` | Maximum value for the progress range |
|
|
78
|
+
| `format` | `Partial<ZapNumericInterface>` | `{}` | Formatting options for the displayed value (uses @flexzap/pipes) |
|
|
79
|
+
|
|
80
|
+
#### Features
|
|
81
|
+
|
|
82
|
+
- **OnPush Change Detection**: Optimized performance with OnPush strategy
|
|
83
|
+
- **Animated Transitions**: Smooth CSS transitions with 100ms delay
|
|
84
|
+
- **Flexible Range**: Supports custom min/max values
|
|
85
|
+
- **Number Formatting**: Integration with @flexzap/pipes for value display
|
|
86
|
+
- **Percentage Calculation**: Automatic percentage calculation based on range
|
|
87
|
+
- **Standalone Component**: No module imports required
|
|
88
|
+
|
|
89
|
+
### Styling
|
|
90
|
+
|
|
91
|
+
Both components use SCSS for styling. You can customize the appearance by overriding the default styles:
|
|
92
|
+
|
|
93
|
+
```scss
|
|
94
|
+
zap-spinner {
|
|
95
|
+
// Custom spinner styles
|
|
96
|
+
--zap-spinner-color: #007bff;
|
|
97
|
+
--zap-spinner-size: 2rem;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
zap-progress-bar {
|
|
101
|
+
// Custom progress bar styles
|
|
102
|
+
--zap-progress-bar-height: 8px;
|
|
103
|
+
--zap-progress-bar-bg: #e9ecef;
|
|
104
|
+
--zap-progress-bar-fill: #007bff;
|
|
105
|
+
--zap-progress-bar-border-radius: 4px;
|
|
106
|
+
}
|
|
17
107
|
```
|
|
18
108
|
|
|
19
|
-
##
|
|
109
|
+
## Testing
|
|
20
110
|
|
|
21
|
-
|
|
111
|
+
This library uses Jest for unit testing with zoneless Angular configuration.
|
|
112
|
+
|
|
113
|
+
### Running Tests
|
|
22
114
|
|
|
23
115
|
```bash
|
|
24
|
-
|
|
116
|
+
# From the monorepo root
|
|
117
|
+
npm run misc:test # Run all unit tests once
|
|
118
|
+
npm run misc:test:watch # Run tests in watch mode
|
|
119
|
+
npm run misc:test:coverage # Generate a test coverage report
|
|
25
120
|
```
|
|
26
121
|
|
|
27
|
-
|
|
122
|
+
### Test Configuration
|
|
28
123
|
|
|
29
|
-
|
|
124
|
+
- **Framework**: Jest with jest-preset-angular
|
|
125
|
+
- **Environment**: jsdom
|
|
126
|
+
- **Configuration**: Zoneless Angular (mandatory)
|
|
127
|
+
- **Coverage**: Reports generated at `../../../coverage/flexzap/misc/`
|
|
30
128
|
|
|
31
|
-
|
|
129
|
+
## Development
|
|
32
130
|
|
|
33
|
-
|
|
34
|
-
```bash
|
|
35
|
-
cd dist/misc
|
|
36
|
-
```
|
|
131
|
+
### Building the Library
|
|
37
132
|
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
133
|
+
```bash
|
|
134
|
+
# From the monorepo root
|
|
135
|
+
npm run misc:build # Build with version bump
|
|
136
|
+
ng build @flexzap/misc # Build directly
|
|
137
|
+
```
|
|
42
138
|
|
|
43
|
-
|
|
139
|
+
### Code Scaffolding
|
|
44
140
|
|
|
45
|
-
To
|
|
141
|
+
To generate new components within this library:
|
|
46
142
|
|
|
47
143
|
```bash
|
|
48
|
-
ng
|
|
144
|
+
ng generate component [component-name] --project @flexzap/misc
|
|
49
145
|
```
|
|
50
146
|
|
|
51
|
-
##
|
|
147
|
+
## Publishing
|
|
148
|
+
|
|
149
|
+
### Build for Publication
|
|
52
150
|
|
|
53
|
-
|
|
151
|
+
```bash
|
|
152
|
+
# From the monorepo root
|
|
153
|
+
npm run misc:build
|
|
154
|
+
```
|
|
155
|
+
|
|
156
|
+
### Publish to NPM
|
|
54
157
|
|
|
55
158
|
```bash
|
|
56
|
-
|
|
159
|
+
cd dist/flexzap/misc
|
|
160
|
+
npm publish --access public
|
|
57
161
|
```
|
|
58
162
|
|
|
59
|
-
|
|
163
|
+
## Contributing
|
|
164
|
+
|
|
165
|
+
This library is part of the FlexZap Library monorepo. Please refer to the [main repository](../../../README.md) for contribution guidelines.
|
|
166
|
+
|
|
167
|
+
### Development Guidelines
|
|
168
|
+
|
|
169
|
+
- Use standalone components (default behavior)
|
|
170
|
+
- Use `input()` and `output()` functions instead of decorators
|
|
171
|
+
- Set `changeDetection: ChangeDetectionStrategy.OnPush`
|
|
172
|
+
- Write comprehensive tests with Jest (zoneless configuration)
|
|
173
|
+
- Follow semantic versioning for releases
|
|
174
|
+
|
|
175
|
+
## License
|
|
176
|
+
|
|
177
|
+
MIT License - see the [LICENSE](../../../LICENSE) file for details.
|
|
60
178
|
|
|
61
|
-
##
|
|
179
|
+
## Links
|
|
62
180
|
|
|
63
|
-
|
|
181
|
+
- **Homepage**: [https://www.flexzap.dev](https://www.flexzap.dev)
|
|
182
|
+
- **Repository**: [https://github.com/vitorazevedo/flexzap-library](https://github.com/vitorazevedo/flexzap-library)
|
|
183
|
+
- **Monorepo Documentation**: [Main README](../../../README.md)
|
|
@@ -1,39 +1,44 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { ChangeDetectionStrategy, Component, input, computed } from '@angular/core';
|
|
2
|
+
import { ChangeDetectionStrategy, Component, input, signal, computed, effect } from '@angular/core';
|
|
3
3
|
import { ZapNumeric } from '@flexzap/pipes';
|
|
4
4
|
|
|
5
|
-
class
|
|
6
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type:
|
|
7
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.2", type:
|
|
5
|
+
class ZapSpinner {
|
|
6
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: ZapSpinner, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.2", type: ZapSpinner, isStandalone: true, selector: "zap-spinner", ngImport: i0, template: "<div class=\"zap-spinner\">\n <div>\n <ng-content></ng-content>\n </div>\n <div></div>\n</div>\n", styles: [".zap-spinner{display:flex;justify-content:center;align-items:center;flex:1}.zap-spinner div:nth-child(1){position:absolute;z-index:1}.zap-spinner div:nth-child(2){width:100%;height:100%}:host{width:100%;height:100%;display:flex;position:absolute;left:0;top:0;z-index:10}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8
8
|
}
|
|
9
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type:
|
|
9
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: ZapSpinner, decorators: [{
|
|
10
10
|
type: Component,
|
|
11
11
|
args: [{ selector: 'zap-spinner', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"zap-spinner\">\n <div>\n <ng-content></ng-content>\n </div>\n <div></div>\n</div>\n", styles: [".zap-spinner{display:flex;justify-content:center;align-items:center;flex:1}.zap-spinner div:nth-child(1){position:absolute;z-index:1}.zap-spinner div:nth-child(2){width:100%;height:100%}:host{width:100%;height:100%;display:flex;position:absolute;left:0;top:0;z-index:10}\n"] }]
|
|
12
12
|
}] });
|
|
13
13
|
|
|
14
|
-
class
|
|
14
|
+
class ZapProgressBar {
|
|
15
15
|
value = input(0, ...(ngDevMode ? [{ debugName: "value" }] : []));
|
|
16
16
|
min = input(0, ...(ngDevMode ? [{ debugName: "min" }] : []));
|
|
17
17
|
max = input(100, ...(ngDevMode ? [{ debugName: "max" }] : []));
|
|
18
18
|
format = input({}, ...(ngDevMode ? [{ debugName: "format" }] : []));
|
|
19
|
-
size =
|
|
20
|
-
|
|
21
|
-
const minValue = this.min();
|
|
22
|
-
const maxValue = this.max();
|
|
23
|
-
if (maxValue <= minValue)
|
|
24
|
-
return 0;
|
|
25
|
-
return Math.trunc(((currentValue - minValue) / (maxValue - minValue)) * 100);
|
|
26
|
-
}, ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
27
|
-
style = computed(() => ({
|
|
19
|
+
size = signal(0, ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
20
|
+
width = computed(() => ({
|
|
28
21
|
width: `${this.size()}%`
|
|
29
|
-
}), ...(ngDevMode ? [{ debugName: "
|
|
30
|
-
|
|
31
|
-
|
|
22
|
+
}), ...(ngDevMode ? [{ debugName: "width" }] : []));
|
|
23
|
+
constructor() {
|
|
24
|
+
// Effect to animate progress bar with CSS transition delay
|
|
25
|
+
effect(() => {
|
|
26
|
+
const targetSize = this.calculatePercentage();
|
|
27
|
+
setTimeout(() => this.size.set(targetSize), 100);
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
calculatePercentage() {
|
|
31
|
+
if (this.max() <= this.min())
|
|
32
|
+
return 0;
|
|
33
|
+
return Math.trunc(((this.value() - this.min()) / (this.max() - this.min())) * 100);
|
|
34
|
+
}
|
|
35
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: ZapProgressBar, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
36
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.2", type: ZapProgressBar, isStandalone: true, selector: "zap-progress-bar", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"zap-progress-bar\">\n <div [style]=\"width()\">\n <span>{{ value() | ZapNumeric: format() }}</span>\n </div>\n</div>\n", styles: [".zap-progress-bar div{max-width:100%}:host{display:block}\n"], dependencies: [{ kind: "pipe", type: ZapNumeric, name: "ZapNumeric" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
32
37
|
}
|
|
33
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type:
|
|
38
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: ZapProgressBar, decorators: [{
|
|
34
39
|
type: Component,
|
|
35
|
-
args: [{ selector: 'zap-progress-bar', imports: [ZapNumeric], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"zap-progress-bar\">\n <div [style]=\"
|
|
36
|
-
}] });
|
|
40
|
+
args: [{ selector: 'zap-progress-bar', imports: [ZapNumeric], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"zap-progress-bar\">\n <div [style]=\"width()\">\n <span>{{ value() | ZapNumeric: format() }}</span>\n </div>\n</div>\n", styles: [".zap-progress-bar div{max-width:100%}:host{display:block}\n"] }]
|
|
41
|
+
}], ctorParameters: () => [] });
|
|
37
42
|
|
|
38
43
|
/*
|
|
39
44
|
* Public API Surface of misc
|
|
@@ -43,5 +48,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
|
|
|
43
48
|
* Generated bundle index. Do not edit.
|
|
44
49
|
*/
|
|
45
50
|
|
|
46
|
-
export {
|
|
51
|
+
export { ZapProgressBar, ZapSpinner };
|
|
47
52
|
//# sourceMappingURL=flexzap-misc.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flexzap-misc.mjs","sources":["../../../../projects/flexzap/misc/src/lib/spinner/spinner.ts","../../../../projects/flexzap/misc/src/lib/spinner/spinner.html","../../../../projects/flexzap/misc/src/lib/progress-bar/progress-bar.ts","../../../../projects/flexzap/misc/src/lib/progress-bar/progress-bar.html","../../../../projects/flexzap/misc/src/public-api.ts","../../../../projects/flexzap/misc/src/flexzap-misc.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n selector: 'zap-spinner',\n templateUrl: './spinner.html',\n styleUrl: './spinner.scss',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class
|
|
1
|
+
{"version":3,"file":"flexzap-misc.mjs","sources":["../../../../projects/flexzap/misc/src/lib/spinner/spinner.ts","../../../../projects/flexzap/misc/src/lib/spinner/spinner.html","../../../../projects/flexzap/misc/src/lib/progress-bar/progress-bar.ts","../../../../projects/flexzap/misc/src/lib/progress-bar/progress-bar.html","../../../../projects/flexzap/misc/src/public-api.ts","../../../../projects/flexzap/misc/src/flexzap-misc.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n selector: 'zap-spinner',\n templateUrl: './spinner.html',\n styleUrl: './spinner.scss',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class ZapSpinner { }\n","<div class=\"zap-spinner\">\n <div>\n <ng-content></ng-content>\n </div>\n <div></div>\n</div>\n","import { ChangeDetectionStrategy, Component, computed, effect, input, signal } from '@angular/core';\n\nimport { ZapNumeric, ZapNumericInterface } from '@flexzap/pipes';\n\n@Component({\n selector: 'zap-progress-bar',\n imports: [ZapNumeric],\n templateUrl: './progress-bar.html',\n styleUrl: './progress-bar.scss',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class ZapProgressBar {\n readonly value = input<number>(0);\n readonly min = input<number>(0);\n readonly max = input<number>(100);\n readonly format = input<Partial<ZapNumericInterface>>({});\n\n private size = signal<number>(0);\n\n width = computed(() => ({\n width: `${this.size()}%`\n }));\n\n constructor() {\n // Effect to animate progress bar with CSS transition delay\n effect(() => {\n const targetSize = this.calculatePercentage();\n setTimeout(() => this.size.set(targetSize), 100);\n });\n }\n\n private calculatePercentage(): number {\n if (this.max() <= this.min()) return 0;\n return Math.trunc(((this.value() - this.min()) / (this.max() - this.min())) * 100);\n }\n}\n","<div class=\"zap-progress-bar\">\n <div [style]=\"width()\">\n <span>{{ value() | ZapNumeric: format() }}</span>\n </div>\n</div>\n","/*\n * Public API Surface of misc\n */\n\nexport * from './lib/spinner/spinner';\nexport * from './lib/progress-bar/progress-bar';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
package/index.d.ts
CHANGED
|
@@ -1,22 +1,24 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
2
|
import { ZapNumericInterface } from '@flexzap/pipes';
|
|
3
3
|
|
|
4
|
-
declare class
|
|
5
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<
|
|
6
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<
|
|
4
|
+
declare class ZapSpinner {
|
|
5
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZapSpinner, never>;
|
|
6
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZapSpinner, "zap-spinner", never, {}, {}, never, ["*"], true, never>;
|
|
7
7
|
}
|
|
8
8
|
|
|
9
|
-
declare class
|
|
10
|
-
value: _angular_core.InputSignal<number>;
|
|
11
|
-
min: _angular_core.InputSignal<number>;
|
|
12
|
-
max: _angular_core.InputSignal<number>;
|
|
13
|
-
format: _angular_core.InputSignal<Partial<ZapNumericInterface>>;
|
|
14
|
-
size
|
|
15
|
-
|
|
9
|
+
declare class ZapProgressBar {
|
|
10
|
+
readonly value: _angular_core.InputSignal<number>;
|
|
11
|
+
readonly min: _angular_core.InputSignal<number>;
|
|
12
|
+
readonly max: _angular_core.InputSignal<number>;
|
|
13
|
+
readonly format: _angular_core.InputSignal<Partial<ZapNumericInterface>>;
|
|
14
|
+
private size;
|
|
15
|
+
width: _angular_core.Signal<{
|
|
16
16
|
width: string;
|
|
17
17
|
}>;
|
|
18
|
-
|
|
19
|
-
|
|
18
|
+
constructor();
|
|
19
|
+
private calculatePercentage;
|
|
20
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZapProgressBar, never>;
|
|
21
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZapProgressBar, "zap-progress-bar", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "format": { "alias": "format"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
20
22
|
}
|
|
21
23
|
|
|
22
|
-
export {
|
|
24
|
+
export { ZapProgressBar, ZapSpinner };
|