@daltonr/pathwrite-angular 0.4.0 → 0.6.0

package/README.md

@@ -15,6 +15,7 @@ For convenience, this package re-exports core types so you don't need to import
 ```typescript
 import { 
   PathFacade,           // Angular-specific
+  PathEngine,           // Re-exported from core (value + type)
   PathData,             // Re-exported from core
   PathDefinition,       // Re-exported from core
   PathEvent,            // Re-exported from core
@@ -65,6 +66,7 @@ export class MyComponent {
 
 | Method | Description |
 |--------|-------------|
+| `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. |
 | `start(definition, data?)` | Start or re-start a path. |
 | `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. |
 | `startSubPath(definition, data?, meta?)` | Push a sub-path. Requires an active path. `meta` is returned unchanged to `onSubPathComplete` / `onSubPathCancel`. |
@@ -85,6 +87,128 @@ facade.snapshot()?.data.name; // typed as string (or whatever MyData defines)
 
 ---
 
+## `injectPath()` — Recommended API for Components
+
+**New in v0.6.0** — `injectPath()` provides an ergonomic, signal-based API for accessing the path engine inside Angular components. This is the **recommended approach** for step components and forms — it mirrors React's `usePathContext()` and Vue's `usePath()` for consistency across frameworks.
+
+### Quick start
+
+```typescript
+import { Component } from "@angular/core";
+import { PathFacade, injectPath } from "@daltonr/pathwrite-angular";
+
+@Component({
+  selector: "app-contact-step",
+  standalone: true,
+  providers: [PathFacade],  // ← Required: provide at this component or a parent
+  template: `
+    @if (path.snapshot(); as s) {
+      <h2>{{ s.activeStep?.title }}</h2>
+      <input 
+        type="text" 
+        [value]="name"
+        (input)="updateName($any($event.target).value)"
+      />
+      <button (click)="path.next()">Next</button>
+    }
+  `
+})
+export class ContactStepComponent {
+  protected readonly path = injectPath<ContactData>();
+  protected name = "";
+
+  protected updateName(value: string): void {
+    this.name = value;
+    this.path.setData("name", value);  // ← No facade or template ref needed
+  }
+}
+```
+
+### API
+
+`injectPath()` returns an object with:
+
+| Member | Type | Description |
+|--------|------|-------------|
+| `snapshot` | `Signal<PathSnapshot \| null>` | Current path snapshot as a signal. `null` when no path is active. |
+| `start(path, data?)` | `Promise<void>` | Start or restart a path. |
+| `restart(path, data?)` | `Promise<void>` | Tear down and restart fresh. |
+| `startSubPath(path, data?, meta?)` | `Promise<void>` | Push a sub-path onto the stack. |
+| `next()` | `Promise<void>` | Advance one step. |
+| `previous()` | `Promise<void>` | Go back one step. |
+| `cancel()` | `Promise<void>` | Cancel the active path. |
+| `setData(key, value)` | `Promise<void>` | Update a single data field. Type-safe when `TData` is specified. |
+| `goToStep(stepId)` | `Promise<void>` | Jump to a step by ID (no guard checks). |
+| `goToStepChecked(stepId)` | `Promise<void>` | Jump to a step by ID (guard-checked). |
+
+### Type safety
+
+Pass your data type as a generic to get full type checking:
+
+```typescript
+interface ContactData {
+  name: string;
+  email: string;
+}
+
+const path = injectPath<ContactData>();
+
+path.setData("name", "Jane");   // ✅ OK
+path.setData("foo", 123);       // ❌ Type error: "foo" not in ContactData
+path.snapshot()?.data.name;     // ✅ Typed as string
+```
+
+### Requirements
+
+- **Angular 16+** (signals required)
+- `PathFacade` must be provided in the injector tree (either at the component or a parent component)
+
+### Compared to manual facade injection
+
+**Before** (manual facade injection + template reference):
+```typescript
+@Component({
+  providers: [PathFacade],
+  template: `
+    <pw-shell #shell ...>
+      <ng-template pwStep="contact">
+        <input (input)="shell.facade.setData('name', $any($event.target).value)" />
+      </ng-template>
+    </pw-shell>
+  `
+})
+export class MyComponent {
+  protected readonly facade = inject(PathFacade);
+}
+```
+
+**After** (with `injectPath()`):
+```typescript
+@Component({
+  providers: [PathFacade],
+  template: `
+    <input (input)="updateName($any($event.target).value)" />
+    <button (click)="path.next()">Next</button>
+  `
+})
+export class MyStepComponent {
+  protected readonly path = injectPath<MyData>();
+
+  protected updateName(value: string): void {
+    this.path.setData("name", value);  // ← Clean, no template ref
+  }
+}
+```
+
+The `injectPath()` approach:
+- **No template references** — access the engine directly from the component class
+- **Signal-native** — `path.snapshot()` returns the reactive signal directly
+- **Type-safe** — generic parameter flows through to all methods
+- **Framework-consistent** — matches React's `usePathContext()` and Vue's `usePath()`
+- **Less Angular-specific knowledge** — just `inject()` and signals, patterns Angular developers already know
+
+---
+
 ## Angular Forms integration — `syncFormGroup`
 
 `syncFormGroup` eliminates the boilerplate of manually wiring an Angular
@@ -253,6 +377,38 @@ export class MyComponent {
 
 Each `<ng-template pwStep="<stepId>">` is rendered when the active step matches `stepId`. The shell handles all navigation internally.
 
+> **⚠️ Important: `pwStep` Values Must Match Step IDs**
+>
+> The string value passed to the `pwStep` directive **must exactly match** the corresponding step's `id`:
+>
+> ```typescript
+> const myPath: PathDefinition = {
+>   id: 'signup',
+>   steps: [
+>     { id: 'details' },  // ← Step ID
+>     { id: 'review' }    // ← Step ID
+>   ]
+> };
+> ```
+>
+> ```html
+> <pw-shell [path]="myPath">
+>   <ng-template pwStep="details">  <!-- ✅ Matches "details" step -->
+>     <app-details-form />
+>   </ng-template>
+>   <ng-template pwStep="review">   <!-- ✅ Matches "review" step -->
+>     <app-review-panel />
+>   </ng-template>
+>   <ng-template pwStep="foo">      <!-- ❌ No step with id "foo" -->
+>     <app-foo-panel />
+>   </ng-template>
+> </pw-shell>
+> ```
+>
+> If a `pwStep` value doesn't match any step ID, that template will never be rendered (silent — no error message).
+>
+> **💡 Tip:** Use your IDE's "Go to Definition" on the step ID in your path definition, then copy-paste the exact string when creating the `pwStep` directive. This ensures perfect matching and avoids typos.
+
 ### Context sharing
 
 `PathShellComponent` provides a `PathFacade` instance in its own `providers` array
@@ -299,12 +455,13 @@ export class MyComponent {
 | `path` | `PathDefinition` | *required* | The path definition to drive. |
 | `initialData` | `PathData` | `{}` | Initial data passed to `facade.start()`. |
 | `autoStart` | `boolean` | `true` | Start the path automatically on `ngOnInit`. |
-| `backLabel` | `string` | `"Back"` | Back button label. |
+| `backLabel` | `string` | `"Previous"` | Previous button label. |
 | `nextLabel` | `string` | `"Next"` | Next button label. |
-| `finishLabel` | `string` | `"Finish"` | Finish button label (last step). |
+| `completeLabel` | `string` | `"Complete"` | Complete button label (last step). |
 | `cancelLabel` | `string` | `"Cancel"` | Cancel button label. |
 | `hideCancel` | `boolean` | `false` | Hide the Cancel button. |
-| `hideProgress` | `boolean` | `false` | Hide the progress indicator. |
+| `hideProgress` | `boolean` | `false` | Hide the progress indicator. Also hidden automatically for single-step top-level paths. |
+| `footerLayout` | `"wizard" \| "form" \| "auto"` | `"auto"` | Footer button layout. `"auto"` uses `"form"` for single-step top-level paths, `"wizard"` otherwise. `"wizard"`: Back on left, Cancel+Submit on right. `"form"`: Cancel on left, Submit on right, no Back button. |
 
 ### Outputs
 
@@ -346,7 +503,7 @@ export class MyComponent { ... }
       <ng-template pwShellFooter let-s let-actions="actions">
         <button (click)="actions.previous()" [disabled]="s.isFirstStep || s.isNavigating">Back</button>
         <button (click)="actions.next()"     [disabled]="!s.canMoveNext || s.isNavigating">
-          {{ s.isLastStep ? 'Finish' : 'Next' }}
+          {{ s.isLastStep ? 'Complete' : 'Next' }}
         </button>
       </ng-template>
       <ng-template pwStep="details"><app-details-form /></ng-template>
@@ -362,6 +519,38 @@ export class MyComponent { ... }
 
 Both directives can be combined. Only the sections you override are replaced — a custom header still shows the default footer, and vice versa.
 
+### Resetting the path
+
+There are two ways to reset `<pw-shell>` to step 1.
+
+**Option 1 — Toggle mount** (simplest, always correct)
+
+Toggle an `@if` flag to destroy and recreate the shell. Every child component resets from scratch:
+
+```html
+@if (isActive) {
+  <pw-shell [path]="myPath" (completed)="isActive = false" (cancelled)="isActive = false">
+    <ng-template pwStep="details"><app-details-form /></ng-template>
+  </pw-shell>
+} @else {
+  <button (click)="isActive = true">Try Again</button>
+}
+```
+
+**Option 2 — Call `restart()` on the shell ref** (in-place, no unmount)
+
+Use the existing `#shell` template reference — `restart()` is a public method:
+
+```html
+<pw-shell #shell [path]="myPath" (completed)="onDone($event)">
+  <ng-template pwStep="details"><app-details-form /></ng-template>
+</pw-shell>
+
+<button (click)="shell.restart()">Try Again</button>
+```
+
+`restart()` resets the path engine to step 1 with the original `[initialData]` without unmounting the component. Use this when you need to keep the shell mounted — for example, to preserve scroll position in a parent container or to drive a CSS transition.
+
 ---
 
 ## Sub-Paths
@@ -634,6 +823,79 @@ Use it to distinguish initialization from re-entry:
 
 ---
 
+## Persistence
+
+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()`.
+
+### Simple persistence example
+
+```typescript
+import { Component, inject, OnInit } from '@angular/core';
+import { PathFacade, PathShellComponent, PathStepDirective } from '@daltonr/pathwrite-angular';
+import { HttpStore, restoreOrStart, httpPersistence } from '@daltonr/pathwrite-store-http';
+import { signupPath } from './signup-path';
+
+@Component({
+  selector: 'app-signup-wizard',
+  standalone: true,
+  imports: [PathShellComponent, PathStepDirective],
+  providers: [PathFacade],
+  template: `
+    @if (ready) {
+      <pw-shell [path]="path" [autoStart]="false" (completed)="onComplete($event)">
+        <ng-template pwStep="details"><app-details-form /></ng-template>
+        <ng-template pwStep="review"><app-review-panel /></ng-template>
+      </pw-shell>
+    } @else {
+      <p>Loading…</p>
+    }
+  `
+})
+export class SignupWizardComponent implements OnInit {
+  private readonly facade = inject(PathFacade);
+
+  path = signupPath;
+  ready = false;
+
+  async ngOnInit() {
+    const store = new HttpStore({ baseUrl: '/api/wizard' });
+    const key = 'user:signup';
+
+    const { engine, restored } = await restoreOrStart({
+      store,
+      key,
+      path: this.path,
+      initialData: { name: '', email: '' },
+      observers: [
+        httpPersistence({ store, key, strategy: 'onNext' })
+      ]
+    });
+
+    // Hand the running engine to the facade — it immediately
+    // reflects the engine's current state and forwards all events.
+    this.facade.adoptEngine(engine);
+    this.ready = true;
+
+    if (restored) {
+      console.log('Progress restored — resuming from', engine.snapshot()?.stepId);
+    }
+  }
+
+  onComplete(data: any) {
+    console.log('Wizard completed:', data);
+  }
+}
+```
+
+### Key points
+
+- **`adoptEngine()`** connects the facade to an externally-created engine. No `@ViewChild` or shell reference needed — inject `PathFacade` directly.
+- **`[autoStart]="false"`** prevents the shell from calling `start()` on its own — the engine is already running.
+- **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.
+- **`restoreOrStart()`** handles the load-or-create logic: if saved state exists on the server, it restores the engine mid-flow; otherwise it starts fresh.
+
+---
+
 ## Styling
 
 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.css

@@ -204,6 +204,15 @@
   left: 4px;
 }
 
+.pw-shell__validation-label {
+  font-weight: 600;
+  margin-right: 3px;
+}
+
+.pw-shell__validation-label::after {
+  content: ":";
+}
+
 /* ------------------------------------------------------------------ */
 /* Footer — navigation buttons                                        */
 /* ------------------------------------------------------------------ */

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { OnDestroy, DestroyRef, Signal } from "@angular/core";
 import { Observable } from "rxjs";
-import { PathData, PathDefinition, PathEvent, PathSnapshot } from "@daltonr/pathwrite-core";
+import { PathData, PathDefinition, PathEngine, PathEvent, PathSnapshot } from "@daltonr/pathwrite-core";
 import * as i0 from "@angular/core";
 /**
  * Angular facade over PathEngine. Provide at component level for an isolated
@@ -17,16 +17,31 @@ import * as i0 from "@angular/core";
  * ```
  */
 export declare class PathFacade<TData extends PathData = PathData> implements OnDestroy {
-    private readonly engine;
+    private _engine;
     private readonly _state$;
     private readonly _events$;
-    private readonly unsubscribeFromEngine;
+    private _unsubscribeFromEngine;
     private readonly _stateSignal;
     readonly state$: Observable<PathSnapshot<TData> | null>;
     readonly events$: Observable<PathEvent>;
     /** Signal version of state$. Updates on every path state change. Requires Angular 16+. */
     readonly stateSignal: Signal<PathSnapshot<TData> | null>;
     constructor();
+    /**
+     * Adopt an externally-managed `PathEngine` — for example, the engine returned
+     * by `restoreOrStart()` from `@daltonr/pathwrite-store-http`.
+     *
+     * The facade immediately reflects the engine's current state and forwards all
+     * subsequent events. The **caller** is responsible for the engine's lifecycle
+     * (starting, cleanup); the facade only subscribes to it.
+     *
+     * ```typescript
+     * const { engine } = await restoreOrStart({ store, key, path, initialData, observers: [...] });
+     * facade.adoptEngine(engine);
+     * ```
+     */
+    adoptEngine(engine: PathEngine): void;
+    private connectEngine;
     ngOnDestroy(): void;
     start(path: PathDefinition<any>, initialData?: PathData): Promise<void>;
     /**
@@ -50,6 +65,73 @@ export declare class PathFacade<TData extends PathData = PathData> implements On
     static ɵfac: i0.ɵɵFactoryDeclaration<PathFacade<any>, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<PathFacade<any>>;
 }
+/**
+ * Return type of `injectPath()`. Provides signal-based reactive access to the
+ * path state and strongly-typed navigation actions. Mirrors React's `usePathContext()`
+ * return type for consistency across adapters.
+ */
+export interface InjectPathReturn<TData extends PathData = PathData> {
+    /** Current path snapshot as a signal. Returns `null` when no path is active. */
+    snapshot: Signal<PathSnapshot<TData> | null>;
+    /** Start (or restart) a path. */
+    start: (path: PathDefinition<any>, initialData?: PathData) => Promise<void>;
+    /** Push a sub-path onto the stack. */
+    startSubPath: (path: PathDefinition<any>, initialData?: PathData, meta?: Record<string, unknown>) => Promise<void>;
+    /** Advance one step. Completes the path on the last step. */
+    next: () => Promise<void>;
+    /** Go back one step. No-op when already on the first step. */
+    previous: () => Promise<void>;
+    /** Cancel the active path (or sub-path). */
+    cancel: () => Promise<void>;
+    /** Update a single data field. */
+    setData: <K extends string & keyof TData>(key: K, value: TData[K]) => Promise<void>;
+    /** Jump to a step by ID without checking guards. */
+    goToStep: (stepId: string) => Promise<void>;
+    /** Jump to a step by ID, checking guards first. */
+    goToStepChecked: (stepId: string) => Promise<void>;
+    /**
+     * Tears down any active path and immediately starts the given path fresh.
+     * Use for "Start over" / retry flows.
+     */
+    restart: (path: PathDefinition<any>, initialData?: PathData) => Promise<void>;
+}
+/**
+ * Inject a PathFacade and return a signal-based API for use in Angular components.
+ * Requires `PathFacade` to be provided in the component's injector tree (either via
+ * `providers: [PathFacade]` in the component or a parent component).
+ *
+ * **This is the recommended way to consume Pathwrite in Angular components** — it
+ * provides the same ergonomic, framework-native API that React's `usePathContext()`
+ * and Vue's `usePath()` offer. No template references or manual facade injection needed.
+ *
+ * The optional generic `TData` narrows `snapshot().data` and `setData()` to your
+ * data shape. It is a **type-level assertion**, not a runtime guarantee.
+ *
+ * @example
+ * ```typescript
+ * @Component({
+ *   selector: 'app-contact-step',
+ *   standalone: true,
+ *   providers: [PathFacade],  // ← Provide at this component or a parent
+ *   template: `
+ *     @if (path.snapshot(); as s) {
+ *       <div>Step: {{ s.activeStep?.title }}</div>
+ *       <button (click)="path.next()">Next</button>
+ *     }
+ *   `
+ * })
+ * export class ContactStepComponent {
+ *   protected readonly path = injectPath<ContactData>();
+ *
+ *   updateName(name: string) {
+ *     this.path.setData('name', name);
+ *   }
+ * }
+ * ```
+ *
+ * @throws Error if PathFacade is not provided in the injector tree
+ */
+export declare function injectPath<TData extends PathData = PathData>(): InjectPathReturn<TData>;
 /**
  * Minimal interface describing what syncFormGroup needs from an Angular
  * FormGroup. Typed as a duck interface so that @angular/forms is not a
@@ -91,4 +173,5 @@ export interface FormGroupLike {
  * ```
  */
 export declare function syncFormGroup<TData extends PathData = PathData>(facade: PathFacade<TData>, formGroup: FormGroupLike, destroyRef?: DestroyRef): () => void;
-export type { PathData, PathDefinition, PathEvent, PathSnapshot, PathStep, PathStepContext, SerializedPathState } from "@daltonr/pathwrite-core";
+export type { PathData, FieldErrors, PathDefinition, PathEvent, PathSnapshot, PathStep, PathStepContext, SerializedPathState } from "@daltonr/pathwrite-core";
+export { PathEngine } from "@daltonr/pathwrite-core";

package/dist/index.js

@@ -1,4 +1,4 @@
-import { Injectable, signal } from "@angular/core";
+import { Injectable, signal, inject } from "@angular/core";
 import { BehaviorSubject, Subject } from "rxjs";
 import { PathEngine } from "@daltonr/pathwrite-core";
 import * as i0 from "@angular/core";
@@ -18,15 +18,43 @@ import * as i0 from "@angular/core";
  */
 export class PathFacade {
     constructor() {
-        this.engine = new PathEngine();
+        this._engine = new PathEngine();
         this._state$ = new BehaviorSubject(null);
         this._events$ = new Subject();
+        this._unsubscribeFromEngine = () => { };
         this._stateSignal = signal(null);
         this.state$ = this._state$.asObservable();
         this.events$ = this._events$.asObservable();
         /** Signal version of state$. Updates on every path state change. Requires Angular 16+. */
         this.stateSignal = this._stateSignal.asReadonly();
-        this.unsubscribeFromEngine = this.engine.subscribe((event) => {
+        this.connectEngine(this._engine);
+    }
+    /**
+     * Adopt an externally-managed `PathEngine` — for example, the engine returned
+     * by `restoreOrStart()` from `@daltonr/pathwrite-store-http`.
+     *
+     * The facade immediately reflects the engine's current state and forwards all
+     * subsequent events. The **caller** is responsible for the engine's lifecycle
+     * (starting, cleanup); the facade only subscribes to it.
+     *
+     * ```typescript
+     * const { engine } = await restoreOrStart({ store, key, path, initialData, observers: [...] });
+     * facade.adoptEngine(engine);
+     * ```
+     */
+    adoptEngine(engine) {
+        // Disconnect from whatever engine we're currently listening to
+        this._unsubscribeFromEngine();
+        this._engine = engine;
+        this.connectEngine(engine);
+    }
+    connectEngine(engine) {
+        // Seed state immediately — critical when restoring a persisted path since
+        // the engine is already running before the facade connects to it.
+        const current = engine.snapshot();
+        this._state$.next(current);
+        this._stateSignal.set(current);
+        this._unsubscribeFromEngine = engine.subscribe((event) => {
             this._events$.next(event);
             if (event.type === "stateChanged" || event.type === "resumed") {
                 this._state$.next(event.snapshot);
@@ -39,12 +67,12 @@ export class PathFacade {
         });
     }
     ngOnDestroy() {
-        this.unsubscribeFromEngine();
+        this._unsubscribeFromEngine();
         this._events$.complete();
         this._state$.complete();
     }
     start(path, initialData = {}) {
-        return this.engine.start(path, initialData);
+        return this._engine.start(path, initialData);
     }
     /**
      * Tears down any active path (without firing lifecycle hooks) and immediately
@@ -53,31 +81,31 @@ export class PathFacade {
      * component that provides this facade.
      */
     restart(path, initialData = {}) {
-        return this.engine.restart(path, initialData);
+        return this._engine.restart(path, initialData);
     }
     startSubPath(path, initialData = {}, meta) {
-        return this.engine.startSubPath(path, initialData, meta);
+        return this._engine.startSubPath(path, initialData, meta);
     }
     next() {
-        return this.engine.next();
+        return this._engine.next();
     }
     previous() {
-        return this.engine.previous();
+        return this._engine.previous();
     }
     cancel() {
-        return this.engine.cancel();
+        return this._engine.cancel();
     }
     setData(key, value) {
-        return this.engine.setData(key, value);
+        return this._engine.setData(key, value);
     }
     goToStep(stepId) {
-        return this.engine.goToStep(stepId);
+        return this._engine.goToStep(stepId);
     }
     /** Jump to a step by ID, checking the current step's canMoveNext (forward) or
      *  canMovePrevious (backward) guard first. Navigation is blocked if the guard
      *  returns false. Throws if the step ID does not exist. */
     goToStepChecked(stepId) {
-        return this.engine.goToStepChecked(stepId);
+        return this._engine.goToStepChecked(stepId);
     }
     snapshot() {
         return this._state$.getValue();
@@ -88,6 +116,61 @@ export class PathFacade {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PathFacade, decorators: [{
             type: Injectable
         }], ctorParameters: () => [] });
+/**
+ * Inject a PathFacade and return a signal-based API for use in Angular components.
+ * Requires `PathFacade` to be provided in the component's injector tree (either via
+ * `providers: [PathFacade]` in the component or a parent component).
+ *
+ * **This is the recommended way to consume Pathwrite in Angular components** — it
+ * provides the same ergonomic, framework-native API that React's `usePathContext()`
+ * and Vue's `usePath()` offer. No template references or manual facade injection needed.
+ *
+ * The optional generic `TData` narrows `snapshot().data` and `setData()` to your
+ * data shape. It is a **type-level assertion**, not a runtime guarantee.
+ *
+ * @example
+ * ```typescript
+ * @Component({
+ *   selector: 'app-contact-step',
+ *   standalone: true,
+ *   providers: [PathFacade],  // ← Provide at this component or a parent
+ *   template: `
+ *     @if (path.snapshot(); as s) {
+ *       <div>Step: {{ s.activeStep?.title }}</div>
+ *       <button (click)="path.next()">Next</button>
+ *     }
+ *   `
+ * })
+ * export class ContactStepComponent {
+ *   protected readonly path = injectPath<ContactData>();
+ *
+ *   updateName(name: string) {
+ *     this.path.setData('name', name);
+ *   }
+ * }
+ * ```
+ *
+ * @throws Error if PathFacade is not provided in the injector tree
+ */
+export function injectPath() {
+    const facade = inject(PathFacade, { optional: true });
+    if (!facade) {
+        throw new Error("injectPath() requires PathFacade to be provided. " +
+            "Add 'providers: [PathFacade]' to your component or a parent component.");
+    }
+    return {
+        snapshot: facade.stateSignal,
+        start: (path, initialData = {}) => facade.start(path, initialData),
+        startSubPath: (path, initialData = {}, meta) => facade.startSubPath(path, initialData, meta),
+        next: () => facade.next(),
+        previous: () => facade.previous(),
+        cancel: () => facade.cancel(),
+        setData: (key, value) => facade.setData(key, value),
+        goToStep: (stepId) => facade.goToStep(stepId),
+        goToStepChecked: (stepId) => facade.goToStepChecked(stepId),
+        restart: (path, initialData = {}) => facade.restart(path, initialData),
+    };
+}
 /**
  * Syncs every key of an Angular FormGroup to the path engine via setData.
  *
@@ -131,4 +214,5 @@ export function syncFormGroup(facade, formGroup, destroyRef) {
     destroyRef?.onDestroy(cleanup);
     return cleanup;
 }
+export { PathEngine } from "@daltonr/pathwrite-core";
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}