@egose/shadcn-theme-ng-tw 0.3.0 → 0.4.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.
Files changed (63) hide show
  1. package/form-autocomplete/README.md +20 -19
  2. package/form-autocomplete/fesm2022/form-autocomplete.mjs +41 -9
  3. package/form-autocomplete/types/form-autocomplete.d.ts +21 -1
  4. package/form-checkbox/README.md +18 -17
  5. package/form-checkbox/fesm2022/form-checkbox.mjs +42 -15
  6. package/form-checkbox/types/form-checkbox.d.ts +21 -1
  7. package/form-combobox/README.md +21 -20
  8. package/form-combobox/fesm2022/form-combobox.mjs +41 -9
  9. package/form-combobox/types/form-combobox.d.ts +21 -1
  10. package/form-date-picker/README.md +28 -27
  11. package/form-date-picker/fesm2022/form-date-picker.mjs +42 -15
  12. package/form-date-picker/types/form-date-picker.d.ts +21 -1
  13. package/form-date-picker-multi/README.md +28 -27
  14. package/form-date-picker-multi/fesm2022/form-date-picker-multi.mjs +42 -15
  15. package/form-date-picker-multi/types/form-date-picker-multi.d.ts +21 -1
  16. package/form-date-range-picker/README.md +28 -27
  17. package/form-date-range-picker/fesm2022/form-date-range-picker.mjs +42 -15
  18. package/form-date-range-picker/types/form-date-range-picker.d.ts +21 -1
  19. package/form-field/README.md +9 -0
  20. package/form-field/fesm2022/form-field.mjs +80 -5
  21. package/form-field/types/form-field.d.ts +50 -2
  22. package/form-field-simple/fesm2022/form-field-simple.mjs +15 -1
  23. package/form-field-simple/types/form-field-simple.d.ts +9 -2
  24. package/form-input-otp/README.md +17 -16
  25. package/form-input-otp/fesm2022/form-input-otp.mjs +41 -9
  26. package/form-input-otp/types/form-input-otp.d.ts +21 -1
  27. package/form-month-year-picker/README.md +26 -25
  28. package/form-month-year-picker/fesm2022/form-month-year-picker.mjs +42 -15
  29. package/form-month-year-picker/types/form-month-year-picker.d.ts +21 -1
  30. package/form-native-select/README.md +18 -17
  31. package/form-native-select/fesm2022/form-native-select.mjs +56 -17
  32. package/form-native-select/types/form-native-select.d.ts +21 -1
  33. package/form-phone-input/README.md +23 -22
  34. package/form-phone-input/fesm2022/form-phone-input.mjs +42 -15
  35. package/form-phone-input/types/form-phone-input.d.ts +21 -1
  36. package/form-radio-group/README.md +18 -17
  37. package/form-radio-group/fesm2022/form-radio-group.mjs +42 -15
  38. package/form-radio-group/types/form-radio-group.d.ts +21 -1
  39. package/form-searchable-multiselect/README.md +18 -17
  40. package/form-searchable-multiselect/fesm2022/form-searchable-multiselect.mjs +42 -15
  41. package/form-searchable-multiselect/types/form-searchable-multiselect.d.ts +21 -1
  42. package/form-select/README.md +20 -19
  43. package/form-select/fesm2022/form-select.mjs +42 -15
  44. package/form-select/types/form-select.d.ts +21 -1
  45. package/form-slider/README.md +19 -18
  46. package/form-slider/fesm2022/form-slider.mjs +41 -9
  47. package/form-slider/types/form-slider.d.ts +21 -1
  48. package/form-switch/README.md +16 -15
  49. package/form-switch/fesm2022/form-switch.mjs +42 -15
  50. package/form-switch/types/form-switch.d.ts +21 -1
  51. package/form-text-input/README.md +27 -26
  52. package/form-text-input/fesm2022/form-text-input.mjs +42 -15
  53. package/form-text-input/types/form-text-input.d.ts +21 -1
  54. package/form-textarea/README.md +23 -22
  55. package/form-textarea/fesm2022/form-textarea.mjs +42 -15
  56. package/form-textarea/types/form-textarea.d.ts +21 -1
  57. package/form-toggle/README.md +17 -16
  58. package/form-toggle/fesm2022/form-toggle.mjs +41 -7
  59. package/form-toggle/types/form-toggle.d.ts +21 -3
  60. package/form-toggle-group/README.md +20 -19
  61. package/form-toggle-group/fesm2022/form-toggle-group.mjs +42 -15
  62. package/form-toggle-group/types/form-toggle-group.d.ts +21 -1
  63. package/package.json +1 -1
package/form-autocomplete/README.md CHANGED
@@ -53,25 +53,26 @@ Selector (from source): `eg-form-autocomplete` (standalone component, host `tw:w
53
53
 
54
54
  ### `EgFormAutocomplete` — `eg-form-autocomplete`
55
55
 
56
- | Input | Type | Default | Description |
57
- | -------------- | --------------------- | ------------------- | ------------------------------------------------------------------ |
58
- | `controlName` | `string` | `''` | `formControlName` key inside the parent `FormGroup`. **Required.** |
59
- | `label` | `string \| undefined` | — | Label text (hidden when omitted). |
60
- | `error` | `string \| undefined` | — | Error text shown when invalid. |
61
- | `hint` | `string \| undefined` | — | Hint text shown otherwise. |
62
- | `controlId` | `string \| undefined` | — | Explicit id (first priority for `effectiveId`). |
63
- | `id` | `string \| undefined` | — | Fallback id (second priority). |
64
- | `placeholder` | `string` | `'Type to search…'` | Input placeholder. |
65
- | `emptyText` | `string` | `'No result.'` | Text shown when no option matches. |
66
- | `disabled` | `boolean` | `false` | Locks interaction (form control stays enabled). |
67
- | `required` | `boolean` | `false` | Shows a red `*` next to the label. |
68
- | `options` | `string[]` | `[]` | Rendered as `hlm-autocomplete-item` entries. |
69
- | `class` | `ClassValue` | `''` | Extra host classes (base `tw:w-full`). |
70
- | `labelClass` | `string` | `''` | Extra label classes (base `tw:mb-1`). |
71
- | `controlClass` | `string` | `''` | Extra autocomplete-root classes. |
72
- | `inputClass` | `string` | `''` | Extra text-input classes. |
73
- | `errorClass` | `string` | `''` | Extra error classes (base `tw:mt-0`). |
74
- | `hintClass` | `string` | `''` | Extra hint classes (base `tw:mt-0`). |
56
+ | Input | Type | Default | Description |
57
+ | -------------- | --------------------- | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
58
+ | `controlName` | `string` | `''` | `formControlName` key inside the parent `FormGroup`. **Required.** |
59
+ | `label` | `string \| undefined` | — | Label text (hidden when omitted). |
60
+ | `error` | `string \| undefined` | — | Error text shown when invalid. |
61
+ | `autoError` | `boolean` | `true` | Auto-resolve the message from the control's `ValidationErrors` when `error` is unset. Explicit `error` always wins; `error=""` counts as unset. Global wording via `provideEgFormErrorMessages`. |
62
+ | `hint` | `string \| undefined` | — | Hint text shown otherwise. |
63
+ | `controlId` | `string \| undefined` | — | Explicit id (first priority for `effectiveId`). |
64
+ | `id` | `string \| undefined` | — | Fallback id (second priority). |
65
+ | `placeholder` | `string` | `'Type to search…'` | Input placeholder. |
66
+ | `emptyText` | `string` | `'No result.'` | Text shown when no option matches. |
67
+ | `disabled` | `boolean` | `false` | Locks interaction (form control stays enabled). |
68
+ | `required` | `boolean` | `false` | Shows a red `*` next to the label. |
69
+ | `options` | `string[]` | `[]` | Rendered as `hlm-autocomplete-item` entries. |
70
+ | `class` | `ClassValue` | `''` | Extra host classes (base `tw:w-full`). |
71
+ | `labelClass` | `string` | `''` | Extra label classes (base `tw:mb-1`). |
72
+ | `controlClass` | `string` | `''` | Extra autocomplete-root classes. |
73
+ | `inputClass` | `string` | `''` | Extra text-input classes. |
74
+ | `errorClass` | `string` | `''` | Extra error classes (base `tw:mt-0`). |
75
+ | `hintClass` | `string` | `''` | Extra hint classes (base `tw:mt-0`). |
75
76
 
76
77
  | Member | Description |
77
78
  | -------------------- | ---------------------------------------------------------------------------------- |
package/form-autocomplete/fesm2022/form-autocomplete.mjs CHANGED
@@ -2,7 +2,7 @@ import * as i0 from '@angular/core';
2
2
  import { InjectionToken, inject, input, computed, Component } from '@angular/core';
3
3
  import * as i1 from '@angular/forms';
4
4
  import { FormGroupDirective, ReactiveFormsModule, ControlContainer } from '@angular/forms';
5
- import { HlmFormIdGenerator, HlmFormField, HlmError, HlmHint } from '@egose/shadcn-theme-ng-tw/form-field';
5
+ import { injectEgFormErrorMessages, HlmFormIdGenerator, resolveEgFormError, HlmFormField, HlmError, HlmHint } from '@egose/shadcn-theme-ng-tw/form-field';
6
6
  import { HlmLabel } from '@egose/shadcn-theme-ng-tw/label';
7
7
  import { HlmAutocomplete, HlmAutocompleteContent, HlmAutocompleteEmpty, HlmAutocompleteGroup, HlmAutocompleteInput, HlmAutocompleteItem, HlmAutocompleteList, HlmAutocompleteLabel } from '@egose/shadcn-theme-ng-tw/autocomplete';
8
8
  import { hlm } from '@egose/shadcn-theme-ng-tw/utils';
@@ -17,6 +17,7 @@ function injectEgFormAutocompleteConfig() {
17
17
 
18
18
  class EgFormAutocomplete {
19
19
  formGroupDirective = inject(FormGroupDirective);
20
+ _errorMessages = injectEgFormErrorMessages();
20
21
  generatedId = inject(HlmFormIdGenerator).generate('eg-form-autocomplete');
21
22
  _config = injectEgFormAutocompleteConfig();
22
23
  label = input(undefined, /* @ts-ignore */
@@ -27,6 +28,13 @@ class EgFormAutocomplete {
27
28
  ...(ngDevMode ? [{ debugName: "controlName" }] : /* istanbul ignore next */ []));
28
29
  error = input(undefined, /* @ts-ignore */
29
30
  ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
31
+ /**
32
+ * Auto-resolve the displayed message from the control's `ValidationErrors`
33
+ * when `error()` is unset. Explicit `error()` always wins. Set to `false`
34
+ * for manual-only messages.
35
+ */
36
+ autoError = input(true, /* @ts-ignore */
37
+ ...(ngDevMode ? [{ debugName: "autoError" }] : /* istanbul ignore next */ []));
30
38
  hint = input(undefined, /* @ts-ignore */
31
39
  ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
32
40
  id = input(undefined, /* @ts-ignore */
@@ -47,6 +55,32 @@ class EgFormAutocomplete {
47
55
  ...(ngDevMode ? [{ debugName: "errorId" }] : /* istanbul ignore next */ []));
48
56
  hintId = computed(() => `${this.effectiveId()}-hint`, /* @ts-ignore */
49
57
  ...(ngDevMode ? [{ debugName: "hintId" }] : /* istanbul ignore next */ []));
58
+ /**
59
+ * Displayed message: explicit `error()` wins; otherwise (when `autoError()`)
60
+ * auto-resolved from the control's `ValidationErrors`. Plain method (not a
61
+ * computed): `ValidationErrors` is not a signal, so the control must be read
62
+ * fresh on every change-detection pass.
63
+ */
64
+ resolvedError() {
65
+ const explicit = this.error();
66
+ if (explicit)
67
+ return explicit;
68
+ if (!this.autoError())
69
+ return undefined;
70
+ const control = this.formGroupDirective.form.get(this.controlName());
71
+ return resolveEgFormError(control?.errors ?? null, this.label(), this._errorMessages);
72
+ }
73
+ /**
74
+ * Whether the error is surfaced: message present + control invalid +
75
+ * touched/dirty/submitted. Gates the visual `<hlm-error>` (and
76
+ * `describedBy()`, where present) so sighted and screen-reader output agree.
77
+ */
78
+ showError() {
79
+ const control = this.formGroupDirective.form.get(this.controlName());
80
+ return (!!this.resolvedError() &&
81
+ !!control?.invalid &&
82
+ (control.dirty || control.touched || this.formGroupDirective.submitted));
83
+ }
50
84
  /**
51
85
  * Combined lock for the brain `linkedSignal`-based disabled state: the raw
52
86
  * input write always carries the resolved value, so a same-pass
@@ -83,10 +117,9 @@ class EgFormAutocomplete {
83
117
  $hintClass = computed(() => hlm('tw:mt-0', this._config.hintClass, this.hintClass()), /* @ts-ignore */
84
118
  ...(ngDevMode ? [{ debugName: "$hintClass" }] : /* istanbul ignore next */ []));
85
119
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: EgFormAutocomplete, deps: [], target: i0.ɵɵFactoryTarget.Component });
86
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.3", type: EgFormAutocomplete, isStandalone: true, selector: "eg-form-autocomplete", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, controlId: { classPropertyName: "controlId", publicName: "controlId", isSignal: true, isRequired: false, transformFunction: null }, controlName: { classPropertyName: "controlName", publicName: "controlName", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, labelClass: { classPropertyName: "labelClass", publicName: "labelClass", isSignal: true, isRequired: false, transformFunction: null }, controlClass: { classPropertyName: "controlClass", publicName: "controlClass", isSignal: true, isRequired: false, transformFunction: null }, inputClass: { classPropertyName: "inputClass", publicName: "inputClass", isSignal: true, isRequired: false, transformFunction: null }, errorClass: { classPropertyName: "errorClass", publicName: "errorClass", isSignal: true, isRequired: false, transformFunction: null }, hintClass: { classPropertyName: "hintClass", publicName: "hintClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "$userClass()" } }, providers: [{ provide: ControlContainer, useExisting: FormGroupDirective }], ngImport: i0, template: `
120
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.3", type: EgFormAutocomplete, isStandalone: true, selector: "eg-form-autocomplete", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, controlId: { classPropertyName: "controlId", publicName: "controlId", isSignal: true, isRequired: false, transformFunction: null }, controlName: { classPropertyName: "controlName", publicName: "controlName", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, autoError: { classPropertyName: "autoError", publicName: "autoError", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, labelClass: { classPropertyName: "labelClass", publicName: "labelClass", isSignal: true, isRequired: false, transformFunction: null }, controlClass: { classPropertyName: "controlClass", publicName: "controlClass", isSignal: true, isRequired: false, transformFunction: null }, inputClass: { classPropertyName: "inputClass", publicName: "inputClass", isSignal: true, isRequired: false, transformFunction: null }, errorClass: { classPropertyName: "errorClass", publicName: "errorClass", isSignal: true, isRequired: false, transformFunction: null }, hintClass: { classPropertyName: "hintClass", publicName: "hintClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "$userClass()" } }, providers: [{ provide: ControlContainer, useExisting: FormGroupDirective }], ngImport: i0, template: `
87
121
  @let lbl = label();
88
122
  @let cnm = controlName();
89
- @let err = error();
90
123
  @let hnt = hint();
91
124
  @let rqrd = required();
92
125
 
@@ -114,9 +147,9 @@ class EgFormAutocomplete {
114
147
  </hlm-autocomplete-content>
115
148
  </div>
116
149
 
117
- @if (err) {
150
+ @if (showError()) {
118
151
  <hlm-error [id]="errorId()" [class]="$errorClass()">
119
- {{ err }}
152
+ {{ resolvedError() }}
120
153
  </hlm-error>
121
154
  }
122
155
 
@@ -155,7 +188,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImpor
155
188
  template: `
156
189
  @let lbl = label();
157
190
  @let cnm = controlName();
158
- @let err = error();
159
191
  @let hnt = hint();
160
192
  @let rqrd = required();
161
193
 
@@ -183,9 +215,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImpor
183
215
  </hlm-autocomplete-content>
184
216
  </div>
185
217
 
186
- @if (err) {
218
+ @if (showError()) {
187
219
  <hlm-error [id]="errorId()" [class]="$errorClass()">
188
- {{ err }}
220
+ {{ resolvedError() }}
189
221
  </hlm-error>
190
222
  }
191
223
 
@@ -197,7 +229,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImpor
197
229
  </hlm-form-field>
198
230
  `,
199
231
  }]
200
- }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], controlId: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlId", required: false }] }], controlName: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlName", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], emptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyText", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], labelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelClass", required: false }] }], controlClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlClass", required: false }] }], inputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputClass", required: false }] }], errorClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorClass", required: false }] }], hintClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintClass", required: false }] }] } });
232
+ }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], controlId: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlId", required: false }] }], controlName: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlName", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], autoError: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoError", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], emptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyText", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], labelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelClass", required: false }] }], controlClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlClass", required: false }] }], inputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputClass", required: false }] }], errorClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorClass", required: false }] }], hintClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintClass", required: false }] }] } });
201
233
 
202
234
  /*
203
235
  * Public API Surface of form-autocomplete
package/form-autocomplete/types/form-autocomplete.d.ts CHANGED
@@ -4,12 +4,19 @@ import { ClassValue } from 'clsx';
4
4
 
5
5
  declare class EgFormAutocomplete {
6
6
  private readonly formGroupDirective;
7
+ private readonly _errorMessages;
7
8
  private readonly generatedId;
8
9
  private readonly _config;
9
10
  label: _angular_core.InputSignal<string | undefined>;
10
11
  controlId: _angular_core.InputSignal<string | undefined>;
11
12
  controlName: _angular_core.InputSignal<string>;
12
13
  error: _angular_core.InputSignal<string | undefined>;
14
+ /**
15
+ * Auto-resolve the displayed message from the control's `ValidationErrors`
16
+ * when `error()` is unset. Explicit `error()` always wins. Set to `false`
17
+ * for manual-only messages.
18
+ */
19
+ autoError: _angular_core.InputSignal<boolean>;
13
20
  hint: _angular_core.InputSignal<string | undefined>;
14
21
  id: _angular_core.InputSignal<string | undefined>;
15
22
  placeholder: _angular_core.InputSignal<string>;
@@ -20,6 +27,19 @@ declare class EgFormAutocomplete {
20
27
  readonly effectiveId: _angular_core.Signal<string>;
21
28
  readonly errorId: _angular_core.Signal<string>;
22
29
  readonly hintId: _angular_core.Signal<string>;
30
+ /**
31
+ * Displayed message: explicit `error()` wins; otherwise (when `autoError()`)
32
+ * auto-resolved from the control's `ValidationErrors`. Plain method (not a
33
+ * computed): `ValidationErrors` is not a signal, so the control must be read
34
+ * fresh on every change-detection pass.
35
+ */
36
+ protected resolvedError(): string | undefined;
37
+ /**
38
+ * Whether the error is surfaced: message present + control invalid +
39
+ * touched/dirty/submitted. Gates the visual `<hlm-error>` (and
40
+ * `describedBy()`, where present) so sighted and screen-reader output agree.
41
+ */
42
+ protected showError(): boolean;
23
43
  /**
24
44
  * Combined lock for the brain `linkedSignal`-based disabled state: the raw
25
45
  * input write always carries the resolved value, so a same-pass
@@ -39,7 +59,7 @@ declare class EgFormAutocomplete {
39
59
  $errorClass: _angular_core.Signal<string>;
40
60
  $hintClass: _angular_core.Signal<string>;
41
61
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<EgFormAutocomplete, never>;
42
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgFormAutocomplete, "eg-form-autocomplete", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "controlId": { "alias": "controlId"; "required": false; "isSignal": true; }; "controlName": { "alias": "controlName"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "labelClass": { "alias": "labelClass"; "required": false; "isSignal": true; }; "controlClass": { "alias": "controlClass"; "required": false; "isSignal": true; }; "inputClass": { "alias": "inputClass"; "required": false; "isSignal": true; }; "errorClass": { "alias": "errorClass"; "required": false; "isSignal": true; }; "hintClass": { "alias": "hintClass"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
62
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgFormAutocomplete, "eg-form-autocomplete", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "controlId": { "alias": "controlId"; "required": false; "isSignal": true; }; "controlName": { "alias": "controlName"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "autoError": { "alias": "autoError"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "labelClass": { "alias": "labelClass"; "required": false; "isSignal": true; }; "controlClass": { "alias": "controlClass"; "required": false; "isSignal": true; }; "inputClass": { "alias": "inputClass"; "required": false; "isSignal": true; }; "errorClass": { "alias": "errorClass"; "required": false; "isSignal": true; }; "hintClass": { "alias": "hintClass"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
43
63
  }
44
64
 
45
65
  interface EgFormAutocompleteConfig {
package/form-checkbox/README.md CHANGED
@@ -83,23 +83,24 @@ Selector (from source): `eg-form-checkbox` (standalone component).
83
83
 
84
84
  ### `EgFormCheckbox` — `eg-form-checkbox`
85
85
 
86
- | Input | Type | Default | Description |
87
- | --------------- | --------------------- | ------- | ------------------------------------------------------------------------------------------- |
88
- | `controlName` | `string` | `''` | `formControlName` key inside the parent `FormGroup`. **Required.** |
89
- | `label` | `string` | `''` | Label text next to the checkbox. |
90
- | `error` | `string \| undefined` | — | Error text shown when the control is invalid + touched/dirty (via `EgFormField` switching). |
91
- | `hint` | `string \| undefined` | — | Hint text shown when there is no error to display. |
92
- | `controlId` | `string \| undefined` | — | Explicit control id (first priority for `effectiveId`). |
93
- | `id` | `string \| undefined` | — | Fallback id (second priority). |
94
- | `name` | `string \| undefined` | — | Checkbox `name` attribute (defaults to `controlName`). |
95
- | `checked` | `boolean` | `false` | Initial checked state passed to `hlm-checkbox`. |
96
- | `required` | `boolean` | `false` | Shows a red `*` and sets checkbox `required`. |
97
- | `disabled` | `boolean` | `false` | Locks interaction via checkbox `wrapperDisabled` (does not write to the form control). |
98
- | `class` | `ClassValue` | `''` | Extra host classes. |
99
- | `checkboxClass` | `string` | `''` | Extra classes for `hlm-checkbox`. |
100
- | `labelClass` | `string` | `''` | Extra classes for the label. |
101
- | `errorClass` | `string` | `''` | Extra classes for `hlm-error`. |
102
- | `hintClass` | `string` | `''` | Extra classes for `hlm-hint`. |
86
+ | Input | Type | Default | Description |
87
+ | --------------- | --------------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
88
+ | `controlName` | `string` | `''` | `formControlName` key inside the parent `FormGroup`. **Required.** |
89
+ | `label` | `string` | `''` | Label text next to the checkbox. |
90
+ | `error` | `string \| undefined` | — | Error text shown when the control is invalid + touched/dirty (via `EgFormField` switching). |
91
+ | `autoError` | `boolean` | `true` | Auto-resolve the message from the control's `ValidationErrors` when `error` is unset. Explicit `error` always wins; `error=""` counts as unset. Global wording via `provideEgFormErrorMessages`. |
92
+ | `hint` | `string \| undefined` | — | Hint text shown when there is no error to display. |
93
+ | `controlId` | `string \| undefined` | — | Explicit control id (first priority for `effectiveId`). |
94
+ | `id` | `string \| undefined` | — | Fallback id (second priority). |
95
+ | `name` | `string \| undefined` | — | Checkbox `name` attribute (defaults to `controlName`). |
96
+ | `checked` | `boolean` | `false` | Initial checked state passed to `hlm-checkbox`. |
97
+ | `required` | `boolean` | `false` | Shows a red `*` and sets checkbox `required`. |
98
+ | `disabled` | `boolean` | `false` | Locks interaction via checkbox `wrapperDisabled` (does not write to the form control). |
99
+ | `class` | `ClassValue` | `''` | Extra host classes. |
100
+ | `checkboxClass` | `string` | `''` | Extra classes for `hlm-checkbox`. |
101
+ | `labelClass` | `string` | `''` | Extra classes for the label. |
102
+ | `errorClass` | `string` | `''` | Extra classes for `hlm-error`. |
103
+ | `hintClass` | `string` | `''` | Extra classes for `hlm-hint`. |
103
104
 
104
105
  | Member | Description |
105
106
  | -------------------- | ------------------------------------------------------------------------------------------------------------------------------------ |
package/form-checkbox/fesm2022/form-checkbox.mjs CHANGED
@@ -4,7 +4,7 @@ import * as i1 from '@angular/forms';
4
4
  import { FormGroupDirective, ReactiveFormsModule, ControlContainer } from '@angular/forms';
5
5
  import { HlmLabel } from '@egose/shadcn-theme-ng-tw/label';
6
6
  import { HlmCheckbox } from '@egose/shadcn-theme-ng-tw/checkbox';
7
- import { HlmFormIdGenerator, HlmError, HlmHint } from '@egose/shadcn-theme-ng-tw/form-field';
7
+ import { injectEgFormErrorMessages, HlmFormIdGenerator, resolveEgFormError, HlmError, HlmHint } from '@egose/shadcn-theme-ng-tw/form-field';
8
8
  import { EgFormField } from '@egose/shadcn-theme-ng-tw/form-field-simple';
9
9
  import { hlm } from '@egose/shadcn-theme-ng-tw/utils';
10
10
 
@@ -18,6 +18,7 @@ function injectEgFormCheckboxConfig() {
18
18
 
19
19
  class EgFormCheckbox {
20
20
  formGroupDirective = inject(FormGroupDirective);
21
+ _errorMessages = injectEgFormErrorMessages();
21
22
  generatedId = inject(HlmFormIdGenerator).generate('eg-form-checkbox');
22
23
  _config = injectEgFormCheckboxConfig();
23
24
  // Classes
@@ -33,6 +34,13 @@ class EgFormCheckbox {
33
34
  ...(ngDevMode ? [{ debugName: "controlName" }] : /* istanbul ignore next */ []));
34
35
  error = input(undefined, /* @ts-ignore */
35
36
  ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
37
+ /**
38
+ * Auto-resolve the displayed message from the control's `ValidationErrors`
39
+ * when `error()` is unset. Explicit `error()` always wins. Set to `false`
40
+ * for manual-only messages.
41
+ */
42
+ autoError = input(true, /* @ts-ignore */
43
+ ...(ngDevMode ? [{ debugName: "autoError" }] : /* istanbul ignore next */ []));
36
44
  hint = input(undefined, /* @ts-ignore */
37
45
  ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
38
46
  id = input(undefined, /* @ts-ignore */
@@ -51,13 +59,34 @@ class EgFormCheckbox {
51
59
  ...(ngDevMode ? [{ debugName: "errorId" }] : /* istanbul ignore next */ []));
52
60
  hintId = computed(() => `${this.effectiveId()}-hint`, /* @ts-ignore */
53
61
  ...(ngDevMode ? [{ debugName: "hintId" }] : /* istanbul ignore next */ []));
54
- describedBy() {
62
+ /**
63
+ * Displayed message: explicit `error()` wins; otherwise (when `autoError()`)
64
+ * auto-resolved from the control's `ValidationErrors`. Plain method (not a
65
+ * computed): `ValidationErrors` is not a signal, so the control must be read
66
+ * fresh on every change-detection pass.
67
+ */
68
+ resolvedError() {
69
+ const explicit = this.error();
70
+ if (explicit)
71
+ return explicit;
72
+ if (!this.autoError())
73
+ return undefined;
74
+ const control = this.formGroupDirective.form.get(this.controlName());
75
+ return resolveEgFormError(control?.errors ?? null, this.label(), this._errorMessages);
76
+ }
77
+ /**
78
+ * Whether the error is surfaced: message present + control invalid +
79
+ * touched/dirty/submitted. Gates the visual `<hlm-error>` (and
80
+ * `describedBy()`, where present) so sighted and screen-reader output agree.
81
+ */
82
+ showError() {
55
83
  const control = this.formGroupDirective.form.get(this.controlName());
56
- return this.error() && control?.invalid && (control.dirty || control.touched)
57
- ? this.errorId()
58
- : this.hint()
59
- ? this.hintId()
60
- : null;
84
+ return (!!this.resolvedError() &&
85
+ !!control?.invalid &&
86
+ (control.dirty || control.touched || this.formGroupDirective.submitted));
87
+ }
88
+ describedBy() {
89
+ return this.showError() ? this.errorId() : this.hint() ? this.hintId() : null;
61
90
  }
62
91
  // Styling
63
92
  checkboxClass = input('', /* @ts-ignore */
@@ -78,10 +107,9 @@ class EgFormCheckbox {
78
107
  $hintClass = computed(() => hlm(this._config.hintClass, this.hintClass()), /* @ts-ignore */
79
108
  ...(ngDevMode ? [{ debugName: "$hintClass" }] : /* istanbul ignore next */ []));
80
109
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: EgFormCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
81
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.3", type: EgFormCheckbox, isStandalone: true, selector: "eg-form-checkbox", inputs: { userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, controlId: { classPropertyName: "controlId", publicName: "controlId", isSignal: true, isRequired: false, transformFunction: null }, controlName: { classPropertyName: "controlName", publicName: "controlName", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, checkboxClass: { classPropertyName: "checkboxClass", publicName: "checkboxClass", isSignal: true, isRequired: false, transformFunction: null }, labelClass: { classPropertyName: "labelClass", publicName: "labelClass", isSignal: true, isRequired: false, transformFunction: null }, errorClass: { classPropertyName: "errorClass", publicName: "errorClass", isSignal: true, isRequired: false, transformFunction: null }, hintClass: { classPropertyName: "hintClass", publicName: "hintClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, providers: [{ provide: ControlContainer, useExisting: FormGroupDirective }], ngImport: i0, template: `
110
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.3", type: EgFormCheckbox, isStandalone: true, selector: "eg-form-checkbox", inputs: { userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, controlId: { classPropertyName: "controlId", publicName: "controlId", isSignal: true, isRequired: false, transformFunction: null }, controlName: { classPropertyName: "controlName", publicName: "controlName", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, autoError: { classPropertyName: "autoError", publicName: "autoError", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, checkboxClass: { classPropertyName: "checkboxClass", publicName: "checkboxClass", isSignal: true, isRequired: false, transformFunction: null }, labelClass: { classPropertyName: "labelClass", publicName: "labelClass", isSignal: true, isRequired: false, transformFunction: null }, errorClass: { classPropertyName: "errorClass", publicName: "errorClass", isSignal: true, isRequired: false, transformFunction: null }, hintClass: { classPropertyName: "hintClass", publicName: "hintClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, providers: [{ provide: ControlContainer, useExisting: FormGroupDirective }], ngImport: i0, template: `
82
111
  @let lbl = label();
83
112
  @let cnm = controlName();
84
- @let err = error();
85
113
  @let hnt = hint();
86
114
  @let rqrd = required();
87
115
 
@@ -105,9 +133,9 @@ class EgFormCheckbox {
105
133
  </label>
106
134
  </div>
107
135
 
108
- @if (err) {
136
+ @if (showError()) {
109
137
  <hlm-error [id]="errorId()" [class]="$errorClass()">
110
- {{ err }}
138
+ {{ resolvedError() }}
111
139
  </hlm-error>
112
140
  }
113
141
 
@@ -133,7 +161,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImpor
133
161
  template: `
134
162
  @let lbl = label();
135
163
  @let cnm = controlName();
136
- @let err = error();
137
164
  @let hnt = hint();
138
165
  @let rqrd = required();
139
166
 
@@ -157,9 +184,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImpor
157
184
  </label>
158
185
  </div>
159
186
 
160
- @if (err) {
187
+ @if (showError()) {
161
188
  <hlm-error [id]="errorId()" [class]="$errorClass()">
162
- {{ err }}
189
+ {{ resolvedError() }}
163
190
  </hlm-error>
164
191
  }
165
192
 
@@ -171,7 +198,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImpor
171
198
  </eg-form-field>
172
199
  `,
173
200
  }]
174
- }], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], controlId: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlId", required: false }] }], controlName: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlName", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], checkboxClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkboxClass", required: false }] }], labelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelClass", required: false }] }], errorClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorClass", required: false }] }], hintClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintClass", required: false }] }] } });
201
+ }], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], controlId: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlId", required: false }] }], controlName: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlName", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], autoError: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoError", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], checkboxClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkboxClass", required: false }] }], labelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelClass", required: false }] }], errorClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorClass", required: false }] }], hintClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintClass", required: false }] }] } });
175
202
 
176
203
  /*
177
204
  * Public API Surface of form-checkbox
package/form-checkbox/types/form-checkbox.d.ts CHANGED
@@ -4,6 +4,7 @@ import { ClassValue } from 'clsx';
4
4
 
5
5
  declare class EgFormCheckbox {
6
6
  private readonly formGroupDirective;
7
+ private readonly _errorMessages;
7
8
  private readonly generatedId;
8
9
  private readonly _config;
9
10
  readonly userClass: _angular_core.InputSignal<ClassValue>;
@@ -12,6 +13,12 @@ declare class EgFormCheckbox {
12
13
  controlId: _angular_core.InputSignal<string | undefined>;
13
14
  controlName: _angular_core.InputSignal<string>;
14
15
  error: _angular_core.InputSignal<string | undefined>;
16
+ /**
17
+ * Auto-resolve the displayed message from the control's `ValidationErrors`
18
+ * when `error()` is unset. Explicit `error()` always wins. Set to `false`
19
+ * for manual-only messages.
20
+ */
21
+ autoError: _angular_core.InputSignal<boolean>;
15
22
  hint: _angular_core.InputSignal<string | undefined>;
16
23
  id: _angular_core.InputSignal<string | undefined>;
17
24
  name: _angular_core.InputSignal<string | undefined>;
@@ -21,6 +28,19 @@ declare class EgFormCheckbox {
21
28
  readonly effectiveId: _angular_core.Signal<string>;
22
29
  readonly errorId: _angular_core.Signal<string>;
23
30
  readonly hintId: _angular_core.Signal<string>;
31
+ /**
32
+ * Displayed message: explicit `error()` wins; otherwise (when `autoError()`)
33
+ * auto-resolved from the control's `ValidationErrors`. Plain method (not a
34
+ * computed): `ValidationErrors` is not a signal, so the control must be read
35
+ * fresh on every change-detection pass.
36
+ */
37
+ protected resolvedError(): string | undefined;
38
+ /**
39
+ * Whether the error is surfaced: message present + control invalid +
40
+ * touched/dirty/submitted. Gates the visual `<hlm-error>` (and
41
+ * `describedBy()`, where present) so sighted and screen-reader output agree.
42
+ */
43
+ protected showError(): boolean;
24
44
  describedBy(): string | null;
25
45
  checkboxClass: _angular_core.InputSignal<string>;
26
46
  labelClass: _angular_core.InputSignal<string>;
@@ -31,7 +51,7 @@ declare class EgFormCheckbox {
31
51
  $errorClass: _angular_core.Signal<string>;
32
52
  $hintClass: _angular_core.Signal<string>;
33
53
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<EgFormCheckbox, never>;
34
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgFormCheckbox, "eg-form-checkbox", never, { "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "controlId": { "alias": "controlId"; "required": false; "isSignal": true; }; "controlName": { "alias": "controlName"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "checkboxClass": { "alias": "checkboxClass"; "required": false; "isSignal": true; }; "labelClass": { "alias": "labelClass"; "required": false; "isSignal": true; }; "errorClass": { "alias": "errorClass"; "required": false; "isSignal": true; }; "hintClass": { "alias": "hintClass"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
54
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgFormCheckbox, "eg-form-checkbox", never, { "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "controlId": { "alias": "controlId"; "required": false; "isSignal": true; }; "controlName": { "alias": "controlName"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "autoError": { "alias": "autoError"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "checkboxClass": { "alias": "checkboxClass"; "required": false; "isSignal": true; }; "labelClass": { "alias": "labelClass"; "required": false; "isSignal": true; }; "errorClass": { "alias": "errorClass"; "required": false; "isSignal": true; }; "hintClass": { "alias": "hintClass"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
35
55
  }
36
56
 
37
57
  interface EgFormCheckboxConfig {
package/form-combobox/README.md CHANGED
@@ -47,26 +47,27 @@ Selector (from source): `eg-form-combobox` (standalone component, host `tw:w-ful
47
47
 
48
48
  ### `EgFormCombobox` — `eg-form-combobox`
49
49
 
50
- | Input | Type | Default | Description |
51
- | -------------- | ------------------------ | ------------------------ | ----------------------------------------------------------------------------------------------------------- |
52
- | `controlName` | `string` | `''` | `formControlName` key inside the parent `FormGroup`. **Required.** |
53
- | `mode` | `'single' \| 'multiple'` | `'multiple'` | `multiple` renders chips + multi-select (`string[]`); `single` renders a trigger button (`string \| null`). |
54
- | `label` | `string \| undefined` | — | Label text (hidden when omitted). |
55
- | `error` | `string \| undefined` | — | Error text shown when invalid. |
56
- | `hint` | `string \| undefined` | — | Hint text shown otherwise. |
57
- | `controlId` | `string \| undefined` | — | Explicit id (first priority for `effectiveId`). |
58
- | `id` | `string \| undefined` | — | Fallback id (second priority). |
59
- | `placeholder` | `string` | `'Pick…'` | Search input placeholder. |
60
- | `emptyText` | `string` | `'Nothing left to add.'` | Text shown when no option matches. |
61
- | `disabled` | `boolean` | `false` | Locks interaction (form control stays enabled). |
62
- | `required` | `boolean` | `false` | Shows a red `*` next to the label. |
63
- | `options` | `string[]` | `[]` | Rendered as `hlm-combobox-item` entries. |
64
- | `class` | `ClassValue` | `''` | Extra host classes (base `tw:w-full`). |
65
- | `labelClass` | `string` | `''` | Extra label classes (base `tw:mb-1`). |
66
- | `controlClass` | `string` | `''` | Extra multi-root classes. |
67
- | `chipsClass` | `string` | `''` | Extra chips-anchor classes. |
68
- | `errorClass` | `string` | `''` | Extra error classes (base `tw:mt-0`). |
69
- | `hintClass` | `string` | `''` | Extra hint classes (base `tw:mt-0`). |
50
+ | Input | Type | Default | Description |
51
+ | -------------- | ------------------------ | ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
52
+ | `controlName` | `string` | `''` | `formControlName` key inside the parent `FormGroup`. **Required.** |
53
+ | `mode` | `'single' \| 'multiple'` | `'multiple'` | `multiple` renders chips + multi-select (`string[]`); `single` renders a trigger button (`string \| null`). |
54
+ | `label` | `string \| undefined` | — | Label text (hidden when omitted). |
55
+ | `error` | `string \| undefined` | — | Error text shown when invalid. |
56
+ | `autoError` | `boolean` | `true` | Auto-resolve the message from the control's `ValidationErrors` when `error` is unset. Explicit `error` always wins; `error=""` counts as unset. Global wording via `provideEgFormErrorMessages`. |
57
+ | `hint` | `string \| undefined` | — | Hint text shown otherwise. |
58
+ | `controlId` | `string \| undefined` | — | Explicit id (first priority for `effectiveId`). |
59
+ | `id` | `string \| undefined` | — | Fallback id (second priority). |
60
+ | `placeholder` | `string` | `'Pick…'` | Search input placeholder. |
61
+ | `emptyText` | `string` | `'Nothing left to add.'` | Text shown when no option matches. |
62
+ | `disabled` | `boolean` | `false` | Locks interaction (form control stays enabled). |
63
+ | `required` | `boolean` | `false` | Shows a red `*` next to the label. |
64
+ | `options` | `string[]` | `[]` | Rendered as `hlm-combobox-item` entries. |
65
+ | `class` | `ClassValue` | `''` | Extra host classes (base `tw:w-full`). |
66
+ | `labelClass` | `string` | `''` | Extra label classes (base `tw:mb-1`). |
67
+ | `controlClass` | `string` | `''` | Extra multi-root classes. |
68
+ | `chipsClass` | `string` | `''` | Extra chips-anchor classes. |
69
+ | `errorClass` | `string` | `''` | Extra error classes (base `tw:mt-0`). |
70
+ | `hintClass` | `string` | `''` | Extra hint classes (base `tw:mt-0`). |
70
71
 
71
72
  | Member | Description |
72
73
  | -------------------- | ---------------------------------------------------------------------------------- |