@nexterajs/ui 0.0.1 → 0.0.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/fesm2022/nexterajs-ui-core.mjs +189 -5
- package/fesm2022/nexterajs-ui-core.mjs.map +1 -1
- package/fesm2022/nexterajs-ui-dropdowns.mjs +314 -50
- package/fesm2022/nexterajs-ui-dropdowns.mjs.map +1 -1
- package/fesm2022/nexterajs-ui-file-uploader.mjs +6 -3
- package/fesm2022/nexterajs-ui-file-uploader.mjs.map +1 -1
- package/fesm2022/nexterajs-ui-forms.mjs +729 -370
- package/fesm2022/nexterajs-ui-forms.mjs.map +1 -1
- package/fesm2022/nexterajs-ui-grid.mjs +1188 -208
- package/fesm2022/nexterajs-ui-grid.mjs.map +1 -1
- package/fesm2022/nexterajs-ui-intl.mjs +15 -5
- package/fesm2022/nexterajs-ui-intl.mjs.map +1 -1
- package/fesm2022/nexterajs-ui-notify.mjs +351 -0
- package/fesm2022/nexterajs-ui-notify.mjs.map +1 -0
- package/fesm2022/nexterajs-ui-pivot.mjs +146 -116
- package/fesm2022/nexterajs-ui-pivot.mjs.map +1 -1
- package/fesm2022/nexterajs-ui-styling.mjs +568 -3
- package/fesm2022/nexterajs-ui-styling.mjs.map +1 -1
- package/fesm2022/nexterajs-ui-tree-view.mjs +147 -18
- package/fesm2022/nexterajs-ui-tree-view.mjs.map +1 -1
- package/fesm2022/nexterajs-ui-validation.mjs +247 -92
- package/fesm2022/nexterajs-ui-validation.mjs.map +1 -1
- package/fesm2022/nexterajs-ui.mjs +1 -0
- package/fesm2022/nexterajs-ui.mjs.map +1 -1
- package/package.json +5 -1
- package/styles/_dropdown.scss +149 -0
- package/styles/_editor.scss +23 -4
- package/styles/_icons.scss +92 -0
- package/styles/_mixins.scss +104 -1
- package/styles/_scrollbar.scss +134 -0
- package/styles/_toast.scss +243 -0
- package/styles/_tokens.scss +48 -0
- package/styles/index.scss +4 -0
- package/types/nexterajs-ui-core.d.ts +142 -22
- package/types/nexterajs-ui-dropdowns.d.ts +145 -27
- package/types/nexterajs-ui-file-uploader.d.ts +4 -1
- package/types/nexterajs-ui-forms.d.ts +103 -19
- package/types/nexterajs-ui-grid.d.ts +445 -57
- package/types/nexterajs-ui-notify.d.ts +147 -0
- package/types/nexterajs-ui-pivot.d.ts +35 -22
- package/types/nexterajs-ui-styling.d.ts +163 -3
- package/types/nexterajs-ui-tree-view.d.ts +50 -1
- package/types/nexterajs-ui-validation.d.ts +94 -15
- package/types/nexterajs-ui.d.ts +1 -0
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
|
-
import { NxeValidationResult } from '@nexterajs/ui/core';
|
|
2
|
+
import { NxeValidatedEvent, NxeBrokenRule, NxeValidationResult } from '@nexterajs/ui/core';
|
|
3
3
|
import { ValidatorFn } from '@angular/forms';
|
|
4
4
|
|
|
5
5
|
/** DevExtreme validation rule type (the codebase uses `required`, `compare`, and `range`). */
|
|
@@ -15,8 +15,32 @@ declare const NXE_DEFAULT_VALIDATION_MESSAGES: Readonly<Record<NxeValidationRule
|
|
|
15
15
|
/** Payload passed to a `custom` rule's `validationCallback` (mirrors DevExtreme). */
|
|
16
16
|
interface NxeCustomRuleData {
|
|
17
17
|
value: unknown;
|
|
18
|
-
rule
|
|
18
|
+
/** Absent when the rule came from `[validationRules]` rather than a projected element. */
|
|
19
|
+
rule?: NxeValidationRuleComponent;
|
|
19
20
|
}
|
|
21
|
+
/**
|
|
22
|
+
* A rule as plain data.
|
|
23
|
+
*
|
|
24
|
+
* The projected `<nxe-validation-rule>` and the `[validationRules]` array are two ways of saying
|
|
25
|
+
* the same thing, so they evaluate through one function rather than two implementations that
|
|
26
|
+
* could drift.
|
|
27
|
+
*/
|
|
28
|
+
interface NxeRuleSpec {
|
|
29
|
+
type: NxeValidationRuleType;
|
|
30
|
+
message?: string;
|
|
31
|
+
comparisonTarget?: () => unknown;
|
|
32
|
+
comparisonType?: '==' | '===' | '!=' | '!==' | '>' | '<' | '>=' | '<=';
|
|
33
|
+
validationCallback?: (data: NxeCustomRuleData) => boolean;
|
|
34
|
+
pattern?: string | RegExp;
|
|
35
|
+
min?: number;
|
|
36
|
+
max?: number;
|
|
37
|
+
}
|
|
38
|
+
/** DevExtreme RequiredRule semantics: null/undefined/''/false are "not specified". */
|
|
39
|
+
declare function nxeIsEmptyValue(value: unknown): boolean;
|
|
40
|
+
/** The message for a rule with none of its own. */
|
|
41
|
+
declare function nxeDefaultMessage(type: NxeValidationRuleType): string;
|
|
42
|
+
/** Whether `value` satisfies `spec`. The single evaluator behind both rule forms. */
|
|
43
|
+
declare function nxeEvaluateRule(spec: NxeRuleSpec, value: unknown, rule?: NxeValidationRuleComponent): boolean;
|
|
20
44
|
/**
|
|
21
45
|
* `nxe-validation-rule` — drop-in for DevExtreme `dxi-validation-rule`.
|
|
22
46
|
*
|
|
@@ -43,13 +67,10 @@ declare class NxeValidationRuleComponent {
|
|
|
43
67
|
* rule type. Whitespace counts as absent — a message of spaces is still an empty bubble.
|
|
44
68
|
*/
|
|
45
69
|
readonly resolvedMessage: _angular_core.Signal<string>;
|
|
70
|
+
/** This rule as plain data, so both rule forms evaluate through one function. */
|
|
71
|
+
toSpec(): NxeRuleSpec;
|
|
46
72
|
/** Whether `value` satisfies this rule. */
|
|
47
73
|
evaluate(value: unknown): boolean;
|
|
48
|
-
/** DevExtreme RequiredRule semantics: null/undefined/''/false are "not specified". */
|
|
49
|
-
private isEmpty;
|
|
50
|
-
private compare;
|
|
51
|
-
private inRange;
|
|
52
|
-
private matchesPattern;
|
|
53
74
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NxeValidationRuleComponent, never>;
|
|
54
75
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NxeValidationRuleComponent, "nxe-validation-rule", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "message": { "alias": "message"; "required": false; "isSignal": true; }; "comparisonTarget": { "alias": "comparisonTarget"; "required": false; "isSignal": true; }; "comparisonType": { "alias": "comparisonType"; "required": false; "isSignal": true; }; "validationCallback": { "alias": "validationCallback"; "required": false; "isSignal": true; }; "pattern": { "alias": "pattern"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
55
76
|
}
|
|
@@ -58,28 +79,58 @@ declare class NxeValidationRuleComponent {
|
|
|
58
79
|
* `nxe-validator` — drop-in for DevExtreme `dx-validator`.
|
|
59
80
|
*
|
|
60
81
|
* Placed inside an editor (`<nxe-text-box><nxe-validator><nxe-validation-rule .../></nxe-validator></nxe-text-box>`),
|
|
61
|
-
* it adapts the editor via {@link NXE_VALIDATION_TARGET}, collects its
|
|
62
|
-
*
|
|
63
|
-
*
|
|
64
|
-
* `validate()` is invoked by
|
|
82
|
+
* it adapts the editor via {@link NXE_VALIDATION_TARGET}, collects its rules, and registers into
|
|
83
|
+
* the {@link NxeValidationGroupRegistry} under the editor's `validationGroup`.
|
|
84
|
+
*
|
|
85
|
+
* Validation is on demand, as in DevExtreme — `validate()` is invoked by
|
|
86
|
+
* `nxe-button[validationGroup]` or directly. With one exception, which is also dx's: once a
|
|
87
|
+
* validator HAS been validated, it re-validates as the value changes, so a field that has gone
|
|
88
|
+
* red clears itself as the user fixes it rather than staying red until the next submit.
|
|
65
89
|
*/
|
|
66
90
|
declare class NxeValidatorComponent {
|
|
67
91
|
private readonly target;
|
|
68
92
|
private readonly registry;
|
|
93
|
+
private readonly groupScope;
|
|
69
94
|
readonly rules: _angular_core.Signal<readonly NxeValidationRuleComponent[]>;
|
|
95
|
+
/**
|
|
96
|
+
* dx `validationRules` — rules as data instead of projected children. Both forms combine;
|
|
97
|
+
* projected children come first, matching declaration order.
|
|
98
|
+
*/
|
|
99
|
+
readonly validationRules: _angular_core.InputSignal<readonly NxeRuleSpec[]>;
|
|
70
100
|
/** Explicit group; otherwise inherited from the wrapped editor's `validationGroup`. */
|
|
71
101
|
readonly validationGroupInput: _angular_core.InputSignal<string>;
|
|
102
|
+
/** dx `onValidated`, fired on every validation, valid or not. */
|
|
103
|
+
readonly onValidated: _angular_core.OutputEmitterRef<NxeValidatedEvent>;
|
|
72
104
|
private readonly group;
|
|
73
105
|
/** Last validation outcome (false once a rule has failed, until re-validated). */
|
|
74
106
|
readonly isValid: _angular_core.WritableSignal<boolean>;
|
|
107
|
+
/** Every rule broken by the last validation, in declaration order. */
|
|
108
|
+
readonly brokenRules: _angular_core.WritableSignal<readonly NxeBrokenRule[]>;
|
|
109
|
+
/** Whether `validate()` has ever run — the gate on live re-validation. */
|
|
110
|
+
private readonly validated;
|
|
75
111
|
/** DevExtreme parity: existing code calls `validator.instance.validate()` via `@ViewChild`. */
|
|
76
112
|
get instance(): NxeValidatorComponent;
|
|
77
113
|
private readonly member;
|
|
114
|
+
/** Projected children plus `[validationRules]`, as one evaluable list. */
|
|
115
|
+
private readonly allRules;
|
|
78
116
|
constructor();
|
|
79
|
-
/**
|
|
117
|
+
/**
|
|
118
|
+
* Run every rule against the editor's current value.
|
|
119
|
+
*
|
|
120
|
+
* dx reports ALL broken rules, not just the first — a `brokenRules` array with at most one
|
|
121
|
+
* entry cannot tell a caller whether a field failed once or three times. The editor's bubble
|
|
122
|
+
* still shows the first message, which is what dx renders.
|
|
123
|
+
*/
|
|
80
124
|
validate(): NxeValidationResult;
|
|
125
|
+
/**
|
|
126
|
+
* Clear the error state without validating (dx `reset()`).
|
|
127
|
+
*
|
|
128
|
+
* Also clears `validated`, so the field goes back to staying quiet until it is validated
|
|
129
|
+
* again — otherwise a reset field would light up on the next keystroke.
|
|
130
|
+
*/
|
|
131
|
+
reset(): void;
|
|
81
132
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NxeValidatorComponent, never>;
|
|
82
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NxeValidatorComponent, "nxe-validator", never, { "validationGroupInput": { "alias": "validationGroup"; "required": false; "isSignal": true; }; }, {}, ["rules"], ["*"], true, never>;
|
|
133
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NxeValidatorComponent, "nxe-validator", never, { "validationRules": { "alias": "validationRules"; "required": false; "isSignal": true; }; "validationGroupInput": { "alias": "validationGroup"; "required": false; "isSignal": true; }; }, { "onValidated": "onValidated"; }, ["rules"], ["*"], true, never>;
|
|
83
134
|
}
|
|
84
135
|
|
|
85
136
|
declare class NxeValidators {
|
|
@@ -98,5 +149,33 @@ declare class NxeValidators {
|
|
|
98
149
|
static mustMatch(controlPath: string, matchingControlPath: string): ValidatorFn;
|
|
99
150
|
}
|
|
100
151
|
|
|
101
|
-
|
|
102
|
-
|
|
152
|
+
/**
|
|
153
|
+
* `nxe-validation-group` — drop-in for DevExtreme `dx-validation-group`.
|
|
154
|
+
*
|
|
155
|
+
* DevExtreme lets a group be addressed two ways. Either a string name is repeated on the
|
|
156
|
+
* validator and on the button, or both are wrapped in a group element and the relationship is
|
|
157
|
+
* structural. Only the string form existed here, which meant a form could not be validated as a
|
|
158
|
+
* unit without inventing a name for it and keeping that name in two places.
|
|
159
|
+
*
|
|
160
|
+
* The key is generated, not derived from anything the application controls, so two groups on one
|
|
161
|
+
* page cannot collide and a group can never accidentally share a name with a string group. An
|
|
162
|
+
* explicit `validationGroup` on a descendant still wins, as in dx — the structural form is a
|
|
163
|
+
* default, not an override.
|
|
164
|
+
*/
|
|
165
|
+
declare class NxeValidationGroupComponent {
|
|
166
|
+
private readonly registry;
|
|
167
|
+
private readonly scope;
|
|
168
|
+
/** The generated key descendants register under. Exposed for a caller that needs to name it. */
|
|
169
|
+
get groupKey(): string;
|
|
170
|
+
/** DevExtreme parity: `group.instance.validate()` / `.reset()`. */
|
|
171
|
+
get instance(): NxeValidationGroupComponent;
|
|
172
|
+
/** Validate every validator inside this group. */
|
|
173
|
+
validate(): NxeValidationResult;
|
|
174
|
+
/** Clear every validator inside this group without validating (dx `reset()`). */
|
|
175
|
+
reset(): void;
|
|
176
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NxeValidationGroupComponent, never>;
|
|
177
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NxeValidationGroupComponent, "nxe-validation-group", never, {}, {}, never, ["*"], true, never>;
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
export { NXE_DEFAULT_VALIDATION_MESSAGES, NxeValidationGroupComponent, NxeValidationRuleComponent, NxeValidatorComponent, NxeValidators, nxeDefaultMessage, nxeEvaluateRule, nxeIsEmptyValue };
|
|
181
|
+
export type { NxeCustomRuleData, NxeRuleSpec, NxeValidationRuleType };
|
package/types/nexterajs-ui.d.ts
CHANGED
|
@@ -6,6 +6,7 @@ export * from '@nexterajs/ui/file-uploader';
|
|
|
6
6
|
export * from '@nexterajs/ui/forms';
|
|
7
7
|
export * from '@nexterajs/ui/grid';
|
|
8
8
|
export * from '@nexterajs/ui/intl';
|
|
9
|
+
export * from '@nexterajs/ui/notify';
|
|
9
10
|
export * from '@nexterajs/ui/pivot';
|
|
10
11
|
export * from '@nexterajs/ui/styling';
|
|
11
12
|
export * from '@nexterajs/ui/tree-view';
|