@3kles/kles-material-dynamicforms 19.4.10 → 19.4.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/3kles-kles-material-dynamicforms.mjs +99 -30
- package/fesm2022/3kles-kles-material-dynamicforms.mjs.map +1 -1
- package/lib/ui/ui-state/array-ui-state.d.ts +3 -3
- package/lib/ui/ui-state/control-ui-state.d.ts +2 -0
- package/lib/ui/ui-state/group-ui-state.d.ts +3 -5
- package/lib/ui/ui-state/ui-state.abstract.d.ts +6 -1
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { signal, InjectionToken, inject, Component, Injector, Input, Directive, Injectable,
|
|
2
|
+
import { signal, InjectionToken, inject, Component, Injector, Input, Directive, Injectable, EventEmitter, Output, NgModule, computed, ViewContainerRef, HostBinding, Pipe, ChangeDetectorRef, ViewChildren, ViewChild, forwardRef, CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import * as i2 from '@angular/forms';
|
|
@@ -134,6 +134,8 @@ class KlesFormControl extends KlesAbstractFormControl {
|
|
|
134
134
|
class AbstractUiState {
|
|
135
135
|
constructor() {
|
|
136
136
|
this._value = signal(undefined);
|
|
137
|
+
this._parent = null;
|
|
138
|
+
this._parentKey = null;
|
|
137
139
|
}
|
|
138
140
|
get(path) {
|
|
139
141
|
let currPath = path;
|
|
@@ -151,6 +153,18 @@ class AbstractUiState {
|
|
|
151
153
|
get value() {
|
|
152
154
|
return this._value.asReadonly();
|
|
153
155
|
}
|
|
156
|
+
setParent(parent, key) {
|
|
157
|
+
this._parent = parent;
|
|
158
|
+
this._parentKey = key;
|
|
159
|
+
}
|
|
160
|
+
notifyParent() {
|
|
161
|
+
if (this._parent && this._parentKey != null) {
|
|
162
|
+
this._parent.childValueChanged(this._parentKey, this._value());
|
|
163
|
+
}
|
|
164
|
+
}
|
|
165
|
+
childValueChanged(key, value) {
|
|
166
|
+
// par défaut, rien
|
|
167
|
+
}
|
|
154
168
|
}
|
|
155
169
|
|
|
156
170
|
class ControlUiState extends AbstractUiState {
|
|
@@ -160,8 +174,12 @@ class ControlUiState extends AbstractUiState {
|
|
|
160
174
|
this._value.set(value);
|
|
161
175
|
}
|
|
162
176
|
}
|
|
177
|
+
get value() {
|
|
178
|
+
return this._value.asReadonly();
|
|
179
|
+
}
|
|
163
180
|
setValue(value) {
|
|
164
181
|
this._value.set(value);
|
|
182
|
+
this.notifyParent();
|
|
165
183
|
}
|
|
166
184
|
patchValue(value) {
|
|
167
185
|
if (value == null) {
|
|
@@ -173,6 +191,7 @@ class ControlUiState extends AbstractUiState {
|
|
|
173
191
|
return;
|
|
174
192
|
}
|
|
175
193
|
this._value.set({ ...curr, ...value });
|
|
194
|
+
this.notifyParent();
|
|
176
195
|
}
|
|
177
196
|
}
|
|
178
197
|
|
|
@@ -531,31 +550,48 @@ class GroupUiState extends AbstractUiState {
|
|
|
531
550
|
constructor(states) {
|
|
532
551
|
super();
|
|
533
552
|
this.states = {};
|
|
534
|
-
this._computedValue = computed(() => {
|
|
535
|
-
return this._snapshot();
|
|
536
|
-
});
|
|
537
553
|
this.states = (states ?? {});
|
|
538
|
-
|
|
554
|
+
for (const key of Object.keys(this.states)) {
|
|
555
|
+
const state = this.states[key];
|
|
556
|
+
state?.setParent(this, key);
|
|
557
|
+
}
|
|
558
|
+
this._value.set(this.buildInitialValue());
|
|
539
559
|
}
|
|
540
560
|
setValue(value) {
|
|
541
561
|
if (value == null)
|
|
542
562
|
return;
|
|
543
|
-
Object.keys(value)
|
|
544
|
-
this.states[name]
|
|
545
|
-
|
|
563
|
+
for (const name of Object.keys(value)) {
|
|
564
|
+
const state = this.states[name];
|
|
565
|
+
if (state) {
|
|
566
|
+
state.setValue(value[name]);
|
|
567
|
+
}
|
|
568
|
+
}
|
|
546
569
|
this._value.set(value);
|
|
570
|
+
this.notifyParent();
|
|
547
571
|
}
|
|
548
572
|
patchValue(value) {
|
|
549
573
|
if (value == null)
|
|
550
574
|
return;
|
|
551
|
-
Object.keys(value)
|
|
575
|
+
for (const name of Object.keys(value)) {
|
|
552
576
|
const state = this.states[name];
|
|
553
577
|
if (state) {
|
|
554
578
|
state.patchValue(value[name]);
|
|
555
579
|
}
|
|
580
|
+
}
|
|
581
|
+
const curr = this._value() ?? {};
|
|
582
|
+
this._value.set({
|
|
583
|
+
...curr,
|
|
584
|
+
...value,
|
|
556
585
|
});
|
|
586
|
+
this.notifyParent();
|
|
587
|
+
}
|
|
588
|
+
childValueChanged(key, value) {
|
|
557
589
|
const curr = this._value() ?? {};
|
|
558
|
-
this._value.set({
|
|
590
|
+
this._value.set({
|
|
591
|
+
...curr,
|
|
592
|
+
[key]: value,
|
|
593
|
+
});
|
|
594
|
+
this.notifyParent();
|
|
559
595
|
}
|
|
560
596
|
_find(name) {
|
|
561
597
|
const key = String(name);
|
|
@@ -564,13 +600,15 @@ class GroupUiState extends AbstractUiState {
|
|
|
564
600
|
}
|
|
565
601
|
addUiState(name, uiState) {
|
|
566
602
|
this.states[name] = uiState;
|
|
603
|
+
uiState.setParent(this, name);
|
|
567
604
|
const curr = this._value() ?? {};
|
|
568
|
-
this._value.set({
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
605
|
+
this._value.set({
|
|
606
|
+
...curr,
|
|
607
|
+
[name]: uiState.value(),
|
|
608
|
+
});
|
|
609
|
+
this.notifyParent();
|
|
572
610
|
}
|
|
573
|
-
|
|
611
|
+
buildInitialValue() {
|
|
574
612
|
const out = {};
|
|
575
613
|
for (const key of Object.keys(this.states)) {
|
|
576
614
|
out[key] = this.states[key]?.value();
|
|
@@ -4325,14 +4363,11 @@ class ArrayUiState extends AbstractUiState {
|
|
|
4325
4363
|
constructor(states) {
|
|
4326
4364
|
super();
|
|
4327
4365
|
this.states = [];
|
|
4328
|
-
this._computedValue = computed(() => {
|
|
4329
|
-
return this.states.map((s) => s.value());
|
|
4330
|
-
});
|
|
4331
4366
|
this.states = states ?? [];
|
|
4332
|
-
this.
|
|
4333
|
-
|
|
4334
|
-
|
|
4335
|
-
|
|
4367
|
+
this.states.forEach((state, index) => {
|
|
4368
|
+
state.setParent(this, index);
|
|
4369
|
+
});
|
|
4370
|
+
this._value.set(this.states.map((state) => state.value()));
|
|
4336
4371
|
}
|
|
4337
4372
|
setValue(value) {
|
|
4338
4373
|
if (!Array.isArray(value)) {
|
|
@@ -4342,6 +4377,7 @@ class ArrayUiState extends AbstractUiState {
|
|
|
4342
4377
|
this.at(index)?.setValue(newValue);
|
|
4343
4378
|
});
|
|
4344
4379
|
this._value.set(value);
|
|
4380
|
+
this.notifyParent();
|
|
4345
4381
|
}
|
|
4346
4382
|
patchValue(value) {
|
|
4347
4383
|
if (value == null) {
|
|
@@ -4355,8 +4391,24 @@ class ArrayUiState extends AbstractUiState {
|
|
|
4355
4391
|
});
|
|
4356
4392
|
const curr = this._value() ?? [];
|
|
4357
4393
|
const next = [...curr];
|
|
4358
|
-
value.forEach((
|
|
4394
|
+
value.forEach((newValue, index) => {
|
|
4395
|
+
next[index] = {
|
|
4396
|
+
...(next[index] ?? {}),
|
|
4397
|
+
...newValue,
|
|
4398
|
+
};
|
|
4399
|
+
});
|
|
4359
4400
|
this._value.set(next);
|
|
4401
|
+
this.notifyParent();
|
|
4402
|
+
}
|
|
4403
|
+
childValueChanged(key, value) {
|
|
4404
|
+
const index = typeof key === 'number' ? key : Number(key);
|
|
4405
|
+
if (!Number.isInteger(index) || index < 0)
|
|
4406
|
+
return;
|
|
4407
|
+
const curr = this._value() ?? [];
|
|
4408
|
+
const next = [...curr];
|
|
4409
|
+
next[index] = value;
|
|
4410
|
+
this._value.set(next);
|
|
4411
|
+
this.notifyParent();
|
|
4360
4412
|
}
|
|
4361
4413
|
at(index) {
|
|
4362
4414
|
return this.states?.[index] ?? null;
|
|
@@ -4366,15 +4418,32 @@ class ArrayUiState extends AbstractUiState {
|
|
|
4366
4418
|
return Number.isFinite(idx) ? this.at(idx) : null;
|
|
4367
4419
|
}
|
|
4368
4420
|
push(control) {
|
|
4369
|
-
|
|
4370
|
-
|
|
4371
|
-
|
|
4372
|
-
|
|
4373
|
-
|
|
4374
|
-
else {
|
|
4375
|
-
this.states.push(control);
|
|
4421
|
+
const items = Array.isArray(control) ? control : [control];
|
|
4422
|
+
for (const item of items) {
|
|
4423
|
+
const index = this.states.length;
|
|
4424
|
+
this.states.push(item);
|
|
4425
|
+
item.setParent(this, index);
|
|
4376
4426
|
}
|
|
4377
4427
|
this._value.set(this.states.map((s) => s.value()));
|
|
4428
|
+
this.notifyParent();
|
|
4429
|
+
}
|
|
4430
|
+
removeAt(index) {
|
|
4431
|
+
if (index < 0 || index >= this.states.length)
|
|
4432
|
+
return;
|
|
4433
|
+
this.states.splice(index, 1);
|
|
4434
|
+
this.states.forEach((state, i) => {
|
|
4435
|
+
state.setParent(this, i);
|
|
4436
|
+
});
|
|
4437
|
+
const curr = this._value() ?? [];
|
|
4438
|
+
const next = [...curr];
|
|
4439
|
+
next.splice(index, 1);
|
|
4440
|
+
this._value.set(next);
|
|
4441
|
+
this.notifyParent();
|
|
4442
|
+
}
|
|
4443
|
+
clear() {
|
|
4444
|
+
this.states.length = 0;
|
|
4445
|
+
this._value.set([]);
|
|
4446
|
+
this.notifyParent();
|
|
4378
4447
|
}
|
|
4379
4448
|
}
|
|
4380
4449
|
|