@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.
Files changed (44) hide show
  1. package/fesm2022/nexterajs-ui-core.mjs +189 -5
  2. package/fesm2022/nexterajs-ui-core.mjs.map +1 -1
  3. package/fesm2022/nexterajs-ui-dropdowns.mjs +314 -50
  4. package/fesm2022/nexterajs-ui-dropdowns.mjs.map +1 -1
  5. package/fesm2022/nexterajs-ui-file-uploader.mjs +6 -3
  6. package/fesm2022/nexterajs-ui-file-uploader.mjs.map +1 -1
  7. package/fesm2022/nexterajs-ui-forms.mjs +729 -370
  8. package/fesm2022/nexterajs-ui-forms.mjs.map +1 -1
  9. package/fesm2022/nexterajs-ui-grid.mjs +1188 -208
  10. package/fesm2022/nexterajs-ui-grid.mjs.map +1 -1
  11. package/fesm2022/nexterajs-ui-intl.mjs +15 -5
  12. package/fesm2022/nexterajs-ui-intl.mjs.map +1 -1
  13. package/fesm2022/nexterajs-ui-notify.mjs +351 -0
  14. package/fesm2022/nexterajs-ui-notify.mjs.map +1 -0
  15. package/fesm2022/nexterajs-ui-pivot.mjs +146 -116
  16. package/fesm2022/nexterajs-ui-pivot.mjs.map +1 -1
  17. package/fesm2022/nexterajs-ui-styling.mjs +568 -3
  18. package/fesm2022/nexterajs-ui-styling.mjs.map +1 -1
  19. package/fesm2022/nexterajs-ui-tree-view.mjs +147 -18
  20. package/fesm2022/nexterajs-ui-tree-view.mjs.map +1 -1
  21. package/fesm2022/nexterajs-ui-validation.mjs +247 -92
  22. package/fesm2022/nexterajs-ui-validation.mjs.map +1 -1
  23. package/fesm2022/nexterajs-ui.mjs +1 -0
  24. package/fesm2022/nexterajs-ui.mjs.map +1 -1
  25. package/package.json +5 -1
  26. package/styles/_dropdown.scss +149 -0
  27. package/styles/_editor.scss +23 -4
  28. package/styles/_icons.scss +92 -0
  29. package/styles/_mixins.scss +104 -1
  30. package/styles/_scrollbar.scss +134 -0
  31. package/styles/_toast.scss +243 -0
  32. package/styles/_tokens.scss +48 -0
  33. package/styles/index.scss +4 -0
  34. package/types/nexterajs-ui-core.d.ts +142 -22
  35. package/types/nexterajs-ui-dropdowns.d.ts +145 -27
  36. package/types/nexterajs-ui-file-uploader.d.ts +4 -1
  37. package/types/nexterajs-ui-forms.d.ts +103 -19
  38. package/types/nexterajs-ui-grid.d.ts +445 -57
  39. package/types/nexterajs-ui-notify.d.ts +147 -0
  40. package/types/nexterajs-ui-pivot.d.ts +35 -22
  41. package/types/nexterajs-ui-styling.d.ts +163 -3
  42. package/types/nexterajs-ui-tree-view.d.ts +50 -1
  43. package/types/nexterajs-ui-validation.d.ts +94 -15
  44. 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: NxeValidationRuleComponent;
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 `nxe-validation-rule`
62
- * children, and registers into the {@link NxeValidationGroupRegistry} under the editor's
63
- * `validationGroup`. Validation is on-demand (matching DevExtreme: not auto-run on change) —
64
- * `validate()` is invoked by `nxe-button[validationGroup]` (group-level) or directly.
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
- /** Run all rules against the editor's current value; pushes the first failing message. */
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
- export { NXE_DEFAULT_VALIDATION_MESSAGES, NxeValidationRuleComponent, NxeValidatorComponent, NxeValidators };
102
- export type { NxeCustomRuleData, NxeValidationRuleType };
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 };
@@ -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';