@ng-forge/dynamic-forms-bootstrap 1.3.0-next.1 → 1.3.0-next.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.
Files changed (47) hide show
  1. package/fesm2022/ng-forge-dynamic-forms-bootstrap-bs-field-errors-wrapper.component-42hynKVO.mjs +56 -0
  2. package/fesm2022/ng-forge-dynamic-forms-bootstrap-bs-field-errors-wrapper.component-42hynKVO.mjs.map +1 -0
  3. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-addon-button.mjs +64 -37
  4. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-addon-button.mjs.map +1 -1
  5. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-addon-icon.mjs +92 -34
  6. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-addon-icon.mjs.map +1 -1
  7. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-button.mjs +94 -49
  8. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-button.mjs.map +1 -1
  9. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-checkbox.mjs +97 -23
  10. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-checkbox.mjs.map +1 -1
  11. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-datepicker.mjs +169 -40
  12. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-datepicker.mjs.map +1 -1
  13. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-input.mjs +180 -88
  14. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-input.mjs.map +1 -1
  15. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-multi-checkbox.mjs +143 -66
  16. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-multi-checkbox.mjs.map +1 -1
  17. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-radio.mjs +326 -61
  18. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-radio.mjs.map +1 -1
  19. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-select.mjs +123 -33
  20. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-select.mjs.map +1 -1
  21. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-slider.mjs +161 -30
  22. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-slider.mjs.map +1 -1
  23. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-textarea.mjs +97 -23
  24. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-textarea.mjs.map +1 -1
  25. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-toggle.mjs +97 -23
  26. package/fesm2022/ng-forge-dynamic-forms-bootstrap-lazy-toggle.mjs.map +1 -1
  27. package/fesm2022/ng-forge-dynamic-forms-bootstrap-shared.mjs +100 -41
  28. package/fesm2022/ng-forge-dynamic-forms-bootstrap-shared.mjs.map +1 -1
  29. package/fesm2022/ng-forge-dynamic-forms-bootstrap.mjs +238 -251
  30. package/fesm2022/ng-forge-dynamic-forms-bootstrap.mjs.map +1 -1
  31. package/package.json +2 -2
  32. package/types/ng-forge-dynamic-forms-bootstrap-lazy-addon-button.d.ts +18 -18
  33. package/types/ng-forge-dynamic-forms-bootstrap-lazy-addon-icon.d.ts +24 -17
  34. package/types/ng-forge-dynamic-forms-bootstrap-lazy-button.d.ts +94 -88
  35. package/types/ng-forge-dynamic-forms-bootstrap-lazy-checkbox.d.ts +24 -18
  36. package/types/ng-forge-dynamic-forms-bootstrap-lazy-datepicker.d.ts +49 -28
  37. package/types/ng-forge-dynamic-forms-bootstrap-lazy-input.d.ts +51 -38
  38. package/types/ng-forge-dynamic-forms-bootstrap-lazy-multi-checkbox.d.ts +34 -23
  39. package/types/ng-forge-dynamic-forms-bootstrap-lazy-radio.d.ts +30 -19
  40. package/types/ng-forge-dynamic-forms-bootstrap-lazy-select.d.ts +36 -24
  41. package/types/ng-forge-dynamic-forms-bootstrap-lazy-slider.d.ts +56 -35
  42. package/types/ng-forge-dynamic-forms-bootstrap-lazy-textarea.d.ts +24 -18
  43. package/types/ng-forge-dynamic-forms-bootstrap-lazy-toggle.d.ts +23 -17
  44. package/types/ng-forge-dynamic-forms-bootstrap-shared.d.ts +78 -71
  45. package/types/ng-forge-dynamic-forms-bootstrap.d.ts +225 -251
  46. package/fesm2022/ng-forge-dynamic-forms-bootstrap-bs-field-errors-wrapper.component-D4qTxFSp.mjs +0 -25
  47. package/fesm2022/ng-forge-dynamic-forms-bootstrap-bs-field-errors-wrapper.component-D4qTxFSp.mjs.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"ng-forge-dynamic-forms-bootstrap-lazy-multi-checkbox.mjs","mappings":";;;;;;;AAqEc;;;;AAIH;;IAGA;;;;;AAKP;;;AAGF;AAEI;;AAEF;AAIF;AACE;AACE;AAEA;AACE;;AAEJ;AAEA;AACE;AACA;;;AAIE;;AAEJ;;;AAIA;;;AAGI;AACE;AACA;;;AAEF;;AAEJ;;;AArDiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAlBlB;;;;AA1CS","names":[],"ignoreList":[],"sources":["../../../../packages/dynamic-forms-bootstrap/src/lib/fields/multi-checkbox/bs-multi-checkbox.component.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input, linkedSignal } from '@angular/core';\nimport { FieldOption, ValueType } from '@ng-forge/dynamic-forms';\nimport { DynamicTextPipe } from '@ng-forge/dynamic-forms/integration';\nimport { injectNgForgeField, NgForgeFieldHost, isEqual, NgForgeControl } from '@ng-forge/dynamic-forms/integration';\nimport { explicitEffect } from 'ngxtension/explicit-effect';\nimport { BsMultiCheckboxProps } from './bs-multi-checkbox.type';\nimport { AsyncPipe } from '@angular/common';\n\n@Component({\n selector: 'df-bs-multi-checkbox',\n imports: [DynamicTextPipe, AsyncPipe, NgForgeControl],\n styleUrl: '../../styles/_form-field.scss',\n hostDirectives: [NgForgeFieldHost],\n template: `\n @let f = ngf.field();\n @let checked = checkedValuesMap();\n @if (ngf.label(); as label) {\n <div class=\"form-label\">{{ label | dynamicText | async }}</div>\n }\n\n <div class=\"checkbox-group\">\n @for (option of options(); track option.value; let i = $index) {\n <div\n class=\"form-check\"\n [class.form-switch]=\"props()?.switch\"\n [class.form-check-inline]=\"props()?.inline\"\n [class.form-check-reverse]=\"props()?.reverse\"\n >\n <input\n ngForgeControl\n type=\"checkbox\"\n [id]=\"ngf.key() + '_' + i\"\n [checked]=\"checked['' + option.value]\"\n [disabled]=\"f().disabled() || option.disabled\"\n (change)=\"onCheckboxChange(option, $event)\"\n class=\"form-check-input\"\n [class.is-invalid]=\"f().invalid() && f().touched()\"\n [attr.tabindex]=\"ngf.tabIndex()\"\n />\n <label [for]=\"ngf.key() + '_' + i\" class=\"form-check-label\">\n {{ option.label | dynamicText | async }}\n </label>\n </div>\n }\n </div>\n\n @if (ngf.errorsToDisplay()[0]; as error) {\n <div class=\"invalid-feedback d-block\" [id]=\"ngf.errorId()\" role=\"alert\">{{ error.message }}</div>\n } @else if (props()?.hint; as hint) {\n <div class=\"form-text\" [id]=\"ngf.hintId()\">{{ hint | dynamicText | async }}</div>\n }\n `,\n styles: [\n `\n :host {\n display: block;\n }\n\n .checkbox-group {\n margin-bottom: 0.5rem;\n }\n\n :host([hidden]) {\n display: none !important;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport default class BsMultiCheckboxFieldComponent {\n protected readonly ngf = injectNgForgeField<ValueType[]>();\n\n readonly options = input<FieldOption<ValueType>[]>([]);\n readonly props = input<BsMultiCheckboxProps>();\n\n /** Computed map of checked option values for O(1) lookup in template */\n readonly checkedValuesMap = computed(() => {\n const map: Record<string, boolean> = {};\n for (const opt of this.valueViewModel()) {\n map[String(opt.value)] = true;\n }\n return map;\n });\n\n valueViewModel = linkedSignal<FieldOption<ValueType>[]>(\n () => {\n const currentValues = this.ngf.field()().value();\n return this.options().filter((option) => currentValues.includes(option.value));\n },\n { equal: isEqual },\n );\n\n constructor() {\n explicitEffect([this.valueViewModel], ([selectedOptions]: [FieldOption<ValueType>[]]) => {\n const selectedValues = selectedOptions.map((option: FieldOption<ValueType>) => option.value);\n\n if (!isEqual(selectedValues, this.ngf.field()().value())) {\n this.ngf.field()().value.set(selectedValues);\n }\n });\n\n explicitEffect([this.options], ([options]: [FieldOption<ValueType>[]]) => {\n const values = options.map((option: FieldOption<ValueType>) => option.value);\n const uniqueValues = new Set(values);\n\n if (values.length !== uniqueValues.size) {\n const duplicates = values.filter((value, index) => values.indexOf(value) !== index);\n throw new Error(`Duplicate option values detected in bs-multi-checkbox: ${duplicates.join(', ')}`);\n }\n });\n }\n\n onCheckboxChange(option: FieldOption<ValueType>, event: Event): void {\n const checked = (event.target as HTMLInputElement).checked;\n this.valueViewModel.update((currentOptions: FieldOption<ValueType>[]) => {\n if (checked) {\n return currentOptions.some((opt: FieldOption<ValueType>) => opt.value === option.value)\n ? currentOptions\n : [...currentOptions, option];\n } else {\n return currentOptions.filter((opt: FieldOption<ValueType>) => opt.value !== option.value);\n }\n });\n }\n}\n"]}
1
+ {"version":3,"file":"ng-forge-dynamic-forms-bootstrap-lazy-multi-checkbox.mjs","names":[],"sources":["../../../../packages/dynamic-forms-bootstrap/src/lib/fields/multi-checkbox/bs-multi-checkbox.component.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input, linkedSignal } from '@angular/core';\nimport { FieldOption, ValueType } from '@ng-forge/dynamic-forms';\nimport { DynamicTextPipe } from '@ng-forge/dynamic-forms/integration';\nimport { injectNgForgeField, NgForgeFieldHost, isEqual, NgForgeControl } from '@ng-forge/dynamic-forms/integration';\nimport { explicitEffect } from 'ngxtension/explicit-effect';\nimport { BsMultiCheckboxProps } from './bs-multi-checkbox.type';\nimport { AsyncPipe } from '@angular/common';\n\n@Component({\n selector: 'df-bs-multi-checkbox',\n imports: [DynamicTextPipe, AsyncPipe, NgForgeControl],\n styleUrl: '../../styles/_form-field.scss',\n hostDirectives: [NgForgeFieldHost],\n template: `\n @let f = ngf.field();\n @let checked = checkedValuesMap();\n @if (ngf.label(); as label) {\n <div class=\"form-label\">{{ label | dynamicText | async }}</div>\n }\n\n <div class=\"checkbox-group\">\n @for (option of options(); track option.value; let i = $index) {\n <div\n class=\"form-check\"\n [class.form-switch]=\"props()?.switch\"\n [class.form-check-inline]=\"props()?.inline\"\n [class.form-check-reverse]=\"props()?.reverse\"\n >\n <input\n ngForgeControl\n type=\"checkbox\"\n [id]=\"ngf.key() + '_' + i\"\n [checked]=\"checked['' + option.value]\"\n [disabled]=\"f().disabled() || option.disabled\"\n (change)=\"onCheckboxChange(option, $event)\"\n class=\"form-check-input\"\n [class.is-invalid]=\"f().invalid() && f().touched()\"\n [attr.tabindex]=\"ngf.tabIndex()\"\n />\n <label [for]=\"ngf.key() + '_' + i\" class=\"form-check-label\">\n {{ option.label | dynamicText | async }}\n </label>\n </div>\n }\n </div>\n\n @if (ngf.errorsToDisplay()[0]; as error) {\n <div class=\"invalid-feedback d-block\" [id]=\"ngf.errorId()\" role=\"alert\">{{ error.message }}</div>\n } @else if (props()?.hint; as hint) {\n <div class=\"form-text\" [id]=\"ngf.hintId()\">{{ hint | dynamicText | async }}</div>\n }\n `,\n styles: [\n `\n :host {\n display: block;\n }\n\n .checkbox-group {\n margin-bottom: 0.5rem;\n }\n\n :host([hidden]) {\n display: none !important;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport default class BsMultiCheckboxFieldComponent {\n protected readonly ngf = injectNgForgeField<ValueType[]>();\n\n readonly options = input<FieldOption<ValueType>[]>([]);\n readonly props = input<BsMultiCheckboxProps>();\n\n /** Computed map of checked option values for O(1) lookup in template */\n readonly checkedValuesMap = computed(() => {\n const map: Record<string, boolean> = {};\n for (const opt of this.valueViewModel()) {\n map[String(opt.value)] = true;\n }\n return map;\n });\n\n valueViewModel = linkedSignal<FieldOption<ValueType>[]>(\n () => {\n const currentValues = this.ngf.field()().value();\n return this.options().filter((option) => currentValues.includes(option.value));\n },\n { equal: isEqual },\n );\n\n constructor() {\n explicitEffect([this.valueViewModel], ([selectedOptions]: [FieldOption<ValueType>[]]) => {\n const selectedValues = selectedOptions.map((option: FieldOption<ValueType>) => option.value);\n\n if (!isEqual(selectedValues, this.ngf.field()().value())) {\n this.ngf.field()().value.set(selectedValues);\n }\n });\n\n explicitEffect([this.options], ([options]: [FieldOption<ValueType>[]]) => {\n const values = options.map((option: FieldOption<ValueType>) => option.value);\n const uniqueValues = new Set(values);\n\n if (values.length !== uniqueValues.size) {\n const duplicates = values.filter((value, index) => values.indexOf(value) !== index);\n throw new Error(`Duplicate option values detected in bs-multi-checkbox: ${duplicates.join(', ')}`);\n }\n });\n }\n\n onCheckboxChange(option: FieldOption<ValueType>, event: Event): void {\n const checked = (event.target as HTMLInputElement).checked;\n this.valueViewModel.update((currentOptions: FieldOption<ValueType>[]) => {\n if (checked) {\n return currentOptions.some((opt: FieldOption<ValueType>) => opt.value === option.value)\n ? currentOptions\n : [...currentOptions, option];\n } else {\n return currentOptions.filter((opt: FieldOption<ValueType>) => opt.value !== option.value);\n }\n });\n }\n}\n"],"mappings":"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"}
@@ -1,33 +1,97 @@
1
- import * as i0 from '@angular/core';
2
- import { inject, model, input, ChangeDetectionStrategy, Component } from '@angular/core';
3
- import { FormField } from '@angular/forms/signals';
4
- import * as i1 from '@ng-forge/dynamic-forms/integration';
5
- import { NgForgeField, NgForgeControl, DynamicTextPipe, injectNgForgeField, NgForgeFieldHost } from '@ng-forge/dynamic-forms/integration';
6
- import { AsyncPipe } from '@angular/common';
7
-
8
- class BsRadioGroupComponent {
9
- parentField = inject(NgForgeField, { optional: true });
10
- value = model(undefined, /* @ts-ignore */
11
- ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
12
- disabled = input(false, /* @ts-ignore */
13
- ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
14
- readonly = input(false, /* @ts-ignore */
15
- ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
16
- name = input('', /* @ts-ignore */
17
- ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
18
- label = input(/* @ts-ignore */
19
- ...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
20
- options = input.required(/* @ts-ignore */
21
- ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
22
- properties = input(/* @ts-ignore */
23
- ...(ngDevMode ? [undefined, { debugName: "properties" }] : /* istanbul ignore next */ []));
24
- onRadioChange(newValue) {
25
- if (!this.disabled() && !this.readonly()) {
26
- this.value.set(newValue);
27
- }
28
- }
29
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: BsRadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
30
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: BsRadioGroupComponent, isStandalone: true, selector: "df-bs-radio-group", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, properties: { classPropertyName: "properties", publicName: "properties", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { attributes: { "role": "radiogroup" }, properties: { "attr.aria-invalid": "parentField?.ariaInvalid() || null", "attr.aria-required": "parentField?.ariaRequired()", "attr.aria-describedby": "parentField?.ariaDescribedBy()" } }, ngImport: i0, template: `
1
+ import * as i0 from "@angular/core";
2
+ import { ChangeDetectionStrategy, Component, inject, input, model } from "@angular/core";
3
+ import { FormField } from "@angular/forms/signals";
4
+ import * as i1 from "@ng-forge/dynamic-forms/integration";
5
+ import { DynamicTextPipe, NgForgeControl, NgForgeField, NgForgeFieldHost, injectNgForgeField } from "@ng-forge/dynamic-forms/integration";
6
+ import { AsyncPipe } from "@angular/common";
7
+ var BsRadioGroupComponent = class BsRadioGroupComponent {
8
+ parentField = inject(NgForgeField, { optional: true });
9
+ value = model(void 0, ...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
10
+ disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
11
+ readonly = input(false, ...ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []);
12
+ name = input("", ...ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []);
13
+ label = input(...ngDevMode ? [void 0, { debugName: "label" }] : /* istanbul ignore next */ []);
14
+ options = input.required(...ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []);
15
+ properties = input(...ngDevMode ? [void 0, { debugName: "properties" }] : /* istanbul ignore next */ []);
16
+ onRadioChange(newValue) {
17
+ if (!this.disabled() && !this.readonly()) this.value.set(newValue);
18
+ }
19
+ static ɵfac = i0.ɵɵngDeclareFactory({
20
+ minVersion: "12.0.0",
21
+ version: "22.2.5",
22
+ ngImport: i0,
23
+ type: BsRadioGroupComponent,
24
+ deps: [],
25
+ target: i0.ɵɵFactoryTarget.Component
26
+ });
27
+ static ɵcmp = i0.ɵɵngDeclareComponent({
28
+ minVersion: "17.0.0",
29
+ version: "22.2.5",
30
+ type: BsRadioGroupComponent,
31
+ isStandalone: true,
32
+ selector: "df-bs-radio-group",
33
+ inputs: {
34
+ value: {
35
+ classPropertyName: "value",
36
+ publicName: "value",
37
+ isSignal: true,
38
+ isRequired: false,
39
+ transformFunction: null
40
+ },
41
+ disabled: {
42
+ classPropertyName: "disabled",
43
+ publicName: "disabled",
44
+ isSignal: true,
45
+ isRequired: false,
46
+ transformFunction: null
47
+ },
48
+ readonly: {
49
+ classPropertyName: "readonly",
50
+ publicName: "readonly",
51
+ isSignal: true,
52
+ isRequired: false,
53
+ transformFunction: null
54
+ },
55
+ name: {
56
+ classPropertyName: "name",
57
+ publicName: "name",
58
+ isSignal: true,
59
+ isRequired: false,
60
+ transformFunction: null
61
+ },
62
+ label: {
63
+ classPropertyName: "label",
64
+ publicName: "label",
65
+ isSignal: true,
66
+ isRequired: false,
67
+ transformFunction: null
68
+ },
69
+ options: {
70
+ classPropertyName: "options",
71
+ publicName: "options",
72
+ isSignal: true,
73
+ isRequired: true,
74
+ transformFunction: null
75
+ },
76
+ properties: {
77
+ classPropertyName: "properties",
78
+ publicName: "properties",
79
+ isSignal: true,
80
+ isRequired: false,
81
+ transformFunction: null
82
+ }
83
+ },
84
+ outputs: { value: "valueChange" },
85
+ host: {
86
+ attributes: { "role": "radiogroup" },
87
+ properties: {
88
+ "attr.aria-invalid": "parentField?.ariaInvalid() || null",
89
+ "attr.aria-required": "parentField?.ariaRequired()",
90
+ "attr.aria-describedby": "parentField?.ariaDescribedBy()"
91
+ }
92
+ },
93
+ ngImport: i0,
94
+ template: `
31
95
  @let props = properties();
32
96
  @if (props?.buttonGroup) {
33
97
  <div class="btn-group" role="group" [attr.aria-label]="label() | dynamicText | async">
@@ -74,16 +138,51 @@ class BsRadioGroupComponent {
74
138
  </div>
75
139
  }
76
140
  }
77
- `, isInline: true, styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: NgForgeControl, selector: "[ngForgeControl]", inputs: ["ngForgeControl"] }, { kind: "pipe", type: DynamicTextPipe, name: "dynamicText" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
78
- }
79
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: BsRadioGroupComponent, decorators: [{
80
- type: Component,
81
- args: [{ selector: 'df-bs-radio-group', imports: [DynamicTextPipe, AsyncPipe, NgForgeControl], host: {
82
- role: 'radiogroup',
83
- '[attr.aria-invalid]': 'parentField?.ariaInvalid() || null',
84
- '[attr.aria-required]': 'parentField?.ariaRequired()',
85
- '[attr.aria-describedby]': 'parentField?.ariaDescribedBy()',
86
- }, template: `
141
+ `,
142
+ isInline: true,
143
+ styles: [":host{display:block}\n"],
144
+ dependencies: [
145
+ {
146
+ kind: "directive",
147
+ type: NgForgeControl,
148
+ selector: "[ngForgeControl]",
149
+ inputs: ["ngForgeControl"]
150
+ },
151
+ {
152
+ kind: "pipe",
153
+ type: DynamicTextPipe,
154
+ name: "dynamicText"
155
+ },
156
+ {
157
+ kind: "pipe",
158
+ type: AsyncPipe,
159
+ name: "async"
160
+ }
161
+ ],
162
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
163
+ });
164
+ };
165
+ i0.ɵɵngDeclareClassMetadata({
166
+ minVersion: "12.0.0",
167
+ version: "22.2.5",
168
+ ngImport: i0,
169
+ type: BsRadioGroupComponent,
170
+ decorators: [{
171
+ type: Component,
172
+ args: [{
173
+ selector: "df-bs-radio-group",
174
+ imports: [
175
+ DynamicTextPipe,
176
+ AsyncPipe,
177
+ NgForgeControl
178
+ ],
179
+ host: {
180
+ role: "radiogroup",
181
+ "[attr.aria-invalid]": "parentField?.ariaInvalid() || null",
182
+ "[attr.aria-required]": "parentField?.ariaRequired()",
183
+ "[attr.aria-describedby]": "parentField?.ariaDescribedBy()"
184
+ },
185
+ template: `
87
186
  @let props = properties();
88
187
  @if (props?.buttonGroup) {
89
188
  <div class="btn-group" role="group" [attr.aria-label]="label() | dynamicText | async">
@@ -130,17 +229,110 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
130
229
  </div>
131
230
  }
132
231
  }
133
- `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}\n"] }]
134
- }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: true }] }], properties: [{ type: i0.Input, args: [{ isSignal: true, alias: "properties", required: false }] }] } });
135
-
136
- class BsRadioFieldComponent {
137
- ngf = injectNgForgeField();
138
- options = input([], /* @ts-ignore */
139
- ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
140
- props = input(/* @ts-ignore */
141
- ...(ngDevMode ? [undefined, { debugName: "props" }] : /* istanbul ignore next */ []));
142
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: BsRadioFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
143
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: BsRadioFieldComponent, isStandalone: true, selector: "df-bs-radio", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, props: { classPropertyName: "props", publicName: "props", isSignal: true, isRequired: false, transformFunction: null } }, hostDirectives: [{ directive: i1.NgForgeFieldHost }], ngImport: i0, template: `
232
+ `,
233
+ changeDetection: ChangeDetectionStrategy.OnPush,
234
+ styles: [":host{display:block}\n"]
235
+ }]
236
+ }],
237
+ propDecorators: {
238
+ value: [{
239
+ type: i0.Input,
240
+ args: [{
241
+ isSignal: true,
242
+ alias: "value",
243
+ required: false
244
+ }]
245
+ }, {
246
+ type: i0.Output,
247
+ args: ["valueChange"]
248
+ }],
249
+ disabled: [{
250
+ type: i0.Input,
251
+ args: [{
252
+ isSignal: true,
253
+ alias: "disabled",
254
+ required: false
255
+ }]
256
+ }],
257
+ readonly: [{
258
+ type: i0.Input,
259
+ args: [{
260
+ isSignal: true,
261
+ alias: "readonly",
262
+ required: false
263
+ }]
264
+ }],
265
+ name: [{
266
+ type: i0.Input,
267
+ args: [{
268
+ isSignal: true,
269
+ alias: "name",
270
+ required: false
271
+ }]
272
+ }],
273
+ label: [{
274
+ type: i0.Input,
275
+ args: [{
276
+ isSignal: true,
277
+ alias: "label",
278
+ required: false
279
+ }]
280
+ }],
281
+ options: [{
282
+ type: i0.Input,
283
+ args: [{
284
+ isSignal: true,
285
+ alias: "options",
286
+ required: true
287
+ }]
288
+ }],
289
+ properties: [{
290
+ type: i0.Input,
291
+ args: [{
292
+ isSignal: true,
293
+ alias: "properties",
294
+ required: false
295
+ }]
296
+ }]
297
+ }
298
+ });
299
+ var BsRadioFieldComponent = class BsRadioFieldComponent {
300
+ ngf = injectNgForgeField();
301
+ options = input([], ...ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []);
302
+ props = input(...ngDevMode ? [void 0, { debugName: "props" }] : /* istanbul ignore next */ []);
303
+ static ɵfac = i0.ɵɵngDeclareFactory({
304
+ minVersion: "12.0.0",
305
+ version: "22.2.5",
306
+ ngImport: i0,
307
+ type: BsRadioFieldComponent,
308
+ deps: [],
309
+ target: i0.ɵɵFactoryTarget.Component
310
+ });
311
+ static ɵcmp = i0.ɵɵngDeclareComponent({
312
+ minVersion: "17.0.0",
313
+ version: "22.2.5",
314
+ type: BsRadioFieldComponent,
315
+ isStandalone: true,
316
+ selector: "df-bs-radio",
317
+ inputs: {
318
+ options: {
319
+ classPropertyName: "options",
320
+ publicName: "options",
321
+ isSignal: true,
322
+ isRequired: false,
323
+ transformFunction: null
324
+ },
325
+ props: {
326
+ classPropertyName: "props",
327
+ publicName: "props",
328
+ isSignal: true,
329
+ isRequired: false,
330
+ transformFunction: null
331
+ }
332
+ },
333
+ hostDirectives: [{ directive: i1.NgForgeFieldHost }],
334
+ ngImport: i0,
335
+ template: `
144
336
  @let f = ngf.field();
145
337
 
146
338
  <div class="mb-3">
@@ -156,11 +348,63 @@ class BsRadioFieldComponent {
156
348
  <div class="form-text" [id]="ngf.hintId()">{{ hint | dynamicText | async }}</div>
157
349
  }
158
350
  </div>
159
- `, isInline: true, styles: [".df-bs-field{display:flex;flex-direction:column;gap:var(--df-field-gap, .5rem);width:100%;margin-bottom:var(--df-bs-field-margin-bottom, 1rem)}.df-bs-label{font-weight:var(--df-label-font-weight, 500);color:var(--df-label-color, inherit);margin-bottom:0}.df-bs-hint{color:var(--df-hint-color, var(--bs-secondary-color, #6c757d));font-size:var(--df-hint-font-size, .875rem);margin-top:var(--df-bs-hint-margin-top, .25rem)}.df-bs-field:has(.df-bs-hint){margin-bottom:var(--df-bs-field-with-hint-margin-bottom, .5rem)}:host([hidden]){display:none!important}\n", ":host{display:block}:host([hidden]){display:none!important}\n"], dependencies: [{ kind: "component", type: BsRadioGroupComponent, selector: "df-bs-radio-group", inputs: ["value", "disabled", "readonly", "name", "label", "options", "properties"], outputs: ["valueChange"] }, { kind: "directive", type: FormField, selector: "[formField]", inputs: ["formField"], exportAs: ["formField"] }, { kind: "pipe", type: DynamicTextPipe, name: "dynamicText" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
160
- }
161
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: BsRadioFieldComponent, decorators: [{
162
- type: Component,
163
- args: [{ selector: 'df-bs-radio', imports: [BsRadioGroupComponent, FormField, DynamicTextPipe, AsyncPipe], hostDirectives: [NgForgeFieldHost], template: `
351
+ `,
352
+ isInline: true,
353
+ styles: [".df-bs-field{display:flex;flex-direction:column;gap:var(--df-field-gap, .5rem);width:100%;margin-bottom:var(--df-bs-field-margin-bottom, 1rem)}.df-bs-label{font-weight:var(--df-label-font-weight, 500);color:var(--df-label-color, inherit);margin-bottom:0}.df-bs-hint{color:var(--df-hint-color, var(--bs-secondary-color, #6c757d));font-size:var(--df-hint-font-size, .875rem);margin-top:var(--df-bs-hint-margin-top, .25rem)}.df-bs-field:has(.df-bs-hint){margin-bottom:var(--df-bs-field-with-hint-margin-bottom, .5rem)}:host([hidden]){display:none!important}\n", ":host{display:block}:host([hidden]){display:none!important}\n"],
354
+ dependencies: [
355
+ {
356
+ kind: "component",
357
+ type: BsRadioGroupComponent,
358
+ selector: "df-bs-radio-group",
359
+ inputs: [
360
+ "value",
361
+ "disabled",
362
+ "readonly",
363
+ "name",
364
+ "label",
365
+ "options",
366
+ "properties"
367
+ ],
368
+ outputs: ["valueChange"]
369
+ },
370
+ {
371
+ kind: "directive",
372
+ type: FormField,
373
+ selector: "[formField]",
374
+ inputs: ["formField"],
375
+ exportAs: ["formField"]
376
+ },
377
+ {
378
+ kind: "pipe",
379
+ type: DynamicTextPipe,
380
+ name: "dynamicText"
381
+ },
382
+ {
383
+ kind: "pipe",
384
+ type: AsyncPipe,
385
+ name: "async"
386
+ }
387
+ ],
388
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
389
+ });
390
+ };
391
+ i0.ɵɵngDeclareClassMetadata({
392
+ minVersion: "12.0.0",
393
+ version: "22.2.5",
394
+ ngImport: i0,
395
+ type: BsRadioFieldComponent,
396
+ decorators: [{
397
+ type: Component,
398
+ args: [{
399
+ selector: "df-bs-radio",
400
+ imports: [
401
+ BsRadioGroupComponent,
402
+ FormField,
403
+ DynamicTextPipe,
404
+ AsyncPipe
405
+ ],
406
+ hostDirectives: [NgForgeFieldHost],
407
+ template: `
164
408
  @let f = ngf.field();
165
409
 
166
410
  <div class="mb-3">
@@ -176,9 +420,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
176
420
  <div class="form-text" [id]="ngf.hintId()">{{ hint | dynamicText | async }}</div>
177
421
  }
178
422
  </div>
179
- `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".df-bs-field{display:flex;flex-direction:column;gap:var(--df-field-gap, .5rem);width:100%;margin-bottom:var(--df-bs-field-margin-bottom, 1rem)}.df-bs-label{font-weight:var(--df-label-font-weight, 500);color:var(--df-label-color, inherit);margin-bottom:0}.df-bs-hint{color:var(--df-hint-color, var(--bs-secondary-color, #6c757d));font-size:var(--df-hint-font-size, .875rem);margin-top:var(--df-bs-hint-margin-top, .25rem)}.df-bs-field:has(.df-bs-hint){margin-bottom:var(--df-bs-field-with-hint-margin-bottom, .5rem)}:host([hidden]){display:none!important}\n", ":host{display:block}:host([hidden]){display:none!important}\n"] }]
180
- }], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], props: [{ type: i0.Input, args: [{ isSignal: true, alias: "props", required: false }] }] } });
181
-
182
-
423
+ `,
424
+ changeDetection: ChangeDetectionStrategy.OnPush,
425
+ styles: [".df-bs-field{display:flex;flex-direction:column;gap:var(--df-field-gap, .5rem);width:100%;margin-bottom:var(--df-bs-field-margin-bottom, 1rem)}.df-bs-label{font-weight:var(--df-label-font-weight, 500);color:var(--df-label-color, inherit);margin-bottom:0}.df-bs-hint{color:var(--df-hint-color, var(--bs-secondary-color, #6c757d));font-size:var(--df-hint-font-size, .875rem);margin-top:var(--df-bs-hint-margin-top, .25rem)}.df-bs-field:has(.df-bs-hint){margin-bottom:var(--df-bs-field-with-hint-margin-bottom, .5rem)}:host([hidden]){display:none!important}\n", ":host{display:block}:host([hidden]){display:none!important}\n"]
426
+ }]
427
+ }],
428
+ propDecorators: {
429
+ options: [{
430
+ type: i0.Input,
431
+ args: [{
432
+ isSignal: true,
433
+ alias: "options",
434
+ required: false
435
+ }]
436
+ }],
437
+ props: [{
438
+ type: i0.Input,
439
+ args: [{
440
+ isSignal: true,
441
+ alias: "props",
442
+ required: false
443
+ }]
444
+ }]
445
+ }
446
+ });
183
447
  export { BsRadioFieldComponent };
184
- //# sourceMappingURL=ng-forge-dynamic-forms-bootstrap-lazy-radio.mjs.map
448
+
449
+ //# sourceMappingURL=ng-forge-dynamic-forms-bootstrap-lazy-radio.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"ng-forge-dynamic-forms-bootstrap-lazy-radio.mjs","mappings":";;;;;;;;;;;;;;;;;IAuGW;;;;AAEA;;IAGC;AACR;AACE;;;;AAnBO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAVV;;;;;AApDC;AACA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACYU;;;;AAIH;;;AAJU;;;;;;;;;;;;;;;;AAdlB;;;;AApBS","names":[],"ignoreList":[],"sources":["../../../../packages/dynamic-forms-bootstrap/src/lib/fields/radio/bs-radio-group.component.ts","../../../../packages/dynamic-forms-bootstrap/src/lib/fields/radio/bs-radio.component.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, inject, input, model } from '@angular/core';\nimport type { FormValueControl } from '@angular/forms/signals';\nimport { DynamicText, FieldOption, ValueType } from '@ng-forge/dynamic-forms';\nimport { DynamicTextPipe } from '@ng-forge/dynamic-forms/integration';\nimport { NgForgeControl, NgForgeField } from '@ng-forge/dynamic-forms/integration';\nimport { AsyncPipe } from '@angular/common';\n\nexport interface BsRadioGroupProps {\n /** Display radio buttons inline (horizontal) */\n inline?: boolean;\n /** Reverse the position of the radio button and label */\n reverse?: boolean;\n /** Display as button group instead of radio buttons */\n buttonGroup?: boolean;\n /** Button size when using button group */\n buttonSize?: 'sm' | 'lg';\n /** Hint text to display below the radio group */\n hint?: DynamicText;\n}\n\n/**\n * Bootstrap radio group implementing FormValueControl. Rendered inside\n * `df-bs-radio` — each `<input type=\"radio\">` carries `ngForgeControl`, so\n * the marker absorbs meta + aria from the ambient parent NgForgeField.\n */\n@Component({\n selector: 'df-bs-radio-group',\n imports: [DynamicTextPipe, AsyncPipe, NgForgeControl],\n host: {\n role: 'radiogroup',\n '[attr.aria-invalid]': 'parentField?.ariaInvalid() || null',\n '[attr.aria-required]': 'parentField?.ariaRequired()',\n '[attr.aria-describedby]': 'parentField?.ariaDescribedBy()',\n },\n template: `\n @let props = properties();\n @if (props?.buttonGroup) {\n <div class=\"btn-group\" role=\"group\" [attr.aria-label]=\"label() | dynamicText | async\">\n @for (option of options(); track option.value; let i = $index) {\n <input\n ngForgeControl\n type=\"radio\"\n [name]=\"name()\"\n [value]=\"option.value\"\n [checked]=\"value() === option.value\"\n (change)=\"onRadioChange(option.value)\"\n [disabled]=\"disabled() || option.disabled || false\"\n class=\"btn-check\"\n [id]=\"name() + '_' + i\"\n autocomplete=\"off\"\n />\n <label\n class=\"btn btn-outline-primary\"\n [class.btn-sm]=\"props?.buttonSize === 'sm'\"\n [class.btn-lg]=\"props?.buttonSize === 'lg'\"\n [for]=\"name() + '_' + i\"\n >\n {{ option.label | dynamicText | async }}\n </label>\n }\n </div>\n } @else {\n @for (option of options(); track option.value; let i = $index) {\n <div class=\"form-check\" [class.form-check-inline]=\"props?.inline\" [class.form-check-reverse]=\"props?.reverse\">\n <input\n ngForgeControl\n type=\"radio\"\n [name]=\"name()\"\n [value]=\"option.value\"\n [checked]=\"value() === option.value\"\n (change)=\"onRadioChange(option.value)\"\n [disabled]=\"disabled() || option.disabled || false\"\n class=\"form-check-input\"\n [id]=\"name() + '_' + i\"\n />\n <label class=\"form-check-label\" [for]=\"name() + '_' + i\">\n {{ option.label | dynamicText | async }}\n </label>\n </div>\n }\n }\n `,\n styles: [\n `\n :host {\n display: block;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class BsRadioGroupComponent implements FormValueControl<ValueType | undefined> {\n protected readonly parentField = inject(NgForgeField, { optional: true });\n\n // Value model - FormField directive binds form value to this\n readonly value = model<ValueType | undefined>(undefined);\n\n // Optional FormValueControl properties - Field directive will bind these\n readonly disabled = input<boolean>(false);\n readonly readonly = input<boolean>(false);\n readonly name = input<string>('');\n\n // Component-specific inputs\n readonly label = input<DynamicText>();\n readonly options = input.required<FieldOption<ValueType>[]>();\n readonly properties = input<BsRadioGroupProps>();\n\n /** Handle radio button change event */\n protected onRadioChange(newValue: ValueType): void {\n if (!this.disabled() && !this.readonly()) {\n this.value.set(newValue);\n }\n }\n}\n","import { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport { FormField } from '@angular/forms/signals';\nimport { FieldOption, ValueType } from '@ng-forge/dynamic-forms';\nimport { DynamicTextPipe } from '@ng-forge/dynamic-forms/integration';\nimport { injectNgForgeField, NgForgeFieldHost } from '@ng-forge/dynamic-forms/integration';\nimport { BsRadioProps } from './bs-radio.type';\nimport { AsyncPipe } from '@angular/common';\nimport { BsRadioGroupComponent } from './bs-radio-group.component';\n\n@Component({\n selector: 'df-bs-radio',\n imports: [BsRadioGroupComponent, FormField, DynamicTextPipe, AsyncPipe],\n styleUrl: '../../styles/_form-field.scss',\n hostDirectives: [NgForgeFieldHost],\n template: `\n @let f = ngf.field();\n\n <div class=\"mb-3\">\n @if (ngf.label(); as label) {\n <div class=\"form-label\">{{ label | dynamicText | async }}</div>\n }\n\n <df-bs-radio-group [formField]=\"f\" [label]=\"ngf.label()\" [options]=\"options()\" [properties]=\"props()\" />\n\n @if (ngf.errorsToDisplay()[0]; as error) {\n <div class=\"invalid-feedback d-block\" [id]=\"ngf.errorId()\" role=\"alert\">{{ error.message }}</div>\n } @else if (props()?.hint; as hint) {\n <div class=\"form-text\" [id]=\"ngf.hintId()\">{{ hint | dynamicText | async }}</div>\n }\n </div>\n `,\n styles: [\n `\n :host {\n display: block;\n }\n\n :host([hidden]) {\n display: none !important;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport default class BsRadioFieldComponent {\n protected readonly ngf = injectNgForgeField<ValueType>();\n\n readonly options = input<FieldOption<ValueType>[]>([]);\n readonly props = input<BsRadioProps>();\n}\n"]}
1
+ {"version":3,"file":"ng-forge-dynamic-forms-bootstrap-lazy-radio.mjs","names":[],"sources":["../../../../packages/dynamic-forms-bootstrap/src/lib/fields/radio/bs-radio-group.component.ts","../../../../packages/dynamic-forms-bootstrap/src/lib/fields/radio/bs-radio.component.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, inject, input, model } from '@angular/core';\nimport type { FormValueControl } from '@angular/forms/signals';\nimport { DynamicText, FieldOption, ValueType } from '@ng-forge/dynamic-forms';\nimport { DynamicTextPipe } from '@ng-forge/dynamic-forms/integration';\nimport { NgForgeControl, NgForgeField } from '@ng-forge/dynamic-forms/integration';\nimport { AsyncPipe } from '@angular/common';\n\nexport interface BsRadioGroupProps {\n /** Display radio buttons inline (horizontal) */\n inline?: boolean;\n /** Reverse the position of the radio button and label */\n reverse?: boolean;\n /** Display as button group instead of radio buttons */\n buttonGroup?: boolean;\n /** Button size when using button group */\n buttonSize?: 'sm' | 'lg';\n /** Hint text to display below the radio group */\n hint?: DynamicText;\n}\n\n/**\n * Bootstrap radio group implementing FormValueControl. Rendered inside\n * `df-bs-radio` — each `<input type=\"radio\">` carries `ngForgeControl`, so\n * the marker absorbs meta + aria from the ambient parent NgForgeField.\n */\n@Component({\n selector: 'df-bs-radio-group',\n imports: [DynamicTextPipe, AsyncPipe, NgForgeControl],\n host: {\n role: 'radiogroup',\n '[attr.aria-invalid]': 'parentField?.ariaInvalid() || null',\n '[attr.aria-required]': 'parentField?.ariaRequired()',\n '[attr.aria-describedby]': 'parentField?.ariaDescribedBy()',\n },\n template: `\n @let props = properties();\n @if (props?.buttonGroup) {\n <div class=\"btn-group\" role=\"group\" [attr.aria-label]=\"label() | dynamicText | async\">\n @for (option of options(); track option.value; let i = $index) {\n <input\n ngForgeControl\n type=\"radio\"\n [name]=\"name()\"\n [value]=\"option.value\"\n [checked]=\"value() === option.value\"\n (change)=\"onRadioChange(option.value)\"\n [disabled]=\"disabled() || option.disabled || false\"\n class=\"btn-check\"\n [id]=\"name() + '_' + i\"\n autocomplete=\"off\"\n />\n <label\n class=\"btn btn-outline-primary\"\n [class.btn-sm]=\"props?.buttonSize === 'sm'\"\n [class.btn-lg]=\"props?.buttonSize === 'lg'\"\n [for]=\"name() + '_' + i\"\n >\n {{ option.label | dynamicText | async }}\n </label>\n }\n </div>\n } @else {\n @for (option of options(); track option.value; let i = $index) {\n <div class=\"form-check\" [class.form-check-inline]=\"props?.inline\" [class.form-check-reverse]=\"props?.reverse\">\n <input\n ngForgeControl\n type=\"radio\"\n [name]=\"name()\"\n [value]=\"option.value\"\n [checked]=\"value() === option.value\"\n (change)=\"onRadioChange(option.value)\"\n [disabled]=\"disabled() || option.disabled || false\"\n class=\"form-check-input\"\n [id]=\"name() + '_' + i\"\n />\n <label class=\"form-check-label\" [for]=\"name() + '_' + i\">\n {{ option.label | dynamicText | async }}\n </label>\n </div>\n }\n }\n `,\n styles: [\n `\n :host {\n display: block;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class BsRadioGroupComponent implements FormValueControl<ValueType | undefined> {\n protected readonly parentField = inject(NgForgeField, { optional: true });\n\n // Value model - FormField directive binds form value to this\n readonly value = model<ValueType | undefined>(undefined);\n\n // Optional FormValueControl properties - Field directive will bind these\n readonly disabled = input<boolean>(false);\n readonly readonly = input<boolean>(false);\n readonly name = input<string>('');\n\n // Component-specific inputs\n readonly label = input<DynamicText>();\n readonly options = input.required<FieldOption<ValueType>[]>();\n readonly properties = input<BsRadioGroupProps>();\n\n /** Handle radio button change event */\n protected onRadioChange(newValue: ValueType): void {\n if (!this.disabled() && !this.readonly()) {\n this.value.set(newValue);\n }\n }\n}\n","import { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport { FormField } from '@angular/forms/signals';\nimport { FieldOption, ValueType } from '@ng-forge/dynamic-forms';\nimport { DynamicTextPipe } from '@ng-forge/dynamic-forms/integration';\nimport { injectNgForgeField, NgForgeFieldHost } from '@ng-forge/dynamic-forms/integration';\nimport { BsRadioProps } from './bs-radio.type';\nimport { AsyncPipe } from '@angular/common';\nimport { BsRadioGroupComponent } from './bs-radio-group.component';\n\n@Component({\n selector: 'df-bs-radio',\n imports: [BsRadioGroupComponent, FormField, DynamicTextPipe, AsyncPipe],\n styleUrl: '../../styles/_form-field.scss',\n hostDirectives: [NgForgeFieldHost],\n template: `\n @let f = ngf.field();\n\n <div class=\"mb-3\">\n @if (ngf.label(); as label) {\n <div class=\"form-label\">{{ label | dynamicText | async }}</div>\n }\n\n <df-bs-radio-group [formField]=\"f\" [label]=\"ngf.label()\" [options]=\"options()\" [properties]=\"props()\" />\n\n @if (ngf.errorsToDisplay()[0]; as error) {\n <div class=\"invalid-feedback d-block\" [id]=\"ngf.errorId()\" role=\"alert\">{{ error.message }}</div>\n } @else if (props()?.hint; as hint) {\n <div class=\"form-text\" [id]=\"ngf.hintId()\">{{ hint | dynamicText | async }}</div>\n }\n </div>\n `,\n styles: [\n `\n :host {\n display: block;\n }\n\n :host([hidden]) {\n display: none !important;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport default class BsRadioFieldComponent {\n protected readonly ngf = injectNgForgeField<ValueType>();\n\n readonly options = input<FieldOption<ValueType>[]>([]);\n readonly props = input<BsRadioProps>();\n}\n"],"mappings":"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"}