@daltonr/pathwrite-angular 0.4.0 → 0.5.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.
- package/README.md +78 -3
- package/dist/index.d.ts +19 -3
- package/dist/index.js +41 -12
- package/dist/index.js.map +1 -1
- package/dist/shell.d.ts +2 -2
- package/dist/shell.js +6 -6
- package/dist/shell.js.map +1 -1
- package/package.json +2 -2
- package/src/index.ts +45 -13
- package/src/shell.ts +3 -3
package/README.md
CHANGED
|
@@ -15,6 +15,7 @@ For convenience, this package re-exports core types so you don't need to import
|
|
|
15
15
|
```typescript
|
|
16
16
|
import {
|
|
17
17
|
PathFacade, // Angular-specific
|
|
18
|
+
PathEngine, // Re-exported from core (value + type)
|
|
18
19
|
PathData, // Re-exported from core
|
|
19
20
|
PathDefinition, // Re-exported from core
|
|
20
21
|
PathEvent, // Re-exported from core
|
|
@@ -65,6 +66,7 @@ export class MyComponent {
|
|
|
65
66
|
|
|
66
67
|
| Method | Description |
|
|
67
68
|
|--------|-------------|
|
|
69
|
+
| `adoptEngine(engine)` | Adopt an externally-managed `PathEngine` (e.g. from `restoreOrStart()`). The facade immediately reflects the engine's current state and forwards all subsequent events. The caller is responsible for the engine's lifecycle. |
|
|
68
70
|
| `start(definition, data?)` | Start or re-start a path. |
|
|
69
71
|
| `restart(definition, data?)` | Tear down any active path (without firing hooks) and start the given path fresh. Safe to call at any time. Use for "Start over" / retry flows. |
|
|
70
72
|
| `startSubPath(definition, data?, meta?)` | Push a sub-path. Requires an active path. `meta` is returned unchanged to `onSubPathComplete` / `onSubPathCancel`. |
|
|
@@ -299,9 +301,9 @@ export class MyComponent {
|
|
|
299
301
|
| `path` | `PathDefinition` | *required* | The path definition to drive. |
|
|
300
302
|
| `initialData` | `PathData` | `{}` | Initial data passed to `facade.start()`. |
|
|
301
303
|
| `autoStart` | `boolean` | `true` | Start the path automatically on `ngOnInit`. |
|
|
302
|
-
| `backLabel` | `string` | `"
|
|
304
|
+
| `backLabel` | `string` | `"Previous"` | Previous button label. |
|
|
303
305
|
| `nextLabel` | `string` | `"Next"` | Next button label. |
|
|
304
|
-
| `
|
|
306
|
+
| `completeLabel` | `string` | `"Complete"` | Complete button label (last step). |
|
|
305
307
|
| `cancelLabel` | `string` | `"Cancel"` | Cancel button label. |
|
|
306
308
|
| `hideCancel` | `boolean` | `false` | Hide the Cancel button. |
|
|
307
309
|
| `hideProgress` | `boolean` | `false` | Hide the progress indicator. |
|
|
@@ -346,7 +348,7 @@ export class MyComponent { ... }
|
|
|
346
348
|
<ng-template pwShellFooter let-s let-actions="actions">
|
|
347
349
|
<button (click)="actions.previous()" [disabled]="s.isFirstStep || s.isNavigating">Back</button>
|
|
348
350
|
<button (click)="actions.next()" [disabled]="!s.canMoveNext || s.isNavigating">
|
|
349
|
-
{{ s.isLastStep ? '
|
|
351
|
+
{{ s.isLastStep ? 'Complete' : 'Next' }}
|
|
350
352
|
</button>
|
|
351
353
|
</ng-template>
|
|
352
354
|
<ng-template pwStep="details"><app-details-form /></ng-template>
|
|
@@ -634,6 +636,79 @@ Use it to distinguish initialization from re-entry:
|
|
|
634
636
|
|
|
635
637
|
---
|
|
636
638
|
|
|
639
|
+
## Persistence
|
|
640
|
+
|
|
641
|
+
Use with [@daltonr/pathwrite-store-http](../store-http) for automatic state persistence. The engine is created externally via `restoreOrStart()`, then handed to the facade via `adoptEngine()`.
|
|
642
|
+
|
|
643
|
+
### Simple persistence example
|
|
644
|
+
|
|
645
|
+
```typescript
|
|
646
|
+
import { Component, inject, OnInit } from '@angular/core';
|
|
647
|
+
import { PathFacade, PathShellComponent, PathStepDirective } from '@daltonr/pathwrite-angular';
|
|
648
|
+
import { HttpStore, restoreOrStart, httpPersistence } from '@daltonr/pathwrite-store-http';
|
|
649
|
+
import { signupPath } from './signup-path';
|
|
650
|
+
|
|
651
|
+
@Component({
|
|
652
|
+
selector: 'app-signup-wizard',
|
|
653
|
+
standalone: true,
|
|
654
|
+
imports: [PathShellComponent, PathStepDirective],
|
|
655
|
+
providers: [PathFacade],
|
|
656
|
+
template: `
|
|
657
|
+
@if (ready) {
|
|
658
|
+
<pw-shell [path]="path" [autoStart]="false" (completed)="onComplete($event)">
|
|
659
|
+
<ng-template pwStep="details"><app-details-form /></ng-template>
|
|
660
|
+
<ng-template pwStep="review"><app-review-panel /></ng-template>
|
|
661
|
+
</pw-shell>
|
|
662
|
+
} @else {
|
|
663
|
+
<p>Loading…</p>
|
|
664
|
+
}
|
|
665
|
+
`
|
|
666
|
+
})
|
|
667
|
+
export class SignupWizardComponent implements OnInit {
|
|
668
|
+
private readonly facade = inject(PathFacade);
|
|
669
|
+
|
|
670
|
+
path = signupPath;
|
|
671
|
+
ready = false;
|
|
672
|
+
|
|
673
|
+
async ngOnInit() {
|
|
674
|
+
const store = new HttpStore({ baseUrl: '/api/wizard' });
|
|
675
|
+
const key = 'user:signup';
|
|
676
|
+
|
|
677
|
+
const { engine, restored } = await restoreOrStart({
|
|
678
|
+
store,
|
|
679
|
+
key,
|
|
680
|
+
path: this.path,
|
|
681
|
+
initialData: { name: '', email: '' },
|
|
682
|
+
observers: [
|
|
683
|
+
httpPersistence({ store, key, strategy: 'onNext' })
|
|
684
|
+
]
|
|
685
|
+
});
|
|
686
|
+
|
|
687
|
+
// Hand the running engine to the facade — it immediately
|
|
688
|
+
// reflects the engine's current state and forwards all events.
|
|
689
|
+
this.facade.adoptEngine(engine);
|
|
690
|
+
this.ready = true;
|
|
691
|
+
|
|
692
|
+
if (restored) {
|
|
693
|
+
console.log('Progress restored — resuming from', engine.snapshot()?.stepId);
|
|
694
|
+
}
|
|
695
|
+
}
|
|
696
|
+
|
|
697
|
+
onComplete(data: any) {
|
|
698
|
+
console.log('Wizard completed:', data);
|
|
699
|
+
}
|
|
700
|
+
}
|
|
701
|
+
```
|
|
702
|
+
|
|
703
|
+
### Key points
|
|
704
|
+
|
|
705
|
+
- **`adoptEngine()`** connects the facade to an externally-created engine. No `@ViewChild` or shell reference needed — inject `PathFacade` directly.
|
|
706
|
+
- **`[autoStart]="false"`** prevents the shell from calling `start()` on its own — the engine is already running.
|
|
707
|
+
- **The facade is the same one the shell uses** (provided in the component's `providers`), so the shell's template bindings, progress indicator, and navigation buttons all work automatically.
|
|
708
|
+
- **`restoreOrStart()`** handles the load-or-create logic: if saved state exists on the server, it restores the engine mid-flow; otherwise it starts fresh.
|
|
709
|
+
|
|
710
|
+
---
|
|
711
|
+
|
|
637
712
|
## Styling
|
|
638
713
|
|
|
639
714
|
Import the optional stylesheet for sensible default styles. All visual values are CSS custom properties (`--pw-*`) so you can theme without overriding selectors.
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { OnDestroy, DestroyRef, Signal } from "@angular/core";
|
|
2
2
|
import { Observable } from "rxjs";
|
|
3
|
-
import { PathData, PathDefinition, PathEvent, PathSnapshot } from "@daltonr/pathwrite-core";
|
|
3
|
+
import { PathData, PathDefinition, PathEngine, PathEvent, PathSnapshot } from "@daltonr/pathwrite-core";
|
|
4
4
|
import * as i0 from "@angular/core";
|
|
5
5
|
/**
|
|
6
6
|
* Angular facade over PathEngine. Provide at component level for an isolated
|
|
@@ -17,16 +17,31 @@ import * as i0 from "@angular/core";
|
|
|
17
17
|
* ```
|
|
18
18
|
*/
|
|
19
19
|
export declare class PathFacade<TData extends PathData = PathData> implements OnDestroy {
|
|
20
|
-
private
|
|
20
|
+
private _engine;
|
|
21
21
|
private readonly _state$;
|
|
22
22
|
private readonly _events$;
|
|
23
|
-
private
|
|
23
|
+
private _unsubscribeFromEngine;
|
|
24
24
|
private readonly _stateSignal;
|
|
25
25
|
readonly state$: Observable<PathSnapshot<TData> | null>;
|
|
26
26
|
readonly events$: Observable<PathEvent>;
|
|
27
27
|
/** Signal version of state$. Updates on every path state change. Requires Angular 16+. */
|
|
28
28
|
readonly stateSignal: Signal<PathSnapshot<TData> | null>;
|
|
29
29
|
constructor();
|
|
30
|
+
/**
|
|
31
|
+
* Adopt an externally-managed `PathEngine` — for example, the engine returned
|
|
32
|
+
* by `restoreOrStart()` from `@daltonr/pathwrite-store-http`.
|
|
33
|
+
*
|
|
34
|
+
* The facade immediately reflects the engine's current state and forwards all
|
|
35
|
+
* subsequent events. The **caller** is responsible for the engine's lifecycle
|
|
36
|
+
* (starting, cleanup); the facade only subscribes to it.
|
|
37
|
+
*
|
|
38
|
+
* ```typescript
|
|
39
|
+
* const { engine } = await restoreOrStart({ store, key, path, initialData, observers: [...] });
|
|
40
|
+
* facade.adoptEngine(engine);
|
|
41
|
+
* ```
|
|
42
|
+
*/
|
|
43
|
+
adoptEngine(engine: PathEngine): void;
|
|
44
|
+
private connectEngine;
|
|
30
45
|
ngOnDestroy(): void;
|
|
31
46
|
start(path: PathDefinition<any>, initialData?: PathData): Promise<void>;
|
|
32
47
|
/**
|
|
@@ -92,3 +107,4 @@ export interface FormGroupLike {
|
|
|
92
107
|
*/
|
|
93
108
|
export declare function syncFormGroup<TData extends PathData = PathData>(facade: PathFacade<TData>, formGroup: FormGroupLike, destroyRef?: DestroyRef): () => void;
|
|
94
109
|
export type { PathData, PathDefinition, PathEvent, PathSnapshot, PathStep, PathStepContext, SerializedPathState } from "@daltonr/pathwrite-core";
|
|
110
|
+
export { PathEngine } from "@daltonr/pathwrite-core";
|
package/dist/index.js
CHANGED
|
@@ -18,15 +18,43 @@ import * as i0 from "@angular/core";
|
|
|
18
18
|
*/
|
|
19
19
|
export class PathFacade {
|
|
20
20
|
constructor() {
|
|
21
|
-
this.
|
|
21
|
+
this._engine = new PathEngine();
|
|
22
22
|
this._state$ = new BehaviorSubject(null);
|
|
23
23
|
this._events$ = new Subject();
|
|
24
|
+
this._unsubscribeFromEngine = () => { };
|
|
24
25
|
this._stateSignal = signal(null);
|
|
25
26
|
this.state$ = this._state$.asObservable();
|
|
26
27
|
this.events$ = this._events$.asObservable();
|
|
27
28
|
/** Signal version of state$. Updates on every path state change. Requires Angular 16+. */
|
|
28
29
|
this.stateSignal = this._stateSignal.asReadonly();
|
|
29
|
-
this.
|
|
30
|
+
this.connectEngine(this._engine);
|
|
31
|
+
}
|
|
32
|
+
/**
|
|
33
|
+
* Adopt an externally-managed `PathEngine` — for example, the engine returned
|
|
34
|
+
* by `restoreOrStart()` from `@daltonr/pathwrite-store-http`.
|
|
35
|
+
*
|
|
36
|
+
* The facade immediately reflects the engine's current state and forwards all
|
|
37
|
+
* subsequent events. The **caller** is responsible for the engine's lifecycle
|
|
38
|
+
* (starting, cleanup); the facade only subscribes to it.
|
|
39
|
+
*
|
|
40
|
+
* ```typescript
|
|
41
|
+
* const { engine } = await restoreOrStart({ store, key, path, initialData, observers: [...] });
|
|
42
|
+
* facade.adoptEngine(engine);
|
|
43
|
+
* ```
|
|
44
|
+
*/
|
|
45
|
+
adoptEngine(engine) {
|
|
46
|
+
// Disconnect from whatever engine we're currently listening to
|
|
47
|
+
this._unsubscribeFromEngine();
|
|
48
|
+
this._engine = engine;
|
|
49
|
+
this.connectEngine(engine);
|
|
50
|
+
}
|
|
51
|
+
connectEngine(engine) {
|
|
52
|
+
// Seed state immediately — critical when restoring a persisted path since
|
|
53
|
+
// the engine is already running before the facade connects to it.
|
|
54
|
+
const current = engine.snapshot();
|
|
55
|
+
this._state$.next(current);
|
|
56
|
+
this._stateSignal.set(current);
|
|
57
|
+
this._unsubscribeFromEngine = engine.subscribe((event) => {
|
|
30
58
|
this._events$.next(event);
|
|
31
59
|
if (event.type === "stateChanged" || event.type === "resumed") {
|
|
32
60
|
this._state$.next(event.snapshot);
|
|
@@ -39,12 +67,12 @@ export class PathFacade {
|
|
|
39
67
|
});
|
|
40
68
|
}
|
|
41
69
|
ngOnDestroy() {
|
|
42
|
-
this.
|
|
70
|
+
this._unsubscribeFromEngine();
|
|
43
71
|
this._events$.complete();
|
|
44
72
|
this._state$.complete();
|
|
45
73
|
}
|
|
46
74
|
start(path, initialData = {}) {
|
|
47
|
-
return this.
|
|
75
|
+
return this._engine.start(path, initialData);
|
|
48
76
|
}
|
|
49
77
|
/**
|
|
50
78
|
* Tears down any active path (without firing lifecycle hooks) and immediately
|
|
@@ -53,31 +81,31 @@ export class PathFacade {
|
|
|
53
81
|
* component that provides this facade.
|
|
54
82
|
*/
|
|
55
83
|
restart(path, initialData = {}) {
|
|
56
|
-
return this.
|
|
84
|
+
return this._engine.restart(path, initialData);
|
|
57
85
|
}
|
|
58
86
|
startSubPath(path, initialData = {}, meta) {
|
|
59
|
-
return this.
|
|
87
|
+
return this._engine.startSubPath(path, initialData, meta);
|
|
60
88
|
}
|
|
61
89
|
next() {
|
|
62
|
-
return this.
|
|
90
|
+
return this._engine.next();
|
|
63
91
|
}
|
|
64
92
|
previous() {
|
|
65
|
-
return this.
|
|
93
|
+
return this._engine.previous();
|
|
66
94
|
}
|
|
67
95
|
cancel() {
|
|
68
|
-
return this.
|
|
96
|
+
return this._engine.cancel();
|
|
69
97
|
}
|
|
70
98
|
setData(key, value) {
|
|
71
|
-
return this.
|
|
99
|
+
return this._engine.setData(key, value);
|
|
72
100
|
}
|
|
73
101
|
goToStep(stepId) {
|
|
74
|
-
return this.
|
|
102
|
+
return this._engine.goToStep(stepId);
|
|
75
103
|
}
|
|
76
104
|
/** Jump to a step by ID, checking the current step's canMoveNext (forward) or
|
|
77
105
|
* canMovePrevious (backward) guard first. Navigation is blocked if the guard
|
|
78
106
|
* returns false. Throws if the step ID does not exist. */
|
|
79
107
|
goToStepChecked(stepId) {
|
|
80
|
-
return this.
|
|
108
|
+
return this._engine.goToStepChecked(stepId);
|
|
81
109
|
}
|
|
82
110
|
snapshot() {
|
|
83
111
|
return this._state$.getValue();
|
|
@@ -131,4 +159,5 @@ export function syncFormGroup(facade, formGroup, destroyRef) {
|
|
|
131
159
|
destroyRef?.onDestroy(cleanup);
|
|
132
160
|
return cleanup;
|
|
133
161
|
}
|
|
162
|
+
export { PathEngine } from "@daltonr/pathwrite-core";
|
|
134
163
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAyB,MAAM,EAAU,MAAM,eAAe,CAAC;AAClF,OAAO,EAAE,eAAe,EAAc,OAAO,EAAE,MAAM,MAAM,CAAC;AAC5D,OAAO,EAGL,UAAU,EAGX,MAAM,yBAAyB,CAAC;;AAEjC;;;;;;;;;;;;;GAaG;AAEH,MAAM,OAAO,UAAU;IAYrB;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/shell.d.ts
CHANGED
|
@@ -108,7 +108,7 @@ export declare class PathShellComponent implements OnInit, OnDestroy {
|
|
|
108
108
|
/** Label for the Next navigation button. */
|
|
109
109
|
nextLabel: string;
|
|
110
110
|
/** Label for the Next button when on the last step. */
|
|
111
|
-
|
|
111
|
+
completeLabel: string;
|
|
112
112
|
/** Label for the Cancel button. */
|
|
113
113
|
cancelLabel: string;
|
|
114
114
|
/** Hide the Cancel button entirely. */
|
|
@@ -133,5 +133,5 @@ export declare class PathShellComponent implements OnInit, OnDestroy {
|
|
|
133
133
|
ngOnDestroy(): void;
|
|
134
134
|
doStart(): void;
|
|
135
135
|
static ɵfac: i0.ɵɵFactoryDeclaration<PathShellComponent, never>;
|
|
136
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<PathShellComponent, "pw-shell", never, { "path": { "alias": "path"; "required": true; }; "initialData": { "alias": "initialData"; "required": false; }; "autoStart": { "alias": "autoStart"; "required": false; }; "backLabel": { "alias": "backLabel"; "required": false; }; "nextLabel": { "alias": "nextLabel"; "required": false; }; "
|
|
136
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<PathShellComponent, "pw-shell", never, { "path": { "alias": "path"; "required": true; }; "initialData": { "alias": "initialData"; "required": false; }; "autoStart": { "alias": "autoStart"; "required": false; }; "backLabel": { "alias": "backLabel"; "required": false; }; "nextLabel": { "alias": "nextLabel"; "required": false; }; "completeLabel": { "alias": "completeLabel"; "required": false; }; "cancelLabel": { "alias": "cancelLabel"; "required": false; }; "hideCancel": { "alias": "hideCancel"; "required": false; }; "hideProgress": { "alias": "hideProgress"; "required": false; }; }, { "completed": "completed"; "cancelled": "cancelled"; "pathEvent": "pathEvent"; }, ["customHeader", "customFooter", "stepDirectives"], never, true, never>;
|
|
137
137
|
}
|
package/dist/shell.js
CHANGED
|
@@ -110,11 +110,11 @@ export class PathShellComponent {
|
|
|
110
110
|
/** Start the path automatically on ngOnInit. Set to false to call doStart() manually. */
|
|
111
111
|
this.autoStart = true;
|
|
112
112
|
/** Label for the Back navigation button. */
|
|
113
|
-
this.backLabel = "
|
|
113
|
+
this.backLabel = "Previous";
|
|
114
114
|
/** Label for the Next navigation button. */
|
|
115
115
|
this.nextLabel = "Next";
|
|
116
116
|
/** Label for the Next button when on the last step. */
|
|
117
|
-
this.
|
|
117
|
+
this.completeLabel = "Complete";
|
|
118
118
|
/** Label for the Cancel button. */
|
|
119
119
|
this.cancelLabel = "Cancel";
|
|
120
120
|
/** Hide the Cancel button entirely. */
|
|
@@ -162,7 +162,7 @@ export class PathShellComponent {
|
|
|
162
162
|
this.facade.start(this.path, this.initialData);
|
|
163
163
|
}
|
|
164
164
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PathShellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
165
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PathShellComponent, isStandalone: true, selector: "pw-shell", inputs: { path: "path", initialData: "initialData", autoStart: "autoStart", backLabel: "backLabel", nextLabel: "nextLabel",
|
|
165
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PathShellComponent, isStandalone: true, selector: "pw-shell", inputs: { path: "path", initialData: "initialData", autoStart: "autoStart", backLabel: "backLabel", nextLabel: "nextLabel", completeLabel: "completeLabel", cancelLabel: "cancelLabel", hideCancel: "hideCancel", hideProgress: "hideProgress" }, outputs: { completed: "completed", cancelled: "cancelled", pathEvent: "pathEvent" }, providers: [PathFacade], queries: [{ propertyName: "customHeader", first: true, predicate: PathShellHeaderDirective, descendants: true }, { propertyName: "customFooter", first: true, predicate: PathShellFooterDirective, descendants: true }, { propertyName: "stepDirectives", predicate: PathStepDirective }], ngImport: i0, template: `
|
|
166
166
|
<!-- Empty state -->
|
|
167
167
|
<div class="pw-shell" *ngIf="!(facade.state$ | async)">
|
|
168
168
|
<div class="pw-shell__empty" *ngIf="!started">
|
|
@@ -237,7 +237,7 @@ export class PathShellComponent {
|
|
|
237
237
|
class="pw-shell__btn pw-shell__btn--next"
|
|
238
238
|
[disabled]="s.isNavigating || !s.canMoveNext"
|
|
239
239
|
(click)="facade.next()"
|
|
240
|
-
>{{ s.isLastStep ?
|
|
240
|
+
>{{ s.isLastStep ? completeLabel : nextLabel }}</button>
|
|
241
241
|
</div>
|
|
242
242
|
</div>
|
|
243
243
|
</ng-template>
|
|
@@ -327,7 +327,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
327
327
|
class="pw-shell__btn pw-shell__btn--next"
|
|
328
328
|
[disabled]="s.isNavigating || !s.canMoveNext"
|
|
329
329
|
(click)="facade.next()"
|
|
330
|
-
>{{ s.isLastStep ?
|
|
330
|
+
>{{ s.isLastStep ? completeLabel : nextLabel }}</button>
|
|
331
331
|
</div>
|
|
332
332
|
</div>
|
|
333
333
|
</ng-template>
|
|
@@ -345,7 +345,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
345
345
|
type: Input
|
|
346
346
|
}], nextLabel: [{
|
|
347
347
|
type: Input
|
|
348
|
-
}],
|
|
348
|
+
}], completeLabel: [{
|
|
349
349
|
type: Input
|
|
350
350
|
}], cancelLabel: [{
|
|
351
351
|
type: Input
|
package/dist/shell.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shell.js","sourceRoot":"","sources":["../src/shell.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,SAAS,EAET,KAAK,EACL,MAAM,EACN,YAAY,EACZ,YAAY,EACZ,eAAe,EAIf,MAAM,EACN,QAAQ,EACR,uBAAuB,EACxB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAO3C,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;;;AAsBrC,8EAA8E;AAC9E,oBAAoB;AACpB,8EAA8E;AAE9E;;;;;;;;;;GAUG;AAEH,MAAM,OAAO,iBAAiB;IAE5B,YAAmC,WAAiC;QAAjC,gBAAW,GAAX,WAAW,CAAsB;IAAG,CAAC;+GAF7D,iBAAiB;mGAAjB,iBAAiB;;4FAAjB,iBAAiB;kBAD7B,SAAS;mBAAC,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE,IAAI,EAAE;gFAEP,MAAM;sBAAjD,KAAK;uBAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE;;AAI5C,8EAA8E;AAC9E,2BAA2B;AAC3B,8EAA8E;AAE9E;;;;;;;;;;;;GAYG;AAEH,MAAM,OAAO,wBAAwB;IACnC,YACkB,WAAqD;QAArD,gBAAW,GAAX,WAAW,CAA0C;IACpE,CAAC;+GAHO,wBAAwB;mGAAxB,wBAAwB;;4FAAxB,wBAAwB;kBADpC,SAAS;mBAAC,EAAE,QAAQ,EAAE,iBAAiB,EAAE,UAAU,EAAE,IAAI,EAAE;;AAO5D,8EAA8E;AAC9E,2BAA2B;AAC3B,8EAA8E;AAE9E;;;;;;;;;;;;;;GAcG;AAEH,MAAM,OAAO,wBAAwB;IACnC,YACkB,WAAgF;QAAhF,gBAAW,GAAX,WAAW,CAAqE;IAC/F,CAAC;+GAHO,wBAAwB;mGAAxB,wBAAwB;;4FAAxB,wBAAwB;kBADpC,SAAS;mBAAC,EAAE,QAAQ,EAAE,iBAAiB,EAAE,UAAU,EAAE,IAAI,EAAE;;AAO5D,8EAA8E;AAC9E,qBAAqB;AACrB,8EAA8E;AAE9E;;;;;;;;;;GAUG;AAyFH,MAAM,OAAO,kBAAkB;IAxF/B;QA2FE,yDAAyD;QAChD,gBAAW,GAAa,EAAE,CAAC;QACpC,yFAAyF;QAChF,cAAS,GAAG,IAAI,CAAC;QAC1B,4CAA4C;QACnC,cAAS,GAAG,
|
|
1
|
+
{"version":3,"file":"shell.js","sourceRoot":"","sources":["../src/shell.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@daltonr/pathwrite-angular",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.5.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"description": "Angular adapter for @daltonr/pathwrite-core — RxJS observables, signal-friendly, with optional <pw-shell> default UI.",
|
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
"@angular/compiler-cli": "^17.0.0"
|
|
61
61
|
},
|
|
62
62
|
"dependencies": {
|
|
63
|
-
"@daltonr/pathwrite-core": "^0.
|
|
63
|
+
"@daltonr/pathwrite-core": "^0.5.0"
|
|
64
64
|
},
|
|
65
65
|
"publishConfig": {
|
|
66
66
|
"access": "public"
|
package/src/index.ts
CHANGED
|
@@ -24,10 +24,10 @@ import {
|
|
|
24
24
|
*/
|
|
25
25
|
@Injectable()
|
|
26
26
|
export class PathFacade<TData extends PathData = PathData> implements OnDestroy {
|
|
27
|
-
private
|
|
27
|
+
private _engine = new PathEngine();
|
|
28
28
|
private readonly _state$ = new BehaviorSubject<PathSnapshot<TData> | null>(null);
|
|
29
29
|
private readonly _events$ = new Subject<PathEvent>();
|
|
30
|
-
private
|
|
30
|
+
private _unsubscribeFromEngine: () => void = () => {};
|
|
31
31
|
private readonly _stateSignal = signal<PathSnapshot<TData> | null>(null);
|
|
32
32
|
|
|
33
33
|
public readonly state$: Observable<PathSnapshot<TData> | null> = this._state$.asObservable();
|
|
@@ -36,7 +36,37 @@ export class PathFacade<TData extends PathData = PathData> implements OnDestroy
|
|
|
36
36
|
public readonly stateSignal: Signal<PathSnapshot<TData> | null> = this._stateSignal.asReadonly();
|
|
37
37
|
|
|
38
38
|
public constructor() {
|
|
39
|
-
this.
|
|
39
|
+
this.connectEngine(this._engine);
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
/**
|
|
43
|
+
* Adopt an externally-managed `PathEngine` — for example, the engine returned
|
|
44
|
+
* by `restoreOrStart()` from `@daltonr/pathwrite-store-http`.
|
|
45
|
+
*
|
|
46
|
+
* The facade immediately reflects the engine's current state and forwards all
|
|
47
|
+
* subsequent events. The **caller** is responsible for the engine's lifecycle
|
|
48
|
+
* (starting, cleanup); the facade only subscribes to it.
|
|
49
|
+
*
|
|
50
|
+
* ```typescript
|
|
51
|
+
* const { engine } = await restoreOrStart({ store, key, path, initialData, observers: [...] });
|
|
52
|
+
* facade.adoptEngine(engine);
|
|
53
|
+
* ```
|
|
54
|
+
*/
|
|
55
|
+
public adoptEngine(engine: PathEngine): void {
|
|
56
|
+
// Disconnect from whatever engine we're currently listening to
|
|
57
|
+
this._unsubscribeFromEngine();
|
|
58
|
+
this._engine = engine;
|
|
59
|
+
this.connectEngine(engine);
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
private connectEngine(engine: PathEngine): void {
|
|
63
|
+
// Seed state immediately — critical when restoring a persisted path since
|
|
64
|
+
// the engine is already running before the facade connects to it.
|
|
65
|
+
const current = engine.snapshot() as PathSnapshot<TData> | null;
|
|
66
|
+
this._state$.next(current);
|
|
67
|
+
this._stateSignal.set(current);
|
|
68
|
+
|
|
69
|
+
this._unsubscribeFromEngine = engine.subscribe((event) => {
|
|
40
70
|
this._events$.next(event);
|
|
41
71
|
if (event.type === "stateChanged" || event.type === "resumed") {
|
|
42
72
|
this._state$.next(event.snapshot as PathSnapshot<TData>);
|
|
@@ -49,13 +79,13 @@ export class PathFacade<TData extends PathData = PathData> implements OnDestroy
|
|
|
49
79
|
}
|
|
50
80
|
|
|
51
81
|
public ngOnDestroy(): void {
|
|
52
|
-
this.
|
|
82
|
+
this._unsubscribeFromEngine();
|
|
53
83
|
this._events$.complete();
|
|
54
84
|
this._state$.complete();
|
|
55
85
|
}
|
|
56
86
|
|
|
57
87
|
public start(path: PathDefinition<any>, initialData: PathData = {}): Promise<void> {
|
|
58
|
-
return this.
|
|
88
|
+
return this._engine.start(path, initialData);
|
|
59
89
|
}
|
|
60
90
|
|
|
61
91
|
/**
|
|
@@ -65,38 +95,38 @@ export class PathFacade<TData extends PathData = PathData> implements OnDestroy
|
|
|
65
95
|
* component that provides this facade.
|
|
66
96
|
*/
|
|
67
97
|
public restart(path: PathDefinition<any>, initialData: PathData = {}): Promise<void> {
|
|
68
|
-
return this.
|
|
98
|
+
return this._engine.restart(path, initialData);
|
|
69
99
|
}
|
|
70
100
|
|
|
71
101
|
public startSubPath(path: PathDefinition<any>, initialData: PathData = {}, meta?: Record<string, unknown>): Promise<void> {
|
|
72
|
-
return this.
|
|
102
|
+
return this._engine.startSubPath(path, initialData, meta);
|
|
73
103
|
}
|
|
74
104
|
|
|
75
105
|
public next(): Promise<void> {
|
|
76
|
-
return this.
|
|
106
|
+
return this._engine.next();
|
|
77
107
|
}
|
|
78
108
|
|
|
79
109
|
public previous(): Promise<void> {
|
|
80
|
-
return this.
|
|
110
|
+
return this._engine.previous();
|
|
81
111
|
}
|
|
82
112
|
|
|
83
113
|
public cancel(): Promise<void> {
|
|
84
|
-
return this.
|
|
114
|
+
return this._engine.cancel();
|
|
85
115
|
}
|
|
86
116
|
|
|
87
117
|
public setData<K extends string & keyof TData>(key: K, value: TData[K]): Promise<void> {
|
|
88
|
-
return this.
|
|
118
|
+
return this._engine.setData(key, value as unknown);
|
|
89
119
|
}
|
|
90
120
|
|
|
91
121
|
public goToStep(stepId: string): Promise<void> {
|
|
92
|
-
return this.
|
|
122
|
+
return this._engine.goToStep(stepId);
|
|
93
123
|
}
|
|
94
124
|
|
|
95
125
|
/** Jump to a step by ID, checking the current step's canMoveNext (forward) or
|
|
96
126
|
* canMovePrevious (backward) guard first. Navigation is blocked if the guard
|
|
97
127
|
* returns false. Throws if the step ID does not exist. */
|
|
98
128
|
public goToStepChecked(stepId: string): Promise<void> {
|
|
99
|
-
return this.
|
|
129
|
+
return this._engine.goToStepChecked(stepId);
|
|
100
130
|
}
|
|
101
131
|
|
|
102
132
|
public snapshot(): PathSnapshot<TData> | null {
|
|
@@ -184,3 +214,5 @@ export type {
|
|
|
184
214
|
SerializedPathState
|
|
185
215
|
} from "@daltonr/pathwrite-core";
|
|
186
216
|
|
|
217
|
+
export { PathEngine } from "@daltonr/pathwrite-core";
|
|
218
|
+
|
package/src/shell.ts
CHANGED
|
@@ -212,7 +212,7 @@ export class PathShellFooterDirective {
|
|
|
212
212
|
class="pw-shell__btn pw-shell__btn--next"
|
|
213
213
|
[disabled]="s.isNavigating || !s.canMoveNext"
|
|
214
214
|
(click)="facade.next()"
|
|
215
|
-
>{{ s.isLastStep ?
|
|
215
|
+
>{{ s.isLastStep ? completeLabel : nextLabel }}</button>
|
|
216
216
|
</div>
|
|
217
217
|
</div>
|
|
218
218
|
</ng-template>
|
|
@@ -227,11 +227,11 @@ export class PathShellComponent implements OnInit, OnDestroy {
|
|
|
227
227
|
/** Start the path automatically on ngOnInit. Set to false to call doStart() manually. */
|
|
228
228
|
@Input() autoStart = true;
|
|
229
229
|
/** Label for the Back navigation button. */
|
|
230
|
-
@Input() backLabel = "
|
|
230
|
+
@Input() backLabel = "Previous";
|
|
231
231
|
/** Label for the Next navigation button. */
|
|
232
232
|
@Input() nextLabel = "Next";
|
|
233
233
|
/** Label for the Next button when on the last step. */
|
|
234
|
-
@Input()
|
|
234
|
+
@Input() completeLabel = "Complete";
|
|
235
235
|
/** Label for the Cancel button. */
|
|
236
236
|
@Input() cancelLabel = "Cancel";
|
|
237
237
|
/** Hide the Cancel button entirely. */
|