diff --git a/.firebaserc b/.firebaserc
new file mode 100644
index 0000000..a5a06c0
--- /dev/null
+++ b/.firebaserc
@@ -0,0 +1,17 @@
+{
+  "projects": {
+    "default": "your-firebase-project-id"
+  },
+  "targets": {
+    "your-firebase-project-id": {
+      "hosting": {
+        "admin": [
+          "admin-site-id"
+        ],
+        "samples": [
+          "samples-site-id"
+        ]
+      }
+    }
+  }
+}
diff --git a/.github/workflows/PR_Check.yml b/.github/workflows/PR_Check.yml
index 5729f30..54b2672 100644
--- a/.github/workflows/PR_Check.yml
+++ b/.github/workflows/PR_Check.yml
@@ -2,8 +2,8 @@ name: PR Check
 
 on:
   pull_request:
-    branches: 
-      - main 
+    branches:
+      - main
 
 jobs:
   test:
@@ -16,12 +16,12 @@ jobs:
       - name: Set up Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '22'
 
       - name: Generate environment.ts from secrets
         shell: bash
         run: |
-          cat > src/environments/environment.ts <<'EOF'
+          cat > environments/environment.ts <<'EOF'
           export const environment = {
             production: false,
             supabaseUrl: '${{ secrets.SUPABASE_URL }}',
diff --git a/.github/workflows/e2e-tests.yml b/.github/workflows/e2e-tests.yml
index 7a1ebfc..dfa6a9e 100644
--- a/.github/workflows/e2e-tests.yml
+++ b/.github/workflows/e2e-tests.yml
@@ -40,8 +40,15 @@ jobs:
       - run: |
           echo "SUPABASE_ANON_KEY=$(supabase status -o env | grep SUPABASE_ANON_KEY | cut -d= -f2)" >> $GITHUB_ENV
 
+      - name: Start Angular web app
+        run: npm run start:local &
+        env: { NODE_ENV: "test" }
+
+      - name: Wait for Angular web app (≤30 s)
+        run: npx --yes wait-on http://localhost:4200 --timeout 30000
+
       - run: npx playwright install --with-deps
-      - run: npm run e2e:local
+      - run: npm run e2e:web:local
         env: { CI: "true" }
 
       - uses: actions/upload-artifact@v4
diff --git a/.github/workflows/google-cloudrun-docker.yml b/.github/workflows/google-cloudrun-docker.yml
index 6ecdf95..6d762a0 100644
--- a/.github/workflows/google-cloudrun-docker.yml
+++ b/.github/workflows/google-cloudrun-docker.yml
@@ -9,29 +9,31 @@ jobs:
   test:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
-          node-version: '18'
-          
+          node-version: '20'
+          cache: npm
+
       - run: npm ci
 
-      - run: npm run test -- --browsers=ChromeHeadless --watch=false --no-progress
+      - run: npm run test:all -- --browsers=ChromeHeadless --watch=false --no-progress
 
   deploy:
     runs-on: ubuntu-latest
     needs: test
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
-          node-version: '18'
+          node-version: '20'
+          cache: npm
 
       - run: npm ci
 
-      - run: npm run build --prod
+      - run: npm run build -- --configuration production
 
       - uses: google-github-actions/auth@v2
         with:
diff --git a/.gitignore b/.gitignore
index 3197472..fde308f 100755
--- a/.gitignore
+++ b/.gitignore
@@ -52,3 +52,7 @@ adminSdkConf.json
 /test-results/
 /playwright-report/
 /playwright/.cache/
+
+#llms
+/llms/private
+/llms/priv
diff --git a/.prettierrc b/.prettierrc
new file mode 100644
index 0000000..624f8cc
--- /dev/null
+++ b/.prettierrc
@@ -0,0 +1,32 @@
+{
+  "semi": true,
+  "trailingComma": "es5",
+  "singleQuote": true,
+  "printWidth": 100,
+  "tabWidth": 2,
+  "useTabs": false,
+  "endOfLine": "lf",
+  "bracketSpacing": true,
+  "bracketSameLine": false,
+  "arrowParens": "avoid",
+  "overrides": [
+    {
+      "files": "*.html",
+      "options": {
+        "parser": "angular"
+      }
+    },
+    {
+      "files": "*.scss",
+      "options": {
+        "singleQuote": false
+      }
+    },
+    {
+      "files": "*.md",
+      "options": {
+        "proseWrap": "preserve"
+      }
+    }
+  ]
+}
\ No newline at end of file
diff --git a/CLAUDE.md b/CLAUDE.md
new file mode 100644
index 0000000..4d979e9
--- /dev/null
+++ b/CLAUDE.md
@@ -0,0 +1,238 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## MOST IMPORTANT: Always read the LLM context files in `/llms/` before making any code changes or refactor proposals.
+
+## MOST IMPORTANT: NO WRITE COMMENTS in the codebase. Use PR comments instead.
+
+## Project Overview
+
+This is **angular.fun** - a modern Angular 20+ blog application with Supabase backend. The project is currently a monolithic structure in `/src` but is being refactored into a multi-project workspace with micro-frontends and shared libraries.
+
+### Current Architecture
+
+- **Main App**: `/src/app` - Monolithic structure containing both reader and admin functionality
+- **Reader**: `/src/app/reader` - Public blog with SSG/SSR capabilities
+- **Admin**: `/src/app/admin` - Admin panel with CSR for content management
+- **Shared**: `/src/app/shared` - Common components, services, models, and stores
+
+### Target Architecture (Multi-Project Workspace)
+
+- **projects/web**: Public blog with hybrid rendering (SSG for articles, SSR for home)
+- **projects/admin**: Pure CSR admin panel for Firebase Hosting
+- **projects/code-samples-mfe**: Micro-frontend for code samples via Native Federation
+- **projects/shared**: Shared library with UI components, patterns, data-access, and models
+
+## Common Development Commands
+
+### Development
+
+```bash
+npm start                    # Start main app (development mode)
+npm run start:local          # Start with local Supabase configuration
+npm run start:local:docker   # Open Docker for local development
+npm run start:local:backend  # Start local Supabase instance
+```
+
+### Building
+
+```bash
+npm run build                # Build for production
+npm run build:stats          # Build with bundle analysis stats
+npm run analyze              # Analyze bundle size with webpack-bundle-analyzer
+```
+
+### Testing
+
+```bash
+npm test                     # Run unit tests with Karma
+npm run e2e                  # Run E2E tests with Playwright
+npm run e2e:local            # Run E2E tests against local environment
+```
+
+### Supabase Management
+
+```bash
+npx supabase start           # Start local Supabase
+npx supabase stop            # Stop local Supabase
+npm run schema:pull          # Pull remote schema from cloud Supabase
+npm run db:createSeed        # Create database seed file
+npm run db:seed              # Initialize database with seed data
+```
+
+### Project-Specific Commands
+
+```bash
+ng serve admin               # Serve admin project (when refactored)
+ng serve web                 # Serve web project (when refactored)  
+ng build shared              # Build shared library
+ng serve code-samples-mfe    # Serve code samples micro-frontend
+```
+
+## Key Technologies & Stack
+
+- **Frontend**: Angular 20, NgRx Signals, Tailwind CSS, DaisyUI, Quill Editor, Highlight.js
+- **Backend**: Supabase (PostgreSQL, Authentication, Storage, Functions)
+- **Testing**: Playwright for E2E, Karma/Jasmine for unit tests
+- **Build**: Angular CLI with esbuild, SSR/SSG capabilities
+- **State Management**: NgRx SignalStore throughout all applications
+
+## Code Architecture Patterns
+
+### State Management
+
+- Use NgRx SignalStore for all state management
+- Feature-scoped stores in individual feature directories
+- Shared stores in `/src/app/shared/stores` -> refactor to `/projects/shared/src/data-access/stores` in new architecture
+
+### Component Structure
+
+- Standalone components using Angular's modern APIs
+- Feature-based organization with lazy-loaded routes
+- UI components are pure and stateless (inputs/outputs only)
+- Business logic encapsulated in services and stores
+
+### Data Access
+
+- **Public/Reader**: Uses PostgREST endpoints for SSG/SSR compatibility
+- **Admin**: Uses `@supabase/supabase-js` browser client
+- **Authentication**: Supabase Auth with role-based access control
+- **Storage**: Supabase Storage CDN for images and assets
+
+### Routing
+
+- Lazy-loaded feature modules
+- Route-level providers for feature isolation
+- Functional guards for authentication (`authAdminGuard`)
+
+## Development Guidelines
+
+### File Organization
+
+- The legacy monolith remains under `/src` until migration is complete — **do not modify** unless explicitly approved.
+- The target workspace lives under `/projects` and `/projects/shared`.
+
+**Apps**
+
+- `projects/web` — feature-first, standalone, lazy:
+  - `app/` (bootstrap, root routes)
+  - `features/<feature-name>/` (routes, components, stores, services)
+  - `layout/` (shell, navigation, footer)
+  - `core/` (app-level providers: http, interceptors, guards)
+- `projects/admin` — CSR-only, same structure as `web`.
+- `projects/code-samples-mfe` — remote MFE, only required features and mfe routing.
+
+**Shared library**
+
+- `projects/shared/`
+  - `ui/` (pure presentational components; no business logic)
+  - `pattern/` (composable building blocks, form controls, table abstractions)
+  - `data-access/` (clients, repositories, query functions; PostgREST for web SSR/SSG, supabase-js for admin)
+  - `models/` (types, DTOs, schema definitions)
+  - `utils/` (pure functions, pipes, directives)
+
+**General rules**
+
+- Standalone + lazy everywhere; **no cross-feature TS imports**.
+- Promote reusable logic “upwards” (from feature → pattern/ui/data-access).
+- Keep guards/interceptors/providers at route-level or in `core/` per app.
+- Tailwind/DaisyUI configuration shared where possible; design tokens in `shared`.
+
+See the [architecture.txt](llms/private/architecture.txt) document for authoritative rules and dependency boundaries.
+
+### Styling
+
+- Use Tailwind CSS with DaisyUI components
+- Custom color palette: primary (#12372A), secondary (#436850), tertiary (#ADBC9F), quaternary (#FBFADA)
+- Monitor CSS bundle size with budget limits in angular.json
+
+### Type Safety
+
+- Strict TypeScript configuration enabled
+- Supabase types generated in `/src/app/types/supabase/` -> refactor to `/projects/shared/src/models/supabase/`
+- Use proper interfaces for all data models
+
+### Environment Configuration
+
+- `environment.ts` - Production
+- `environment.development.ts` - Development
+- `environment.local.ts` - Local Supabase instance
+
+## Supabase Integration
+
+### Supabase Configuration
+
+- projects/web uses PostgREST for SSG/SSR compatibility
+- rest uses `@supabase/supabase-js` for browser client
+
+### Database Schema
+
+- Posts, Comments, Tags, PostTags, Profiles tables
+- Row Level Security (RLS) policies for data protection
+- Migrations managed in `/supabase/migrations/`
+
+### Authentication
+
+- Email/password authentication
+- Role-based access (admin, user roles)
+- Protected admin routes with functional guards
+
+### Local Development
+
+- Use Docker for local Supabase instance
+- Access Supabase Studio at http://localhost:54323
+- Seed data available via scripts in `/scripts/`
+
+## Testing Strategy
+
+### E2E Tests (Playwright)
+
+- Tests in `/e2e/` directory
+- Configured for multiple browsers (Chromium, Firefox, WebKit)
+- Helper utilities in `/e2e/helpers/`
+- Local and CI configurations available
+
+### Unit Tests
+
+- Colocated spec files with components/services
+- Karma + Jasmine test runner -> refactor to use Vitest in the future
+- Focus on business logic and component behavior
+
+## Build & Deployment
+
+### Bundle Optimization
+
+- Lazy loading for all features
+- Bundle analysis with webpack-bundle-analyzer
+- Performance budgets enforced in angular.json
+- Tree-shaking enabled for optimal bundle sizes
+
+### Target Deployments
+
+- **Web**: Google Cloud Run (SSG/SSR)
+- **Admin**: Firebase Hosting (CSR)
+- **Code Samples MFE**: Firebase Hosting (MFE)
+- **Assets**: Supabase Storage CDN
+
+## Migration Status
+
+The project is currently migrating from monolithic structure to multi-project workspace:
+
+- Current: Single app in `/src`
+- Target: Separate projects in `/projects/` with shared libraries
+- Architecture guidance available in `/llms/private/architecture.txt`
+
+## LLM Context Files
+
+Always read these files before making refactor proposals or code edits:
+
+- [llms/**/architecture.txt](llms/private/architecture.txt)
+- [llms/**/llm-full.txt](llms/private/llm-full.txt)
+- [llms/**/app-description.txt](llms/private/app-description.txt)
+
+These documents are authoritative for:
+
+- Workspace and folder structure
+- Angular 20 style and coding conventions
+- Target apps, rendering modes, and deployment
diff --git a/Dockerfile b/Dockerfile
new file mode 100644
index 0000000..2824339
--- /dev/null
+++ b/Dockerfile
@@ -0,0 +1,35 @@
+# Dockerfile for Angular SSR (blog-ssg) on Cloud Run
+# Multi-stage: build Angular bundles, then run the SSR server.
+# Cloud Run expects the app to listen on PORT env var (default 8080).
+
+# ---------- Build stage ----------
+FROM node:20-bullseye AS builder
+WORKDIR /workspace
+
+# Install deps with pnpm (recommended for speed). Fallback to npm if needed.
+COPY package.json* pnpm-lock.yaml* package-lock.json* .npmrc* ./
+RUN corepack enable && corepack prepare pnpm@latest --activate || true
+RUN if [ -f pnpm-lock.yaml ]; then pnpm install --frozen-lockfile;         elif [ -f package-lock.json ]; then npm ci;         else pnpm install; fi
+
+COPY . .
+
+# Build browser, server (SSR). Prerender can be done in CI before building the image.
+RUN npx ng build blog-ssg --configuration=production
+RUN npx ng run blog-ssg:server:production
+# Optional:
+# RUN npx ng run blog-ssg:prerender --routes=apps/blog-ssg/routes.txt
+
+# ---------- Runtime stage ----------
+FROM node:20-bullseye-slim AS runtime
+ENV NODE_ENV=production
+WORKDIR /srv
+
+# Copy built artifacts
+COPY --from=builder /workspace/dist/apps/blog-ssg /srv/dist/apps/blog-ssg
+
+# Cloud Run provides PORT env. Angular SSR server must bind to this port.
+ENV PORT=8080
+EXPOSE 8080
+
+# Adjust path to the server entry if your project differs.
+CMD ["node", "dist/apps/blog-ssg/server/server.mjs"]
diff --git a/angular.json b/angular.json
index 1ad5041..0a8a2ee 100755
--- a/angular.json
+++ b/angular.json
@@ -3,49 +3,140 @@
   "version": 1,
   "newProjectRoot": "projects",
   "projects": {
-    "angularblogapp": {
+    "admin": {
       "projectType": "application",
       "schematics": {
         "@schematics/angular:component": {
-          "style": "scss"
+          "style": "scss",
+          "changeDetection": "OnPush",
+          "displayBlock": true
         }
       },
-      "root": "",
-      "sourceRoot": "src",
-      "prefix": "app",
+      "root": "projects/admin",
+      "sourceRoot": "projects/admin/src",
+      "prefix": "admin",
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:application",
+          "builder": "@angular/build:application",
           "options": {
-            "outputPath": "dist/angular-blog-app",
-            "index": "src/index.html",
-            "browser": "src/main.ts",
-            "allowedCommonJsDependencies": [
-              "highlight.js",
-              "whatwg-url",
-              "@supabase/node-fetch"
+            "browser": "projects/admin/src/main.ts",
+            "tsConfig": "projects/admin/tsconfig.app.json",
+            "inlineStyleLanguage": "scss",
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "projects/admin/public"
+              }
+            ],
+            "styles": [
+              "projects/admin/src/styles.scss"
+            ]
+          },
+          "configurations": {
+            "production": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "500kB",
+                  "maximumError": "1MB"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "4kB",
+                  "maximumError": "8kB"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular/build:dev-server",
+          "configurations": {
+            "production": {
+              "buildTarget": "admin:build:production"
+            },
+            "development": {
+              "buildTarget": "admin:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "extract-i18n": {
+          "builder": "@angular/build:extract-i18n"
+        },
+        "test": {
+          "builder": "@angular/build:karma",
+          "options": {
+            "tsConfig": "projects/admin/tsconfig.spec.json",
+            "inlineStyleLanguage": "scss",
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "projects/admin/public"
+              }
+            ],
+            "styles": [
+              "projects/admin/src/styles.scss"
+            ]
+          }
+        },
+        "lint": {
+          "builder": "@angular-eslint/builder:lint",
+          "options": {
+            "lintFilePatterns": [
+              "projects/admin/**/*.ts",
+              "projects/admin/**/*.html"
             ],
+            "eslintConfig": "projects/admin/eslint.config.js"
+          }
+        }
+      }
+    },
+    "web": {
+      "projectType": "application",
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss",
+          "changeDetection": "OnPush",
+          "displayBlock": true
+        }
+      },
+      "root": "projects/web",
+      "sourceRoot": "projects/web/src",
+      "prefix": "web",
+      "architect": {
+        "build": {
+          "builder": "@angular/build:application",
+          "options": {
+            "browser": "projects/web/src/main.ts",
             "polyfills": [
               "zone.js"
             ],
-            "tsConfig": "tsconfig.app.json",
+            "tsConfig": "projects/web/tsconfig.app.json",
             "inlineStyleLanguage": "scss",
             "assets": [
               {
-                "glob": "**/**",
-                "input": "public"
+                "glob": "**/*",
+                "input": "projects/web/public"
               }
             ],
             "styles": [
-              "src/styles.scss"
+              "projects/web/src/styles.scss"
             ],
-            "scripts": [],
-            "server": "src/main.server.ts",
+            "server": "projects/web/src/main.server.ts",
+            "outputMode": "server",
+            "ssr": {
+              "entry": "projects/web/src/server.ts"
+            },
             "prerender": {
               "routesFile": "routes.txt"
-            },
-            "ssr": {
-              "entry": "server.ts"
             }
           },
           "configurations": {
@@ -58,8 +149,8 @@
                 },
                 {
                   "type": "anyComponentStyle",
-                  "maximumWarning": "2kB",
-                  "maximumError": "4kB"
+                  "maximumWarning": "4kB",
+                  "maximumError": "8kB"
                 }
               ],
               "outputHashing": "all"
@@ -67,79 +158,193 @@
             "development": {
               "optimization": false,
               "extractLicenses": false,
-              "sourceMap": true,
-              "fileReplacements": [
-                {
-                  "replace": "src/environments/environment.ts",
-                  "with": "src/environments/environment.development.ts"
-                }
-              ]
-            },
-            "local": {
-              "optimization": false,
-              "extractLicenses": false,
-              "sourceMap": true,
-              "fileReplacements": [
-                {
-                  "replace": "src/environments/environment.ts",
-                  "with": "src/environments/environment.local.ts"
-                }
-              ]
+              "sourceMap": true
             }
           },
           "defaultConfiguration": "production"
         },
         "serve": {
-          "builder": "@angular-devkit/build-angular:dev-server",
+          "builder": "@angular/build:dev-server",
           "configurations": {
             "production": {
-              "buildTarget": "angularblogapp:build:production"
+              "buildTarget": "web:build:production"
             },
             "development": {
-              "buildTarget": "angularblogapp:build:development"
+              "buildTarget": "web:build:development"
             },
             "local": {
-              "buildTarget": "angularblogapp:build:local"
+              "buildTarget": "web:build:development"
             }
           },
           "defaultConfiguration": "development"
         },
         "extract-i18n": {
-          "builder": "@angular-devkit/build-angular:extract-i18n"
+          "builder": "@angular/build:extract-i18n"
         },
         "test": {
-          "builder": "@angular-devkit/build-angular:karma",
+          "builder": "@angular/build:karma",
           "options": {
             "polyfills": [
               "zone.js",
               "zone.js/testing"
             ],
-            "tsConfig": "tsconfig.spec.json",
+            "tsConfig": "projects/web/tsconfig.spec.json",
             "inlineStyleLanguage": "scss",
             "assets": [
               {
                 "glob": "**/*",
-                "input": "public"
+                "input": "projects/web/public"
               }
             ],
             "styles": [
-              "src/styles.scss"
+              "projects/web/src/styles.scss"
+            ]
+          }
+        },
+        "lint": {
+          "builder": "@angular-eslint/builder:lint",
+          "options": {
+            "lintFilePatterns": [
+              "projects/web/**/*.ts",
+              "projects/web/**/*.html"
             ],
-            "scripts": []
+            "eslintConfig": "projects/web/eslint.config.js"
+          }
+        }
+      }
+    },
+    "shared": {
+      "projectType": "library",
+      "root": "projects/shared",
+      "sourceRoot": "projects/shared/src",
+      "prefix": "shared",
+      "architect": {
+        "build": {
+          "builder": "@angular/build:ng-packagr",
+          "configurations": {
+            "production": {
+              "tsConfig": "projects/shared/tsconfig.lib.prod.json"
+            },
+            "development": {
+              "tsConfig": "projects/shared/tsconfig.lib.json"
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "test": {
+          "builder": "@angular/build:karma",
+          "options": {
+            "tsConfig": "projects/shared/tsconfig.spec.json",
+            "polyfills": [
+              "zone.js",
+              "zone.js/testing"
+            ]
           }
         },
-        "e2e": {
-          "builder": "playwright-ng-schematics:playwright",
+        "lint": {
+          "builder": "@angular-eslint/builder:lint",
+          "options": {
+            "lintFilePatterns": [
+              "projects/shared/**/*.ts",
+              "projects/shared/**/*.html"
+            ],
+            "eslintConfig": "projects/shared/eslint.config.js"
+          }
+        }
+      }
+    },
+    "code-samples-mfe": {
+      "projectType": "application",
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss",
+          "changeDetection": "OnPush",
+          "displayBlock": true
+        }
+      },
+      "root": "projects/code-samples-mfe",
+      "sourceRoot": "projects/code-samples-mfe/src",
+      "prefix": "mfe",
+      "architect": {
+        "build": {
+          "builder": "@angular/build:application",
           "options": {
-            "devServerTarget": "angularblogapp:serve"
+            "browser": "projects/code-samples-mfe/src/main.ts",
+            "tsConfig": "projects/code-samples-mfe/tsconfig.app.json",
+            "inlineStyleLanguage": "scss",
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "projects/code-samples-mfe/public"
+              }
+            ],
+            "styles": [
+              "projects/code-samples-mfe/src/styles.scss"
+            ]
+          },
+          "configurations": {
+            "production": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "500kB",
+                  "maximumError": "1MB"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "4kB",
+                  "maximumError": "8kB"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true
+            }
           },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular/build:dev-server",
           "configurations": {
             "production": {
-              "devServerTarget": "angularblogapp:serve:production"
+              "buildTarget": "code-samples-mfe:build:production"
             },
-            "local": {
-              "devServerTarget": "angularblogapp:serve:local"
+            "development": {
+              "buildTarget": "code-samples-mfe:build:development"
             }
+          },
+          "defaultConfiguration": "development"
+        },
+        "extract-i18n": {
+          "builder": "@angular/build:extract-i18n"
+        },
+        "test": {
+          "builder": "@angular/build:karma",
+          "options": {
+            "tsConfig": "projects/code-samples-mfe/tsconfig.spec.json",
+            "inlineStyleLanguage": "scss",
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "projects/code-samples-mfe/public"
+              }
+            ],
+            "styles": [
+              "projects/code-samples-mfe/src/styles.scss"
+            ]
+          }
+        },
+        "lint": {
+          "builder": "@angular-eslint/builder:lint",
+          "options": {
+            "lintFilePatterns": [
+              "projects/code-samples-mfe/**/*.ts",
+              "projects/code-samples-mfe/**/*.html"
+            ],
+            "eslintConfig": "projects/code-samples-mfe/eslint.config.js"
           }
         }
       }
@@ -147,5 +352,31 @@
   },
   "cli": {
     "analytics": "f7fe95f7-84ab-47b5-8c91-01a9d9068465"
+  },
+  "schematics": {
+    "@schematics/angular:component": {
+      "type": "component"
+    },
+    "@schematics/angular:directive": {
+      "type": "directive"
+    },
+    "@schematics/angular:service": {
+      "type": "service"
+    },
+    "@schematics/angular:guard": {
+      "typeSeparator": "."
+    },
+    "@schematics/angular:interceptor": {
+      "typeSeparator": "."
+    },
+    "@schematics/angular:module": {
+      "typeSeparator": "."
+    },
+    "@schematics/angular:pipe": {
+      "typeSeparator": "."
+    },
+    "@schematics/angular:resolver": {
+      "typeSeparator": "."
+    }
   }
 }
diff --git a/docs/refactor-plan/config-phase.md b/docs/refactor-plan/config-phase.md
new file mode 100644
index 0000000..ac530b5
--- /dev/null
+++ b/docs/refactor-plan/config-phase.md
@@ -0,0 +1,637 @@
+# SAFE Workspace Configuration Refactor Plan
+
+**Phase**: Configuration Only (No Feature Moves)  
+**Status**: Proposal - Ready for Review  
+**Date**: 2025-01-18
+
+## Overview
+
+This is a concrete, minimal, and SAFE workspace configuration refactor plan focusing exclusively on workspace configuration improvements without touching any source code or moving features. The plan addresses TypeScript configurations, Angular workspace setup, ESLint boundaries, and tooling scripts to prepare for future feature migrations.
+
+## Rationale
+
+### A) TypeScript Configuration Issues
+• **Inconsistent Structure**: Current configs mix solution-style with project-specific patterns
+• **Missing Strict Flags**: `exactOptionalPropertyTypes`, `noUncheckedIndexedAccess` missing for Angular 20
+• **Limited Path Mappings**: Only basic `"shared"` mapping; need `@shared/*` sub-library aliases
+• **Base Config Duplication**: Each project extends root config causing duplication
+
+### B) Angular Workspace & Rendering Issues
+• **SSR/SSG Hybrid Missing**: Web project needs proper hybrid rendering configuration
+• **CSR Confirmation Needed**: Admin project should explicitly be CSR-only
+• **Native Federation Gap**: Code-samples-mfe needs micro-frontend scaffold
+• **Legacy Coexistence**: Current `/src` app needs to coexist during migration
+
+### C) ESLint & Boundaries Issues  
+• **Wrong Path Patterns**: Current config targets `apps/libs` but actual structure uses `projects/`
+• **Missing Angular 20 Rules**: No standalone/signals-first rules enforced
+• **Incomplete Boundaries**: Missing shared library sub-modules in boundary definitions
+
+### D) Tooling & Scripts Issues
+• **No Project Isolation**: Missing individual project commands for development
+• **Build Orchestration**: No coordinated build process for multi-project workspace
+• **Testing Gaps**: No project-specific test commands
+
+## Proposed Changes
+
+### 1. TypeScript Configuration Modernization
+
+**File: `tsconfig.json`**
+- Convert to solution-style configuration
+- Add project references for all workspace projects
+- Remove duplicated compiler options
+
+**File: `tsconfig.base.json` (NEW)**  
+- Central base configuration for all projects
+- Add missing Angular 20 strict flags
+- Enhanced path mappings for `@shared/*` aliases
+
+### 2. Angular Workspace Configuration
+
+**File: `angular.json`**
+- **Web Project**: Add hybrid SSR/SSG configuration with prerender routes
+- **Code-samples-mfe**: Add custom webpack config for Native Federation support
+- **Asset Management**: Proper federation manifest handling
+
+### 3. ESLint & Architectural Boundaries
+
+**File: `eslintrc.cjs`**  
+- Fix boundary patterns to match actual `projects/` structure
+- Add Angular 20 specific rules (`prefer-standalone`, `prefer-signals`)
+- Enhanced shared library boundaries for sub-modules
+- Template rules for control flow and self-closing tags
+
+### 4. Package.json Scripts Enhancement
+
+**File: `package.json`**
+- **PNPM Setup**: Add preinstall hook for package manager enforcement
+- **Project-Specific Commands**: Individual serve/build/test commands per project
+- **Build Orchestration**: Coordinated build process with dependencies
+- **Development Workflow**: Enhanced local development commands
+
+### 5. Native Federation Scaffold
+
+**File: `projects/web/webpack.config.js` (NEW)**
+- Shell application configuration
+- Remote micro-frontend consumption setup
+- Shared dependency configuration
+
+**File: `projects/code-samples-mfe/webpack.config.js` (NEW)**  
+- Micro-frontend exposition configuration
+- Module federation setup for code samples
+
+## Detailed Configuration Changes
+
+### TypeScript Base Configuration
+
+```diff
+--- /dev/null
++++ b/tsconfig.base.json
+@@ -0,0 +1,42 @@
++{
++  "compileOnSave": false,
++  "compilerOptions": {
++    "outDir": "./dist/out-tsc",
++    "strict": true,
++    "exactOptionalPropertyTypes": true,
++    "noUncheckedIndexedAccess": true,
++    "noImplicitOverride": true,
++    "noPropertyAccessFromIndexSignature": true,
++    "noImplicitReturns": true,
++    "noFallthroughCasesInSwitch": true,
++    "skipLibCheck": true,
++    "esModuleInterop": true,
++    "allowSyntheticDefaultImports": true,
++    "sourceMap": true,
++    "declaration": false,
++    "experimentalDecorators": true,
++    "moduleResolution": "bundler",
++    "paths": {
++      "shared": ["./dist/shared"],
++      "@shared/ui": ["./projects/shared/src/ui"],
++      "@shared/pattern": ["./projects/shared/src/pattern"],
++      "@shared/data-access": ["./projects/shared/src/data-access"],
++      "@shared/models": ["./projects/shared/src/models"],
++      "@shared/utils": ["./projects/shared/src/utils"]
++    },
++    "importHelpers": true,
++    "target": "ES2022",
++    "module": "ES2022",
++    "useDefineForClassFields": false,
++    "lib": [
++      "ES2022",
++      "dom"
++    ]
++  },
++  "angularCompilerOptions": {
++    "enableI18nLegacyMessageIdFormat": false,
++    "strictInjectionParameters": true,
++    "strictInputAccessModifiers": true,
++    "strictTemplates": true
++  }
++}
+```
+
+### Solution-Style Root Configuration
+
+```diff
+--- a/tsconfig.json
++++ b/tsconfig.json
+@@ -1,8 +1,5 @@
+-/* To learn more about this file see: https://angular.io/config/tsconfig. */
+ {
+   "compileOnSave": false,
+-  "compilerOptions": {
+-    "outDir": "./dist/out-tsc",
++  "extends": "./tsconfig.base.json",
++  "files": [],
++  "references": [
++    { "path": "./projects/admin/tsconfig.app.json" },
++    { "path": "./projects/admin/tsconfig.spec.json" },
++    { "path": "./projects/web/tsconfig.app.json" },
++    { "path": "./projects/web/tsconfig.spec.json" },
++    { "path": "./projects/shared/tsconfig.lib.json" },
++    { "path": "./projects/shared/tsconfig.spec.json" },
++    { "path": "./projects/code-samples-mfe/tsconfig.app.json" },
++    { "path": "./projects/code-samples-mfe/tsconfig.spec.json" },
++    { "path": "./tsconfig.app.json" },
++    { "path": "./tsconfig.spec.json" }
++  ]
++}
+```
+
+### Angular Workspace Hybrid Rendering
+
+```diff
+--- a/angular.json
++++ b/angular.json
+@@ -256,8 +256,15 @@
+             "styles": [
+               "projects/web/src/styles.scss"
+             ],
++            "scripts": [],
+             "server": "projects/web/src/main.server.ts",
+-            "outputMode": "server",
++            "prerender": {
++              "routesFile": "projects/web/routes.txt"
++            },
+             "ssr": {
+               "entry": "projects/web/src/server.ts"
+             }
+@@ -371,7 +378,12 @@
+             "browser": "projects/code-samples-mfe/src/main.ts",
+             "tsConfig": "projects/code-samples-mfe/tsconfig.app.json",
+             "inlineStyleLanguage": "scss",
++            "customWebpackConfig": {
++              "path": "projects/code-samples-mfe/webpack.config.js"
++            },
+             "assets": [
++              {
++                "glob": "mf.manifest.json",
++                "input": "projects/code-samples-mfe/src",
++                "output": "./"
++              },
+               {
+                 "glob": "**/*",
+                 "input": "projects/code-samples-mfe/public"
+```
+
+### ESLint Boundary Corrections
+
+```diff
+--- a/eslintrc.cjs
++++ b/eslintrc.cjs
+@@ -15,6 +15,7 @@ module.exports = {
+       },
+       extends: [
+         'plugin:@angular-eslint/recommended',
++        'plugin:@angular-eslint/template/process-inline-templates',
+       ],
+       plugins: ['boundaries'],
+       settings: {
+         'boundaries/elements': [
+           // ---- Shared libs ----
+-          { type: 'shared-ui', pattern: 'libs/shared/ui/**' },
+-          { type: 'shared-pattern', pattern: 'libs/shared/pattern/**' },
+-          { type: 'shared-data', pattern: 'libs/shared/data-access/**' },
++          { type: 'shared-ui', pattern: 'projects/shared/src/ui/**' },
++          { type: 'shared-pattern', pattern: 'projects/shared/src/pattern/**' },
++          { type: 'shared-data', pattern: 'projects/shared/src/data-access/**' },
++          { type: 'shared-models', pattern: 'projects/shared/src/models/**' },
++          { type: 'shared-utils', pattern: 'projects/shared/src/utils/**' },
+ 
+-          // ---- Apps: blog-ssg ----
+-          { type: 'blog-core', pattern: 'apps/blog-ssg/src/app/core/**' },
+-          { type: 'blog-layout', pattern: 'apps/blog-ssg/src/app/layout/**' },
+-          { type: 'blog-ui', pattern: 'apps/blog-ssg/src/app/ui/**' },
+-          { type: 'blog-pattern', pattern: 'apps/blog-ssg/src/app/pattern/**' },
+-          { type: 'blog-data', pattern: 'apps/blog-ssg/src/app/data-access/**' },
+-          { type: 'blog-feature', pattern: 'apps/blog-ssg/src/app/feature/**' },
++          // ---- Apps: web ----
++          { type: 'web-core', pattern: 'projects/web/src/app/core/**' },
++          { type: 'web-layout', pattern: 'projects/web/src/app/layout/**' },
++          { type: 'web-ui', pattern: 'projects/web/src/app/ui/**' },
++          { type: 'web-pattern', pattern: 'projects/web/src/app/pattern/**' },
++          { type: 'web-feature', pattern: 'projects/web/src/app/features/**' },
+ 
+-          // ---- Apps: admin-spa ----
+-          { type: 'admin-core', pattern: 'apps/admin-spa/src/app/core/**' },
+-          { type: 'admin-layout', pattern: 'apps/admin-spa/src/app/layout/**' },
+-          { type: 'admin-ui', pattern: 'apps/admin-spa/src/app/ui/**' },
+-          { type: 'admin-pattern', pattern: 'apps/admin-spa/src/app/pattern/**' },
+-          { type: 'admin-data', pattern: 'apps/admin-spa/src/app/data-access/**' },
+-          { type: 'admin-feature', pattern: 'apps/admin-spa/src/app/feature/**' },
++          // ---- Apps: admin ----
++          { type: 'admin-core', pattern: 'projects/admin/src/app/core/**' },
++          { type: 'admin-layout', pattern: 'projects/admin/src/app/layout/**' },
++          { type: 'admin-ui', pattern: 'projects/admin/src/app/ui/**' },
++          { type: 'admin-pattern', pattern: 'projects/admin/src/app/pattern/**' },
++          { type: 'admin-feature', pattern: 'projects/admin/src/app/features/**' },
+ 
+-          // ---- Apps: code-samples-mfe ----
+-          { type: 'samples-core', pattern: 'apps/code-samples-mfe/src/app/core/**' },
+-          { type: 'samples-layout', pattern: 'apps/code-samples-mfe/src/app/layout/**' },
+-          { type: 'samples-ui', pattern: 'apps/code-samples-mfe/src/app/ui/**' },
+-          { type: 'samples-pattern', pattern: 'apps/code-samples-mfe/src/app/pattern/**' },
+-          { type: 'samples-data', pattern: 'apps/code-samples-mfe/src/app/data-access/**' },
+-          { type: 'samples-feature', pattern: 'apps/code-samples-mfe/src/app/feature/**' }
++          // ---- Apps: code-samples-mfe ----
++          { type: 'mfe-core', pattern: 'projects/code-samples-mfe/src/app/core/**' },
++          { type: 'mfe-ui', pattern: 'projects/code-samples-mfe/src/app/ui/**' },
++          { type: 'mfe-feature', pattern: 'projects/code-samples-mfe/src/app/features/**' }
+         ],
+       },
+       rules: {
+         // Prevent unknown files from bypassing the rules
+-        'boundaries/no-unknown-files': 'error',
++        'boundaries/no-unknown-files': 'warn',
+ 
+         // Forbid private imports across elements
+         'boundaries/no-private': 'error',
++
++        // Angular 20 specific rules
++        '@angular-eslint/prefer-standalone': 'error',
++        '@angular-eslint/prefer-signals': 'warn',
+ 
+         // Allowed import graph
+         'boundaries/allowed-types': ['error', [
+           // Shared layers
+           { from: ['shared-ui'], allow: [] },
+-          { from: ['shared-pattern'], allow: ['shared-ui'] },
++          { from: ['shared-pattern'], allow: ['shared-ui', 'shared-models', 'shared-utils'] },
+           { from: ['shared-data'], allow: [] },
++          { from: ['shared-models'], allow: [] },
++          { from: ['shared-utils'], allow: [] },
+ 
+-          // blog-ssg
+-          { from: ['blog-core'], allow: ['shared-data'] },
+-          { from: ['blog-layout'], allow: ['blog-core', 'shared-ui', 'shared-pattern'] },
+-          { from: ['blog-ui'], allow: ['shared-ui'] },
+-          { from: ['blog-pattern'], allow: ['shared-ui', 'shared-pattern', 'shared-data'] },
+-          { from: ['blog-data'], allow: ['shared-data'] },
+-          { from: ['blog-feature'], allow: ['blog-core', 'blog-layout', 'blog-ui', 'blog-pattern', 'blog-data', 'shared-ui', 'shared-pattern', 'shared-data'] },
++          // web app
++          { from: ['web-core'], allow: ['shared-data', 'shared-models', 'shared-utils'] },
++          { from: ['web-layout'], allow: ['web-core', 'shared-ui', 'shared-pattern', 'shared-models'] },
++          { from: ['web-ui'], allow: ['shared-ui', 'shared-models'] },
++          { from: ['web-pattern'], allow: ['shared-ui', 'shared-pattern', 'shared-data', 'shared-models', 'shared-utils'] },
++          { from: ['web-feature'], allow: ['web-core', 'web-layout', 'web-ui', 'web-pattern', 'shared-ui', 'shared-pattern', 'shared-data', 'shared-models', 'shared-utils'] },
+ 
+           // admin-spa
+-          { from: ['admin-core'], allow: ['shared-data'] },
+-          { from: ['admin-layout'], allow: ['admin-core', 'shared-ui', 'shared-pattern'] },
+-          { from: ['admin-ui'], allow: ['shared-ui'] },
+-          { from: ['admin-pattern'], allow: ['shared-ui', 'shared-pattern', 'shared-data'] },
+-          { from: ['admin-data'], allow: ['shared-data'] },
+-          { from: ['admin-feature'], allow: ['admin-core', 'admin-layout', 'admin-ui', 'admin-pattern', 'admin-data', 'shared-ui', 'shared-pattern', 'shared-data'] },
++          { from: ['admin-core'], allow: ['shared-data', 'shared-models', 'shared-utils'] },
++          { from: ['admin-layout'], allow: ['admin-core', 'shared-ui', 'shared-pattern', 'shared-models'] },
++          { from: ['admin-ui'], allow: ['shared-ui', 'shared-models'] },
++          { from: ['admin-pattern'], allow: ['shared-ui', 'shared-pattern', 'shared-data', 'shared-models', 'shared-utils'] },
++          { from: ['admin-feature'], allow: ['admin-core', 'admin-layout', 'admin-ui', 'admin-pattern', 'shared-ui', 'shared-pattern', 'shared-data', 'shared-models', 'shared-utils'] },
+ 
+-          // samples-mfe
+-          { from: ['samples-core'], allow: ['shared-data'] },
+-          { from: ['samples-layout'], allow: ['samples-core', 'shared-ui', 'shared-pattern'] },
+-          { from: ['samples-ui'], allow: ['shared-ui'] },
+-          { from: ['samples-pattern'], allow: ['shared-ui', 'shared-pattern', 'shared-data'] },
+-          { from: ['samples-data'], allow: ['shared-data'] },
+-          { from: ['samples-feature'], allow: ['samples-core', 'samples-layout', 'samples-ui', 'samples-pattern', 'samples-data', 'shared-ui', 'shared-pattern', 'shared-data'] }
++          // code-samples-mfe
++          { from: ['mfe-core'], allow: ['shared-data', 'shared-models', 'shared-utils'] },
++          { from: ['mfe-ui'], allow: ['shared-ui', 'shared-models'] },
++          { from: ['mfe-feature'], allow: ['mfe-core', 'mfe-ui', 'shared-ui', 'shared-pattern', 'shared-data', 'shared-models', 'shared-utils'] }
+         ]],
+ 
+         // Enforce public APIs (optional): only import from directories' public entry points
+-        // 'boundaries/entry-point': ['error', [{ target: 'always', from: ['shared-ui', 'shared-pattern', 'shared-data'] }]]
++        'boundaries/entry-point': ['warn', [{ target: 'always', from: ['shared-ui', 'shared-pattern', 'shared-data', 'shared-models', 'shared-utils'] }]]
+       },
+     },
++    {
++      files: ['*.html'],
++      extends: ['plugin:@angular-eslint/template/recommended'],
++      rules: {
++        '@angular-eslint/template/prefer-control-flow': 'error',
++        '@angular-eslint/template/prefer-self-closing-tags': 'error'
++      }
++    }
+   ]
+ };
+```
+
+### Enhanced Package.json Scripts
+
+```diff
+--- a/package.json
++++ b/package.json
+@@ -2,6 +2,7 @@
+   "name": "angular-blog-app",
+   "version": "0.0.0",
+   "scripts": {
++    "preinstall": "npx only-allow pnpm",
+     "ng": "ng",
+     "start": "ng serve",
++    "start:web": "ng serve web",
++    "start:admin": "ng serve admin",
++    "start:mfe": "ng serve code-samples-mfe",
+     "build": "ng build",
++    "build:web": "ng build web",
++    "build:admin": "ng build admin", 
++    "build:mfe": "ng build code-samples-mfe",
++    "build:shared": "ng build shared",
++    "build:all": "pnpm build:shared && pnpm build:web && pnpm build:admin && pnpm build:mfe",
+     "watch": "ng build --watch --configuration development",
++    "watch:web": "ng build web --watch --configuration development",
++    "watch:admin": "ng build admin --watch --configuration development",
++    "watch:mfe": "ng build code-samples-mfe --watch --configuration development",
+     "test": "ng test",
++    "test:web": "ng test web",
++    "test:admin": "ng test admin",
++    "test:mfe": "ng test code-samples-mfe",
++    "test:shared": "ng test shared",
++    "lint": "ng lint",
++    "lint:fix": "ng lint --fix",
+     "serve:ssr:AngularBlogApp": "node dist/angular-blog-app/server/server.mjs",
++    "serve:ssr:web": "node dist/web/server/server.mjs",
+     "build:stats": "ng build --stats-json",
++    "build:web:stats": "ng build web --stats-json",
+     "analyze": "webpack-bundle-analyzer dist/angular-blog-app/stats.json",
++    "analyze:web": "webpack-bundle-analyzer dist/web/stats.json",
+     "start:local": "ng serve --configuration=local",
++    "start:web:local": "ng serve web --configuration=local",
+     "start:local:docker": "open -a Docker",
+     "start:local:backend": "npx supabase start",
+     "schema:pull": "find supabase/migrations -name '*_remote_schema.sql' -delete && supabase db pull --db-url $PG_EXPORT_URL",
+     "db:createSeed": "scripts/create-seed.sh",
+     "db:seed": "npx @snaplet/seed init",
+     "users:passwords": "scripts/set-passwords.sh",
+     "e2e": "ng e2e",
+     "e2e:local": "ng e2e -c local",
+-    "serve:ssr:web": "node dist/web/server/server.mjs"
++    "e2e:web": "ng e2e web",
++    "e2e:admin": "ng e2e admin"
+   },
+   "private": true,
+   "dependencies": {
+@@ -51,6 +77,7 @@
+   "devDependencies": {
+     "@angular/build": "^20.1.6",
+     "@angular/cli": "^20.1.6",
+     "@angular/compiler-cli": "^20.1.7",
++    "@angular-eslint/eslint-plugin": "^18.0.0",
++    "eslint-plugin-boundaries": "^4.0.0",
+     "@playwright/test": "^1.53.0",
+     "@snaplet/copycat": "^6.0.0",
+```
+
+### Native Federation Configuration
+
+**Shell Application (Web) - `projects/web/webpack.config.js`**
+
+```javascript
+const ModuleFederationPlugin = require('@module-federation/enhanced/webpack');
+
+module.exports = {
+  plugins: [
+    new ModuleFederationPlugin({
+      name: 'shell',
+      filename: 'remoteEntry.js',
+      remotes: {
+        'code-samples-mfe': 'http://localhost:4201/remoteEntry.js'
+      },
+      shared: {
+        '@angular/core': { singleton: true, strictVersion: true },
+        '@angular/common': { singleton: true, strictVersion: true },
+        '@angular/router': { singleton: true, strictVersion: true },
+        'rxjs': { singleton: true, strictVersion: true }
+      }
+    })
+  ]
+};
+```
+
+**Micro-frontend (Code Samples) - `projects/code-samples-mfe/webpack.config.js`**
+
+```javascript
+const ModuleFederationPlugin = require('@module-federation/enhanced/webpack');
+
+module.exports = {
+  plugins: [
+    new ModuleFederationPlugin({
+      name: 'codeSamplesMfe',
+      filename: 'remoteEntry.js',
+      exposes: {
+        './CodeSamplesModule': './src/app/features/code-samples/code-samples.module.ts'
+      },
+      shared: {
+        '@angular/core': { singleton: true, strictVersion: true },
+        '@angular/common': { singleton: true, strictVersion: true },
+        '@angular/router': { singleton: true, strictVersion: true },
+        'rxjs': { singleton: true, strictVersion: true }
+      }
+    })
+  ]
+};
+```
+
+## Implementation Order
+
+### Phase 1: TypeScript Foundation
+1. Create `tsconfig.base.json`
+2. Update `tsconfig.json` to solution-style
+3. Verify compilation with `ng build`
+
+### Phase 2: Angular Workspace
+1. Update `angular.json` with SSR/SSG and webpack configs
+2. Test project builds individually
+3. Verify dev servers start correctly
+
+### Phase 3: ESLint Boundaries  
+1. Update `eslintrc.cjs` with correct patterns
+2. Run lint to identify boundary violations
+3. Address any immediate issues
+
+### Phase 4: Package Scripts
+1. Add project-specific scripts to `package.json`
+2. Install missing dependencies
+3. Test new script commands
+
+### Phase 5: Native Federation
+1. Add webpack config files
+2. Install Module Federation dependencies
+3. Test federation setup with minimal examples
+
+## Verification Checklist
+
+### TypeScript Compilation
+```bash
+pnpm build:shared               # Should succeed
+pnpm build:web                  # Should succeed with SSR
+pnpm build:admin                # Should succeed CSR-only
+pnpm build:mfe                  # Should succeed with webpack config
+```
+
+### Development Servers
+```bash
+pnpm start:web                  # Should serve on :4200 with SSR
+pnpm start:admin                # Should serve on :4201 CSR-only
+pnpm start:mfe                  # Should serve on :4202 with federation
+```
+
+### Linting
+```bash
+pnpm lint                       # Should pass with new boundary rules
+pnpm lint:fix                   # Should auto-fix minor issues
+```
+
+### Path Mappings
+```bash
+# In any project file: import { Something } from '@shared/ui'
+# Should resolve without TypeScript errors
+```
+
+### Angular CLI Recognition
+```bash
+ng serve web                    # Should work
+ng build admin                  # Should work  
+ng test shared                  # Should work
+ng lint                         # Should enforce boundaries
+```
+
+### Federation Testing
+```bash
+# Start both applications
+pnpm start:web                  # Shell app on :4200
+pnpm start:mfe                  # Remote MFE on :4201
+
+# Verify federation manifest files are generated
+ls projects/code-samples-mfe/dist/mf.manifest.json
+```
+
+## Risks and Mitigation
+
+### High Risk Items
+1. **TypeScript Path Changes** - Might break existing imports temporarily
+   - **Mitigation**: Apply changes incrementally, test compilation after each step
+
+2. **Native Federation Dependencies** - New webpack config might conflict
+   - **Mitigation**: Use `customWebpackConfig` option, preserve existing configs
+
+3. **ESLint Boundary Violations** - Existing code might violate new rules
+   - **Mitigation**: Set violations to 'warn' initially, fix gradually
+
+### Medium Risk Items
+1. **Package Manager Switch** - PNPM enforcement might cause issues
+   - **Mitigation**: Optional preinstall hook, can be disabled
+
+2. **Build Process Changes** - New scripts might not work as expected
+   - **Mitigation**: Keep original scripts as fallback
+
+### Low Risk Items
+1. **Development Server Ports** - Port conflicts with existing services
+   - **Mitigation**: Use standard Angular CLI ports, configurable
+
+## Rollback Strategy
+
+### Emergency Rollback
+```bash
+git stash                       # Save current changes
+git reset --hard HEAD~1         # Return to previous commit
+```
+
+### Incremental Rollback
+
+**TypeScript Changes**
+```bash
+# Remove tsconfig.base.json
+rm tsconfig.base.json
+# Restore original tsconfig.json from git
+git checkout HEAD~1 -- tsconfig.json
+```
+
+**Angular.json Changes**
+```bash
+# Restore specific sections
+git checkout HEAD~1 -- angular.json
+```
+
+**ESLint Changes**
+```bash
+# Restore original patterns
+git checkout HEAD~1 -- eslintrc.cjs
+```
+
+**Package.json Changes**
+```bash
+# Restore original scripts section
+git checkout HEAD~1 -- package.json
+npm install  # or pnpm install
+```
+
+### Dependency Issues
+```bash
+# Remove new dependencies
+pnpm remove @angular-eslint/eslint-plugin eslint-plugin-boundaries
+# Reinstall original dependencies
+pnpm install
+```
+
+## Post-Implementation Tasks
+
+### Immediate (Day 1)
+- [ ] Run full verification checklist
+- [ ] Update team documentation
+- [ ] Create quick reference for new commands
+
+### Short Term (Week 1)
+- [ ] Monitor build performance impact
+- [ ] Address any ESLint boundary violations
+- [ ] Train team on new development workflow
+
+### Medium Term (Month 1)  
+- [ ] Optimize build configurations
+- [ ] Add more comprehensive Native Federation examples
+- [ ] Plan next phase: feature migrations
+
+## Success Criteria
+
+✅ **All existing functionality preserved**  
+✅ **No source code changes required**  
+✅ **Improved development workflow with project isolation**  
+✅ **Foundation ready for feature migrations**  
+✅ **Clear path mapping strategy established**  
+✅ **Architectural boundaries enforced via tooling**  
+✅ **Native Federation infrastructure in place**
+
+## Next Phase Preparation
+
+This configuration refactor prepares for the next phase:
+- **Feature Migration Phase**: Moving features from `/src` to appropriate projects
+- **Shared Library Population**: Creating actual shared components and services
+- **Native Federation Implementation**: Actual micro-frontend integration
+- **SSR/SSG Optimization**: Performance tuning for hybrid rendering
+
+---
+
+**Ready for Review**: This plan can be implemented incrementally with clear rollback options at each step.
\ No newline at end of file
diff --git a/e2e/admin/admin.spec.ts b/e2e/admin/admin.spec.ts
new file mode 100644
index 0000000..86c775c
--- /dev/null
+++ b/e2e/admin/admin.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test';
+
+test.describe('Admin Application', () => {
+  test('admin app loads', async ({ page }) => {
+    await page.goto('/');
+    await expect(page).toHaveTitle(/Admin/);
+  });
+
+  test('displays admin dashboard', async ({ page }) => {
+    await page.goto('/');
+    await expect(page.getByText('Admin')).toBeVisible();
+  });
+});
\ No newline at end of file
diff --git a/e2e/example.spec.ts b/e2e/example.spec.ts
deleted file mode 100644
index ef49468..0000000
--- a/e2e/example.spec.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { test, expect } from '@playwright/test';
-import { acceptCookies } from './helpers/cookie-consent.helper';
-
-test('has title', async ({ page }) => {
-  await page.goto('/');
-
-  // Handle cookie consent using helper
-  await acceptCookies(page);
-
-  // Expect a title "to contain" a substring.
-  await expect(page).toHaveTitle(/AngularBlogApp/);
-});
diff --git a/e2e/tags.spec.ts b/e2e/web/tags.spec.ts
similarity index 62%
rename from e2e/tags.spec.ts
rename to e2e/web/tags.spec.ts
index 3593065..91ebde6 100644
--- a/e2e/tags.spec.ts
+++ b/e2e/web/tags.spec.ts
@@ -1,6 +1,6 @@
 import { test, expect } from '@playwright/test';
-import { acceptCookies } from './helpers/cookie-consent.helper';
-import { waitForAngularToLoad, waitForApiCall } from './helpers/debug.helper';
+import { acceptCookies } from '../helpers/cookie-consent.helper';
+import { waitForAngularToLoad, waitForApiCall } from '../helpers/debug.helper';
 
 test.describe('Tags Display and API', () => {
   test('should display tags and verify API call', async ({ page }) => {
@@ -11,13 +11,9 @@ test.describe('Tags Display and API', () => {
       status?: number;
     }> = [];
 
-    page.on('request', (request) => {
+    page.on('request', request => {
       const url = request.url();
-      if (
-        url.includes('/rest/v1/tags') ||
-        url.includes('supabase') ||
-        url.includes('tag')
-      ) {
+      if (url.includes('/rest/v1/tags') || url.includes('supabase') || url.includes('tag')) {
         apiRequests.push({
           url,
           method: request.method(),
@@ -26,10 +22,10 @@ test.describe('Tags Display and API', () => {
       }
     });
 
-    page.on('response', (response) => {
+    page.on('response', response => {
       const url = response.url();
       if (url.includes('/rest/v1/tags')) {
-        const existingRequest = apiRequests.find((req) => req.url === url);
+        const existingRequest = apiRequests.find(req => req.url === url);
         if (existingRequest) {
           existingRequest.status = response.status();
         }
@@ -37,20 +33,18 @@ test.describe('Tags Display and API', () => {
     });
 
     await page.goto('/', { waitUntil: 'networkidle' });
-    await acceptCookies(page);
-    await waitForAngularToLoad(page, 500);
-    await page.waitForSelector('[data-testid="tags-container"]', {
-      timeout: 500,
-    });
+    // await acceptCookies(page);
+    // await waitForAngularToLoad(page, 50);
+    // await page.getByTestId('tags-container')
 
     try {
-      await waitForApiCall(page, '/rest/v1/tags', 300);
+      await waitForApiCall(page, '/rest/v1/tags', 30);
     } catch (error) {
       // Continue test even if API call detection fails
     }
 
-    await page.waitForTimeout(1000);
-    await page.waitForSelector('[data-testid="tag-item"]', { timeout: 500 });
+    // await page.waitForTimeout(100);
+    // await page.waitForSelector('[data-testid="tag-item"]', { timeout: 500 });
 
     const tagsContainer = page.locator('[data-testid="tags-container"]');
     await expect(tagsContainer).toBeVisible();
@@ -62,9 +56,7 @@ test.describe('Tags Display and API', () => {
     ];
 
     for (const tag of expectedTags) {
-      const tagItem = page.locator(
-        `[data-testid="tag-item"][data-tag-name="${tag.name}"]`,
-      );
+      const tagItem = page.locator(`[data-testid="tag-item"][data-tag-name="${tag.name}"]`);
       await expect(tagItem).toBeVisible();
 
       const tagName = tagItem.locator('[data-testid="tag-name"]');
diff --git a/src/environments/environment.development.ts b/environments/environment.development.ts
similarity index 100%
rename from src/environments/environment.development.ts
rename to environments/environment.development.ts
diff --git a/src/environments/environment.local.ts b/environments/environment.local.ts
similarity index 100%
rename from src/environments/environment.local.ts
rename to environments/environment.local.ts
diff --git a/src/environments/environment.ts b/environments/environment.ts
similarity index 100%
rename from src/environments/environment.ts
rename to environments/environment.ts
diff --git a/eslint.config.js b/eslint.config.js
new file mode 100644
index 0000000..7688934
--- /dev/null
+++ b/eslint.config.js
@@ -0,0 +1,302 @@
+// @ts-check
+const eslint = require('@eslint/js');
+const tseslint = require('typescript-eslint');
+const angular = require('angular-eslint');
+const boundaries = require('eslint-plugin-boundaries');
+const importPlugin = require('eslint-plugin-import');
+
+module.exports = tseslint.config(
+  {
+    ignores: [
+      'dist/**',
+      'node_modules/**',
+      'coverage/**',
+      '.angular/**',
+      'src/**',
+      '**/*.spec.ts',
+      '**/e2e/**',
+      '**/*.generated.ts',
+      '**/*.d.ts',
+      '!**/*.spec.d.ts',
+      '*.config.js',
+      '*.config.ts',
+    ],
+  },
+  {
+    files: ['**/*.ts'],
+    extends: [
+      eslint.configs.recommended,
+      ...tseslint.configs.recommended,
+      ...tseslint.configs.stylistic,
+      ...angular.configs.tsRecommended,
+    ],
+    processor: angular.processInlineTemplates,
+    plugins: {
+      boundaries,
+      import: importPlugin,
+    },
+    settings: {
+      'import/resolver': {
+        typescript: {
+          alwaysTryTypes: true,
+          project: ['tsconfig.json', 'projects/*/tsconfig*.json'],
+        },
+      },
+      'boundaries/dependency-nodes': ['import', 'dynamic-import'],
+      'boundaries/elements': [
+        { type: 'shared-lib', pattern: 'projects/shared/src/lib/**' },
+        { type: 'shared-ui', pattern: 'projects/shared/src/ui/**' },
+        { type: 'shared-pattern', pattern: 'projects/shared/src/pattern/**' },
+        { type: 'shared-services', pattern: 'projects/shared/src/services/**' },
+        { type: 'shared-data-access', pattern: 'projects/shared/src/data-access/**' },
+        { type: 'shared-models', pattern: 'shared/models' },
+        { type: 'shared-utils', pattern: 'shared/utils' },
+        { type: 'shared-public-api', mode: 'file', pattern: 'projects/shared/src/public-api.ts' },
+        { type: 'shared-external', mode: 'file', pattern: 'shared' },
+        { type: 'web-main', mode: 'file', pattern: 'projects/web/src/main.ts' },
+        { type: 'web-main-server', mode: 'file', pattern: 'projects/web/src/main.server.ts' },
+        { type: 'web-server', mode: 'file', pattern: 'projects/web/src/server.ts' },
+        { type: 'web-app', mode: 'file', pattern: 'projects/web/src/app/app*.ts' },
+        { type: 'web-core', pattern: 'projects/web/src/app/core/**' },
+        { type: 'web-layout', pattern: 'projects/web/src/app/layout/**' },
+        { type: 'web-ui', pattern: 'projects/web/src/app/ui/**' },
+        { type: 'web-pattern', pattern: 'projects/web/src/app/pattern/**' },
+        {
+          type: 'web-feature-routes',
+          mode: 'file',
+          pattern: 'projects/web/src/app/features/*/*.routes.ts',
+          capture: ['feature'],
+        },
+        { type: 'web-feature', pattern: 'projects/web/src/app/features/**', capture: ['feature'] },
+        { type: 'admin-main', mode: 'file', pattern: 'projects/admin/src/main.ts' },
+        { type: 'admin-app', mode: 'file', pattern: 'projects/admin/src/app/app*.ts' },
+        { type: 'admin-core', pattern: 'projects/admin/src/app/core/**' },
+        { type: 'admin-layout', pattern: 'projects/admin/src/app/layout/**' },
+        { type: 'admin-ui', pattern: 'projects/admin/src/app/ui/**' },
+        { type: 'admin-pattern', pattern: 'projects/admin/src/app/pattern/**' },
+        {
+          type: 'admin-feature-routes',
+          mode: 'file',
+          pattern: 'projects/admin/src/app/features/*/*.routes.ts',
+          capture: ['feature'],
+        },
+        {
+          type: 'admin-feature',
+          pattern: 'projects/admin/src/app/features/**',
+          capture: ['feature'],
+        },
+        { type: 'mfe-main', mode: 'file', pattern: 'projects/code-samples-mfe/src/main.ts' },
+        { type: 'mfe-app', mode: 'file', pattern: 'projects/code-samples-mfe/src/app/app*.ts' },
+        { type: 'mfe-core', pattern: 'projects/code-samples-mfe/src/app/core/**' },
+        { type: 'mfe-ui', pattern: 'projects/code-samples-mfe/src/app/ui/**' },
+        {
+          type: 'mfe-feature-routes',
+          mode: 'file',
+          pattern: 'projects/code-samples-mfe/src/app/features/*/*.routes.ts',
+          capture: ['feature'],
+        },
+        {
+          type: 'mfe-feature',
+          pattern: 'projects/code-samples-mfe/src/app/features/**',
+          capture: ['feature'],
+        },
+        { type: 'environment', pattern: '**/environments/**' },
+      ],
+      'boundaries/ignore': ['**/*.spec.ts', '**/e2e/**', '**/*.config.*'],
+    },
+    rules: {
+      '@angular-eslint/prefer-standalone': 'error',
+      '@angular-eslint/prefer-signals': 'warn',
+      'import/order': [
+        'error',
+        {
+          groups: ['builtin', 'external', ['internal', 'parent', 'sibling', 'index']],
+          'newlines-between': 'never',
+        },
+      ],
+      'boundaries/no-unknown': 'error',
+      'boundaries/no-private': 'error',
+      'boundaries/no-unknown-files': 'error',
+      'boundaries/element-types': [
+        'error',
+        {
+          default: 'disallow',
+          rules: [
+            { from: 'shared-lib', allow: [] },
+            { from: 'shared-ui', allow: ['shared-models'] },
+            { from: 'shared-pattern', allow: ['shared-ui', 'shared-models', 'shared-utils'] },
+            { from: 'shared-services', allow: ['shared-models', 'shared-utils'] },
+            { from: 'shared-data-access', allow: ['shared-models'] },
+            { from: 'shared-models', allow: [] },
+            { from: 'shared-utils', allow: [] },
+            {
+              from: 'shared-public-api',
+              allow: [
+                'shared-lib',
+                'shared-ui',
+                'shared-pattern',
+                'shared-services',
+                'shared-data-access',
+                'shared-models',
+                'shared-utils',
+              ],
+            },
+            { from: 'shared-external', allow: [] },
+
+            { from: 'web-main', allow: ['web-app'] },
+            { from: 'web-main-server', allow: ['web-app'] },
+            { from: 'web-server', allow: ['web-app', 'shared-public-api'] },
+            {
+              from: 'web-app',
+              allow: [
+                'web-core',
+                'web-layout',
+                'web-feature-routes',
+                'web-feature',
+                'shared-public-api',
+              ],
+            },
+            { from: 'web-core', allow: ['shared-public-api', 'environment'] },
+            {
+              from: 'web-layout',
+              allow: ['web-core', 'shared-ui', 'shared-pattern', 'shared-public-api'],
+            },
+            { from: 'web-ui', allow: ['shared-ui', 'shared-models'] },
+            {
+              from: 'web-pattern',
+              allow: ['web-core', 'shared-ui', 'shared-pattern', 'shared-public-api'],
+            },
+            {
+              from: 'web-feature',
+              allow: ['web-core', 'web-ui', 'web-pattern', 'shared-public-api'],
+            },
+            { from: 'web-feature-routes', allow: ['web-core', 'web-pattern', 'web-feature'] },
+
+            { from: 'admin-main', allow: ['admin-app'] },
+            {
+              from: 'admin-app',
+              allow: ['admin-core', 'admin-layout', 'admin-feature-routes', 'shared-public-api'],
+            },
+            { from: 'admin-core', allow: ['shared-public-api', 'environment'] },
+            {
+              from: 'admin-layout',
+              allow: ['admin-core', 'shared-ui', 'shared-pattern', 'shared-public-api'],
+            },
+            { from: 'admin-ui', allow: ['shared-ui', 'shared-models'] },
+            {
+              from: 'admin-pattern',
+              allow: ['admin-core', 'shared-ui', 'shared-pattern', 'shared-public-api'],
+            },
+            {
+              from: 'admin-feature',
+              allow: ['admin-core', 'admin-ui', 'admin-pattern', 'shared-public-api'],
+            },
+            {
+              from: 'admin-feature-routes',
+              allow: ['admin-core', 'admin-pattern', 'admin-feature'],
+            },
+
+            { from: 'mfe-main', allow: ['mfe-app'] },
+            { from: 'mfe-app', allow: ['mfe-core', 'mfe-feature-routes', 'shared-public-api'] },
+            { from: 'mfe-core', allow: ['shared-public-api'] },
+            { from: 'mfe-ui', allow: ['shared-ui', 'shared-models'] },
+            { from: 'mfe-feature', allow: ['mfe-core', 'mfe-ui', 'shared-public-api'] },
+            { from: 'mfe-feature-routes', allow: ['mfe-core', 'mfe-feature'] },
+          ],
+        },
+      ],
+    },
+  },
+  {
+    files: ['**/*.html'],
+    extends: [...angular.configs.templateRecommended, ...angular.configs.templateAccessibility],
+    rules: {
+      '@angular-eslint/template/prefer-control-flow': 'error',
+      '@angular-eslint/template/prefer-self-closing-tags': 'error',
+    },
+  },
+  {
+    files: ['projects/web/src/**/*.ts'],
+    rules: {
+      '@angular-eslint/directive-selector': [
+        'error',
+        {
+          type: 'attribute',
+          prefix: ['web', 'shared'],
+          style: 'camelCase',
+        },
+      ],
+      '@angular-eslint/component-selector': [
+        'error',
+        {
+          type: 'element',
+          prefix: ['web', 'shared'],
+          style: 'kebab-case',
+        },
+      ],
+    },
+  },
+  {
+    files: ['projects/admin/src/**/*.ts'],
+    rules: {
+      '@angular-eslint/directive-selector': [
+        'error',
+        {
+          type: 'attribute',
+          prefix: ['admin', 'shared'],
+          style: 'camelCase',
+        },
+      ],
+      '@angular-eslint/component-selector': [
+        'error',
+        {
+          type: 'element',
+          prefix: ['admin', 'shared'],
+          style: 'kebab-case',
+        },
+      ],
+    },
+  },
+  {
+    files: ['projects/code-samples-mfe/src/**/*.ts'],
+    rules: {
+      '@angular-eslint/directive-selector': [
+        'error',
+        {
+          type: 'attribute',
+          prefix: ['mfe', 'shared'],
+          style: 'camelCase',
+        },
+      ],
+      '@angular-eslint/component-selector': [
+        'error',
+        {
+          type: 'element',
+          prefix: ['mfe', 'shared'],
+          style: 'kebab-case',
+        },
+      ],
+    },
+  },
+  {
+    files: ['projects/shared/src/**/*.ts'],
+    rules: {
+      '@angular-eslint/directive-selector': [
+        'error',
+        {
+          type: 'attribute',
+          prefix: 'shared',
+          style: 'camelCase',
+        },
+      ],
+      '@angular-eslint/component-selector': [
+        'error',
+        {
+          type: 'element',
+          prefix: 'shared',
+          style: 'kebab-case',
+        },
+      ],
+    },
+  }
+);
diff --git a/eslintrc.cjs b/eslintrc.cjs
new file mode 100644
index 0000000..a13e10e
--- /dev/null
+++ b/eslintrc.cjs
@@ -0,0 +1,102 @@
+/* .eslintrc.cjs — boundaries for angular.fun monorepo
+ * Layers per app: core, layout, ui, pattern, data-access, feature (lazy)
+ * Shared libs: shared/ui, shared/pattern, shared/data-access
+ */
+/* eslint-env node */
+module.exports = {
+  root: true,
+  ignorePatterns: ['**/*'],
+  overrides: [
+    {
+      files: ['*.ts'],
+      parserOptions: {
+        project: ['tsconfig.json'],
+        sourceType: 'module',
+      },
+      extends: [
+        'plugin:@angular-eslint/recommended',
+        'plugin:@angular-eslint/template/process-inline-templates',
+      ],
+      plugins: ['boundaries'],
+      settings: {
+        'boundaries/elements': [
+          // ---- Shared libs ----
+          { type: 'shared-ui', pattern: 'libs/shared/ui/**' },
+          { type: 'shared-pattern', pattern: 'libs/shared/pattern/**' },
+          { type: 'shared-data', pattern: 'libs/shared/data-access/**' },
+
+          // ---- Apps: blog-ssg ----
+          { type: 'blog-core', pattern: 'apps/blog-ssg/src/app/core/**' },
+          { type: 'blog-layout', pattern: 'apps/blog-ssg/src/app/layout/**' },
+          { type: 'blog-ui', pattern: 'apps/blog-ssg/src/app/ui/**' },
+          { type: 'blog-pattern', pattern: 'apps/blog-ssg/src/app/pattern/**' },
+          { type: 'blog-data', pattern: 'apps/blog-ssg/src/app/data-access/**' },
+          { type: 'blog-feature', pattern: 'apps/blog-ssg/src/app/feature/**' },
+
+          // ---- Apps: admin-spa ----
+          { type: 'admin-core', pattern: 'apps/admin-spa/src/app/core/**' },
+          { type: 'admin-layout', pattern: 'apps/admin-spa/src/app/layout/**' },
+          { type: 'admin-ui', pattern: 'apps/admin-spa/src/app/ui/**' },
+          { type: 'admin-pattern', pattern: 'apps/admin-spa/src/app/pattern/**' },
+          { type: 'admin-data', pattern: 'apps/admin-spa/src/app/data-access/**' },
+          { type: 'admin-feature', pattern: 'apps/admin-spa/src/app/feature/**' },
+
+          // ---- Apps: code-samples-mfe ----
+          { type: 'samples-core', pattern: 'apps/code-samples-mfe/src/app/core/**' },
+          { type: 'samples-layout', pattern: 'apps/code-samples-mfe/src/app/layout/**' },
+          { type: 'samples-ui', pattern: 'apps/code-samples-mfe/src/app/ui/**' },
+          { type: 'samples-pattern', pattern: 'apps/code-samples-mfe/src/app/pattern/**' },
+          { type: 'samples-data', pattern: 'apps/code-samples-mfe/src/app/data-access/**' },
+          { type: 'samples-feature', pattern: 'apps/code-samples-mfe/src/app/feature/**' }
+        ],
+      },
+      rules: {
+        // Prevent unknown files from bypassing the rules
+        'boundaries/no-unknown-files': 'error',
+
+        // Forbid private imports across elements
+        'boundaries/no-private': 'error',
+
+        // Allowed import graph
+        'boundaries/allowed-types': ['error', [
+          // Shared layers
+          { from: ['shared-ui'], allow: [] },
+          { from: ['shared-pattern'], allow: ['shared-ui'] },
+          { from: ['shared-data'], allow: [] },
+
+          // blog-ssg
+          { from: ['blog-core'], allow: ['shared-data'] },
+          { from: ['blog-layout'], allow: ['blog-core', 'shared-ui', 'shared-pattern'] },
+          { from: ['blog-ui'], allow: ['shared-ui'] },
+          { from: ['blog-pattern'], allow: ['shared-ui', 'shared-pattern', 'shared-data'] },
+          { from: ['blog-data'], allow: ['shared-data'] },
+          { from: ['blog-feature'], allow: ['blog-core', 'blog-layout', 'blog-ui', 'blog-pattern', 'blog-data', 'shared-ui', 'shared-pattern', 'shared-data'] },
+
+          // admin-spa
+          { from: ['admin-core'], allow: ['shared-data'] },
+          { from: ['admin-layout'], allow: ['admin-core', 'shared-ui', 'shared-pattern'] },
+          { from: ['admin-ui'], allow: ['shared-ui'] },
+          { from: ['admin-pattern'], allow: ['shared-ui', 'shared-pattern', 'shared-data'] },
+          { from: ['admin-data'], allow: ['shared-data'] },
+          { from: ['admin-feature'], allow: ['admin-core', 'admin-layout', 'admin-ui', 'admin-pattern', 'admin-data', 'shared-ui', 'shared-pattern', 'shared-data'] },
+
+          // samples-mfe
+          { from: ['samples-core'], allow: ['shared-data'] },
+          { from: ['samples-layout'], allow: ['samples-core', 'shared-ui', 'shared-pattern'] },
+          { from: ['samples-ui'], allow: ['shared-ui'] },
+          { from: ['samples-pattern'], allow: ['shared-ui', 'shared-pattern', 'shared-data'] },
+          { from: ['samples-data'], allow: ['shared-data'] },
+          { from: ['samples-feature'], allow: ['samples-core', 'samples-layout', 'samples-ui', 'samples-pattern', 'samples-data', 'shared-ui', 'shared-pattern', 'shared-data'] }
+        ]],
+
+        // Enforce public APIs (optional): only import from directories' public entry points
+        // 'boundaries/entry-point': ['error', [{ target: 'always', from: ['shared-ui', 'shared-pattern', 'shared-data'] }]]
+      },
+    },
+    {
+      files: ['*.html'],
+      extends: ['plugin:@angular-eslint/template/recommended'],
+      rules: {}
+    }
+  ]
+};
diff --git a/firebase.json b/firebase.json
index e69de29..3285260 100644
--- a/firebase.json
+++ b/firebase.json
@@ -0,0 +1,38 @@
+{
+  "hosting": [
+    {
+      "target": "admin",
+      "public": "dist/apps/admin-spa",
+      "ignore": ["**/.*", "**/node_modules/**"],
+      "rewrites": [{ "source": "**", "destination": "/index.html" }],
+      "headers": [
+        {
+          "source": "**/*.@(js|css)",
+          "headers": [
+            { "key": "Cache-Control", "value": "public, max-age=31536000, immutable" }
+          ]
+        }
+      ]
+    },
+    {
+      "target": "samples",
+      "public": "dist/apps/code-samples-mfe",
+      "ignore": ["**/.*", "**/node_modules/**"],
+      "rewrites": [{ "source": "**", "destination": "/index.html" }],
+      "headers": [
+        {
+          "source": "**/remoteEntry.@(js|mjs)",
+          "headers": [
+            { "key": "Cache-Control", "value": "public, max-age=31536000, immutable" }
+          ]
+        },
+        {
+          "source": "**/*.@(js|css)",
+          "headers": [
+            { "key": "Cache-Control", "value": "public, max-age=31536000, immutable" }
+          ]
+        }
+      ]
+    }
+  ]
+}
diff --git a/llms.txt b/llms.txt
deleted file mode 100644
index 47c724d..0000000
--- a/llms.txt
+++ /dev/null
@@ -1,129 +0,0 @@
-# Angular
-
-Angular — Deliver web apps with confidence 🚀
-
-## Table of Contents
-
-- [What is Angular](https://angular.dev/overview)
-- [Installation guide](https://angular.dev/installation)
-- [Style Guide](https://next.angular.dev/style-guide)
-
-## Components
-
-- [What is a component](https://angular.dev/guide/components)
-- [Component selectors](https://angular.dev/guide/components/selectors)
-- [Styling components](https://angular.dev/guide/components/styling)
-- [Accepting data with input properties](https://angular.dev/guide/components/inputs)
-- [Custom events with output](https://angular.dev/guide/components/outputs)
-- [Content projection](https://angular.dev/guide/components/content-projection)
-- [Component lifecycle](https://angular.dev/guide/components/lifecycle)
-
-## Templates guides
-
-- [Template Overview](https://angular.dev/guide/templates)
-- [Adding event listeners](https://angular.dev/guide/templates/event-listeners)
-- [Binding text, properties and attributes](https://angular.dev/guide/templates/binding)
-- [Control Flow](https://angular.dev/guide/templates/control-flow)
-- [Template variable declaration](https://angular.dev/guide/templates/variables)
-- [Deferred loading of components](https://angular.dev/guide/templates/defer)
-- [Expression syntax](https://angular.dev/guide/templates/expression-syntax)
-
-## Directives
-
-- [Directives overview](https://angular.dev/guide/directives)
-- [Attribute directives](https://angular.dev/guide/directives/attribute-directives)
-- [Structural directives](https://angular.dev/guide/directives/structural-directives)
-- [Directive composition](https://angular.dev/guide/directives/directive-composition-api)
-- [Optimizing images](https://angular.dev/guide/image-optimization)
-
-## Signals
-
-- [Signals overview](https://angular.dev/guide/signals)
-- [Dependent state with linkedSignal](https://angular.dev/guide/signals/linked-signal)
-- [Async reactivity with resources](https://angular.dev/guide/signals/resource)
-
-## Dependency injection (DI)
-
-- [Dependency Injection overview](https://angular.dev/guide/di)
-- [Understanding Dependency injection](https://angular.dev/guide/di/dependency-injection)
-- [Creating an injectable service](https://angular.dev/guide/di/creating-injectable-service)
-- [Configuring dependency providers](https://angular.dev/guide/di/dependency-injection-providers)
-- [Injection context](https://angular.dev/guide/di/dependency-injection-context)
-- [Hierarchical injectors](https://angular.dev/guide/di/hierarchical-dependency-injection)
-- [Optimizing Injection tokens](https://angular.dev/guide/di/lightweight-injection-tokens)
-
-## RxJS
-
-- [RxJS interop with Angular signals](https://angular.dev/ecosystem/rxjs-interop)
-- [Component output interop](https://angular.dev/ecosystem/rxjs-interop/output-interop)
-
-## Loading Data
-
-- [HttpClient overview](https://angular.dev/guide/http)
-- [Setting up the HttpClient](https://angular.dev/guide/http/setup)
-- [Making requests](https://angular.dev/guide/http/making-requests)
-- [Intercepting requests](https://angular.dev/guide/http/interceptors)
-- [Testing](https://angular.dev/guide/http/testing)
-
-## Forms
-- [Forms overview](https://angular.dev/guide/forms)
-- [Reactive Forms](https://angular.dev/guide/forms/reactive-forms)
-- [Strictly types forms](https://angular.dev/guide/forms/typed-forms)
-- [Template driven forms](https://angular.dev/guide/forms/template-driven-forms)
-- [Validate forms input](https://angular.dev/guide/forms/form-validation)
-- [Building dynamic forms](https://angular.dev/guide/forms/dynamic-forms)
-
-## Routing
-- [Routing overview](https://angular.dev/guide/routing)
-- [Common routing tasks](https://angular.dev/guide/routing/common-router-tasks)
-- [Routing in an SPA](https://angular.dev/guide/routing/router-tutorial)
-- [Creating custom route matches](https://angular.dev/guide/routing/routing-with-urlmatcher)
-
-## Server Side Rendering (SSR)
-
-- [SSR Overview](https://angular.dev/guide/performance)
-- [SSR with Angular](https://angular.dev/guide/ssr)
-- [Build-time prerendering (SSG)](https://angular.dev/guide/prerendering)
-- [Hybrid rendering with server routing](https://angular.dev/guide/hybrid-rendering)
-- [Hydration](https://angular.dev/guide/hydration)
-- [Incremental Hydration](https://angular.dev/guide/incremental-hydration)
-
-# CLI
-[Angular CLI Overview](https://angular.dev/tools/cli)
-
-## Testing
-
-- [Testing overview](https://angular.dev/guide/testing)
-- [Testing coverage](https://angular.dev/guide/testing/code-coverage)
-- [Testing services](https://angular.dev/guide/testing/services)
-- [Basics of component testing](https://angular.dev/guide/testing/components-basics)
-- [Component testing scenarios](https://angular.dev/guide/testing/components-scenarios)
-- [Testing attribute directives](https://angular.dev/guide/testing/attribute-directives
-- [Testing pipes](https://angular.dev/guide/testing/pipes
-- [Debugging tests](https://angular.dev/guide/testing/debugging)
-- [Testing utility apis](https://angular.dev/guide/testing/utility-apis)
-- [Component harness overview](https://angular.dev/guide/testing/component-harnesses-overview)
-- [Using component harness in tests](https://angular.dev/guide/testing/using-component-harnesses)
-- [Creating a component harness for your components](https://angular.dev/guide/testing/creating-component-harnesses)
-
-## Animations
-- [Animations your content](https://angular.dev/guide/animations/css)
-- [Route transition animation](https://angular.dev/guide/animations/route-animations)
-- [Migrating to native CSS animations](https://next.angular.dev/guide/animations/migration)
-
-## APIs
-- [API reference](https://angular.dev/api)
-- [CLI command reference](https://angular.dev/cli)
-
-
-## Others
-
-- [Zoneless](https://angular.dev/guide/experimental/zoneless)
-- [Error encyclopedia](https://angular.dev/errors)
-- [Extended diagnostics](https://angular.dev/extended-diagnostics)
-- [Update guide](https://angular.dev/update-guide)
-- [Contribute to Angular](https://github.com/angular/angular/blob/main/CONTRIBUTING.md)
-- [Angular's Roadmap](https://angular.dev/roadmap)
-- [Keeping your projects up-to-date](https://angular.dev/update)
-- [Security](https://angular.dev/best-practices/security)
-- [Internationalization (i18n)](https://angular.dev/guide/i18n)
diff --git a/llms/public/app-description.txt b/llms/public/app-description.txt
new file mode 100644
index 0000000..1857f1d
--- /dev/null
+++ b/llms/public/app-description.txt
@@ -0,0 +1,90 @@
+# app-llm.txt — Copilot / LLM brief for angular.fun (Angular 20+)
+
+## Overview
+**angular.fun** is a blog and code samples site focused on Angular, built with modern Angular features like SSG, SSR, and micro‑frontends. It serves as a resource for learning.
+Actual is a single app with a monolithic structure, but the goal is to refactor it into a multi‑project workspace with clear separation of concerns and deployment strategies.
+App is in the src folder, with a monolithic structure. At the end /src should be empty.
+Current structure is that:
+- `src/app/` contains the app.
+- `src/app/admin` contains the admin part of the app - Pure CSR.
+- `src/app/reader` contains the part of the blog for reader so it's SSG/SSR.
+
+## Goal
+Rebuild **angular.fun** as a clean Angular 20+ multi‑project workspace (no Nx) with three independently deployed apps and shared libraries:
+
+- **projects/web* (public): Hybrid rendering (**SSG for articles**, **SSR for home**; CSR where needed). Deployed to **Google Cloud Run** from source using buildpacks. SEO and Core Web Vitals are top priority. [docs: hybrid rendering, route‑level render mode, Cloud Run deploy from source]
+- **projects/admin**: Pure CSR admin panel. Will be deployed to **Firebase Hosting**.
+- **projects/code-samples-mfe**: Micro‑frontend for heavy examples, loaded lazily from the blog via **Native Federation** (Angular Architects). Deployed to **Firebase Hosting**.
+- **projects/shared**: UI (presentational), pattern (composable UI + injectables), data‑access (REST clients, mappers, Supabase helpers), models.
+
+**State**: **NgRx SignalStore** for all apps.
+
+**Data**: Supabase (Postgres + Auth + Storage). Public content is fetched via **PostgREST REST endpoints** in SSG/SSR to avoid initializing `supabase-js`. Admin/MFE can use `@supabase/supabase-js`. Public assets come from **Supabase Storage CDN**.
+
+**A11y & Performance**: Aim for **100/100/100/100 Lighthouse** on the home page. Enforce with Lighthouse CI in GitHub Actions. Add Playwright + axe accessibility checks.
+
+---
+
+## Projects & folders
+
+**Workspace (Angular CLI):**
+- `projects/web` — public reader app
+- `projects/admin` — admin
+- `projects/code-samples-mfe` — remote
+- `projects/shared` — Library shared between apps
+- `scripts/` — Node scripts (e.g. prerender route generator)
+- `e2e/` — end‑to‑end tests (Playwright)
+- 'llms' - LLMs and Copilot prompts for the project
+- '.github' - GitHub Actions workflows
+
+** Inside each app inside folder should cover architecture from : llms/private/architecture.txt **
+
+## Data access
+
+- **Web**: call **PostgREST** endpoints with the anon key and RLS‑safe policies. Because of issues with `@supabase/supabase-js` in SSR/SSG
+- **Admin/MFE**: use `@supabase/supabase-js` browser client.
+- **Auth**: already implemented with Supabase. When SSR needs session, use `@supabase/ssr` and `createServerClient` with cookies (Cloud Run).
+- **Storage**: serve images from Supabase **CDN** (public bucket). Control cache with versioned filenames or signed URLs if you need cache‑busting.
+
+---
+## Tooling & versions
+
+- **Angular 20+**.
+- **Node.js LTS**: **20.19+** (Angular 20 drops Node 18). Configure Actions runners to Node 20.
+- **Package manager**: `pnpm` recommended (fast, content‑addressable store). Use `actions/setup-node` caching with `cache: 'pnpm'`.
+- **Testing**: Use `@playwright/test` for e2e tests. - implemeted
+- **Linting**: `@angular-eslint` for Angular code, `eslint-plugin-js
+- **boundaries** : eslint-plugin-boundaries
+- **CI/CD**: GitHub Actions.
+
+---
+
+## CI/CD
+
+### Overview
+- Separate jobs for each app. Common `test` job first.
+- **blog-ssg**: build (`ng build` + `ng run blog-ssg:server` + prerender), then **deploy to Cloud Run**. Prefer **Workload Identity Federation** instead of JSON key when possible.
+- **admin-spa** and **code-samples-mfe**: build and **deploy to Firebase Hosting** (each to its own site/target). Use `firebase init hosting:github` to scaffold.
+- **Lighthouse CI**: run on the preview/live URL of the **home page** only. Thresholds set to 1.00 for all categories; fail PRs on regressions.
+- **Accessibility**: Playwright + `@axe-core/playwright` scan of the home page gate in CI.
+
+### Monorepo workflow (sketch)
+See `.github/workflows/ci.yml` below for a consolidated workflow.
+
+---
+
+## i18n roadmap
+
+- Start English‑only. Next locale: **pl**.
+
+---
+
+## SEO decisions
+
+- Generate server‑side meta (title, description, canonical, Open Graph, Twitter). For `og:image`, generate images at publish time and serve from Supabase Storage CDN. Consider adding a small Cloud Run job/Function to generate OG images on demand if needed.
+
+---
+
+## Styling
+- **Tailwind + DaisyUI**. Provide design tokens (colors, spacing, font scale). Set CSS budget limits in `angular.json`. Monitor CSS size in CI.
+
diff --git a/llms/public/guidelines-copilot.md b/llms/public/guidelines-copilot.md
new file mode 100644
index 0000000..71a2b12
--- /dev/null
+++ b/llms/public/guidelines-copilot.md
@@ -0,0 +1,576 @@
+# Persona
+
+You are a dedicated Angular developer who thrives on leveraging the absolute latest features of the framework to build cutting-edge applications. You are currently immersed in Angular v20+, passionately adopting signals for reactive state management, embracing standalone components for streamlined architecture, and utilizing the new control flow for more intuitive template logic. Performance is paramount to you, who constantly seeks to optimize change detection and improve user experience through these modern Angular paradigms. When prompted, assume You are familiar with all the newest APIs and best practices, valuing clean, efficient, and maintainable code.
+
+## Examples
+
+These are modern examples of how to write an Angular 20 component with signals
+
+```ts
+import {ChangeDetectionStrategy, Component, signal} from '@angular/core';
+
+
+@Component({
+  selector: '{{tag-name}}-root',
+  templateUrl: '{{tag-name}}.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class { {
+  ClassName
+}
+}
+{
+protected readonly
+  isServerRunning = signal(true);
+  toggleServerStatus()
+  {
+    this.isServerRunning.update(isServerRunning => !isServerRunning);
+  }
+}
+```
+
+```css
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 100vh;
+
+  button {
+    margin-top: 10px;
+  }
+}
+```
+
+```html
+
+<section class="container">
+  @if (isServerRunning()) {
+  <span>Yes, the server is running</span>
+  } @else {
+  <span>No, the server is not running</span>
+  }
+  <button (click)="toggleServerStatus()">Toggle Server Status</button>
+</section>
+```
+
+When you update a component, be sure to put the logic in the ts file, the styles in the css file and the html template in the html file.
+
+## Resources
+
+Here are some links to the essentials for building Angular applications. Use these to get an understanding of how some of the core functionality works
+https://angular.dev/essentials/components
+https://angular.dev/essentials/signals
+https://angular.dev/essentials/templates
+https://angular.dev/essentials/dependency-injection
+
+## Best practices & Style guide
+
+Here are the best practices and the style guide information.
+
+### Coding Style guide
+
+Here is a link to the most recent Angular style guide https://angular.dev/style-guide
+
+### TypeScript Best Practices
+
+- Use strict type checking
+- Prefer type inference when the type is obvious
+- Avoid the `any` type; use `unknown` when type is uncertain
+
+### Angular Best Practices
+
+- Always use standalone components over `NgModules`
+- Do NOT set `standalone: true` inside the `@Component`, `@Directive` and `@Pipe` decorators
+- Use signals for state management
+- Implement lazy loading for feature routes
+- Use `NgOptimizedImage` for all static images.
+- Do NOT use the `@HostBinding` and `@HostListener` decorators. Put host bindings inside the `host` object of the `@Component` or `@Directive` decorator instead
+
+### Components
+
+- Keep components small and focused on a single responsibility
+- Use `input()` signal instead of decorators, learn more here https://angular.dev/guide/components/inputs
+- Use `output()` function instead of decorators, learn more here https://angular.dev/guide/components/outputs
+- Use `computed()` for derived state learn more about signals here https://angular.dev/guide/signals.
+- Set `changeDetection: ChangeDetectionStrategy.OnPush` in `@Component` decorator
+- Prefer inline templates for small components
+- Prefer Reactive forms instead of Template-driven ones
+- Do NOT use `ngClass`, use `class` bindings instead, for context: https://angular.dev/guide/templates/binding#css-class-and-style-property-bindings
+- DO NOT use `ngStyle`, use `style` bindings instead, for context: https://angular.dev/guide/templates/binding#css-class-and-style-property-bindings
+
+### State Management
+
+- Use signals for local component state
+- Use `computed()` for derived state
+- Keep state transformations pure and predictable
+- Do NOT use `mutate` on signals, use `update` or `set` instead
+
+### Templates
+
+- Keep templates simple and avoid complex logic
+- Use native control flow (`@if`, `@for`, `@switch`) instead of `*ngIf`, `*ngFor`, `*ngSwitch`
+- Use the async pipe to handle observables
+- Use built in pipes and import pipes when being used in a template, learn more https://angular.dev/guide/templates/pipes#
+
+### Services
+
+- Design services around a single responsibility
+- Use the `providedIn: 'root'` option for singleton services
+- Use the `inject()` function instead of constructor injection
+
+# guidelines-copilot.md — uzupełnienia
+
+## Workspace
+
+- Monorepo Angular CLI (bez Nx). Projekty: `apps/blog-ssg` (SSR/SSG), `apps/admin-spa` (SPA), `apps/code-samples-mfe` (MFE), biblioteki w `libs/`.
+- Architektura według `architecture.txt`: `core/`, `layout/`, `ui/`, `pattern/`, `feature/` (lazy). Granice wymusza `eslint-plugin-boundaries`. Feature’y nie importują się nawzajem.
+
+## Rendering
+
+- Blog: hybrydowo (SSR + SSG). Generuj `routes.txt` lub `getPrerenderParams`. Ciężkie widgety pod `@defer`. W razie problemów z hydracją: `host: { ngSkipHydration: 'true' }`.
+- Admin: wyłącznie CSR.
+- Code‑samples: mikro‑frontend ładowany przez Module/Native Federation; brak prerenderingu.
+
+## State Management — **używaj NgRx SignalStore**
+
+**Zasady ogólne**
+
+- Drobny stan lokalny w komponentach: `signal`, `computed`, `linkedSignal`.
+- Stan domenowy współdzielony: **`@ngrx/signals`**.
+- Transformacje są czyste; **bez mutacji**. Aktualizacje przez `patchState(store, partial)`.
+- Obliczenia wtórne przez `withComputed`. Logika imperatywna i side‑effects w `withMethods` (serwisy HTTP, router itp.).
+- Inicjalizacja/cleanup przez `withHooks({ onInit, onDestroy })`.
+- Dla kolekcji encji używaj `withEntities` i updaterów (`addEntities`, `setEntities`, `updateEntity`, `removeEntity`, itd.).
+- Asynchroniczność:
+  - Proste pobrania: `async/await` + `firstValueFrom` wewnątrz metod store lub
+  - **`rxMethod`** (z `@ngrx/signals/rxjs-interop`) do reakcji na zmiany sygnałów/zdarzeń z operatorskim pipeline (debounce, switchMap, cancelation) albo
+  - **`resource`** (Angular) + `withProps` do odpornego na race conditions ładowania.
+- Interoperacyjność: `toSignal(observable)`, `toObservable(signal)` z `@angular/core/rxjs-interop`.
+
+**Minimalny szablon Store**
+
+```ts
+import {inject, computed} from '@angular/core';
+import {HttpClient} from '@angular/common/http';
+import {
+  signalStore, withState, withComputed, withMethods, withHooks, patchState,
+} from '@ngrx/signals';
+
+interface State {
+  loading: boolean;
+  error: string | null;
+  items: Item[];
+  selectedId: string | null;
+}
+
+const initialState: State = {loading: false, error: null, items: [], selectedId: null};
+
+export const ExampleStore = signalStore(
+  {providedIn: 'root'},
+  withState(initialState),
+  withComputed(({items, selectedId}) => ({
+    selected: computed(() => items().find(i => i.id === selectedId())),
+    count: computed(() => items().length),
+  })),
+  withMethods((store, http = inject(HttpClient)) => ({
+    async load() {
+      patchState(store, {loading: true, error: null});
+      try {
+        const data = await http.get<Item[]>('/api/items').toPromise();
+        patchState(store, {items: data ?? [], loading: false});
+      } catch (e: any) {
+        patchState(store, {loading: false, error: String(e?.message ?? e)});
+      }
+    },
+    select(id: string | null) {
+      patchState(store, {selectedId: id});
+    },
+    upsert(item: Item) {
+      const list = store.items();
+      const i = list.findIndex(x => x.id === item.id);
+      patchState(store, {items: i === -1 ? [...list, item] : list.map(x => x.id === item.id ? item : x)});
+    },
+  })),
+  withHooks({
+    onInit() {/* opcjonalnie */
+    }
+  }),
+);
+```
+
+**rxMethod — reagowanie na zmiany sygnałów**
+
+```ts
+import {rxMethod} from '@ngrx/signals/rxjs-interop';
+import {debounceTime, distinctUntilChanged, switchMap, tap, catchError, of} from 'rxjs';
+
+export const SearchStore = signalStore(
+  withState({query: '', results: [] as Result[], loading: false, error: null as string | null}),
+  withMethods((store, svc = inject(SearchService)) => {
+    const search = rxMethod<string>(pipe(
+      debounceTime(300),
+      distinctUntilChanged(),
+      tap(() => patchState(store, {loading: true, error: null})),
+      switchMap(q => svc.search(q).pipe(
+        tap(results => patchState(store, {results, loading: false})),
+        catchError(err => {
+          patchState(store, {error: String(err), loading: false});
+          return of([]);
+        }),
+      )),
+    ));
+    return {
+      setQuery(q: string) {
+        patchState(store, {query: q});
+        search(q);
+      },
+    };
+  }),
+);
+```
+
+**Entity management**
+
+```ts
+import {withEntities, addEntities, setEntities, updateEntity, removeEntity} from '@ngrx/signals/entities';
+
+type Id = string;
+
+interface Todo {
+  id: Id;
+  title: string;
+  done: boolean;
+}
+
+export const TodosStore = signalStore(
+  withState({loading: false}),
+  withEntities<Todo>(),
+  withMethods((store) => ({
+    add(todo: Todo) {
+      patchState(store, addEntities(todo));
+    },
+    set(list: Todo[]) {
+      patchState(store, setEntities(list));
+    },
+    toggle(id: Id) {
+      patchState(store, updateEntity({id, changes: (t) => ({...t, done: !t.done})}));
+    },
+    remove(id: Id) {
+      patchState(store, removeEntity({id}));
+    },
+  })),
+);
+```
+
+**Checklist projektowy (ważne)**
+
+- Używaj **signals** w komponentach. Do globalnego stanu i przepływów domenowych używaj **SignalStore**.
+- Nigdy nie mutuj obiektów i tablic w stanie. Zawsze twórz nowe referencje.
+- Oddziel pobieranie danych (metody store/serwisy) od renderowania UI.
+- Efekty uboczne inicjuj w `withMethods` lub `withHooks`, nie w `computed()`.
+- W SSR pamiętaj o bezpiecznym dostępie do `window/document`.
+- Dla tras MFE i ciężkich przykładów wyłącz prerendering i (w razie potrzeby) hydrację.
+
+## Workspace & Projects
+
+- CLI multi‑project workspace (no Nx). Projects:
+  - `apps/blog-ssg` (SSR/SSG hybrid, SEO critical),
+  - `apps/admin-spa` (CSR only),
+  - `apps/code-samples-mfe` (Native Federation remote),
+  - shared libs under `libs/`.
+- All **features are lazy**. Features never import other features directly. Reuse via `ui`, `pattern`, or routing. Enforce boundaries in ESLint. fileciteturn3file0
+
+## Rendering
+
+- Use **route‑level render mode** (Angular v19+) to choose SSR/SSG/CSR per route. Home = SSR, article pages = SSG, others case‑by‑case. citeturn2search2turn0search0
+- Hydration by default. Opt‑out only with `host: { ngSkipHydration: 'true' }` for incompatible widgets. citeturn0search1turn0search16
+- Wrap heavy UI with **`@defer`**; provide placeholders and triggers (`on viewport`, `on idle`, etc.). citeturn0search2turn0search10
+- Optimize images with **`NgOptimizedImage`** and a CDN loader. Prioritize LCP. citeturn2search1turn2search7
+
+## Micro‑frontend
+
+- Prefer **Native Federation** (Angular Architects) for the **code‑samples** remote — minimal setup, integrates with the CLI’s esbuild ApplicationBuilder, future‑proof. Shell: blog. Remote: samples. Load via `loadRemoteModule('samples', './routes')`. citeturn0search7turn0search14
+- If needed, Module Federation is also supported by the same toolkit. citeturn0search6
+
+## Data access (Supabase)
+
+- **Public reader app** should fetch article data over **REST (PostgREST)** during SSG/SSR to avoid supabase-js initialization complexities. Keep requests RLS‑safe or fetch via a server token on Cloud Run. citeturn1search0turn1search5turn1search10
+- For SSR that needs auth, use `@supabase/ssr` and **`createServerClient`** with cookie storage. For browsers (Admin/MFE), use `createBrowserClient`. citeturn1search1turn1search6turn1search16
+
+## **State Management — Use NgRx SignalStore**
+
+### Principles
+
+- Local state: **signals** — `signal`, `computed`, `linkedSignal`. Keep computations pure. fileciteturn3file2turn3file7turn3file3
+- Domain/shared state: **`@ngrx/signals` SignalStore**. Define state via `withState`, derive state via `withComputed`, perform side‑effects in `withMethods`, lifecycle in `withHooks`. Update state immutably with **`patchState`**. citeturn0search3
+- **Do NOT mutate** arrays/objects; always create new references.
+- Async:
+  - Simple fetches: `async/await` + `firstValueFrom`.
+  - Reactive workflows: **`rxMethod`** with RxJS operators.
+  - Interop: `toSignal` / `toObservable` from `@angular/rxjs-interop`. citeturn0search5turn0search20
+- Entities: use `withEntities` + updaters (`addEntities`, `setEntities`, `updateEntity`, `removeEntity`, etc.). Expose selectors via computed signals. citeturn0search4turn0search11
+
+### Store template
+
+```ts
+import {computed, inject} from '@angular/core';
+import {HttpClient} from '@angular/common/http';
+import {
+  signalStore, withState, withComputed, withMethods, withHooks, patchState,
+} from '@ngrx/signals';
+
+interface Item {
+  id: string;
+  title: string;
+}
+
+interface State {
+  loading: boolean;
+  error: string | null;
+  items: Item[];
+  selectedId: string | null;
+}
+
+const initial: State = {loading: false, error: null, items: [], selectedId: null};
+
+export const ItemsStore = signalStore(
+  {providedIn: 'root'},
+  withState(initial),
+  withComputed(({items, selectedId}) => ({
+    count: computed(() => items().length),
+    selected: computed(() => items().find(i => i.id === selectedId())),
+  })),
+  withMethods((store, http = inject(HttpClient)) => ({
+    async load() {
+      patchState(store, {loading: true, error: null});
+      try {
+        const data = await http.get<Item[]>('/api/items').toPromise();
+        patchState(store, {items: data ?? [], loading: false});
+      } catch (e: any) {
+        patchState(store, {loading: false, error: String(e?.message ?? e)});
+      }
+    },
+    select(id: string | null) {
+      patchState(store, {selectedId: id});
+    },
+  })),
+  withHooks({
+    onInit() {/* optional */
+    }
+  }),
+);
+```
+
+Reference: NgRx SignalStore docs. citeturn0search3
+
+### Entities example
+
+```ts
+import {signalStore, withMethods, patchState} from '@ngrx/signals';
+import {withEntities, addEntities, setEntities, updateEntity, removeEntity} from '@ngrx/signals/entities';
+
+type Id = string;
+
+interface Todo {
+  id: Id;
+  title: string;
+  done: boolean;
+}
+
+export const TodosStore = signalStore(
+  withEntities<Todo>(),
+  withMethods((store) => ({
+    add(todo: Todo) {
+      patchState(store, addEntities(todo));
+    },
+    set(all: Todo[]) {
+      patchState(store, setEntities(all));
+    },
+    toggle(id: Id) {
+      patchState(store, updateEntity({id, changes: (t) => ({...t, done: !t.done})}));
+    },
+    remove(id: Id) {
+      patchState(store, removeEntity({id}));
+    },
+  })),
+);
+```
+
+Reference: NgRx entities plugin docs. citeturn0search4turn0search11
+
+### rxMethod example
+
+```ts
+import {rxMethod} from '@ngrx/signals/rxjs-interop';
+import {debounceTime, distinctUntilChanged, switchMap, tap, catchError, of} from 'rxjs';
+
+export const SearchStore = signalStore(
+  withState({query: '', results: [] as Result[], loading: false, error: null as string | null}),
+  withMethods((store, svc = inject(SearchService)) => {
+    const search = rxMethod<string>(pipe(
+      debounceTime(300),
+      distinctUntilChanged(),
+      tap(() => patchState(store, {loading: true, error: null})),
+      switchMap(q => svc.search(q).pipe(
+        tap(results => patchState(store, {results, loading: false})),
+        catchError(err => {
+          patchState(store, {error: String(err), loading: false});
+          return of([]);
+        }),
+      )),
+    ));
+    return {
+      setQuery(q: string) {
+        patchState(store, {query: q});
+        search(q);
+      },
+    };
+  }),
+);
+```
+
+Reference: NgRx rxMethod docs. citeturn0search5
+
+## Performance & Web Vitals
+
+- Target **100/100/100/100** Lighthouse in CI. Use **Lighthouse CI** GitHub Action and fail PRs on regressions. citeturn1search4turn1search9
+- Use `@defer`, image optimization, lazy features, and skip hydration for problem widgets. Monitor LCP/INP/CLS. citeturn0search2turn2search1
+
+## Accessibility & i18n
+
+- Add a11y linting and automated checks (axe).
+- Plan Angular **i18n** (`$localize`, extraction) and localized builds; later decide which locale routes use SSG/SSR. citeturn2search0turn2search19turn2search2
+
+## Projects
+
+- `apps/blog-ssg` (SSR/SSG hybrid, SEO critical) → Google Cloud Run.
+- `apps/admin-spa` (CSR) → Firebase Hosting.
+- `apps/code-samples-mfe` (Native Federation remote) → Firebase Hosting.
+- `libs/shared/*` for reusable UI, pattern, data-access.
+
+## Rendering
+
+- Use **route‑level render mode** to select SSR/SSG/CSR per route. Home = SSR, `/posts/:slug` = SSG. Hydrate by default; opt‑out with `ngSkipHydration` only when strictly necessary. Use `@defer` to reduce initial JS and improve LCP/INP. Optimize images using `NgOptimizedImage`.
+
+## Micro‑frontend
+
+- Prefer **Native Federation**. It integrates with Angular’s esbuild ApplicationBuilder and is tooling‑agnostic. Blog is the shell; Samples is the remote. Expose routes; load with `loadRemoteModule('samples', './routes')`. Share Angular and RxJS as singletons.
+
+## Supabase
+
+- Public content: fetch via **PostgREST REST** in SSG/SSR (RLS‑safe anon role). Avoid initializing `supabase-js` for prerenders. If SSR needs user context, use `@supabase/ssr` and `createServerClient` with cookie storage.
+- Storage: serve images from **Supabase Storage CDN**. For cache‑busting, prefer versioned filenames or signed URLs.
+
+## State Management — **NgRx SignalStore**
+
+- Local state: `signal`, `computed`, `linkedSignal`.
+- Domain/shared: **SignalStore** with `withState`, `withComputed`, `withMethods`, `withHooks`. Updates via **`patchState`** only. **Do not mutate**.
+- Entities: `withEntities` + updaters (`addEntities`, `setEntities`, `updateEntity`, `removeEntity`, …).
+- RxJS interop: use `rxMethod` for effectful flows; use `toSignal`/`toObservable` bridges when needed.
+
+## Performance & CI
+
+- Target **100/100/100/100** Lighthouse on the home page. Enforce with **Lighthouse CI** in GitHub Actions (fail PRs on regressions).
+- Add **Playwright + axe** accessibility scans on the home page.
+- Node **20.19+** on all runners.
+- Prefer **Workload Identity Federation** for Cloud Run auth when ready.
+
+## i18n
+
+- Plan localized builds (`localize` config) with route prefixes per locale. The dev server supports a **single locale per run**; use `--configuration=<locale>`.
+- For SSG, generate `routes.<locale>.txt` and prerender per locale.
+
+### Api calls
+
+- For SSG/SSR, use this api-url-builder.ts
+- import { ColumnName, RowOf, TableName } from '../types/supabase-helper'
+- This file provides a simple way to build API URLs for Supabase tables using PostgREST conventions.
+
+```ts
+//https://postgrest.org/en/stable/references/api/tables_views.html#operators
+type Op =
+  | 'eq'
+  | 'gt'
+  | 'gte'
+  | 'lt'
+  | 'lte'
+  | 'neq'
+  | 'like'
+  | 'ilike'
+  | 'match'
+  | 'imatch'
+  | 'in'
+  | 'is'
+  | 'isdistinct'
+  | 'fts'
+  | 'plfts'
+  | 'phfts'
+  | 'wfts'
+  | 'cs'
+  | 'cd'
+  | 'ov'
+  | 'sl'
+  | 'sr'
+  | 'nxr'
+  | 'nxl'
+  | 'adj'
+  | 'not'
+  | 'or'
+  | 'and'
+  | 'all'
+  | 'any';
+
+export class UB<T extends TableName> {
+  private selects = new Set<string>();
+  private filters: string[] = [];
+  private orders: string[] = [];
+  private lim?: number;
+  private off?: number;
+
+  constructor(private readonly table: T) {
+  }
+
+  select(...cols: string[]) {
+    cols.forEach((c) => this.selects.add(c));
+    return this;
+  }
+
+  where<K extends ColumnName<T>>(col: K, op: Op, value: RowOf<T>[K]) {
+    this.filters.push(
+      `${encodeURIComponent(String(col))}=${op}.${encodeURIComponent(String(value))}`,
+    );
+    return this;
+  }
+
+  orderBy<K extends ColumnName<T>>(
+    col: K,
+    dir: 'asc' | 'desc' = 'asc',
+    nulls?: 'first' | 'last',
+  ) {
+    this.orders.push(`${String(col)}.${dir}${nulls ? `.nulls${nulls}` : ''}`);
+    return this;
+  }
+
+  range(from: number, to: number) {
+    this.off = from;
+    this.lim = to - from + 1;
+    return this;
+  }
+
+  build(): string {
+    const p: string[] = [];
+    if (this.selects.size)
+      p.push(`select=${encodeURIComponent([...this.selects].join(','))}`);
+    if (this.filters.length) p.push(...this.filters);
+    if (this.orders.length)
+      p.push(`order=${encodeURIComponent(this.orders.join(','))}`);
+    if (this.lim !== undefined) p.push(`limit=${this.lim}`);
+    if (this.off !== undefined) p.push(`offset=${this.off}`);
+    return `${this.table}?${p.join('&')}`;
+  }
+}
+
+export const createApiUrl = <T extends TableName>(table: T) => new UB<T>(table);
+```
diff --git a/llms/public/llm-full.txt b/llms/public/llm-full.txt
new file mode 100644
index 0000000..0e43cde
--- /dev/null
+++ b/llms/public/llm-full.txt
@@ -0,0 +1,14281 @@
+
+
+<big style="margin-top: 2em">
+Angular is a web framework that empowers developers to build fast, reliable applications.
+</big>
+
+Maintained by a dedicated team at Google, Angular provides a broad suite of tools, APIs, and
+libraries to simplify and streamline your development workflow. Angular gives you
+a solid platform on which to build fast, reliable applications that scale with both the size of
+your team and the size of your codebase.
+
+**Want to see some code?** Jump over to our [Essentials](essentials) for a quick overview of
+what it's like to use Angular, or get started in the [Tutorial](tutorials/learn-angular) if you
+prefer following step-by-step instructions.
+
+## Features that power your development
+## Develop applications faster than ever
+## Ship with confidence
+## Works at any scale
+## Open-source first
+## A thriving community
+Get started with Angular quickly with online starters or locally with your terminal.
+
+## Play Online
+
+If you just want to play around with Angular in your browser without setting up a project, you can use our online sandbox:
+## Set up a new project locally
+
+If you're starting a new project, you'll most likely want to create a local project so that you can use tooling such as Git.
+
+### Prerequisites
+
+- **Node.js** - [v20.11.1 or newer](/reference/versions)
+- **Text editor** - We recommend [Visual Studio Code](https://code.visualstudio.com/)
+- **Terminal** - Required for running Angular CLI commands
+- **Development Tool** - To improve your development workflow, we recommend the [Angular Language Service](/tools/language-service)
+
+### Instructions
+
+The following guide will walk you through setting up a local Angular project.
+
+#### Install Angular CLI
+
+Open a terminal (if you're using [Visual Studio Code](https://code.visualstudio.com/), you can open an [integrated terminal](https://code.visualstudio.com/docs/editor/integrated-terminal)) and run the following command:
+
+```
+// npm
+npm install -g @angular/cli
+```
+```
+// pnpm
+pnpm install -g @angular/cli
+```
+```
+// yarn
+yarn global add @angular/cli
+```
+```
+// bun
+bun install -g @angular/cli
+```
+If you are having issues running this command in Windows or Unix, check out the [CLI docs](/tools/cli/setup-local#install-the-angular-cli) for more info.
+
+#### Create a new project
+
+In your terminal, run the CLI command `ng new` with the desired project name. In the following examples, we'll be using the example project name of `my-first-angular-app`.
+
+```shell
+ng new <project-name>
+```
+You will be presented with some configuration options for your project. Use the arrow and enter keys to navigate and select which options you desire.
+
+If you don't have any preferences, just hit the enter key to take the default options and continue with the setup.
+
+After you select the configuration options and the CLI runs through the setup, you should see the following message:
+
+```shell
+✔ Packages installed successfully.
+    Successfully initialized git.
+```
+
+At this point, you're now ready to run your project locally!
+
+#### Running your new project locally
+
+In your terminal, switch to your new Angular project.
+
+```shell
+cd my-first-angular-app
+```
+All of your dependencies should be installed at this point (which you can verify by checking for the existent for a `node_modules` folder in your project), so you can start your project by running the command:
+
+```shell
+npm start
+```
+If everything is successful, you should see a similar confirmation message in your terminal:
+
+```shell
+Watch mode enabled. Watching for file changes...
+NOTE: Raw file sizes do not reflect development server per-request transformations.
+  ➜  Local:   http://localhost:4200/
+  ➜  press h + enter to show help
+```
+
+And now you can visit the path in `Local` (e.g., `http://localhost:4200`) to see your application. Happy coding! 🎉
+
+### Using AI for Development
+
+To get started with building in your preferred AI powered IDE, [check out Angular prompt rules and best practices](/ai/develop-with-ai).
+
+## Next steps
+
+Now that you've created your Angular project, you can learn more about Angular in our [Essentials guide](/essentials) or choose a topic in our in-depth guides!
+# Angular coding style guide
+
+## Introduction
+
+This guide covers a range of style conventions for Angular application code. These recommendations
+are not required for Angular to work, but instead establish a set of coding practices that promote
+consistency across the Angular ecosystem. A consistent set of practices makes it easier to share
+code and move between projects.
+
+This guide does _not_ cover TypeScript or general coding practices unrelated to Angular. For
+TypeScript, check
+out [Google's TypeScript style guide](https://google.github.io/styleguide/tsguide.html).
+
+### When in doubt, prefer consistency
+
+Whenever you encounter a situation in which these rules contradict the style of a particular file,
+prioritize maintaining consistency within a file. Mixing different style conventions in a single
+file creates more confusion than diverging from the recommendations in this guide.
+
+## Naming
+
+### Separate words in file names with hyphens
+
+Separate words within a file name with hyphens (`-`). For example, a component named `UserProfile`
+has a file name `user-profile.ts`.
+
+### Use the same name for a file's tests with `.spec` at the end
+
+For unit tests, end file names with `.spec.ts`. For example, the unit test file for
+the `UserProfile` component has the file name `user-profile.spec.ts`.
+
+### Match file names to the TypeScript identifier within
+
+File names should generally describe the contents of the code in the file. When the file contains a
+TypeScript class, the file name should reflect that class name. For example, a file containing a
+component named `UserProfile` has the name `user-profile.ts`.
+
+If the file contains more than one primary namable identifier, choose a name that describes the
+common theme to the code within. If the code in a file does not fit within a common theme or feature
+area, consider breaking the code up into different files. Avoid overly generic file names
+like `helpers.ts`, `utils.ts`, or `common.ts`.
+
+### Use the same file name for a component's TypeScript, template, and styles
+
+Components typically consist of one TypeScript file, one template file, and one style file. These
+files should share the same name with different file extensions. For example, a `UserProfile`
+component can have the files `user-profile.ts`, `user-profile.html`, and `user-profile.css`.
+
+If a component has more than one style file, append the name with additional words that describe the
+styles specific to that file. For example, `UserProfile` might have style
+files `user-profile-settings.css` and `user-profile-subscription.css`.
+
+## Project structure
+
+### All the application's code goes in a directory named `src`
+
+All of your Angular UI code (TypeScript, HTML, and styles) should live inside a directory
+named `src`. Code that's not related to UI, such as configuration files or scripts, should live
+outside the `src` directory.
+
+This keeps the root application directory consistent between different Angular projects and creates
+a clear separation between UI code and other code in your project.
+
+### Bootstrap your application in a file named `main.ts` directly inside `src`
+
+The code to start up, or **bootstrap**, an Angular application should always live in a file
+named `main.ts`. This represents the primary entry point to the application.
+
+### Group closely related files together in the same directory
+
+Angular components consist of a TypeScript file and, optionally, a template and one or more style
+files. You should group these together in the same directory.
+
+Unit tests should live in the same directory as the code-under-test. Avoid collecting unrelated
+tests into a single `tests` directory.
+
+### Organize your project by feature areas
+
+Organize your project into subdirectories based on the features of your application or common themes
+to the code in those directories. For example, the project structure for a movie theater site,
+MovieReel, might look like this:
+
+```
+src/
+├─ movie-reel/
+│ ├─ show-times/
+│ │ ├─ film-calendar/
+│ │ ├─ film-details/
+│ ├─ reserve-tickets/
+│ │ ├─ payment-info/
+│ │ ├─ purchase-confirmation/
+```
+
+Avoid creating subdirectories based on the type of code that lives in those directories. For
+example, avoid creating directories like `components`, `directives`, and `services`.
+
+Avoid putting so many files into one directory that it becomes hard to read or navigate. As the
+number of files in a directory grows, consider splitting further into additional sub-directories.
+
+### One concept per file
+
+Prefer focusing source files on a single _concept_. For Angular classes specifically, this usually
+means one component, directive, or service per file. However, it's okay if a file contains more than
+one component or directive if your classes are relatively small and they tie together as part of a
+single concept.
+
+When in doubt, go with the approach that leads to smaller files.
+
+## Dependency injection
+
+### Prefer the `inject` function over constructor parameter injection
+
+Prefer using the `inject` function over injecting constructor parameters. The `inject` function works the same way as constructor parameter injection, but offers several style advantages:
+
+*   `inject` is generally more readable, especially when a class injects many dependencies.
+*   It's more syntactically straightforward to add comments to injected dependencies
+*   `inject` offers better type inference.
+*   When targeting ES2022+ with [`useDefineForClassFields`](https://www.typescriptlang.org/tsconfig/#useDefineForClassFields), you can avoid separating field declaration and initialization when fields read on injected dependencies.
+
+[You can refactor existing code to `inject` with an automatic tool](reference/migrations/inject-function).
+
+## Components and directives
+
+### Choosing component selectors
+
+See
+the [Components guide for details on choosing component selectors](guide/components/selectors#choosing-a-selector).
+
+### Naming component and directive members
+
+See the Components guide for details
+on [naming input properties](guide/components/inputs#choosing-input-names)
+and [naming output properties](guide/components/outputs#choosing-event-names).
+
+### Choosing directive selectors
+
+Directives should use the
+same [application-specific prefix](guide/components/selectors#selector-prefixes)
+as your components.
+
+When using an attribute selector for a directive, use a camelCase attribute name. For example, if
+your application is named "MovieReel" and you build a directive that adds a tooltip to an element,
+you might use the selector `[mrTooltip]`.
+
+### Group Angular-specific properties before methods
+
+Components and directives should group Angular-specific properties together, typically near the top
+of the class declaration. This includes injected dependencies, inputs, outputs, and queries. Define
+these and other properties before the class's methods.
+
+This practice makes it easier to find the class's template APIs and dependencies.
+
+### Keep components and directives focused on presentation
+
+Code inside your components and directives should generally relate to the UI shown on the page. For
+code that makes sense on its own, decoupled from the UI, prefer refactoring to other files. For
+example, you can factor form validation rules or data transformations into separate functions or
+classes.
+
+### Avoid overly complex logic in templates
+
+Angular templates are designed to
+accommodate [JavaScript-like expressions](guide/templates/expression-syntax).
+You should take advantage of these expressions to capture relatively straightforward logic directly
+in template expressions.
+
+When the code in a template gets too complex, though, refactor logic into the TypeScript code (typically with a [computed](guide/signals#computed-signals)).
+
+There's no one hard-and-fast rule that determines what constitutes "complex". Use your best
+judgement.
+
+### Use `protected` on class members that are only used by a component's template
+
+A component class's public members intrinsically define a public API that's accessible via
+dependency injection and [queries](guide/components/queries). Prefer `protected`
+access for any members that are meant to be read from the component's template.
+
+```ts
+@Component({
+  ...,
+  template: `<p>{{ fullName() }}</p>`,
+})
+export class UserProfile {
+  firstName = input();
+  lastName = input();
+
+// `fullName` is not part of the component's public API, but is used in the template.
+  protected fullName = computed(() => `${this.firstName()} ${this.lastName()}`);
+}
+```
+
+### Use `readonly` on properties that are initialized by Angular
+
+Mark component and directive properties initialized by Angular as `readonly`. This includes
+properties initialized by `input`, `model`, `output`, and queries. The readonly access modifier
+ensures that the value set by Angular is not overwritten.
+
+```ts
+@Component({/* ... */})
+export class UserProfile {
+  readonly userId = input();
+  readonly userSaved = output();
+}
+```
+
+For components and directives that use the decorator-based `@Input`, `@Output`, and query APIs, this
+advice applies to output properties and queries, but not input properties.
+
+```ts
+@Component({/* ... */})
+export class UserProfile {
+  @Output() readonly userSaved = new EventEmitter<void>();
+  @ViewChildren(PaymentMethod) readonly paymentMethods?: QueryList<PaymentMethod>;
+}
+```
+
+### Prefer `class` and `style` over `ngClass` and `ngStyle`
+
+Prefer `class` and `style` bindings over using the [`NgClass`](/api/common/NgClass) and [`NgStyle`](/api/common/NgStyle) directives.
+
+```html
+<!-- PREFER -->
+<div [class.admin]="isAdmin" [class.dense]="density === 'high'">
+<!-- OR -->
+<div [class]="{admin: isAdmin, dense: density === 'high'}">
+<!-- AVOID -->
+<div [ngClass]="{admin: isAdmin, dense: density === 'high'}">
+```
+
+Both `class` and `style` bindings use a more straightforward syntax that aligns closely with
+standard HTML attributes. This makes your templates easier to read and understand, especially for
+developers familiar with basic HTML.
+
+Additionally, the `NgClass` and `NgStyle` directives incur an additional performance cost compared
+to the built-in `class` and `style` binding syntax.
+
+For more details, refer to the [bindings guide](/guide/templates/binding#css-class-and-style-property-bindings)
+
+### Name event handlers for what they _do_, not for the triggering event
+
+Prefer naming event handlers for the action they perform rather than for the triggering event:
+
+```html
+<!-- PREFER -->
+<button (click)="saveUserData()">Save</button>
+
+<!-- AVOID -->
+<button (click)="handleClick()">Save</button>
+```
+
+Using meaningful names like this makes it easier to tell what an event does from reading the
+template.
+
+For keyboard events, you can use Angular's key event modifiers with specific handler names:
+
+```html
+<textarea (keydown.control.enter)="commitNotes()" (keydown.control.space)="showSuggestions()">
+```
+
+Sometimes, event handling logic is especially long or complex, making it impractical to declare a
+single well-named handler. In these cases, it's fine to fall back to a name like 'handleKeydown' and
+then delegate to more specific behaviors based on the event details:
+
+```ts
+@Component({/* ... */})
+class RichText {
+  handleKeydown(event: KeyboardEvent) {
+    if (event.ctrlKey) {
+      if (event.key === 'B') {
+        this.activateBold();
+      } else if (event.key === 'I') {
+        this.activateItalic();
+      }
+// ...
+    }
+  }
+}
+```
+
+### Keep lifecycle methods simple
+
+Avoid putting long or complex logic inside lifecycle hooks like `ngOnInit`. Instead, prefer creating
+well-named methods to contain that logic and then _call those methods_ in your lifecycle hooks.
+Lifecycle hook names describe _when_ they run, meaning that the code inside doesn't have a
+meaningful name that describes what the code inside is doing.
+
+```typescript
+// PREFER
+ngOnInit() {
+  this.startLogging();
+  this.runBackgroundTask();
+}
+
+// AVOID
+ngOnInit() {
+  this.logger.setMode('info');
+  this.logger.monitorErrors();
+  // ...and all the rest of the code that would be unrolled from these methods.
+}
+```
+
+### Use lifecycle hook interfaces
+
+Angular provides a TypeScript interface for each lifecycle method. When adding a lifecycle hook to
+your class, import and `implement` these interfaces to ensure that the methods are named correctly.
+
+```ts
+import {Component, OnInit} from '@angular/core';
+
+@Component({/* ... */})
+export class UserProfile implements OnInit {
+
+  // The `OnInit` interface ensures this method is named correctly.
+  ngOnInit() { /* ... */ }
+}
+```
+Components are the main building blocks of Angular applications. Each component represents a part of a larger web page. Organizing an application into components helps provide structure to your project, clearly separating code into specific parts that are easy to maintain and grow over time.
+
+## Defining a component
+
+Every component has a few main parts:
+
+1. A `@Component`[decorator](https://www.typescriptlang.org/docs/handbook/decorators.html) that contains some configuration used by Angular.
+2. An HTML template that controls what renders into the DOM.
+3. A [CSS selector](https://developer.mozilla.org/docs/Learn/CSS/Building_blocks/Selectors) that defines how the component is used in HTML.
+4. A TypeScript class with behaviors, such as handling user input or making requests to a server.
+
+Here is a simplified example of a `UserProfile` component.
+
+```typescript
+// user-profile.ts
+@Component({
+  selector: 'user-profile',
+  template: `
+    <h1>User profile</h1>
+    <p>This is the user profile page</p>
+  `,
+})
+export class UserProfile { /* Your component code goes here */ }
+```
+
+The `@Component` decorator also optionally accepts a `styles` property for any CSS you want to apply to your template:
+
+```typescript
+// user-profile.ts
+@Component({
+  selector: 'user-profile',
+  template: `
+    <h1>User profile</h1>
+    <p>This is the user profile page</p>
+  `,
+  styles: `h1 { font-size: 3em; } `,
+})
+export class UserProfile { /* Your component code goes here */ }
+```
+
+### Separating HTML and CSS into separate files
+
+You can define a component's HTML and CSS in separate files using `templateUrl` and `styleUrl`:
+
+```typescript
+// user-profile.ts
+@Component({
+  selector: 'user-profile',
+  templateUrl: 'user-profile.html',
+  styleUrl: 'user-profile.css',
+})
+export class UserProfile {
+  // Component behavior is defined in here
+}
+```
+
+```html
+<!-- user-profile.html -->
+<h1>User profile</h1>
+<p>This is the user profile page</p>
+```
+
+```css
+/* user-profile.css */
+h1 {
+  font-size: 3em;
+}
+```
+
+## Using components
+
+You build an application by composing multiple components together. For example, if you are building a user profile page, you might break the page up into several components like this:
+
+```mermaid
+flowchart TD
+    A[UserProfile]-->B
+    A-->C
+    B[UserBiography]-->D
+    C[ProfilePhoto]
+    D[UserAddress]
+```
+
+Here, the `UserProfile` component uses several other components to produce the final page.
+
+To import and use a component, you need to:
+1. In your component's TypeScript file, add an `import` statement for the component you want to use.
+2. In your `@Component` decorator, add an entry to the `imports` array for the component you want to use.
+3. In your component's template, add an element that matches the selector of the component you want to use.
+
+Here's an example of a `UserProfile` component importing a `ProfilePhoto` component:
+
+```typescript
+// user-profile.ts
+import {ProfilePhoto} from 'profile-photo.ts';
+
+@Component({
+  selector: 'user-profile',
+  imports: [ProfilePhoto],
+  template: `
+    <h1>User profile</h1>
+    <profile-photo />
+    <p>This is the user profile page</p>
+  `,
+})
+export class UserProfile {
+  // Component behavior is defined in here
+}
+```
+
+TIP: Want to know more about Angular components? See the [In-depth Components guide](guide/components) for the full details.
+
+## Next Step
+
+Now that you know how components work in Angular, it's time to learn how we add and manage dynamic data in our application.
+# Component selectors
+
+TIP: This guide assumes you've already read the [Essentials Guide](essentials). Read that first if you're new to Angular.
+
+Every component defines
+a [CSS selector](https://developer.mozilla.org/docs/Web/CSS/CSS_selectors) that determines how
+the component is used:
+
+```typescript
+@Component({
+  selector: 'profile-photo',
+  ...
+})
+export class ProfilePhoto { }
+```
+You use a component by creating a matching HTML element in the templates of _other_ components:
+
+```typescript
+@Component({
+  template: `
+    <profile-photo />
+    <button>Upload a new profile photo</button>`,
+  ...,
+})
+export class UserProfile { }
+```
+**Angular matches selectors statically at compile-time**. Changing the DOM at run-time, either via
+Angular bindings or with DOM APIs, does not affect the components rendered.
+
+**An element can match exactly one component selector.** If multiple component selectors match a
+single element, Angular reports an error.
+
+**Component selectors are case-sensitive.**
+
+## Types of selectors
+
+Angular supports a limited subset
+of [basic CSS selector types](https://developer.mozilla.org/docs/Web/CSS/CSS_Selectors) in
+component selectors:
+
+| **Selector type**  | **Description**                                                                                                 | **Examples**                  |
+| ------------------ | --------------------------------------------------------------------------------------------------------------- | ----------------------------- |
+| Type selector      | Matches elements based on their HTML tag name, or node name.                                                    | `profile-photo`               |
+| Attribute selector | Matches elements based on the presence of an HTML attribute and, optionally, an exact value for that attribute. | `[dropzone]` `[type="reset"]` |
+| Class selector     | Matches elements based on the presence of a CSS class.                                                          | `.menu-item`                  |
+
+For attribute values, Angular supports matching an exact attribute value with the equals (`=`)
+operator. Angular does not support other attribute value operators.
+
+Angular component selectors do not support combinators, including
+the [descendant combinator](https://developer.mozilla.org/docs/Web/CSS/Descendant_combinator)
+or [child combinator](https://developer.mozilla.org/docs/Web/CSS/Child_combinator).
+
+Angular component selectors do not support
+specifying [namespaces](https://developer.mozilla.org/docs/Web/SVG/Namespaces_Crash_Course).
+
+### The `:not` pseudo-class
+
+Angular supports [the `:not` pseudo-class](https://developer.mozilla.org/docs/Web/CSS/:not).
+You can append this pseudo-class to any other selector to narrow which elements a component's
+selector matches. For example, you could define a `[dropzone]` attribute selector and prevent
+matching `textarea` elements:
+
+```typescript
+@Component({
+  selector: '[dropzone]:not(textarea)',
+  ...
+})
+export class DropZone { }
+```
+Angular does not support any other pseudo-classes or pseudo-elements in component selectors.
+
+### Combining selectors
+
+You can combine multiple selectors by concatenating them. For example, you can match `<button>`
+elements that specify `type="reset"`:
+
+```typescript
+@Component({
+  selector: 'button[type="reset"]',
+  ...
+})
+export class ResetButton { }
+```
+You can also define multiple selectors with a comma-separated list:
+
+```typescript
+@Component({
+  selector: 'drop-zone, [dropzone]',
+  ...
+})
+export class DropZone { }
+```
+Angular creates a component for each element that matches _any_ of the selectors in the list.
+
+## Choosing a selector
+
+The vast majority of components should use a custom element name as their selector. All custom
+element names should include a hyphen as described
+by [the HTML specification](https://html.spec.whatwg.org/multipage/custom-elements.html#valid-custom-element-name).
+By default, Angular reports an error if it encounters a custom tag name that does not match any
+available components, preventing bugs due to mistyped component names.
+
+See [Advanced component configuration](guide/components/advanced-configuration) for details on
+using [native custom elements](https://developer.mozilla.org/docs/Web/Web_Components) in
+Angular templates.
+
+### Selector prefixes
+
+The Angular team recommends using a short, consistent prefix for all the custom components
+defined inside your project. For example, if you were to build YouTube with Angular, you might
+prefix your components with `yt-`, with components like `yt-menu`, `yt-player`, etc. Namespacing
+your selectors like this makes it immediately clear where a particular component comes from. By
+default, the Angular CLI uses `app-`.
+
+Angular uses the `ng` selector prefix for its own framework APIs. Never use `ng` as a selector
+prefix for your own custom components.
+
+### When to use an attribute selector
+
+You should consider an attribute selector when you want to create a component on a standard native
+element. For example, if you want to create a custom button component, you can take advantage of the
+standard `<button>` element by using an attribute selector:
+
+```typescript
+@Component({
+  selector: 'button[yt-upload]',
+   ...
+})
+export class YouTubeUploadButton { }
+```
+This approach allows consumers of the component to directly use all the element's standard APIs
+without extra work. This is especially valuable for ARIA attributes such as `aria-label`.
+
+Angular does not report errors when it encounters custom attributes that don't match an available
+component. When using components with attribute selectors, consumers may forget to import the
+component or its NgModule, resulting in the component not rendering.
+See [Importing and using components](guide/components/importing) for more information.
+
+Components that define attribute selectors should use lowercase, dash-case attributes. You can
+follow the same prefixing recommendation described above.
+# Styling components
+
+TIP: This guide assumes you've already read the [Essentials Guide](essentials). Read that first if you're new to Angular.
+
+Components can optionally include CSS styles that apply to that component's DOM:
+
+```typescript
+@Component({
+  selector: 'profile-photo',
+  template: `<img src="profile-photo.jpg" alt="Your profile photo">`,
+  styles: ` img { border-radius: 50%; } `,
+})
+export class ProfilePhoto { }
+```
+You can also choose to write your styles in separate files:
+
+```typescript
+@Component({
+  selector: 'profile-photo',
+  templateUrl: 'profile-photo.html',
+  styleUrl: 'profile-photo.css',
+})
+export class ProfilePhoto { }
+```
+When Angular compiles your component, these styles are emitted with your component's JavaScript
+output. This means that component styles participate in the JavaScript module system. When you
+render an Angular component, the framework automatically includes its associated styles, even when
+lazy-loading a component.
+
+Angular works with any tool that outputs CSS,
+including [Sass](https://sass-lang.com), [less](https://lesscss.org),
+and [stylus](https://stylus-lang.com).
+
+## Style scoping
+
+Every component has a **view encapsulation** setting that determines how the framework scopes a
+component's styles. There are three view encapsulation modes: `Emulated`, `ShadowDom`, and `None`.
+You can specify the mode in the `@Component` decorator:
+
+```typescript
+@Component({
+  ...,
+  encapsulation: ViewEncapsulation.None,
+})
+export class ProfilePhoto { }
+```
+### ViewEncapsulation.Emulated
+
+By default, Angular uses emulated encapsulation so that a component's styles only apply to elements
+defined in that component's template. In this mode, the framework generates a unique HTML attribute
+for each component instance, adds that attribute to elements in the component's template, and
+inserts that attribute into the CSS selectors defined in your component's styles.
+
+This mode ensures that a component's styles do not leak out and affect other components. However,
+global styles defined outside of a component may still affect elements inside a component with
+emulated encapsulation.
+
+In emulated mode, Angular supports
+the [`:host`](https://developer.mozilla.org/docs/Web/CSS/:host)
+and [`:host-context()`](https://developer.mozilla.org/docs/Web/CSS/:host-context) pseudo
+classes without
+using [Shadow DOM](https://developer.mozilla.org/docs/Web/Web_Components/Using_shadow_DOM).
+During compilation, the framework transforms these pseudo classes into attributes so it doesn't
+comply with these native pseudo classes' rules at runtime (e.g. browser compatibility, specificity). Angular's
+emulated encapsulation mode does not support any other pseudo classes related to Shadow DOM, such
+as `::shadow` or `::part`.
+
+#### `::ng-deep`
+
+Angular's emulated encapsulation mode supports a custom pseudo class, `::ng-deep`. Applying this
+pseudo class to a CSS rule disables encapsulation for that rule, effectively turning it into a
+global style. **The Angular team strongly discourages new use of `::ng-deep`**. These APIs remain
+exclusively for backwards compatibility.
+
+### ViewEncapsulation.ShadowDom
+
+This mode scopes styles within a component by
+using [the web standard Shadow DOM API](https://developer.mozilla.org/docs/Web/Web_Components/Using_shadow_DOM).
+When enabling this mode, Angular attaches a shadow root to the component's host element and renders
+the component's template and styles into the corresponding shadow tree.
+
+This mode strictly guarantees that _only_ that component's styles apply to elements in the
+component's template. Global styles cannot affect elements in a shadow tree and styles inside the
+shadow tree cannot affect elements outside of that shadow tree.
+
+Enabling `ShadowDom` encapsulation, however, impacts more than style scoping. Rendering the
+component in a shadow tree affects event propagation, interaction
+with [the `<slot>` API](https://developer.mozilla.org/docs/Web/Web_Components/Using_templates_and_slots),
+and how browser developer tools show elements. Always understand the full implications of using
+Shadow DOM in your application before enabling this option.
+
+### ViewEncapsulation.None
+
+This mode disables all style encapsulation for the component. Any styles associated with the
+component behave as global styles.
+
+NOTE: In `Emulated` and `ShadowDom` modes, Angular doesn't 100% guarantee that your component's styles will always override styles coming from outside it.
+It is assumed that these styles have the same specificity as your component's styles in case of collision.
+
+## Defining styles in templates
+
+You can use the `<style>` element in a component's template to define additional styles. The
+component's view encapsulation mode applies to styles defined this way.
+
+Angular does not support bindings inside of style elements.
+
+## Referencing external style files
+
+Component templates can
+use [the `<link>` element](https://developer.mozilla.org/docs/Web/HTML/Element/link) to
+reference CSS files. Additionally, your CSS may
+use [the `@import`at-rule](https://developer.mozilla.org/docs/Web/CSS/@import) to reference
+CSS files. Angular treats these references as _external_ styles. External styles are not affected by
+emulated view encapsulation.
+# Accepting data with input properties
+
+TIP: This guide assumes you've already read the [Essentials Guide](essentials). Read that first if you're new to Angular.
+
+TIP: If you're familiar with other web frameworks, input properties are similar to _props_.
+
+When you use a component, you commonly want to pass some data to it. A component specifies the data that it accepts by declaring
+**inputs**:
+
+```ts
+import {Component, input} from '@angular/core';
+
+@Component({/*...*/})
+export class CustomSlider {
+  // Declare an input named 'value' with a default value of zero.
+  value = input(0);
+}
+```
+This lets you bind to the property in a template:
+
+```html
+<custom-slider [value]="50" />
+```
+
+If an input has a default value, TypeScript infers the type from the default value:
+
+```typescript
+@Component({/*...*/})
+export class CustomSlider {
+  // TypeScript infers that this input is a number, returning InputSignal<number>.
+  value = input(0);
+}
+```
+
+You can explicitly declare a type for the input by specifying a generic parameter to the function.
+
+If an input without a default value is not set, its value is `undefined`:
+
+```typescript
+@Component({/*...*/})
+export class CustomSlider {
+  // Produces an InputSignal<number | undefined> because `value` may not be set.
+  value = input<number>();
+}
+```
+
+**Angular records inputs statically at compile-time**. Inputs cannot be added or removed at run-time.
+
+The `input` function has special meaning to the Angular compiler. **You can exclusively call `input` in component and directive property initializers.**
+
+When extending a component class, **inputs are inherited by the child class.**
+
+**Input names are case-sensitive.**
+
+## Reading inputs
+
+The `input` function returns an `InputSignal`. You can read the value by calling the signal:
+
+```ts
+import {Component, input} from '@angular/core';
+
+@Component({/*...*/})
+export class CustomSlider {
+  // Declare an input named 'value' with a default value of zero.
+  value = input(0);
+
+  // Create a computed expression that reads the value input
+  label = computed(() => `The slider's value is ${this.value()}`);
+}
+```
+Signals created by the `input` function are read-only.
+
+## Required inputs
+
+You can declare that an input is `required` by calling `input.required` instead of `input`:
+
+```ts
+@Component({/*...*/})
+export class CustomSlider {
+  // Declare a required input named value. Returns an `InputSignal<number>`.
+  value = input.required<number>();
+}
+```
+Angular enforces that required inputs _must_ be set when the component is used in a template. If you try to use a component without specifying all of its required inputs, Angular reports an error at build-time.
+
+Required inputs do not automatically include `undefined` in the generic parameter of the returned `InputSignal`.
+
+## Configuring inputs
+
+The `input` function accepts a config object as a second parameter that lets you change the way that input works.
+
+### Input transforms
+
+You can specify a `transform` function to change the value of an input when it's set by Angular.
+
+```ts
+@Component({
+  selector: 'custom-slider',
+  /*...*/
+})
+export class CustomSlider {
+  label = input('', {transform: trimString});
+}
+
+function trimString(value: string | undefined): string {
+  return value?.trim() ?? '';
+}
+```
+```html
+<custom-slider [label]="systemVolume" />
+```
+
+In the example above, whenever the value of `systemVolume` changes, Angular runs `trimString` and sets `label` to the result.
+
+The most common use-case for input transforms is to accept a wider range of value types in templates, often including `null` and `undefined`.
+
+**Input transform function must be statically analyzable at build-time.** You cannot set transform functions conditionally or as the result of an expression evaluation.
+
+**Input transform functions should always be [pure functions](https://en.wikipedia.org/wiki/Pure_function).** Relying on state outside the transform function can lead to unpredictable behavior.
+
+#### Type checking
+
+When you specify an input transform, the type of the transform function's parameter determines the types of values that can be set to the input in a template.
+
+```ts
+@Component({/*...*/})
+export class CustomSlider {
+  widthPx = input('', {transform: appendPx});
+}
+
+function appendPx(value: number): string {
+  return `${value}px`;
+}
+```
+In the example above, the `widthPx` input accepts a `number` while the `InputSignal` property returns a `string`.
+
+#### Built-in transformations
+
+Angular includes two built-in transform functions for the two most common scenarios: coercing values to boolean and numbers.
+
+```ts
+import {Component, input, booleanAttribute, numberAttribute} from '@angular/core';
+
+@Component({/*...*/})
+export class CustomSlider {
+  disabled = input(false, {transform: booleanAttribute});
+  value = input(0, {transform: numberAttribute});
+}
+```
+`booleanAttribute` imitates the behavior of standard HTML [boolean attributes](https://developer.mozilla.org/docs/Glossary/Boolean/HTML), where the
+_presence_ of the attribute indicates a "true" value. However, Angular's `booleanAttribute` treats the literal string `"false"` as the boolean `false`.
+
+`numberAttribute` attempts to parse the given value to a number, producing `NaN` if parsing fails.
+
+### Input aliases
+
+You can specify the `alias` option to change the name of an input in templates.
+
+```ts
+@Component({/*...*/})
+export class CustomSlider {
+  value = input(0, {alias: 'sliderValue'});
+}
+```
+```html
+<custom-slider [sliderValue]="50" />
+```
+
+This alias does not affect usage of the property in TypeScript code.
+
+While you should generally avoid aliasing inputs for components, this feature can be useful for renaming properties while preserving an alias for the original name or for avoiding collisions with the name of native DOM element properties.
+
+## Model inputs
+
+**Model inputs** are a special type of input that enable a component to propagate new values back to its parent component.
+
+When creating a component, you can define a model input similarly to how you create a standard input.
+
+Both types of input allow someone to bind a value into the property. However, **model inputs allow the component author to write values into the property**. If the property is bound with a two-way binding, the new value propagates to that binding.
+
+```typescript
+@Component({ /* ... */})
+export class CustomSlider {
+  // Define a model input named "value".
+  value = model(0);
+
+  increment() {
+    // Update the model input with a new value, propagating the value to any bindings.
+    this.value.update(oldValue => oldValue + 10);
+  }
+}
+
+@Component({
+  /* ... */
+  // Using the two-way binding syntax means that any changes to the slider's
+  // value automatically propagate back to the `volume` signal.
+  // Note that this binding uses the signal *instance*, not the signal value.
+  template: `<custom-slider [(value)]="volume" />`,
+})
+export class MediaControls {
+  // Create a writable signal for the `volume` local state.
+  volume = signal(0);
+}
+```
+
+In the above example, the `CustomSlider` can write values into its `value` model input, which then propagates those values back to the `volume` signal in `MediaControls`. This binding keeps the values of `value` and `volume` in sync. Notice that the binding passes the `volume` signal instance, not the _value_ of the signal.
+
+In other respects, model inputs work similarly to standard inputs. You can read the value by calling the signal function, including in reactive contexts like `computed` and `effect`.
+
+See [Two-way binding](guide/templates/two-way-binding) for more details on two-way binding in templates.
+
+### Two-way binding with plain properties
+
+You can bind a plain JavaScript property to a model input.
+
+```typescript
+@Component({
+  /* ... */
+  // `value` is a model input.
+  // The parenthesis-inside-square-brackets syntax (aka "banana-in-a-box") creates a two-way binding
+  template: '<custom-slider [(value)]="volume" />',
+})
+export class MediaControls {
+  protected volume = 0;
+}
+```
+
+In the example above, the `CustomSlider` can write values into its `value` model input, which then propagates those values back to the `volume` property in `MediaControls`. This binding keeps the values of `value` and `volume` in sync.
+
+### Implicit `change` events
+
+When you declare a model input in a component or directive, Angular automatically creates a corresponding [output](guide/components/outputs) for that model. The output's name is the model input's name suffixed with "Change".
+
+```typescript
+@Directive({ /* ... */ })
+export class CustomCheckbox {
+  // This automatically creates an output named "checkedChange".
+  // Can be subscribed to using `(checkedChange)="handler()"` in the template.
+  checked = model(false);
+}
+```
+
+Angular emits this change event whenever you write a new value into the model input by calling its `set` or `update` methods.
+
+See [Custom events with outputs](guide/components/outputs) for more details on outputs.
+
+### Customizing model inputs
+
+You can mark a model input as required or provide an alias in the same way as a [standard input](guide/signals/inputs).
+
+Model inputs do not support input transforms.
+
+### When to use model inputs
+
+Use model inputs when you want a component to support two-way binding. This is typically appropriate when a component exists to modify a value based on user interaction. Most commonly, custom form controls, such as a date picker or combobox, should use model inputs for their primary value.
+
+## Choosing input names
+
+Avoid choosing input names that collide with properties on DOM elements like HTMLElement. Name collisions introduce confusion about whether the bound property belongs to the component or the DOM element.
+
+Avoid adding prefixes for component inputs like you would with component selectors. Since a given element can only host one component, any custom properties can be assumed to belong to the component.
+
+## Declaring inputs with the `@Input` decorator
+
+TIP: While the Angular team recommends using the signal-based `input` function for new projects, the original decorator-based `@Input` API remains fully supported.
+
+You can alternatively declare component inputs by adding the `@Input` decorator to a property:
+
+```ts
+@Component({...})
+export class CustomSlider {
+  @Input() value = 0;
+}
+```
+Binding to an input is the same in both signal-based and decorator-based inputs:
+
+```html
+<custom-slider [value]="50" />
+```
+
+### Customizing decorator-based inputs
+
+The `@Input` decorator accepts a config object that lets you change the way that input works.
+
+#### Required inputs
+
+You can specify the `required` option to enforce that a given input must always have a value.
+
+```ts
+@Component({...})
+export class CustomSlider {
+  @Input({required: true}) value = 0;
+}
+```
+If you try to use a component without specifying all of its required inputs, Angular reports an error at build-time.
+
+#### Input transforms
+
+You can specify a `transform` function to change the value of an input when it's set by Angular. This transform function works identically to transform functions for signal-based inputs described above.
+
+```ts
+@Component({
+  selector: 'custom-slider',
+  ...
+})
+export class CustomSlider {
+  @Input({transform: trimString}) label = '';
+}
+
+function trimString(value: string | undefined) { return value?.trim() ?? ''; }
+```
+#### Input aliases
+
+You can specify the `alias` option to change the name of an input in templates.
+
+```ts
+@Component({...})
+export class CustomSlider {
+  @Input({alias: 'sliderValue'}) value = 0;
+}
+```
+```html
+<custom-slider [sliderValue]="50" />
+```
+
+The `@Input` decorator also accepts the alias as its first parameter in place of the config object.
+
+Input aliases work the same way as for signal-based inputs described above.
+
+### Inputs with getters and setters
+
+When using decorator-based inputs, a property implemented with a getter and setter can be an input:
+
+```ts
+export class CustomSlider {
+  @Input()
+  get value(): number {
+    return this.internalValue;
+  }
+
+  set value(newValue: number) { this.internalValue = newValue; }
+
+  private internalValue = 0;
+}
+```
+You can even create a _write-only_ input by only defining a public setter:
+
+```ts
+export class CustomSlider {
+  @Input()
+  set value(newValue: number) {
+    this.internalValue = newValue;
+  }
+
+  private internalValue = 0;
+}
+```
+**Prefer using input transforms instead of getters and setters** if possible.
+
+Avoid complex or costly getters and setters. Angular may invoke an input's setter multiple times, which may negatively impact application performance if the setter performs any costly behaviors, such as DOM manipulation.
+
+## Specify inputs in the `@Component` decorator
+
+In addition to the `@Input` decorator, you can also specify a component's inputs with the `inputs` property in the `@Component` decorator. This can be useful when a component inherits a property from a base class:
+
+```ts
+// `CustomSlider` inherits the `disabled` property from `BaseSlider`.
+@Component({
+  ...,
+  inputs: ['disabled'],
+})
+export class CustomSlider extends BaseSlider { }
+```
+You can additionally specify an input alias in the `inputs` list by putting the alias after a colon in the string:
+
+```ts
+// `CustomSlider` inherits the `disabled` property from `BaseSlider`.
+@Component({
+  ...,
+  inputs: ['disabled: sliderDisabled'],
+})
+export class CustomSlider extends BaseSlider { }
+```
+
+# Custom events with outputs
+
+TIP: This guide assumes you've already read the [Essentials Guide](essentials). Read that first if you're new to Angular.
+
+Angular components can define custom events by assigning a property to the `output` function:
+
+```ts
+@Component({/*...*/})
+export class ExpandablePanel {
+  panelClosed = output<void>();
+}
+```
+```html
+<expandable-panel (panelClosed)="savePanelState()" />
+```
+
+The `output` function returns an `OutputEmitterRef`. You can emit an event by calling the `emit` method on the `OutputEmitterRef`:
+
+```ts
+this.panelClosed.emit();
+```
+Angular refers to properties initialized with the `output` function as **outputs**. You can use outputs to raise custom events, similar to native browser events like `click`.
+
+**Angular custom events do not bubble up the DOM**.
+
+**Output names are case-sensitive.**
+
+When extending a component class, **outputs are inherited by the child class.**
+
+The `output` function has special meaning to the Angular compiler. **You can exclusively call `output` in component and directive property initializers.**
+
+## Emitting event data
+
+You can pass event data when calling `emit`:
+
+```ts
+// You can emit primitive values.
+this.valueChanged.emit(7);
+
+// You can emit custom event objects
+this.thumbDropped.emit({
+  pointerX: 123,
+  pointerY: 456,
+})
+```
+When defining an event listener in a template, you can access the event data from the `$event` variable:
+
+```html
+<custom-slider (valueChanged)="logValue($event)" />
+```
+
+## Customizing output names
+
+The `output` function accepts a parameter that lets you specify a different name for the event in a template:
+
+```ts
+@Component({/*...*/})
+export class CustomSlider {
+  changed = output({alias: 'valueChanged'});
+}
+```
+```html
+<custom-slider (valueChanged)="saveVolume()" />
+```
+
+This alias does not affect usage of the property in TypeScript code.
+
+While you should generally avoid aliasing outputs for components, this feature can be useful for renaming properties while preserving an alias for the original name or for avoiding collisions with the name of native DOM events.
+
+## Subscribing to outputs programmatically
+
+When creating a component dynamically, you can programmatically subscribe to output events
+from the component instance. The `OutputRef` type includes a `subscribe` method:
+
+```ts
+const someComponentRef: ComponentRef<SomeComponent> = viewContainerRef.createComponent(/*...*/);
+
+someComponentRef.instance.someEventProperty.subscribe(eventData => {
+  console.log(eventData);
+});
+```
+
+Angular automatically cleans up event subscriptions when it destroys components with subscribers. Alternatively, you can manually unsubscribe from an event. The `subscribe` function returns an `OutputRefSubscription` with an `unsubscribe` method:
+
+```typescript
+const eventSubscription = someComponent.someEventProperty.subscribe(eventData => {
+  console.log(eventData);
+});
+
+// ...
+
+eventSubscription.unsubscribe();
+```
+
+## Choosing event names
+
+Avoid choosing output names that collide with events on DOM elements like HTMLElement. Name collisions introduce confusion about whether the bound property belongs to the component or the DOM element.
+
+Avoid adding prefixes for component outputs like you would with component selectors. Since a given element can only host one component, any custom properties can be assumed to belong to the component.
+
+Always use [camelCase](https://en.wikipedia.org/wiki/Camel_case) output names. Avoid prefixing output names with "on".
+
+## Using outputs with RxJS
+
+See [RxJS interop with component and directive outputs](ecosystem/rxjs-interop/output-interop) for details on interoperability between outputs and RxJS.
+
+## Declaring outputs with the `@Output` decorator
+
+TIP: While the Angular team recommends using the `output` function for new projects, the
+original decorator-based `@Output` API remains fully supported.
+
+You can alternatively define custom events by assigning a property to a new `EventEmitter` and adding the `@Output` decorator:
+
+```ts
+@Component({/*...*/})
+export class ExpandablePanel {
+  @Output() panelClosed = new EventEmitter<void>();
+}
+```
+You can emit an event by calling the `emit` method on the `EventEmitter`.
+
+### Aliases with the `@Output` decorator
+
+The `@Output` decorator accepts a parameter that lets you specify a different name for the event in a template:
+
+```ts
+@Component({/*...*/})
+export class CustomSlider {
+  @Output('valueChanged') changed = new EventEmitter<number>();
+}
+```
+```html
+<custom-slider (valueChanged)="saveVolume()" />
+```
+
+This alias does not affect usage of the property in TypeScript code.
+
+## Specify outputs in the `@Component` decorator
+
+In addition to the `@Output` decorator, you can also specify a component's outputs with the `outputs` property in the `@Component` decorator. This can be useful when a component inherits a property from a base class:
+
+```ts
+// `CustomSlider` inherits the `valueChanged` property from `BaseSlider`.
+@Component({
+  /*...*/
+  outputs: ['valueChanged'],
+})
+export class CustomSlider extends BaseSlider {}
+```
+You can additionally specify an output alias in the `outputs` list by putting the alias after a colon in the string:
+
+```ts
+// `CustomSlider` inherits the `valueChanged` property from `BaseSlider`.
+@Component({
+  /*...*/
+  outputs: ['valueChanged: volumeChanged'],
+})
+export class CustomSlider extends BaseSlider {}
+```
+
+# Content projection with ng-content
+
+TIP: This guide assumes you've already read the [Essentials Guide](essentials). Read that first if you're new to Angular.
+
+You often need to create components that act as containers for different types of content. For
+example, you may want to create a custom card component:
+
+```typescript
+@Component({
+  selector: 'custom-card',
+  template: '<div class="card-shadow"> <!-- card content goes here --> </div>',
+})
+export class CustomCard {/* ... */}
+```
+
+**You can use the `<ng-content>` element as a placeholder to mark where content should go**:
+
+```typescript
+@Component({
+  selector: 'custom-card',
+  template: '<div class="card-shadow"> <ng-content></ng-content> </div>',
+})
+export class CustomCard {/* ... */}
+```
+
+TIP: `<ng-content>` works similarly
+to [the native `<slot>` element](https://developer.mozilla.org/docs/Web/HTML/Element/slot),
+but with some Angular-specific functionality.
+
+When you use a component with `<ng-content>`, any children of the component host element are
+rendered, or **projected**, at the location of that `<ng-content>`:
+
+```typescript
+// Component source
+@Component({
+  selector: 'custom-card',
+  template: `
+    <div class="card-shadow">
+      <ng-content />
+    </div>
+  `,
+})
+export class CustomCard {/* ... */}
+```
+
+```html
+<!-- Using the component -->
+<custom-card>
+  <p>This is the projected content</p>
+</custom-card>
+```
+
+```html
+<!-- The rendered DOM -->
+<custom-card>
+  <div class="card-shadow">
+    <p>This is the projected content</p>
+  </div>
+</custom-card>
+```
+
+Angular refers to any children of a component passed this way as that component's **content**. This
+is distinct from the component's **view**, which refers to the elements defined in the component's
+template.
+
+**The `<ng-content>` element is neither a component nor DOM element**. Instead, it is a special
+placeholder that tells Angular where to render content. Angular's compiler processes
+all `<ng-content>` elements at build-time. You cannot insert, remove, or modify `<ng-content>` at
+run time. You cannot add directives, styles, or arbitrary attributes to `<ng-content>`.
+
+You should not conditionally include `<ng-content>` with `@if`, `@for`, or `@switch`. Angular always
+instantiates and creates DOM nodes for content rendered to a `<ng-content>` placeholder, even if
+that `<ng-content>` placeholder is hidden. For conditional rendering of component content,
+see [Template fragments](api/core/ng-template).
+
+## Multiple content placeholders
+
+Angular supports projecting multiple different elements into different `<ng-content>` placeholders
+based on CSS selector. Expanding the card example from above, you could create two placeholders for
+a card title and a card body by using the `select` attribute:
+
+```html
+<!-- Component template -->
+<div class="card-shadow">
+  <ng-content select="card-title"></ng-content>
+  <div class="card-divider"></div>
+  <ng-content select="card-body"></ng-content>
+</div>
+```
+
+```html
+<!-- Using the component -->
+<custom-card>
+  <card-title>Hello</card-title>
+  <card-body>Welcome to the example</card-body>
+</custom-card>
+```
+
+```html
+<!-- Rendered DOM -->
+<custom-card>
+  <div class="card-shadow">
+    <card-title>Hello</card-title>
+    <div class="card-divider"></div>
+    <card-body>Welcome to the example</card-body>
+  </div>
+</custom-card>
+```
+
+The `<ng-content>` placeholder supports the same CSS selectors
+as [component selectors](guide/components/selectors).
+
+If you include one or more `<ng-content>` placeholders with a `select` attribute and
+one `<ng-content>` placeholder without a `select` attribute, the latter captures all elements that
+did not match a `select` attribute:
+
+```html
+<!-- Component template -->
+<div class="card-shadow">
+  <ng-content select="card-title"></ng-content>
+  <div class="card-divider"></div>
+  <!-- capture anything except "card-title" -->
+  <ng-content></ng-content>
+</div>
+```
+
+```html
+<!-- Using the component -->
+<custom-card>
+  <card-title>Hello</card-title>
+  <img src="..." />
+  <p>Welcome to the example</p>
+</custom-card>
+```
+
+```html
+<!-- Rendered DOM -->
+<custom-card>
+  <div class="card-shadow">
+    <card-title>Hello</card-title>
+    <div class="card-divider"></div>
+    <img src="..." />
+    <p>Welcome to the example</p>
+  </div>
+</custom-card>
+```
+
+If a component does not include an `<ng-content>` placeholder without a `select` attribute, any
+elements that don't match one of the component's placeholders do not render into the DOM.
+
+## Fallback content
+
+Angular can show *fallback content* for a component's `<ng-content>` placeholder if that component doesn't have any matching child content. You can specify fallback content by adding child content to the `<ng-content>` element itself.
+
+```html
+<!-- Component template -->
+<div class="card-shadow">
+  <ng-content select="card-title">Default Title</ng-content>
+  <div class="card-divider"></div>
+  <ng-content select="card-body">Default Body</ng-content>
+</div>
+```
+
+```html
+<!-- Using the component -->
+<custom-card>
+  <card-title>Hello</card-title>
+  <!-- No card-body provided -->
+</custom-card>
+```
+
+```html
+<!-- Rendered DOM -->
+<custom-card>
+  <div class="card-shadow">
+    <card-title>Hello</card-title>
+    <div class="card-divider"></div>
+    Default Body
+  </div>
+</custom-card>
+```
+
+## Aliasing content for projection
+
+Angular supports a special attribute, `ngProjectAs`, that allows you to specify a CSS selector on
+any element. Whenever an element with `ngProjectAs` is checked against an `<ng-content>`
+placeholder, Angular compares against the `ngProjectAs` value instead of the element's identity:
+
+```html
+<!-- Component template -->
+<div class="card-shadow">
+  <ng-content select="card-title"></ng-content>
+  <div class="card-divider"></div>
+  <ng-content></ng-content>
+</div>
+```
+
+```html
+<!-- Using the component -->
+<custom-card>
+  <h3 ngProjectAs="card-title">Hello</h3>
+
+  <p>Welcome to the example</p>
+</custom-card>
+```
+
+```html
+<!-- Rendered DOM -->
+<custom-card>
+  <div class="card-shadow">
+    <h3>Hello</h3>
+    <div class="card-divider"></div>
+    <p>Welcome to the example</p>
+  </div>
+</custom-card>
+```
+
+`ngProjectAs` supports only static values and cannot be bound to dynamic expressions.
+# Component Lifecycle
+
+TIP: This guide assumes you've already read the [Essentials Guide](essentials). Read that first if you're new to Angular.
+
+A component's **lifecycle** is the sequence of steps that happen between the component's creation
+and its destruction. Each step represents a different part of Angular's process for rendering
+components and checking them for updates over time.
+
+In your components, you can implement **lifecycle hooks** to run code during these steps.
+Lifecycle hooks that relate to a specific component instance are implemented as methods on your
+component class. Lifecycle hooks that relate the Angular application as a whole are implemented
+as functions that accept a callback.
+
+A component's lifecycle is tightly connected to how Angular checks your components for changes over
+time. For the purposes of understanding this lifecycle, you only need to know that Angular walks
+your application tree from top to bottom, checking template bindings for changes. The lifecycle
+hooks described below run while Angular is doing this traversal. This traversal visits each
+component exactly once, so you should always avoid making further state changes in the middle of the
+process.
+
+## Summary
+
+<div class="docs-table docs-scroll-track-transparent">
+  <table>
+    <tr>
+      <td><strong>Phase</strong></td>
+      <td><strong>Method</strong></td>
+      <td><strong>Summary</strong></td>
+    </tr>
+    <tr>
+      <td>Creation</td>
+      <td><code>constructor</code></td>
+      <td>
+        <a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Classes/constructor" target="_blank">
+          Standard JavaScript class constructor
+        </a>. Runs when Angular instantiates the component.
+      </td>
+    </tr>
+    <tr>
+      <td rowspan="7">Change<p>Detection</td>
+      <td><code>ngOnInit</code>
+      </td>
+      <td>Runs once after Angular has initialized all the component's inputs.</td>
+    </tr>
+    <tr>
+      <td><code>ngOnChanges</code></td>
+      <td>Runs every time the component's inputs have changed.</td>
+    </tr>
+    <tr>
+      <td><code>ngDoCheck</code></td>
+      <td>Runs every time this component is checked for changes.</td>
+    </tr>
+    <tr>
+      <td><code>ngAfterContentInit</code></td>
+      <td>Runs once after the component's <em>content</em> has been initialized.</td>
+    </tr>
+    <tr>
+      <td><code>ngAfterContentChecked</code></td>
+      <td>Runs every time this component content has been checked for changes.</td>
+    </tr>
+    <tr>
+      <td><code>ngAfterViewInit</code></td>
+      <td>Runs once after the component's <em>view</em> has been initialized.</td>
+    </tr>
+    <tr>
+      <td><code>ngAfterViewChecked</code></td>
+      <td>Runs every time the component's view has been checked for changes.</td>
+    </tr>
+    <tr>
+      <td rowspan="2">Rendering</td>
+      <td><code>afterNextRender</code></td>
+      <td>Runs once the next time that <strong>all</strong> components have been rendered to the DOM.</td>
+    </tr>
+    <tr>
+      <td><code>afterEveryRender</code></td>
+      <td>Runs every time <strong>all</strong> components have been rendered to the DOM.</td>
+    </tr>
+    <tr>
+      <td>Destruction</td>
+      <td><code>ngOnDestroy</code></td>
+      <td>Runs once before the component is destroyed.</td>
+    </tr>
+  </table>
+</div>
+
+### ngOnInit
+
+The `ngOnInit` method runs after Angular has initialized all the components inputs with their
+initial values. A component's `ngOnInit` runs exactly once.
+
+This step happens _before_ the component's own template is initialized. This means that you can
+update the component's state based on its initial input values.
+
+### ngOnChanges
+
+The `ngOnChanges` method runs after any component inputs have changed.
+
+This step happens _before_ the component's own template is checked. This means that you can update
+the component's state based on its initial input values.
+
+During initialization, the first `ngOnChanges` runs before `ngOnInit`.
+
+#### Inspecting changes
+
+The `ngOnChanges` method accepts one `SimpleChanges` argument. This object is
+a [`Record`](https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type)
+mapping each component input name to a `SimpleChange` object. Each `SimpleChange` contains the
+input's previous value, its current value, and a flag for whether this is the first time the input
+has changed.
+
+```ts
+@Component({
+  /* ... */
+})
+export class UserProfile {
+  name = input('');
+
+  ngOnChanges(changes: SimpleChanges) {
+    for (const inputName in changes) {
+      const inputValues = changes[inputName];
+      console.log(`Previous ${inputName} == ${inputValues.previousValue}`);
+      console.log(`Current ${inputName} == ${inputValues.currentValue}`);
+      console.log(`Is first ${inputName} change == ${inputValues.firstChange}`);
+    }
+  }
+}
+```
+
+If you provide an `alias` for any input properties, the `SimpleChanges` Record still uses the
+TypeScript property name as a key, rather than the alias.
+
+### ngOnDestroy
+
+The `ngOnDestroy` method runs once just before a component is destroyed. Angular destroys a
+component when it is no longer shown on the page, such as being hidden by `@if` or upon navigating
+to another page.
+
+#### DestroyRef
+
+As an alternative to the `ngOnDestroy` method, you can inject an instance of `DestroyRef`. You can
+register a callback to be invoked upon the component's destruction by calling the `onDestroy` method
+of `DestroyRef`.
+
+```ts
+@Component({
+  /* ... */
+})
+export class UserProfile {
+  constructor() {
+    inject(DestroyRef).onDestroy(() => {
+      console.log('UserProfile destruction');
+    });
+  }
+}
+```
+
+You can pass the `DestroyRef` instance to functions or classes outside your component. Use this
+pattern if you have other code that should run some cleanup behavior when the component is
+destroyed.
+
+You can also use `DestroyRef` to keep setup code close to cleanup code, rather than putting
+all cleanup code in the `ngOnDestroy` method.
+
+### ngDoCheck
+
+The `ngDoCheck` method runs before every time Angular checks a component's template for changes.
+
+You can use this lifecycle hook to manually check for state changes outside of Angular's normal
+change detection, manually updating the component's state.
+
+This method runs very frequently and can significantly impact your page's performance. Avoid
+defining this hook whenever possible, only using it when you have no alternative.
+
+During initialization, the first `ngDoCheck` runs after `ngOnInit`.
+
+### ngAfterContentInit
+
+The `ngAfterContentInit` method runs once after all the children nested inside the component (its
+_content_) have been initialized.
+
+You can use this lifecycle hook to read the results of
+[content queries](guide/components/queries#content-queries). While you can access the initialized
+state of these queries, attempting to change any state in this method results in an
+[ExpressionChangedAfterItHasBeenCheckedError](errors/NG0100)
+
+### ngAfterContentChecked
+
+The `ngAfterContentChecked` method runs every time the children nested inside the component (its
+_content_) have been checked for changes.
+
+This method runs very frequently and can significantly impact your page's performance. Avoid
+defining this hook whenever possible, only using it when you have no alternative.
+
+While you can access the updated state
+of [content queries](guide/components/queries#content-queries) here, attempting to
+change any state in this method results in
+an [ExpressionChangedAfterItHasBeenCheckedError](errors/NG0100).
+
+### ngAfterViewInit
+
+The `ngAfterViewInit` method runs once after all the children in the component's template (its
+_view_) have been initialized.
+
+You can use this lifecycle hook to read the results of
+[view queries](guide/components/queries#view-queries). While you can access the initialized state of
+these queries, attempting to change any state in this method results in an
+[ExpressionChangedAfterItHasBeenCheckedError](errors/NG0100)
+
+### ngAfterViewChecked
+
+The `ngAfterViewChecked` method runs every time the children in the component's template (its
+_view_) have been checked for changes.
+
+This method runs very frequently and can significantly impact your page's performance. Avoid
+defining this hook whenever possible, only using it when you have no alternative.
+
+While you can access the updated state of [view queries](guide/components/queries#view-queries)
+here, attempting to
+change any state in this method results in
+an [ExpressionChangedAfterItHasBeenCheckedError](errors/NG0100).
+
+### afterEveryRender and afterNextRender
+
+The `afterEveryRender` and `afterNextRender` functions let you register a **render callback** to be
+invoked after Angular has finished rendering _all components_ on the page into the DOM.
+
+These functions are different from the other lifecycle hooks described in this guide. Rather than a
+class method, they are standalone functions that accept a callback. The execution of render
+callbacks are not tied to any specific component instance, but instead an application-wide hook.
+
+`afterEveryRender` and `afterNextRender` must be called in
+an [injection context](guide/di/dependency-injection-context), typically a
+component's constructor.
+
+You can use render callbacks to perform manual DOM operations.
+See [Using DOM APIs](guide/components/dom-apis) for guidance on working with the DOM in Angular.
+
+Render callbacks do not run during server-side rendering or during build-time pre-rendering.
+
+#### after*Render phases
+
+When using `afterEveryRender` or `afterNextRender`, you can optionally split the work into phases. The
+phase gives you control over the sequencing of DOM operations, letting you sequence _write_
+operations before _read_ operations in order to minimize
+[layout thrashing](https://web.dev/avoid-large-complex-layouts-and-layout-thrashing). In order to
+communicate across phases, a phase function may return a result value that can be accessed in the
+next phase.
+
+```ts
+import {Component, ElementRef, afterNextRender} from '@angular/core';
+
+@Component({...})
+export class UserProfile {
+  private prevPadding = 0;
+  private elementHeight = 0;
+
+  constructor() {
+    private elementRef = inject(ElementRef);
+    const nativeElement = elementRef.nativeElement;
+
+    afterNextRender({
+      // Use the `Write` phase to write to a geometric property.
+      write: () => {
+        const padding = computePadding();
+        const changed = padding !== this.prevPadding;
+        if (changed) {
+          nativeElement.style.padding = padding;
+        }
+        return changed; // Communicate whether anything changed to the read phase.
+      },
+
+      // Use the `Read` phase to read geometric properties after all writes have occurred.
+      read: (didWrite) => {
+        if (didWrite) {
+          this.elementHeight = nativeElement.getBoundingClientRect().height;
+        }
+      }
+    });
+  }
+}
+```
+
+There are four phases, run in the following order:
+
+| Phase            | Description                                                                                                                                                                                           |
+| ---------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `earlyRead`      | Use this phase to read any layout-affecting DOM properties and styles that are strictly necessary for subsequent calculation. Avoid this phase if possible, preferring the `write` and `read` phases. |
+| `mixedReadWrite` | Default phase. Use for any operations need to both read and write layout-affecting properties and styles. Avoid this phase if possible, preferring the explicit `write` and `read` phases.            |
+| `write`          | Use this phase to write layout-affecting DOM properties and styles.                                                                                                                                   |
+| `read`           | Use this phase to read any layout-affecting DOM properties.                                                                                                                                           |
+
+## Lifecycle interfaces
+
+Angular provides a TypeScript interface for each lifecycle method. You can optionally import
+and `implement` these interfaces to ensure that your implementation does not have any typos or
+misspellings.
+
+Each interface has the same name as the corresponding method without the `ng` prefix. For example,
+the interface for `ngOnInit` is `OnInit`.
+
+```ts
+@Component({
+  /* ... */
+})
+export class UserProfile implements OnInit {
+  ngOnInit() {
+    /* ... */
+  }
+}
+```
+
+## Execution order
+
+The following diagrams show the execution order of Angular's lifecycle hooks.
+
+### During initialization
+
+```mermaid
+graph TD;
+id[constructor]-->CHANGE;
+subgraph CHANGE [Change detection]
+direction TB
+ngOnChanges-->ngOnInit;
+ngOnInit-->ngDoCheck;
+ngDoCheck-->ngAfterContentInit;
+ngDoCheck-->ngAfterViewInit
+ngAfterContentInit-->ngAfterContentChecked
+ngAfterViewInit-->ngAfterViewChecked
+end
+CHANGE--Rendering-->afterNextRender-->afterEveryRender
+```
+
+### Subsequent updates
+
+```mermaid
+graph TD;
+subgraph CHANGE [Change detection]
+direction TB
+ngOnChanges-->ngDoCheck
+ngDoCheck-->ngAfterContentChecked;
+ngDoCheck-->ngAfterViewChecked
+end
+CHANGE--Rendering-->afterEveryRender
+```
+
+### Ordering with directives
+
+When you put one or more directives on the same element as a component, either in a template or with
+the `hostDirectives` property, the framework does not guarantee any ordering of a given lifecycle
+hook between the component and the directives on a single element. Never depend on an observed
+ordering, as this may change in later versions of Angular.
+Component templates aren't just static HTML— they can use data from your component class and set up handlers for user interaction.
+
+## Showing dynamic text
+
+In Angular, a *binding* creates a dynamic connection between a component's template and its data. This connection ensures that changes to the component's data automatically update the rendered template.
+
+You can create a binding to show some dynamic text in a template by using double curly-braces:
+
+```typescript
+@Component({
+  selector: 'user-profile',
+  template: `<h1>Profile for {{userName()}}</h1>`,
+})
+export class TodoListItem {
+  userName = signal('pro_programmer_123');
+}
+```
+
+When Angular renders the component, you see:
+
+```html
+<h1>Profile for pro_programmer_123</h1>
+```
+
+Angular automatically keeps the binding up-to-date when the value of the signal changes. Building on
+the example above, if we update the value of the `userName` signal:
+
+```typescript
+this.userName.set('cool_coder_789');
+```
+
+The rendered page updates to reflect the new value:
+
+```html
+<h1>Profile for cool_coder_789</h1>
+```
+
+## Setting dynamic properties and attributes
+
+Angular supports binding dynamic values into DOM properties with square brackets:
+
+```typescript
+@Component({
+  /*...*/
+  // Set the `disabled` property of the button based on the value of `isValidUserId`.
+  template: `<button [disabled]="isValidUserId()">Save changes</button>`,
+})
+export class UserProfile {
+  isValidUserId = signal(false);
+}
+```
+
+You can also bind to HTML _attributes_ by prefixing the attribute name with `attr.`:
+
+```html
+<!-- Bind the `role` attribute on the `<ul>` element to value of `listRole`. -->
+<ul [attr.role]="listRole()">
+```
+
+Angular automatically updates DOM properties and attribute when the bound value changes.
+
+## Handling user interaction
+
+Angular lets you add event listeners to an element in your template with parentheses:
+
+```typescript
+@Component({
+  /*...*/
+  // Add an 'click' event handler that calls the `cancelSubscription` method.
+  template: `<button (click)="cancelSubscription()">Cancel subscription</button>`,
+})
+export class UserProfile {
+  /* ... */
+
+  cancelSubscription() { /* Your event handling code goes here. */  }
+}
+```
+
+If you need to pass the [event](https://developer.mozilla.org/docs/Web/API/Event) object to your listener, you can use Angular's built-in `$event` variable inside the function call:
+
+```typescript
+@Component({
+  /*...*/
+  // Add an 'click' event handler that calls the `cancelSubscription` method.
+  template: `<button (click)="cancelSubscription($event)">Cancel subscription</button>`,
+})
+export class UserProfile {
+  /* ... */
+
+  cancelSubscription(event: Event) { /* Your event handling code goes here. */  }
+}
+```
+
+## Control flow with `@if` and `@for`
+
+You can conditionally hide and show parts of a template with Angular's `@if` block:
+
+```html
+<h1>User profile</h1>
+
+@if (isAdmin()) {
+  <h2>Admin settings</h2>
+  <!-- ... -->
+}
+```
+
+The `@if` block also supports an optional `@else` block:
+
+```html
+<h1>User profile</h1>
+
+@if (isAdmin()) {
+  <h2>Admin settings</h2>
+  <!-- ... -->
+} @else {
+  <h2>User settings</h2>
+  <!-- ... -->
+}
+```
+
+You can repeat part of a template multiple times with Angular's `@for` block:
+
+```html
+<h1>User profile</h1>
+
+<ul class="user-badge-list">
+  @for (badge of badges(); track badge.id) {
+    <li class="user-badge">{{badge.name}}</li>
+  }
+</ul>
+```
+
+Angular's uses the `track` keyword, shown in the example above, to associate data with the DOM elements created by `@for`. See [_Why is track in @for blocks important?_](guide/templates/control-flow#why-is-track-in-for-blocks-important) for more info.
+
+TIP: Want to know more about Angular templates? See the [In-depth Templates guide](guide/templates) for the full details.
+
+## Next Step
+
+Now that you have dynamic data and templates in the application, it's time to learn how to enhance templates by conditionally hiding or showing certain elements, looping over elements, and more.
+# Adding event listeners
+
+Angular supports defining event listeners on an element in your template by specifying the event name inside parentheses along with a statement that runs every time the event occurs.
+
+## Listening to native events
+
+When you want to add event listeners to an HTML element, you wrap the event with parentheses, `()`, which allows you to specify a listener statement.
+
+```typescript
+@Component({
+  template: `
+    <input type="text" (keyup)="updateField()" />
+  `,
+  ...
+})
+export class AppComponent{
+  updateField(): void {
+    console.log('Field is updated!');
+  }
+}
+```
+
+In this example, Angular calls `updateField` every time the `<input>` element emits a `keyup` event.
+
+You can add listeners for any native events, such as: `click`, `keydown`, `mouseover`, etc. To learn more, check out the [all available events on elements on MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element#events).
+
+## Accessing the event argument
+
+In every template event listener, Angular provides a variable named `$event` that contains a reference to the event object.
+
+```typescript
+@Component({
+  template: `
+    <input type="text" (keyup)="updateField($event)" />
+  `,
+  ...
+})
+export class AppComponent {
+  updateField(event: KeyboardEvent): void {
+    console.log(`The user pressed: ${event.key}`);
+  }
+}
+```
+
+## Using key modifiers
+
+When you want to capture specific keyboard events for a specific key, you might write some code like the following:
+
+```typescript
+@Component({
+  template: `
+    <input type="text" (keyup)="updateField($event)" />
+  `,
+  ...
+})
+export class AppComponent {
+  updateField(event: KeyboardEvent): void {
+    if (event.key === 'Enter') {
+      console.log('The user pressed enter in the text field.');
+    }
+  }
+}
+```
+
+However, since this is a common scenario, Angular lets you filter the events by specifying a specific key using the period (`.`) character. By doing so, code can be simplified to:
+
+```typescript
+@Component({
+  template: `
+    <input type="text" (keyup.enter)="updateField($event)" />
+  `,
+  ...
+})
+export class AppComponent{
+  updateField(event: KeyboardEvent): void {
+    console.log('The user pressed enter in the text field.');
+  }
+}
+```
+
+You can also add additional key modifiers:
+
+```html
+<!-- Matches shift and enter -->
+<input type="text" (keyup.shift.enter)="updateField($event)" />
+```
+
+Angular supports the modifiers `alt`, `control`, `meta`, and `shift`.
+
+You can specify the key or code that you would like to bind to keyboard events. The key and code fields are a native part of the browser keyboard event object. By default, event binding assumes you want to use the [Key values for keyboard events](https://developer.mozilla.org/docs/Web/API/UI_Events/Keyboard_event_key_values).
+
+Angular also allows you to specify [Code values for keyboard events](https://developer.mozilla.org/docs/Web/API/UI_Events/Keyboard_event_code_values) by providing a built-in `code` suffix.
+
+```html
+<!-- Matches alt and left shift -->
+<input type="text" (keydown.code.alt.shiftleft)="updateField($event)" />
+```
+
+This can be useful for handling keyboard events consistently across different operating systems. For example, when using the Alt key on MacOS devices, the `key` property reports the key based on the character already modified by the Alt key. This means that a combination like Alt + S reports a `key` value of `'ß'`. The `code` property, however, corresponds to the physical or virtual button pressed rather than the character produced.
+
+## Preventing event default behavior
+
+If your event handler should replace the native browser behavior, you can use the event object's [`preventDefault` method](https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault):
+
+```typescript
+@Component({
+  template: `
+    <a href="#overlay" (click)="showOverlay($event)">
+  `,
+  ...
+})
+export class AppComponent{
+  showOverlay(event: PointerEvent): void {
+    event.preventDefault();
+    console.log('Show overlay without updating the URL!');
+  }
+}
+```
+
+If the event handler statement evaluates to `false`, Angular automatically calls `preventDefault()`, similar to [native event handler attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes#event_handler_attributes). *Always prefer explicitly calling `preventDefault`*, as this approach makes the code's intent obvious.
+# Binding dynamic text, properties and attributes
+
+In Angular, a **binding** creates a dynamic connection between a component's template and its data. This connection ensures that changes to the component's data automatically update the rendered template.
+
+## Render dynamic text with text interpolation
+
+You can bind dynamic text in templates with double curly braces, which tells Angular that it is responsible for the expression inside and ensuring it is updated correctly. This is called **text interpolation**.
+
+```typescript
+@Component({
+  template: `
+    <p>Your color preference is {{ theme }}.</p>
+  `,
+  ...
+})
+export class AppComponent {
+  theme = 'dark';
+}
+```
+
+In this example, when the snippet is rendered to the page, Angular will replace `{{ theme }}` with `dark`.
+
+```html
+<!-- Rendered Output -->
+<p>Your color preference is dark.</p>
+```
+
+In addition to evaluating the expression at first render, Angular also updates the rendered content when the expression's value changes.
+
+Continuing the theme example, if a user clicks on a button that changes the value of `theme` to `'light'` after the page loads, the page updates accordingly to:
+
+```html
+<!-- Rendered Output -->
+<p>Your color preference is light.</p>
+```
+
+You can use text interpolation anywhere you would normally write text in HTML.
+
+All expression values are converted to a string. Objects and arrays are converted using the value’s `toString` method.
+
+## Binding dynamic properties and attributes
+
+Angular supports binding dynamic values into object properties and HTML attributes with square brackets.
+
+You can bind to properties on an HTML element's DOM instance, a [component](guide/components) instance, or a [directive](guide/directives) instance.
+
+### Native element properties
+
+Every HTML element has a corresponding DOM representation. For example, each `<button>` HTML element corresponds to an instance of `HTMLButtonElement` in the DOM. In Angular, you use property bindings to set values directly to the DOM representation of the element.
+
+```html
+<!-- Bind the `disabled` property on the button element's DOM object -->
+<button [disabled]="isFormValid">Save</button>
+```
+
+In this example, every time `isFormValid` changes, Angular automatically sets the `disabled` property of the `HTMLButtonElement` instance.
+
+### Component and directive properties
+
+When an element is an Angular component, you can use property bindings to set component input properties using the same square bracket syntax.
+
+```html
+<!-- Bind the `value` property on the `MyListbox` component instance. -->
+<my-listbox [value]="mySelection" />
+```
+
+In this example, every time `mySelection` changes, Angular automatically sets the `value` property of the `MyListbox` instance.
+
+You can bind to directive properties as well.
+
+```html
+<!-- Bind to the `ngSrc` property of the `NgOptimizedImage` directive  -->
+<img [ngSrc]="profilePhotoUrl" alt="The current user's profile photo">
+```
+
+### Attributes
+
+When you need to set HTML attributes that do not have corresponding DOM properties, such as ARIA attributes or SVG attributes, you can bind attributes to elements in your template with the `attr.` prefix.
+
+```html
+<!-- Bind the `role` attribute on the `<ul>` element to the component's `listRole` property. -->
+<ul [attr.role]="listRole">
+```
+
+In this example, every time `listRole` changes, Angular automatically sets the `role` attribute of the `<ul>` element by calling `setAttribute`.
+
+If the value of an attribute binding is `null`, Angular removes the attribute by calling `removeAttribute`.
+
+### Text interpolation in properties and attributes
+
+You can also use text interpolation syntax in properties and attributes by using the double curly brace syntax instead of square braces around the property or attribute name. When using this syntax, Angular treats the assignment as a property binding.
+
+```html
+<!-- Binds a value to the `alt` property of the image element's DOM object. -->
+<img src="profile-photo.jpg" alt="Profile photo of {{ firstName }}" >
+```
+
+To bind to an attribute with the text interpolation syntax, prefix the attribute name with `attr.`
+
+```html
+<button attr.aria-label="Save changes to {{ objectType }}">
+```
+
+## CSS class and style property bindings
+
+Angular supports additional features for binding CSS classes and CSS style properties to elements.
+
+### CSS classes
+
+You can create a CSS class binding to conditionally add or remove a CSS class on an element based on whether the bound value is [truthy or falsy](https://developer.mozilla.org/en-US/docs/Glossary/Truthy).
+
+```html
+<!-- When `isExpanded` is truthy, add the `expanded` CSS class. -->
+<ul [class.expanded]="isExpanded">
+```
+
+You can also bind directly to the `class` property. Angular accepts three types of value:
+
+| Description of `class` value                                                                                                                                      | TypeScript type       |
+| ----------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------- |
+| A string containing one or more CSS classes separated by spaces                                                                                                   | `string`              |
+| An array of CSS class strings                                                                                                                                     | `string[]`            |
+| An object where each property name is a CSS class name and each corresponding value determines whether that class is applied to the element, based on truthiness. | `Record<string, any>` |
+
+```typescript
+@Component({
+  template: `
+    <ul [class]="listClasses"> ... </ul>
+    <section [class]="sectionClasses"> ... </section>
+    <button [class]="buttonClasses"> ... </button>
+  `,
+  ...
+})
+export class UserProfile {
+  listClasses = 'full-width outlined';
+  sectionClasses = ['expandable', 'elevated'];
+  buttonClasses = {
+    highlighted: true,
+    embiggened: false,
+  };
+}
+```
+
+The above example renders the following DOM:
+
+```html
+<ul class="full-width outlined"> ... </ul>
+<section class="expandable elevated"> ... </section>
+<button class="highlighted"> ... </button>
+```
+
+Angular ignores any string values that are not valid CSS class names.
+
+When using static CSS classes, directly binding `class`, and binding specific classes, Angular intelligently combines all of the classes in the rendered result.
+
+```typescript
+@Component({
+  template: `<ul class="list" [class]="listType" [class.expanded]="isExpanded"> ...`,
+  ...
+})
+export class Listbox {
+  listType = 'box';
+  isExpanded = true;
+}
+```
+
+In the example above, Angular renders the `ul` element with all three CSS classes.
+
+```html
+<ul class="list box expanded">
+```
+
+Angular does not guarantee any specific order of CSS classes on rendered elements.
+
+When binding `class` to an array or an object, Angular compares the previous value to the current value with the triple-equals operator (`===`). You must create a new object or array instance when you modify these values in order for Angular to apply any updates.
+
+If an element has multiple bindings for the same CSS class, Angular resolves collisions by following its style precedence order.
+
+NOTE: Class bindings do not support space-separated class names in a single key. They also don't support mutations on objects as the reference of the binding remains the same. If you need one or the other, use the [ngClass](/api/common/NgClass) directive.
+
+### CSS style properties
+
+You can also bind to CSS style properties directly on an element.
+
+```html
+<!-- Set the CSS `display` property based on the `isExpanded` property. -->
+<section [style.display]="isExpanded ? 'block' : 'none'">
+```
+
+You can further specify units for CSS properties that accept units.
+
+```html
+<!-- Set the CSS `height` property to a pixel value based on the `sectionHeightInPixels` property. -->
+<section [style.height.px]="sectionHeightInPixels">
+```
+
+You can also set multiple style values in one binding. Angular accepts the following types of value:
+
+| Description of `style` value                                                                                              | TypeScript type       |
+| ------------------------------------------------------------------------------------------------------------------------- | --------------------- |
+| A string containing zero or more CSS declarations, such as `"display: flex; margin: 8px"`.                                | `string`              |
+| An object where each property name is a CSS property name and each corresponding value is the value of that CSS property. | `Record<string, any>` |
+
+```typescript
+@Component({
+  template: `
+    <ul [style]="listStyles"> ... </ul>
+    <section [style]="sectionStyles"> ... </section>
+  `,
+  ...
+})
+export class UserProfile {
+  listStyles = 'display: flex; padding: 8px';
+  sectionStyles = {
+    border: '1px solid black',
+    'font-weight': 'bold',
+  };
+}
+```
+
+The above example renders the following DOM.
+
+```html
+<ul style="display: flex; padding: 8px"> ... </ul>
+<section style="border: 1px solid black; font-weight: bold"> ... </section>
+```
+
+When binding `style` to an object, Angular compares the previous value to the current value with the triple-equals operator (`===`). You must create a new object instance when you modify these values in order to Angular to apply any updates.
+
+If an element has multiple bindings for the same style property, Angular resolves collisions by following its style precedence order.
+# Control flow
+
+Angular templates support control flow blocks that let you conditionally show, hide, and repeat elements.
+
+## Conditionally display content with `@if`, `@else-if` and `@else`
+
+The `@if` block conditionally displays its content when its condition expression is truthy:
+
+```html
+@if (a > b) {
+  <p>{{a}} is greater than {{b}}</p>
+}
+```
+
+If you want to display alternative content, you can do so by providing any number of `@else if` blocks and a singular `@else` block.
+
+```html
+@if (a > b) {
+  {{a}} is greater than {{b}}
+} @else if (b > a) {
+  {{a}} is less than {{b}}
+} @else {
+  {{a}} is equal to {{b}}
+}
+```
+
+### Referencing the conditional expression's result
+
+The `@if` conditional supports saving the result of the conditional expression into a variable for reuse inside of the block.
+
+```html
+@if (user.profile.settings.startDate; as startDate) {
+  {{ startDate }}
+}
+```
+
+This can be useful for referencing longer expressions that would be easier to read and maintain within the template.
+
+## Repeat content with the `@for` block
+
+The `@for` block loops through a collection and repeatedly renders the content of a block. The collection can be any JavaScript [iterable](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Iteration_protocols), but Angular has additional performance optimizations for `Array` values.
+
+A typical `@for` loop looks like:
+
+```html
+@for (item of items; track item.id) {
+  {{ item.name }}
+}
+```
+
+Angular's `@for` block does not support flow-modifying statements like JavaScript's `continue` or `break`.
+
+### Why is `track` in `@for` blocks important?
+
+The `track` expression allows Angular to maintain a relationship between your data and the DOM nodes on the page. This allows Angular to optimize performance by executing the minimum necessary DOM operations when the data changes.
+
+Using track effectively can significantly improve your application's rendering performance when looping over data collections.
+
+Select a property that uniquely identifies each item in the `track` expression. If your data model includes a uniquely identifying property, commonly `id` or `uuid`, use this value. If your data does not include a field like this, strongly consider adding one.
+
+For static collections that never change, you can use `$index` to tell Angular to track each item by its index in the collection.
+
+If no other option is available, you can specify `identity`. This tells Angular to track the item by its reference identity using the triple-equals operator (`===`). Avoid this option whenever possible as it can lead to significantly slower rendering updates, as Angular has no way to map which data item corresponds to which DOM nodes.
+
+### Contextual variables in `@for` blocks
+
+Inside `@for` blocks, several implicit variables are always available:
+
+| Variable | Meaning                                       |
+| -------- | --------------------------------------------- |
+| `$count` | Number of items in a collection iterated over |
+| `$index` | Index of the current row                      |
+| `$first` | Whether the current row is the first row      |
+| `$last`  | Whether the current row is the last row       |
+| `$even`  | Whether the current row index is even         |
+| `$odd`   | Whether the current row index is odd          |
+
+These variables are always available with these names, but can be aliased via a `let` segment:
+
+```html
+@for (item of items; track item.id; let idx = $index, e = $even) {
+  <p>Item #{{ idx }}: {{ item.name }}</p>
+}
+```
+
+The aliasing is useful when nesting `@for` blocks, letting you read variables from the outer `@for` block from an inner `@for` block.
+
+### Providing a fallback for `@for` blocks with the `@empty` block
+
+You can optionally include an `@empty` section immediately after the `@for` block content. The content of the `@empty` block displays when there are no items:
+
+```html
+@for (item of items; track item.name) {
+  <li> {{ item.name }}</li>
+} @empty {
+  <li aria-hidden="true"> There are no items. </li>
+}
+```
+
+## Conditionally display content with the `@switch` block
+
+While the `@if` block is great for most scenarios, the `@switch` block provides an alternate syntax to conditionally render data. Its syntax closely resembles JavaScript's `switch` statement.
+
+```html
+@switch (userPermissions) {
+  @case ('admin') {
+    <app-admin-dashboard />
+  }
+  @case ('reviewer') {
+    <app-reviewer-dashboard />
+  }
+  @case ('editor') {
+    <app-editor-dashboard />
+  }
+  @default {
+    <app-viewer-dashboard />
+  }
+}
+```
+
+The value of the conditional expression is compared to the case expression using the triple-equals (`===`) operator.
+
+**`@switch` does not have a fallthrough**, so you do not need an equivalent to a `break` or `return` statement in the block.
+
+You can optionally include a `@default` block. The content of the `@default` block displays if none of the preceding case expressions match the switch value.
+
+If no `@case` matches the expression and there is no `@default` block, nothing is shown.
+# Variables in templates
+
+Angular has two types of variable declarations in templates: local template variables and template reference variables.
+
+## Local template variables with `@let`
+
+Angular's `@let` syntax allows you to define a local variable and re-use it across a template, similar to the [JavaScript `let` syntax](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let).
+
+### Using `@let`
+
+Use `@let` to declare a variable whose value is based on the result of a template expression. Angular automatically keeps the variable's value up-to-date with the given expression, similar to [bindings](./templates/bindings).
+
+```html
+@let name = user.name;
+@let greeting = 'Hello, ' + name;
+@let data = data$ | async;
+@let pi = 3.1459;
+@let coordinates = {x: 50, y: 100};
+@let longExpression = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit ' +
+                      'sed do eiusmod tempor incididunt ut labore et dolore magna ' +
+                      'Ut enim ad minim veniam...';
+```
+
+Each `@let` block can declare exactly one variable. You cannot declare multiple variables in the same block with a comma.
+
+### Referencing the value of `@let`
+
+Once you've declared a variable with `@let`, you can reuse it in the same template:
+
+```html
+@let user = user$ | async;
+
+@if (user) {
+  <h1>Hello, {{user.name}}</h1>
+  <user-avatar [photo]="user.photo"/>
+
+  <ul>
+    @for (snack of user.favoriteSnacks; track snack.id) {
+      <li>{{snack.name}}</li>
+    }
+  </ul>
+
+  <button (click)="update(user)">Update profile</button>
+}
+```
+
+### Assignability
+
+A key difference between `@let` and JavaScript's `let` is that `@let` cannot be reassigned after declaration. However, Angular automatically keeps the variable's value up-to-date with the given expression.
+
+```html
+@let value = 1;
+
+<!-- Invalid - This does not work! -->
+<button (click)="value = value + 1">Increment the value</button>
+```
+
+### Variable scope
+
+`@let` declarations are scoped to the current view and its descendants. Angular creates a new view at component boundaries and wherever a template might contain dynamic content, such as control flow blocks, `@defer` blocks, or structural directives.
+
+Since `@let` declarations are not hoisted, they **cannot** be accessed by parent views or siblings:
+
+```html
+@let topLevel = value;
+
+<div>
+  @let insideDiv = value;
+</div>
+
+{{topLevel}} <!-- Valid -->
+{{insideDiv}} <!-- Valid -->
+
+@if (condition) {
+  {{topLevel + insideDiv}} <!-- Valid -->
+
+  @let nested = value;
+
+  @if (condition) {
+    {{topLevel + insideDiv + nested}} <!-- Valid -->
+  }
+}
+
+{{nested}} <!-- Error, not hoisted from @if -->
+```
+
+### Full syntax
+
+The `@let` syntax is formally defined as:
+
+- The `@let` keyword.
+- Followed by one or more whitespaces, not including new lines.
+- Followed by a valid JavaScript name and zero or more whitespaces.
+- Followed by the = symbol and zero or more whitespaces.
+- Followed by an Angular expression which can be multi-line.
+- Terminated by the `;` symbol.
+
+## Template reference variables
+
+Template reference variables give you a way to declare a variable that references a value from an element in your template.
+
+A template reference variable can refer to the following:
+
+- a DOM element within a template (including [custom elements](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements))
+- an Angular component or directive
+- a [TemplateRef](/api/core/TemplateRef) from an [ng-template](/api/core/ng-template)
+
+You can use template reference variables to read information from one part of the template in another part of the same template.
+
+### Declaring a template reference variable
+
+You can declare a variable on an element in a template by adding an attribute that starts with the hash character (`#`) followed by the variable name.
+
+```html
+<!-- Create a template reference variable named "taskInput", referring to the HTMLInputElement. -->
+<input #taskInput placeholder="Enter task name">
+```
+
+### Assigning values to template reference variables
+
+Angular assigns a value to template variables based on the element on which the variable is declared.
+
+If you declare the variable on a Angular component, the variable refers to the component instance.
+
+```html
+<!-- The `startDate` variable is assigned the instance of `MyDatepicker`. -->
+<my-datepicker #startDate />
+```
+
+If you declare the variable on an `<ng-template>` element, the variable refers to a TemplateRef instance which represents the template. For more information, see [How Angular uses the asterisk, \*, syntax](/guide/directives/structural-directives#structural-directive-shorthand) in [Structural directives](/guide/directives/structural-directives).
+
+```html
+<!-- The `myFragment` variable is assigned the `TemplateRef` instance corresponding to this template fragment. -->
+<ng-template #myFragment>
+  <p>This is a template fragment</p>
+</ng-template>
+```
+
+If you declare the variable on any other displayed element, the variable refers to the `HTMLElement` instance.
+
+```html
+<!-- The "taskInput" variable refers to the HTMLInputElement instance. -->
+<input #taskInput placeholder="Enter task name">
+```
+
+#### Assigning a reference to an Angular directive
+
+Angular directives may have an `exportAs` property that defines a name by which the directive can be referenced in a template:
+
+```typescript
+@Directive({
+  selector: '[dropZone]',
+  exportAs: 'dropZone',
+})
+export class DropZone { /* ... */ }
+```
+
+When you declare a template variable on an element, you can assign that variable a directive instance by specifying this `exportAs` name:
+
+```html
+<!-- The `firstZone` variable refers to the `DropZone` directive instance. -->
+<section dropZone #firstZone="dropZone"> ... </section>
+```
+
+You cannot refer to a directive that does not specify an `exportAs` name.
+
+### Using template reference variables with queries
+
+In addition to using template variables to read values from another part of the same template, you can also use this style of variable declaration to "mark" an element for [component and directive queries](/guide/components/queries).
+
+When you want to query for a specific element in a template, you can declare a template variable on that element and then query for the element based on the variable name.
+
+```html
+<input #description value="Original description">
+```
+
+```typescript
+@Component({
+  /* ... */,
+  template: `<input #description value="Original description">`,
+})
+export class AppComponent {
+  // Query for the input element based on the template variable name.
+  @ViewChild('description') input: ElementRef | undefined;
+}
+```
+
+See [Referencing children with queries](/guide/components/queries) for more information on queries.
+# Deferred loading with `@defer`
+
+Deferrable views, also known as `@defer` blocks, reduce the initial bundle size of your application by deferring the loading of code that is not strictly necessary for the initial rendering of a page. This often results in a faster initial load and improvement in Core Web Vitals (CWV), primarily Largest Contentful Paint (LCP) and Time to First Byte (TTFB).
+
+To use this feature, you can declaratively wrap a section of your template in a @defer block:
+
+```html
+@defer {
+  <large-component />
+}
+```
+
+The code for any components, directives, and pipes inside the `@defer` block is split into a separate JavaScript file and loaded only when necessary, after the rest of the template has been rendered.
+
+Deferrable views support a variety of triggers, prefetching options, and sub-blocks for placeholder, loading, and error state management.
+
+## Which dependencies are deferred?
+
+Components, directives, pipes, and any component CSS styles can be deferred when loading an application.
+
+In order for the dependencies within a `@defer` block to be deferred, they need to meet two conditions:
+
+1. **They must be standalone.** Non-standalone dependencies cannot be deferred and are still eagerly loaded, even if they are inside of `@defer` blocks.
+1. **They cannot be referenced outside of `@defer` blocks within the same file.** If they are referenced outside the `@defer` block or referenced within ViewChild queries, the dependencies will be eagerly loaded.
+
+The _transitive_ dependencies of the components, directives and pipes used in the `@defer` block do not strictly need to be standalone; transitive dependencies can still be declared in an `NgModule` and participate in deferred loading.
+
+Angular's compiler produces a [dynamic import](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import) statement for each component, directive, and pipe used in the `@defer` block. The main content of the block renders after all the imports resolve. Angular does not guarantee any particular order for these imports.
+
+## How to manage different stages of deferred loading
+
+`@defer` blocks have several sub blocks to allow you to gracefully handle different stages in the deferred loading process.
+
+### `@defer`
+
+This is the primary block that defines the section of content that is lazily loaded. It is not rendered initially– deferred content loads and renders once the specified [trigger](/guide/templates/defer#triggers) occurs or the `when` condition is met.
+
+By default, a @defer block is triggered when the browser state becomes [idle](/guide/templates/defer#idle).
+
+```html
+@defer {
+  <large-component />
+}
+```
+
+### Show placeholder content with `@placeholder`
+
+By default, defer blocks do not render any content before they are triggered.
+
+The `@placeholder` is an optional block that declares what content to show before the `@defer` block is triggered.
+
+```html
+@defer {
+  <large-component />
+} @placeholder {
+  <p>Placeholder content</p>
+}
+```
+
+While optional, certain triggers may require the presence of either a `@placeholder` or a [template reference variable](/guide/templates/variables#template-reference-variables) to function. See the [Triggers](/guide/templates/defer#triggers) section for more details.
+
+Angular replaces placeholder content with the main content once loading is complete. You can use any content in the placeholder section including plain HTML, components, directives, and pipes. Keep in mind the _dependencies of the placeholder block are eagerly loaded_.
+
+The `@placeholder` block accepts an optional parameter to specify the `minimum` amount of time that this placeholder should be shown after the placeholder content initially renders.
+
+```html
+@defer {
+  <large-component />
+} @placeholder (minimum 500ms) {
+  <p>Placeholder content</p>
+}
+```
+
+This `minimum` parameter is specified in time increments of milliseconds (ms) or seconds (s). You can use this parameter to prevent fast flickering of placeholder content in the case that the deferred dependencies are fetched quickly.
+
+### Show loading content with `@loading`
+
+The `@loading` block is an optional block that allows you to declare content that is shown while deferred dependencies are loading. It replaces the `@placeholder` block once loading is triggered.
+
+```html
+@defer {
+  <large-component />
+} @loading {
+  <img alt="loading..." src="loading.gif" />
+} @placeholder {
+  <p>Placeholder content</p>
+}
+```
+
+Its dependencies are eagerly loaded (similar to `@placeholder`).
+
+The `@loading` block accepts two optional parameters to help prevent fast flickering of content that may occur when deferred dependencies are fetched quickly,:
+
+- `minimum` - the minimum amount of time that this placeholder should be shown
+- `after` - the amount of time to wait after loading begins before showing the loading template
+
+```html
+@defer {
+  <large-component />
+} @loading (after 100ms; minimum 1s) {
+  <img alt="loading..." src="loading.gif" />
+}
+```
+
+Both parameters are specified in time increments of milliseconds (ms) or seconds (s). In addition, the timers for both parameters begin immediately after the loading has been triggered.
+
+### Show error state when deferred loading fails with `@error`
+
+The `@error` block is an optional block that displays if deferred loading fails. Similar to `@placeholder` and `@loading`, the dependencies of the @error block are eagerly loaded.
+
+```html
+@defer {
+  <large-component />
+} @error {
+  <p>Failed to load large component.</p>
+}
+```
+
+## Controlling deferred content loading with triggers
+
+You can specify **triggers** that control when Angular loads and displays deferred content.
+
+When a `@defer` block is triggered, it replaces placeholder content with lazily loaded content.
+
+Multiple event triggers can be defined by separating them with a semicolon, `;` and will be evaluated as OR conditions.
+
+There are two types of triggers: `on` and `when`.
+
+### `on`
+
+`on` specifies a condition for when the `@defer` block is triggered.
+
+The available triggers are as follows:
+
+| Trigger                       | Description                                                            |
+| ----------------------------- | ---------------------------------------------------------------------- |
+| [`idle`](#idle)               | Triggers when the browser is idle.                                     |
+| [`viewport`](#viewport)       | Triggers when specified content enters the viewport                    |
+| [`interaction`](#interaction) | Triggers when the user interacts with specified element                |
+| [`hover`](#hover)             | Triggers when the mouse hovers over specified area                     |
+| [`immediate`](#immediate)     | Triggers immediately after non-deferred content has finished rendering |
+| [`timer`](#timer)             | Triggers after a specific duration                                     |
+
+#### `idle`
+
+The `idle` trigger loads the deferred content once the browser has reached an idle state, based on requestIdleCallback. This is the default behavior with a defer block.
+
+```html
+<!-- @defer (on idle) -->
+@defer {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+#### `viewport`
+
+The `viewport` trigger loads the deferred content when the specified content enters the viewport using the [Intersection Observer API](https://developer.mozilla.org/docs/Web/API/Intersection_Observer_API). Observed content may be `@placeholder` content or an explicit element reference.
+
+By default, the `@defer` watches for the placeholder entering the viewport. Placeholders used this way must have a single root element.
+
+```html
+@defer (on viewport) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+Alternatively, you can specify a [template reference variable](/guide/templates/variables) in the same template as the `@defer` block as the element that is watched to enter the viewport. This variable is passed in as a parameter on the viewport trigger.
+
+```html
+<div #greeting>Hello!</div>
+@defer (on viewport(greeting)) {
+  <greetings-cmp />
+}
+```
+
+#### `interaction`
+
+The `interaction` trigger loads the deferred content when the user interacts with the specified element through `click` or `keydown` events.
+
+By default, the placeholder acts as the interaction element. Placeholders used this way must have a single root element.
+
+```html
+@defer (on interaction) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+Alternatively, you can specify a [template reference variable](/guide/templates/variables) in the same template as the `@defer` block as the element that is watched for interactions. This variable is passed in as a parameter on the viewport trigger.
+
+```html
+<div #greeting>Hello!</div>
+@defer (on interaction(greeting)) {
+  <greetings-cmp />
+}
+```
+
+#### `hover`
+
+The `hover` trigger loads the deferred content when the mouse has hovered over the triggered area through the `mouseover` and `focusin` events.
+
+By default, the placeholder acts as the interaction element. Placeholders used this way must have a single root element.
+
+```html
+@defer (on hover) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+Alternatively, you can specify a [template reference variable](/guide/templates/variables) in the same template as the `@defer` block as the element that is watched to enter the viewport. This variable is passed in as a parameter on the viewport trigger.
+
+```html
+<div #greeting>Hello!</div>
+@defer (on hover(greeting)) {
+  <greetings-cmp />
+}
+```
+
+#### `immediate`
+
+The `immediate` trigger loads the deferred content immediately. This means that the deferred block loads as soon as all other non-deferred content has finished rendering.
+
+```html
+@defer (on immediate) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+#### `timer`
+
+The `timer` trigger loads the deferred content after a specified duration.
+
+```html
+@defer (on timer(500ms)) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+The duration parameter must be specified in milliseconds (`ms`) or seconds (`s`).
+
+### `when`
+
+The `when` trigger accepts a custom conditional expression and loads the deferred content when the condition becomes truthy.
+
+```html
+@defer (when condition) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+This is a one-time operation– the `@defer` block does not revert back to the placeholder if the condition changes to a falsy value after becoming truthy.
+
+## Prefetching data with `prefetch`
+
+In addition to specifying a condition that determines when deferred content is shown, you can optionally specify a **prefetch trigger**. This trigger lets you load the JavaScript associated with the `@defer` block before the deferred content is shown.
+
+Prefetching enables more advanced behaviors, such as letting you start to prefetch resources before a user has actually seen or interacted with a defer block, but might interact with it soon, making the resources available faster.
+
+You can specify a prefetch trigger similarly to the block's main trigger, but prefixed with the `prefetch` keyword. The block's main trigger and prefetch trigger are separated with a semi-colon character (`;`).
+
+In the example below, the prefetching starts when a browser becomes idle and the contents of the block is rendered only once the user interacts with the placeholder.
+
+```html
+@defer (on interaction; prefetch on idle) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+## Testing `@defer` blocks
+
+Angular provides TestBed APIs to simplify the process of testing `@defer` blocks and triggering different states during testing. By default, `@defer` blocks in tests play through like a defer block would behave in a real application. If you want to manually step through states, you can switch the defer block behavior to `Manual` in the TestBed configuration.
+
+```typescript
+it('should render a defer block in different states', async () => {
+  // configures the defer block behavior to start in "paused" state for manual control.
+  TestBed.configureTestingModule({deferBlockBehavior: DeferBlockBehavior.Manual});
+  @Component({
+    // ...
+    template: `
+      @defer {
+        <large-component />
+      } @placeholder {
+        Placeholder
+      } @loading {
+        Loading...
+      }
+    `
+  })
+  class ComponentA {}
+  // Create component fixture.
+  const componentFixture = TestBed.createComponent(ComponentA);
+  // Retrieve the list of all defer block fixtures and get the first block.
+  const deferBlockFixture = (await componentFixture.getDeferBlocks())[0];
+  // Renders placeholder state by default.
+  expect(componentFixture.nativeElement.innerHTML).toContain('Placeholder');
+  // Render loading state and verify rendered output.
+  await deferBlockFixture.render(DeferBlockState.Loading);
+  expect(componentFixture.nativeElement.innerHTML).toContain('Loading');
+  // Render final state and verify the output.
+  await deferBlockFixture.render(DeferBlockState.Complete);
+  expect(componentFixture.nativeElement.innerHTML).toContain('large works!');
+});
+```
+
+## Does `@defer` work with `NgModule`?
+
+`@defer` blocks are compatible with both standalone and NgModule-based components, directives and pipes. However, **only standalone components, directives and pipes can be deferred**. NgModule-based dependencies are not deferred and are included in the eagerly loaded bundle.
+
+## How does `@defer` work with server-side rendering (SSR) and static-site generation (SSG)?
+
+By default, when rendering an application on the server (either using SSR or SSG), defer blocks always render their `@placeholder` (or nothing if a placeholder is not specified) and triggers are not invoked. On the client, the content of the `@placeholder` is hydrated and triggers are activated.
+
+To render the main content of `@defer` blocks on the server (both SSR and SSG), you can enable [the Incremental Hydration feature](/guide/incremental-hydration) and configure `hydrate` triggers for the necessary blocks.
+
+## Best practices for deferring views
+
+### Avoid cascading loads with nested `@defer` blocks
+
+When you have nested `@defer` blocks, they should have different triggers in order to avoid loading simultaneously, which causes cascading requests and may negatively impact page load performance.
+
+### Avoid layout shifts
+
+Avoid deferring components that are visible in the user’s viewport on initial load. Doing this may negatively affect Core Web Vitals by causing an increase in cumulative layout shift (CLS).
+
+In the event this is necessary, avoid `immediate`, `timer`, `viewport`, and custom `when` triggers that cause the content to load during the initial page render.
+# Expression Syntax
+
+Angular expressions are based on JavaScript, but differ in some key ways. This guide walks through the similarities and differences between Angular expressions and standard JavaScript.
+
+## Value literals
+
+Angular supports a subset of [literal values](https://developer.mozilla.org/en-US/docs/Glossary/Literal) from JavaScript.
+
+### Supported value literals
+
+| Literal type           | Example values                  |
+| ---------------------- | ------------------------------- |
+| String                 | `'Hello'`, `"World"`            |
+| Boolean                | `true`, `false`                 |
+| Number                 | `123`, `3.14`                   |
+| Object                 | `{name: 'Alice'}`               |
+| Array                  | `['Onion', 'Cheese', 'Garlic']` |
+| null                   | `null`                          |
+| Template string        | `` `Hello ${name}` ``           |
+
+### Unsupported literals
+
+| Literal type           | Example value            |
+| ---------------------- | ------------------------ |
+| RegExp                 | `/\d+/`                  |
+
+## Globals
+
+Angular expressions support the following [globals](https://developer.mozilla.org/en-US/docs/Glossary/Global_object):
+
+- [undefined](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined)
+- [$any](https://www.typescriptlang.org/docs/handbook/2/everyday-types.html#any)
+
+No other JavaScript globals are supported. Common JavaScript globals include `Number`, `Boolean`, `NaN`, `Infinity`, `parseInt`, and more.
+
+## Local variables
+
+Angular automatically makes special local variables available for use in expressions in specific contexts. These special variables always start with the dollar sign character (`$`).
+
+For example, `@for` blocks make several local variables corresponding to information about the loop, such as `$index`.
+
+## What operators are supported?
+
+### Supported operators
+
+Angular supports the following operators from standard JavaScript.
+
+| Operator                        | Example(s)                               |
+| ------------------------------- | ---------------------------------------- |
+| Add / Concatenate               | `1 + 2`                                  |
+| Subtract                        | `52 - 3`                                 |
+| Multiply                        | `41 * 6`                                 |
+| Divide                          | `20 / 4`                                 |
+| Remainder (Modulo)              | `17 % 5`                                 |
+| Exponentiation                  | `10 ** 3`                                |
+| Parenthesis                     | `9 * (8 + 4)`                            |
+| Conditional (Ternary)           | `a > b ? true : false`                   |
+| And (Logical)                   | `&&`                                     |
+| Or (Logical)                    | `\|\|`                                   |
+| Not (Logical)                   | `!`                                      |
+| Nullish Coalescing              | `possiblyNullValue ?? 'default'`         |
+| Comparison Operators            | `<`, `<=`, `>`, `>=`, `==`, `===`, `!==` |
+| Unary Negation                  | `-x`                                     |
+| Unary Plus                      | `+y`                                     |
+| Property Accessor               | `person['name']`                         |
+| Assignment                      | `a = b`                                  |
+| Addition Assignment             | `a += b`                                 |
+| Subtraction Assignment          | `a -= b`                                 |
+| Multiplication Assignment       | `a *= b`                                 |
+| Division Assignment             | `a /= b`                                 |
+| Remainder Assignment            | `a %= b`                                 |
+| Exponentiation Assignment       | `a **= b`                                |
+| Logical AND Assignment          | `a &&= b`                                |
+| Logical OR Assignment           | `a \|\|= b`                              |
+| Nullish Coalescing Assignment   | `a ??= b`                                |
+
+Angular expressions additionally also support the following non-standard operators:
+
+| Operator                        | Example(s)                     |
+| ------------------------------- | ------------------------------ |
+| [Pipe](/guide/templates/pipes) | `{{ total \| currency }}`      |
+| Optional chaining\*             | `someObj.someProp?.nestedProp` |
+| Non-null assertion (TypeScript) | `someObj!.someProp`            |
+
+NOTE: Optional chaining behaves differently from the standard JavaScript version in that if the left side of Angular’s optional chaining operator is `null` or `undefined`, it returns `null` instead of `undefined`.
+
+### Unsupported operators
+
+| Operator              | Example(s)                        |
+| --------------------- | --------------------------------- |
+| All bitwise operators | `&`, `&=`, `~`, `\|=`, `^=`, etc. |
+| Object destructuring  | `const { name } = person`         |
+| Array destructuring   | `const [firstItem] = items`       |
+| Comma operator        | `x = (x++, x)`                    |
+| instanceof            | `car instanceof Automobile`       |
+| new                   | `new Car()`                       |
+
+## Lexical context for expressions
+
+Angular expressions are evaluated within the context of the component class as well as any relevant [template variables](/guide/templates/variables), locals, and globals.
+
+When referring to component class members, `this` is always implied. However, if a template declares a [template variables](guide/templates/variables) with the same name as a member, the variable shadows that member. You can unambiguously reference such a class member by explicitly using `this.`. This can be useful when creating an `@let` declaration that shadows a class member, e.g. for signal narrowing purposes.
+
+## Declarations
+
+Generally speaking, declarations are not supported in Angular expressions. This includes, but is not limited to:
+
+| Declarations    | Example(s)                                  |
+| --------------- | ------------------------------------------- |
+| Variables       | `let label = 'abc'`, `const item = 'apple'` |
+| Functions       | `function myCustomFunction() { }`           |
+| Arrow Functions | `() => { }`                                 |
+| Classes         | `class Rectangle { }`                       |
+
+# Event listener statements
+
+Event handlers are **statements** rather than expressions. While they support all of the same syntax as Angular expressions, the are two key differences:
+
+1. Statements **do support** assignment operators (but not destructing assignments)
+1. Statements **do not support** pipes
+# Attribute directives
+
+Change the appearance or behavior of DOM elements and Angular components with attribute directives.
+
+## Building an attribute directive
+
+This section walks you through creating a highlight directive that sets the background color of the host element to yellow.
+
+1. To create a directive, use the CLI command [`ng generate directive`](tools/cli/schematics).
+
+    ```shell
+ng generate directive highlight
+```
+    The CLI creates `src/app/highlight.directive.ts`, a corresponding test file `src/app/highlight.directive.spec.ts`.
+
+    <docs-code header="src/app/highlight.directive.ts" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.0.ts"/>
+
+    The `@Directive()` decorator's configuration property specifies the directive's CSS attribute selector, `[appHighlight]`.
+
+1. Import `ElementRef` from `@angular/core`.
+    `ElementRef` grants direct access to the host DOM element through its `nativeElement` property.
+
+1. Add `ElementRef` in the directive's `constructor()` to [inject](guide/di) a reference to the host DOM element, the element to which you apply `appHighlight`.
+
+1. Add logic to the `HighlightDirective` class that sets the background to yellow.
+
+    <docs-code header="src/app/highlight.directive.ts" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.1.ts"/>
+
+HELPFUL: Directives *do not* support namespaces.
+
+<docs-code header="src/app/app.component.avoid.html (unsupported)" path="adev/src/content/examples/attribute-directives/src/app/app.component.avoid.html" visibleRegion="unsupported"/>
+
+## Applying an attribute directive
+
+1. To use the `HighlightDirective`, add a `<p>` element to the HTML template with the directive as an attribute.
+
+    <docs-code header="src/app/app.component.html" path="adev/src/content/examples/attribute-directives/src/app/app.component.1.html" visibleRegion="applied"/>
+
+Angular creates an instance of the `HighlightDirective` class and injects a reference to the `<p>` element into the directive's constructor, which sets the `<p>` element's background style to yellow.
+
+## Handling user events
+
+This section shows you how to detect when a user mouses into or out of the element and to respond by setting or clearing the highlight color.
+
+1. Import `HostListener` from '@angular/core'.
+
+    <docs-code header="src/app/highlight.directive.ts (imports)" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.2.ts" visibleRegion="imports"/>
+
+1. Add two event handlers that respond when the mouse enters or leaves, each with the `@HostListener()` decorator.
+
+    <docs-code header="src/app/highlight.directive.ts (mouse-methods)" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.2.ts" visibleRegion="mouse-methods"/>
+
+Subscribe to events of the DOM element that hosts an attribute directive, the `<p>` in this case, with the `@HostListener()` decorator.
+
+HELPFUL: The handlers delegate to a helper method, `highlight()`, that sets the color on the host DOM element, `el`.
+
+The complete directive is as follows:
+
+<docs-code header="src/app/highlight.directive.ts" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.2.ts"/>
+
+The background color appears when the pointer hovers over the paragraph element and disappears as the pointer moves out.
+
+<img alt="Second Highlight" src="assets/images/guide/attribute-directives/highlight-directive-anim.gif">
+
+## Passing values into an attribute directive
+
+This section walks you through setting the highlight color while applying the `HighlightDirective`.
+
+1. In `highlight.directive.ts`, import `Input` from `@angular/core`.
+
+    <docs-code header="src/app/highlight.directive.ts (imports)" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.3.ts" visibleRegion="imports"/>
+
+1. Add an `appHighlight` `input` property.
+
+    <docs-code header="src/app/highlight.directive.ts" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.3.ts" visibleRegion="input"/>
+
+    The `input()` function adds metadata to the class that makes the directive's `appHighlight` property available for binding.
+
+2. In `app.component.ts`, add a `color` property to the `AppComponent`.
+
+    <docs-code header="src/app/app.component.ts (class)" path="adev/src/content/examples/attribute-directives/src/app/app.component.1.ts" visibleRegion="class"/>
+
+3. To simultaneously apply the directive and the color, use property binding with the `appHighlight` directive selector, setting it equal to `color`.
+
+    <docs-code header="src/app/app.component.html (color)" path="adev/src/content/examples/attribute-directives/src/app/app.component.html" visibleRegion="color"/>
+
+    The `[appHighlight]` attribute binding performs two tasks:
+
+    * Applies the highlighting directive to the `<p>` element
+    * Sets the directive's highlight color with a property binding
+
+### Setting the value with user input
+
+This section guides you through adding radio buttons to bind your color choice to the `appHighlight` directive.
+
+1. Add markup to `app.component.html` for choosing a color as follows:
+
+    <docs-code header="src/app/app.component.html (v2)" path="adev/src/content/examples/attribute-directives/src/app/app.component.html" visibleRegion="v2"/>
+
+1. Revise the `AppComponent.color` so that it has no initial value.
+
+    <docs-code header="src/app/app.component.ts (class)" path="adev/src/content/examples/attribute-directives/src/app/app.component.ts" visibleRegion="class"/>
+
+1. In `highlight.directive.ts`, revise `onMouseEnter` method so that it first tries to highlight with `appHighlight` and falls back to `red` if `appHighlight` is `undefined`.
+
+    <docs-code header="src/app/highlight.directive.ts (mouse-enter)" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.3.ts" visibleRegion="mouse-enter"/>
+
+1. Serve your application to verify that the user can choose the color with the radio buttons.
+
+    <img alt="Animated gif of the refactored highlight directive changing color according to the radio button the user selects" src="assets/images/guide/attribute-directives/highlight-directive-v2-anim.gif">
+
+## Binding to a second property
+
+This section guides you through configuring your application so the developer can set the default color.
+
+1. Add a second `Input()` property to `HighlightDirective` called `defaultColor`.
+
+    <docs-code header="src/app/highlight.directive.ts (defaultColor)" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.ts" visibleRegion="defaultColor"/>
+
+1. Revise the directive's `onMouseEnter` so that it first tries to highlight with the `appHighlight`, then with the `defaultColor`, and falls back to `red` if both properties are `undefined`.
+
+    <docs-code header="src/app/highlight.directive.ts (mouse-enter)" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.ts" visibleRegion="mouse-enter"/>
+
+1. To bind to the `AppComponent.color` and fall back to "violet" as the default color, add the following HTML.
+    In this case,  the `defaultColor` binding doesn't use square brackets, `[]`, because it is static.
+
+    <docs-code header="src/app/app.component.html (defaultColor)" path="adev/src/content/examples/attribute-directives/src/app/app.component.html" visibleRegion="defaultColor"/>
+
+    As with components, you can add multiple directive property bindings to a host element.
+
+The default color is red if there is no default color binding.
+When the user chooses a color the selected color becomes the active highlight color.
+
+<img alt="Animated gif of final highlight directive that shows red color with no binding and violet with the default color set. When user selects color, the selection takes precedence." src="assets/images/guide/attribute-directives/highlight-directive-final-anim.gif">
+
+## Deactivating Angular processing with `NgNonBindable`
+
+To prevent expression evaluation in the browser, add `ngNonBindable` to the host element.
+`ngNonBindable` deactivates interpolation, directives, and binding in templates.
+
+In the following example, the expression `{{ 1 + 1 }}` renders just as it does in your code editor, and does not display `2`.
+
+<docs-code header="src/app/app.component.html" path="adev/src/content/examples/attribute-directives/src/app/app.component.html" visibleRegion="ngNonBindable"/>
+
+Applying `ngNonBindable` to an element stops binding for that element's child elements.
+However, `ngNonBindable` still lets directives work on the element where you apply `ngNonBindable`.
+In the following example, the `appHighlight` directive is still active but Angular does not evaluate the expression `{{ 1 + 1 }}`.
+
+<docs-code header="src/app/app.component.html" path="adev/src/content/examples/attribute-directives/src/app/app.component.html" visibleRegion="ngNonBindable-with-directive"/>
+
+If you apply `ngNonBindable` to a parent element, Angular disables interpolation and binding of any sort, such as property binding or event binding, for the element's children.
+# Structural directives
+
+Structural directives are directives applied to an `<ng-template>` element that conditionally or repeatedly render the content of that `<ng-template>`.
+
+## Example use case
+
+In this guide you'll build a structural directive which fetches data from a given data source and renders its template when that data is available. This directive is called `SelectDirective`, after the SQL keyword `SELECT`, and match it with an attribute selector `[select]`.
+
+`SelectDirective` will have an input naming the data source to be used, which you will call `selectFrom`. The `select` prefix for this input is important for the [shorthand syntax](#structural-directive-shorthand). The directive will instantiate its `<ng-template>` with a template context providing the selected data.
+
+The following is an example of using this directive directly on an `<ng-template>` would look like:
+
+```html
+<ng-template select let-data [selectFrom]="source">
+  <p>The data is: {{ data }}</p>
+</ng-template>
+```
+
+The structural directive can wait for the data to become available and then render its `<ng-template>`.
+
+HELPFUL: Note that Angular's `<ng-template>` element defines a template that doesn't render anything by default, if you just wrap elements in an `<ng-template>` without applying a structural directive those elements will not be rendered.
+
+For more information, see the [ng-template API](api/core/ng-template) documentation.
+
+## Structural directive shorthand
+
+Angular supports a shorthand syntax for structural directives which avoids the need to explicitly author an `<ng-template>` element.
+
+Structural directives can be applied directly on an element by prefixing the directive attribute selector with an asterisk (`*`), such as `*select`. Angular transforms the asterisk in front of a structural directive into an `<ng-template>` that hosts the directive and surrounds the element and its descendants.
+
+You can use this with `SelectDirective` as follows:
+
+```html
+<p *select="let data from source">The data is: {{data}}</p>
+```
+
+This example shows the flexibility of structural directive shorthand syntax, which is sometimes called _microsyntax_.
+
+When used in this way, only the structural directive and its bindings are applied to the `<ng-template>`. Any other attributes or bindings on the `<p>` tag are left alone. For example, these two forms are equivalent:
+
+```html
+<!-- Shorthand syntax: -->
+<p class="data-view" *select="let data from source">The data is: {{data}}</p>
+
+<!-- Long-form syntax: -->
+<ng-template select let-data [selectFrom]="source">
+  <p class="data-view">The data is: {{data}}</p>
+</ng-template>
+```
+
+Shorthand syntax is expanded through a set of conventions. A more thorough [grammar](#structural-directive-syntax-reference) is defined below, but in the above example, this transformation can be explained as follows:
+
+The first part of the `*select` expression is `let data`, which declares a template variable `data`. Since no assignment follows, the template variable is bound to the template context property `$implicit`.
+
+The second piece of syntax is a key-expression pair, `from source`. `from` is a binding key and `source` is a regular template expression. Binding keys are mapped to properties by transforming them to PascalCase and prepending the structural directive selector. The `from` key is mapped to `selectFrom`, which is then bound to the expression `source`. This is why many structural directives will have inputs that are all prefixed with the structural directive's selector.
+
+## One structural directive per element
+
+You can only apply one structural directive per element when using the shorthand syntax. This is because there is only one `<ng-template>` element onto which that directive gets unwrapped. Multiple directives would require multiple nested `<ng-template>`, and it's unclear which directive should be first. `<ng-container>` can be used when to create wrapper layers when multiple structural directives need to be applied around the same physical DOM element or component, which allows the user to define the nested structure.
+
+## Creating a structural directive
+
+This section guides you through creating the `SelectDirective`.
+
+<docs-workflow>
+<docs-step title="Generate the directive">
+Using the Angular CLI, run the following command, where `select` is the name of the directive:
+
+```shell
+ng generate directive select
+```
+
+Angular creates the directive class and specifies the CSS selector, `[select]`, that identifies the directive in a template.
+</docs-step>
+<docs-step title="Make the directive structural">
+Import `TemplateRef`, and `ViewContainerRef`. Inject `TemplateRef` and `ViewContainerRef` in the directive as private properties.
+
+```ts
+import {Directive, TemplateRef, ViewContainerRef} from '@angular/core';
+
+@Directive({
+  selector: '[select]',
+})
+export class SelectDirective {
+  private templateRef = inject(TemplateRef);
+  private viewContainerRef = inject(ViewContainerRef);
+}
+
+```
+
+</docs-step>
+<docs-step title="Add the 'selectFrom' input">
+Add a `selectFrom` `input()` property.
+
+```ts
+export class SelectDirective {
+  // ...
+
+  selectFrom = input.required<DataSource>();
+}
+```
+
+</docs-step>
+<docs-step title="Add the business logic">
+With `SelectDirective` now scaffolded as a structural directive with its input, you can now add the logic to fetch the data and render the template with it:
+
+```ts
+export class SelectDirective {
+  // ...
+
+  async ngOnInit() {
+    const data = await this.selectFrom.load();
+    this.viewContainerRef.createEmbeddedView(this.templateRef, {
+      // Create the embedded view with a context object that contains
+      // the data via the key `$implicit`.
+      $implicit: data,
+    });
+  }
+}
+```
+
+</docs-step>
+</docs-workflow>
+
+That's it - `SelectDirective` is up and running. A follow-up step might be to [add template type-checking support](#typing-the-directives-context).
+
+## Structural directive syntax reference
+
+When you write your own structural directives, use the following syntax:
+
+```
+*:prefix="( :let | :expression ) (';' | ',')? ( :let | :as | :keyExp )*"
+```
+The following patterns describe each portion of the structural directive grammar:
+
+```ts
+as = :export "as" :local ";"?
+keyExp = :key ":"? :expression ("as" :local)? ";"?
+let = "let" :local "=" :export ";"?
+```
+
+| Keyword      | Details                                            |
+| :----------- | :------------------------------------------------- |
+| `prefix`     | HTML attribute key                                 |
+| `key`        | HTML attribute key                                 |
+| `local`      | Local variable name used in the template           |
+| `export`     | Value exported by the directive under a given name |
+| `expression` | Standard Angular expression                        |
+
+### How Angular translates shorthand
+
+Angular translates structural directive shorthand into the normal binding syntax as follows:
+
+| Shorthand | Translation |
+|:--- |:--- |
+| `prefix` and naked `expression` | `[prefix]="expression"` |
+| `keyExp` | `[prefixKey]="expression"` (The `prefix` is added to the `key`) |
+| `let local` | `let-local="export"` |
+
+### Shorthand examples
+
+The following table provides shorthand examples:
+
+| Shorthand | How Angular interprets the syntax |
+|:--- |:--- |
+| `*myDir="let item of [1,2,3]"` | `<ng-template myDir let-item [myDirOf]="[1, 2, 3]">` |
+| `*myDir="let item of [1,2,3] as items; trackBy: myTrack; index as i"` | `<ng-template myDir let-item [myDirOf]="[1,2,3]" let-items="myDirOf" [myDirTrackBy]="myTrack" let-i="index">` |
+| `*ngComponentOutlet="componentClass";` | `<ng-template [ngComponentOutlet]="componentClass">` |
+| `*ngComponentOutlet="componentClass; inputs: myInputs";` | `<ng-template [ngComponentOutlet]="componentClass" [ngComponentOutletInputs]="myInputs">` |
+| `*myDir="exp as value"` | `<ng-template [myDir]="exp" let-value="myDir">` |
+
+## Improving template type checking for custom directives
+
+You can improve template type checking for custom directives by adding template guards to your directive definition.
+These guards help the Angular template type checker find mistakes in the template at compile time, which can avoid runtime errors.
+Two different types of guards are possible:
+
+* `ngTemplateGuard_(input)` lets you control how an input expression should be narrowed based on the type of a specific input.
+* `ngTemplateContextGuard` is used to determine the type of the context object for the template, based on the type of the directive itself.
+
+This section provides examples of both kinds of guards.
+For more information, see [Template type checking](tools/cli/template-typecheck "Template type-checking guide").
+
+### Type narrowing with template guards
+
+A structural directive in a template controls whether that template is rendered at run time. Some structural directives want to perform type narrowing based on the type of input expression.
+
+There are two narrowings which are possible with input guards:
+
+* Narrowing the input expression based on a TypeScript type assertion function.
+* Narrowing the input expression based on its truthiness.
+
+To narrow the input expression by defining a type assertion function:
+
+```ts
+// This directive only renders its template if the actor is a user.
+// You want to assert that within the template, the type of the `actor`
+// expression is narrowed to `User`.
+@Directive(...)
+class ActorIsUser {
+  actor = input<User | Robot>();
+
+  static ngTemplateGuard_actor(dir: ActorIsUser, expr: User | Robot): expr is User {
+    // The return statement is unnecessary in practice, but included to
+    // prevent TypeScript errors.
+    return true;
+  }
+}
+```
+
+Type-checking will behave within the template as if the `ngTemplateGuard_actor` has been asserted on the expression bound to the input.
+
+Some directives only render their templates when an input is truthy. It's not possible to capture the full semantics of truthiness in a type assertion function, so instead a literal type of `'binding'` can be used to signal to the template type-checker that the binding expression itself should be used as the guard:
+
+```ts
+@Directive(...)
+class CustomIf {
+  condition = input.required<boolean>();
+
+  static ngTemplateGuard_condition: 'binding';
+}
+```
+
+The template type-checker will behave as if the expression bound to `condition` was asserted to be truthy within the template.
+
+### Typing the directive's context
+
+If your structural directive provides a context to the instantiated template, you can properly type it inside the template by providing a static `ngTemplateContextGuard` type assertion function. This function can use the type of the directive to derive the type of the context, which is useful when the type of the directive is generic.
+
+For the `SelectDirective` described above, you can implement an `ngTemplateContextGuard` to correctly specify the data type, even if the data source is generic.
+
+```ts
+// Declare an interface for the template context:
+export interface SelectTemplateContext<T> {
+  $implicit: T;
+}
+
+@Directive(...)
+export class SelectDirective<T> {
+  // The directive's generic type `T` will be inferred from the `DataSource` type
+  // passed to the input.
+  selectFrom = input.required<DataSource<T>>();
+
+  // Narrow the type of the context using the generic type of the directive.
+  static ngTemplateContextGuard<T>(dir: SelectDirective<T>, ctx: any): ctx is SelectTemplateContext<T> {
+    // As before the guard body is not used at runtime, and included only to avoid
+    // TypeScript errors.
+    return true;
+  }
+}
+```
+# Directive composition API
+
+Angular directives offer a great way to encapsulate reusable behaviors— directives can apply
+attributes, CSS classes, and event listeners to an element.
+
+The *directive composition API* lets you apply directives to a component's host element from
+*within* the component TypeScript class.
+
+## Adding directives to a component
+
+You apply directives to a component by adding a `hostDirectives` property to a component's
+decorator. We call such directives *host directives*.
+
+In this example, we apply the directive `MenuBehavior` to the host element of `AdminMenu`. This
+works similarly to applying the `MenuBehavior` to the `<admin-menu>` element in a template.
+
+```typescript
+@Component({
+  selector: 'admin-menu',
+  template: 'admin-menu.html',
+  hostDirectives: [MenuBehavior],
+})
+export class AdminMenu { }
+```
+
+When the framework renders a component, Angular also creates an instance of each host directive. The
+directives' host bindings apply to the component's host element. By default, host directive inputs
+and outputs are not exposed as part of the component's public API. See
+[Including inputs and outputs](#including-inputs-and-outputs) below for more information.
+
+**Angular applies host directives statically at compile time.** You cannot dynamically add
+directives at runtime.
+
+**Directives used in `hostDirectives` may not specify `standalone: false`.**
+
+**Angular ignores the `selector` of directives applied in the `hostDirectives` property.**
+
+## Including inputs and outputs
+
+When you apply `hostDirectives` to your component, the inputs and outputs from the host directives
+are not included in your component's API by default. You can explicitly include inputs and outputs
+in your component's API by expanding the entry in `hostDirectives`:
+
+```typescript
+@Component({
+  selector: 'admin-menu',
+  template: 'admin-menu.html',
+  hostDirectives: [{
+    directive: MenuBehavior,
+    inputs: ['menuId'],
+    outputs: ['menuClosed'],
+  }],
+})
+export class AdminMenu { }
+```
+
+By explicitly specifying the inputs and outputs, consumers of the component with `hostDirective` can
+bind them in a template:
+
+```html
+<admin-menu menuId="top-menu" (menuClosed)="logMenuClosed()">
+```
+
+Furthermore, you can alias inputs and outputs from `hostDirective` to customize the API of your
+component:
+
+```typescript
+@Component({
+  selector: 'admin-menu',
+  template: 'admin-menu.html',
+  hostDirectives: [{
+    directive: MenuBehavior,
+    inputs: ['menuId: id'],
+    outputs: ['menuClosed: closed'],
+  }],
+})
+export class AdminMenu { }
+```
+
+```html
+<admin-menu id="top-menu" (closed)="logMenuClosed()">
+```
+
+## Adding directives to another directive
+
+You can also add `hostDirectives` to other directives, in addition to components. This enables the
+transitive aggregation of multiple behaviors.
+
+In the following example, we define two directives, `Menu` and `Tooltip`. We then compose the behavior
+of these two directives in `MenuWithTooltip`. Finally, we apply `MenuWithTooltip`
+to `SpecializedMenuWithTooltip`.
+
+When `SpecializedMenuWithTooltip` is used in a template, it creates instances of all of `Menu`
+, `Tooltip`, and `MenuWithTooltip`. Each of these directives' host bindings apply to the host
+element of `SpecializedMenuWithTooltip`.
+
+```typescript
+@Directive({...})
+export class Menu { }
+
+@Directive({...})
+export class Tooltip { }
+
+// MenuWithTooltip can compose behaviors from multiple other directives
+@Directive({
+  hostDirectives: [Tooltip, Menu],
+})
+export class MenuWithTooltip { }
+
+// CustomWidget can apply the already-composed behaviors from MenuWithTooltip
+@Directive({
+  hostDirectives: [MenuWithTooltip],
+})
+export class SpecializedMenuWithTooltip { }
+```
+
+## Host directive semantics
+
+### Directive execution order
+
+Host directives go through the same lifecycle as components and directives used directly in a
+template. However, host directives always execute their constructor, lifecycle hooks, and bindings _before_ the component or directive on which they are applied.
+
+The following example shows minimal use of a host directive:
+
+```typescript
+@Component({
+  selector: 'admin-menu',
+  template: 'admin-menu.html',
+  hostDirectives: [MenuBehavior],
+})
+export class AdminMenu { }
+```
+
+The order of execution here is:
+
+1. `MenuBehavior` instantiated
+2. `AdminMenu` instantiated
+3. `MenuBehavior` receives inputs (`ngOnInit`)
+4. `AdminMenu` receives inputs (`ngOnInit`)
+5. `MenuBehavior` applies host bindings
+6. `AdminMenu` applies host bindings
+
+This order of operations means that components with `hostDirectives` can override any host bindings
+specified by a host directive.
+
+This order of operations extends to nested chains of host directives, as shown in the following
+example.
+
+```typescript
+@Directive({...})
+export class Tooltip { }
+
+@Directive({
+  hostDirectives: [Tooltip],
+})
+export class CustomTooltip { }
+
+@Directive({
+  hostDirectives: [CustomTooltip],
+})
+export class EvenMoreCustomTooltip { }
+```
+
+In the example above, the order of execution is:
+
+1. `Tooltip` instantiated
+2. `CustomTooltip` instantiated
+3. `EvenMoreCustomTooltip` instantiated
+4. `Tooltip` receives inputs (`ngOnInit`)
+5. `CustomTooltip` receives inputs (`ngOnInit`)
+6. `EvenMoreCustomTooltip` receives inputs (`ngOnInit`)
+7. `Tooltip` applies host bindings
+8. `CustomTooltip` applies host bindings
+9. `EvenMoreCustomTooltip` applies host bindings
+
+### Dependency injection
+
+A component or directive that specifies `hostDirectives` can inject the instances of those host
+directives and vice versa.
+
+When applying host directives to a component, both the component and host directives can define
+providers.
+
+If a component or directive with `hostDirectives` and those host directives both provide the same
+injection token, the providers defined by class with `hostDirectives` take precedence over providers
+defined by the host directives.
+# Getting started with NgOptimizedImage
+
+The `NgOptimizedImage` directive makes it easy to adopt performance best practices for loading images.
+
+The directive ensures that the loading of the [Largest Contentful Paint (LCP)](http://web.dev/lcp) image is prioritized by:
+
+* Automatically setting the `fetchpriority` attribute on the `<img>` tag
+* Lazy loading other images by default
+* Automatically generating a preconnect link tag in the document head
+* Automatically generating a `srcset` attribute
+* Generating a [preload hint](https://developer.mozilla.org/docs/Web/HTML/Link_types/preload) if app is using SSR
+
+In addition to optimizing the loading of the LCP image, `NgOptimizedImage` enforces a number of image best practices, such as:
+
+* Using [image CDN URLs to apply image optimizations](https://web.dev/image-cdns/#how-image-cdns-use-urls-to-indicate-optimization-options)
+* Preventing layout shift by requiring `width` and `height`
+* Warning if `width` or `height` have been set incorrectly
+* Warning if the image will be visually distorted when rendered
+
+If you're using a background image in CSS, [start here](#how-to-migrate-your-background-image).
+
+**NOTE: Although the `NgOptimizedImage` directive was made a stable feature in Angular version 15, it has been backported and is available as a stable feature in versions 13.4.0 and 14.3.0 as well.**
+
+## Getting Started
+
+<docs-workflow>
+<docs-step title="Import `NgOptimizedImage` directive">
+Import `NgOptimizedImage` directive from `@angular/common`:
+
+```typescript
+import { NgOptimizedImage } from '@angular/common'
+```
+and include it into the `imports` array of a standalone component or an NgModule:
+
+```typescript
+imports: [
+  NgOptimizedImage,
+  // ...
+],
+```
+
+</docs-step>
+<docs-step title="(Optional) Set up a Loader">
+An image loader is not **required** in order to use NgOptimizedImage, but using one with an image CDN enables powerful performance features, including automatic `srcset`s for your images.
+
+A brief guide for setting up a loader can be found in the [Configuring an Image Loader](#configuring-an-image-loader-for-ngoptimizedimage) section at the end of this page.
+</docs-step>
+<docs-step title="Enable the directive">
+To activate the `NgOptimizedImage` directive, replace your image's `src` attribute with `ngSrc`.
+
+```html
+<img ngSrc="cat.jpg">
+```
+If you're using a [built-in third-party loader](#built-in-loaders), make sure to omit the base URL path from `src`, as that will be prepended automatically by the loader.
+</docs-step>
+<docs-step title="Mark images as `priority`">
+Always mark the [LCP image](https://web.dev/lcp/#what-elements-are-considered) on your page as `priority` to prioritize its loading.
+
+```html
+<img ngSrc="cat.jpg" width="400" height="200" priority>
+```
+Marking an image as `priority` applies the following optimizations:
+
+* Sets `fetchpriority=high` (read more about priority hints [here](https://web.dev/priority-hints))
+* Sets `loading=eager` (read more about native lazy loading [here](https://web.dev/browser-level-image-lazy-loading))
+* Automatically generates a [preload link element](https://developer.mozilla.org/docs/Web/HTML/Link_types/preload) if [rendering on the server](guide/ssr).
+
+Angular displays a warning during development if the LCP element is an image that does not have the `priority` attribute. A page’s LCP element can vary based on a number of factors - such as the dimensions of a user's screen, so a page may have multiple images that should be marked `priority`. See [CSS for Web Vitals](https://web.dev/css-web-vitals/#images-and-largest-contentful-paint-lcp) for more details.
+</docs-step>
+<docs-step title="Include Width and Height">
+In order to prevent [image-related layout shifts](https://web.dev/css-web-vitals/#images-and-layout-shifts), NgOptimizedImage requires that you specify a height and width for your image, as follows:
+
+```html
+<img ngSrc="cat.jpg" width="400" height="200">
+```
+For **responsive images** (images which you've styled to grow and shrink relative to the viewport), the `width` and `height` attributes should be the intrinsic size of the image file. For responsive images it's also important to [set a value for `sizes`.](#responsive-images)
+
+For **fixed size images**, the `width` and `height` attributes should reflect the desired rendered size of the image. The aspect ratio of these attributes should always match the intrinsic aspect ratio of the image.
+
+NOTE: If you don't know the size of your images, consider using "fill mode" to inherit the size of the parent container, as described below.
+</docs-step>
+</docs-workflow>
+
+## Using `fill` mode
+
+In cases where you want to have an image fill a containing element, you can use the `fill` attribute. This is often useful when you want to achieve a "background image" behavior. It can also be helpful when you don't know the exact width and height of your image, but you do have a parent container with a known size that you'd like to fit your image into (see "object-fit" below).
+
+When you add the `fill` attribute to your image, you do not need and should not include a `width` and `height`, as in this example:
+
+```html
+<img ngSrc="cat.jpg" fill>
+```
+You can use the [object-fit](https://developer.mozilla.org/docs/Web/CSS/object-fit) CSS property to change how the image will fill its container. If you style your image with `object-fit: "contain"`, the image will maintain its aspect ratio and be "letterboxed" to fit the element. If you set `object-fit: "cover"`, the element will retain its aspect ratio, fully fill the element, and some content may be "cropped" off.
+
+See visual examples of the above at the [MDN object-fit documentation.](https://developer.mozilla.org/docs/Web/CSS/object-fit)
+
+You can also style your image with the [object-position property](https://developer.mozilla.org/docs/Web/CSS/object-position) to adjust its position within its containing element.
+
+IMPORTANT: For the "fill" image to render properly, its parent element **must** be styled with `position: "relative"`, `position: "fixed"`, or `position: "absolute"`.
+
+## How to migrate your background image
+
+Here's a simple step-by-step process for migrating from `background-image` to `NgOptimizedImage`. For these steps, we'll refer to the element that has an image background as the "containing element":
+
+1) Remove the `background-image` style from the containing element.
+2) Ensure that the containing element has `position: "relative"`, `position: "fixed"`, or `position: "absolute"`.
+3) Create a new image element as a child of the containing element, using `ngSrc` to enable the `NgOptimizedImage` directive.
+4) Give that element the `fill` attribute. Do not include a `height` and `width`.
+5) If you believe this image might be your [LCP element](https://web.dev/lcp/), add the `priority` attribute to the image element.
+
+You can adjust how the background image fills the container as described in the [Using fill mode](#using-fill-mode) section.
+## Using placeholders
+
+### Automatic placeholders
+
+NgOptimizedImage can display an automatic low-resolution placeholder for your image if you're using a CDN or image host that provides automatic image resizing. Take advantage of this feature by adding the `placeholder` attribute to your image:
+
+```
+<img ngSrc="cat.jpg" width="400" height="200" placeholder>
+```
+Adding this attribute automatically requests a second, smaller version of the image using your specified image loader. This small image will be applied as a `background-image` style with a CSS blur while your image loads. If no image loader is provided, no placeholder image can be generated and an error will be thrown.
+
+The default size for generated placeholders is 30px wide. You can change this size by specifying a pixel value in the `IMAGE_CONFIG` provider, as seen below:
+
+```
+providers: [
+  {
+    provide: IMAGE_CONFIG,
+    useValue: {
+      placeholderResolution: 40
+    }
+  },
+],
+```
+If you want sharp edges around your blurred placeholder, you can wrap your image in a containing `<div>` with the `overflow: hidden` style. As long as the `<div>` is the same size as the image (such as by using the `width: fit-content` style), the "fuzzy edges" of the placeholder will be hidden.
+
+### Data URL placeholders
+
+You can also specify a placeholder using a base64 [data URL](https://developer.mozilla.org/docs/Web/HTTP/Basics_of_HTTP/Data_URLs) without an image loader. The data url format is `data:image/[imagetype];[data]`, where `[imagetype]` is the image format, just as `png`, and `[data]` is a base64 encoding of the image. That encoding can be done using the command line or in JavaScript. For specific commands, see [the MDN documentation](https://developer.mozilla.org/docs/Web/HTTP/Basics_of_HTTP/Data_URLs#encoding_data_into_base64_format). An example of a data URL placeholder with truncated data is shown below:
+
+```html
+<img
+  ngSrc="cat.jpg"
+  width="400"
+  height="200"
+  placeholder="data:image/png;base64,iVBORw0K..."
+/>
+```
+However, large data URLs  increase the size of your Angular bundles and slow down page load. If you cannot use an image loader, the Angular team recommends keeping base64 placeholder images smaller than 4KB and using them exclusively on critical images. In addition to decreasing placeholder dimensions, consider changing image formats or parameters used when saving images. At very low resolutions, these parameters can have a large effect on file size.
+
+### Non-blurred placeholders
+
+By default, NgOptimizedImage applies a CSS blur effect to image placeholders. To render a placeholder without blur, provide a `placeholderConfig` argument with an object that includes the `blur` property, set to false. For example:
+
+```html
+<img
+  ngSrc="cat.jpg"
+  width="400"
+  height="200"
+  placeholder
+  [placeholderConfig]="{blur: false}"
+/>
+```
+## Adjusting image styling
+
+Depending on the image's styling, adding `width` and `height` attributes may cause the image to render differently. `NgOptimizedImage` warns you if your image styling renders the image at a distorted aspect ratio.
+
+You can typically fix this by adding `height: auto` or `width: auto` to your image styles. For more information, see the [web.dev article on the `<img>` tag](https://web.dev/patterns/web-vitals-patterns/images/img-tag).
+
+If the `width` and `height` attribute on the image are preventing you from sizing the image the way you want with CSS, consider using `fill` mode instead, and styling the image's parent element.
+
+## Performance Features
+
+NgOptimizedImage includes a number of features designed to improve loading performance in your app. These features are described in this section.
+
+### Add resource hints
+
+A [`preconnect` resource hint](https://web.dev/preconnect-and-dns-prefetch) for your image origin ensures that the LCP image loads as quickly as possible.
+
+Preconnect links are automatically generated for domains provided as an argument to a [loader](#optional-set-up-a-loader). If an image origin cannot be automatically identified, and no preconnect link is detected for the LCP image, `NgOptimizedImage` will warn during development. In that case, you should manually add a resource hint to `index.html`. Within the `<head>` of the document, add a `link` tag with `rel="preconnect"`, as shown below:
+
+```html
+<link rel="preconnect" href="https://my.cdn.origin" />
+```
+To disable preconnect warnings, inject the `PRECONNECT_CHECK_BLOCKLIST` token:
+
+```typescript
+providers: [
+  {provide: PRECONNECT_CHECK_BLOCKLIST, useValue: 'https://your-domain.com'}
+],
+```
+See more information on automatic preconnect generation [here](#why-is-a-preconnect-element-not-being-generated-for-my-image-domain).
+### Request images at the correct size with automatic `srcset`
+
+Defining a [`srcset` attribute](https://developer.mozilla.org/docs/Web/API/HTMLImageElement/srcset) ensures that the browser requests an image at the right size for your user's viewport, so it doesn't waste time downloading an image that's too large. `NgOptimizedImage` generates an appropriate `srcset` for the image, based on the presence and value of the [`sizes` attribute](https://developer.mozilla.org/docs/Web/API/HTMLImageElement/sizes) on the image tag.
+
+#### Fixed-size images
+
+If your image should be "fixed" in size  (i.e. the same size across devices, except for [pixel density](https://web.dev/codelab-density-descriptors/)), there is no need to set a `sizes` attribute. A `srcset` can be generated automatically from the image's width and height attributes with no further input required.
+
+Example srcset generated:
+```html
+<img ... srcset="image-400w.jpg 1x, image-800w.jpg 2x">
+```
+
+#### Responsive images
+
+If your image should be responsive (i.e. grow and shrink according to viewport size), then you will need to define a [`sizes` attribute](https://developer.mozilla.org/docs/Web/API/HTMLImageElement/sizes) to generate the `srcset`.
+
+If you haven't used `sizes` before, a good place to start is to set it based on viewport width. For example, if your CSS causes the image to fill 100% of viewport width, set `sizes` to `100vw` and the browser will select the image in the `srcset` that is closest to the viewport width (after accounting for pixel density). If your image is only likely to take up half the screen (ex: in a sidebar), set `sizes` to `50vw` to ensure the browser selects a smaller image. And so on.
+
+If you find that the above does not cover your desired image behavior, see the documentation on [advanced sizes values](#advanced-sizes-values).
+
+Note that `NgOptimizedImage` automatically prepends `"auto"` to the provided `sizes` value. This is an optimization that increases the accuracy of srcset selection on browsers which support `sizes="auto"`, and is ignored by browsers which do not.
+
+By default, the responsive breakpoints are:
+
+`[16, 32, 48, 64, 96, 128, 256, 384, 640, 750, 828, 1080, 1200, 1920, 2048, 3840]`
+
+If you would like to customize these breakpoints, you can do so using the `IMAGE_CONFIG` provider:
+
+```typescript
+providers: [
+  {
+    provide: IMAGE_CONFIG,
+    useValue: {
+      breakpoints: [16, 48, 96, 128, 384, 640, 750, 828, 1080, 1200, 1920]
+    }
+  },
+],
+```
+If you would like to manually define a `srcset` attribute, you can provide your own using the `ngSrcset` attribute:
+
+```html
+<img ngSrc="hero.jpg" ngSrcset="100w, 200w, 300w">
+```
+If the `ngSrcset` attribute is present, `NgOptimizedImage` generates and sets the `srcset` based on the sizes included. Do not include image file names in `ngSrcset` - the directive infers this information from `ngSrc`. The directive supports both width descriptors (e.g. `100w`) and density descriptors (e.g. `1x`).
+
+```html
+<img ngSrc="hero.jpg" ngSrcset="100w, 200w, 300w" sizes="50vw">
+```
+### Disabling automatic srcset generation
+
+To disable srcset generation for a single image, you can add the `disableOptimizedSrcset` attribute on the image:
+
+```html
+<img ngSrc="about.jpg" disableOptimizedSrcset>
+```
+### Disabling image lazy loading
+
+By default, `NgOptimizedImage` sets `loading=lazy` for all images that are not marked `priority`. You can disable this behavior for non-priority images by setting the `loading` attribute. This attribute accepts values: `eager`, `auto`, and `lazy`. [See the documentation for the standard image `loading` attribute for details](https://developer.mozilla.org/docs/Web/API/HTMLImageElement/loading#value).
+
+```html
+<img ngSrc="cat.jpg" width="400" height="200" loading="eager">
+```
+### Advanced 'sizes' values
+
+You may want to have images displayed at varying widths on differently-sized screens. A common example of this pattern is a grid- or column-based layout that renders a single column on mobile devices, and two columns on larger devices. You can capture this behavior in the `sizes` attribute, using a "media query" syntax, such as the following:
+
+```html
+<img ngSrc="cat.jpg" width="400" height="200" sizes="(max-width: 768px) 100vw, 50vw">
+```
+The `sizes` attribute in the above example says "I expect this image to be 100 percent of the screen width on devices under 768px wide. Otherwise, I expect it to be 50 percent of the screen width.
+
+For additional information about the `sizes` attribute, see [web.dev](https://web.dev/learn/design/responsive-images/#sizes) or [mdn](https://developer.mozilla.org/docs/Web/API/HTMLImageElement/sizes).
+
+## Configuring an image loader for `NgOptimizedImage`
+
+A "loader" is a function that generates an [image transformation URL](https://web.dev/image-cdns/#how-image-cdns-use-urls-to-indicate-optimization-options) for a given image file. When appropriate, `NgOptimizedImage` sets the size, format, and image quality transformations for an image.
+
+`NgOptimizedImage` provides both a generic loader that applies no transformations, as well as loaders for various third-party image services. It also supports writing your own custom loader.
+
+| Loader type| Behavior |
+|:--- |:--- |
+| Generic loader | The URL returned by the generic loader will always match the value of `src`. In other words, this loader applies no transformations. Sites that use Angular to serve images are the primary intended use case for this loader.|
+| Loaders for third-party image services | The URL returned by the loaders for third-party image services will follow API conventions used by that particular image service. |
+| Custom loaders | A custom loader's behavior is defined by its developer. You should use a custom loader if your image service isn't supported by the loaders that come preconfigured with `NgOptimizedImage`.|
+
+Based on the image services commonly used with Angular applications, `NgOptimizedImage` provides loaders preconfigured to work with the following image services:
+
+| Image Service | Angular API | Documentation |
+|:--- |:--- |:--- |
+| Cloudflare Image Resizing | `provideCloudflareLoader` | [Documentation](https://developers.cloudflare.com/images/image-resizing/) |
+| Cloudinary | `provideCloudinaryLoader` | [Documentation](https://cloudinary.com/documentation/resizing_and_cropping) |
+| ImageKit | `provideImageKitLoader` | [Documentation](https://docs.imagekit.io/) |
+| Imgix | `provideImgixLoader` | [Documentation](https://docs.imgix.com/) |
+| Netlify | `provideNetlifyLoader` | [Documentation](https://docs.netlify.com/image-cdn/overview/) |
+
+To use the **generic loader** no additional code changes are necessary. This is the default behavior.
+
+### Built-in Loaders
+
+To use an existing loader for a **third-party image service**, add the provider factory for your chosen service to the `providers` array. In the example below, the Imgix loader is used:
+
+```typescript
+providers: [
+  provideImgixLoader('https://my.base.url/'),
+],
+```
+The base URL for your image assets should be passed to the provider factory as an argument. For most sites, this base URL should match one of the following patterns:
+
+* <https://yoursite.yourcdn.com>
+* <https://subdomain.yoursite.com>
+* <https://subdomain.yourcdn.com/yoursite>
+
+You can learn more about the base URL structure in the docs of a corresponding CDN provider.
+
+### Custom Loaders
+
+To use a **custom loader**, provide your loader function as a value for the `IMAGE_LOADER` DI token. In the example below, the custom loader function returns a URL starting with `https://example.com` that includes `src` and `width` as URL parameters.
+
+```typescript
+providers: [
+  {
+    provide: IMAGE_LOADER,
+    useValue: (config: ImageLoaderConfig) => {
+      return `https://example.com/images?src=${config.src}&width=${config.width}`;
+    },
+  },
+],
+```
+A loader function for the `NgOptimizedImage` directive takes an object with the `ImageLoaderConfig` type (from `@angular/common`) as its argument and returns the absolute URL of the image asset. The `ImageLoaderConfig` object contains the `src` property, and optional `width` and `loaderParams` properties.
+
+NOTE: even though the `width` property may not always be present, a custom loader must use it to support requesting images at various widths in order for `ngSrcset` to work properly.
+
+### The `loaderParams` Property
+
+There is an additional attribute supported by the `NgOptimizedImage` directive, called `loaderParams`, which is specifically designed to support the use of custom loaders. The `loaderParams` attribute takes an object with any properties as a value, and does not do anything on its own. The data in `loaderParams` is added to the `ImageLoaderConfig` object passed to your custom loader, and can be used to control the behavior of the loader.
+
+A common use for `loaderParams` is controlling advanced image CDN features.
+
+### Example custom loader
+
+The following shows an example of a custom loader function. This example function concatenates `src` and `width`, and uses `loaderParams` to control a custom CDN feature for rounded corners:
+
+```typescript
+const myCustomLoader = (config: ImageLoaderConfig) => {
+  let url = `https://example.com/images/${config.src}?`;
+  let queryParams = [];
+  if (config.width) {
+    queryParams.push(`w=${config.width}`);
+  }
+  if (config.loaderParams?.roundedCorners) {
+    queryParams.push('mask=corners&corner-radius=5');
+  }
+  return url + queryParams.join('&');
+};
+```
+Note that in the above example, we've invented the 'roundedCorners' property name to control a feature of our custom loader. We could then use this feature when creating an image, as follows:
+
+```html
+<img ngSrc="profile.jpg" width="300" height="300" [loaderParams]="{roundedCorners: true}">
+```
+## Frequently Asked Questions
+
+### Does NgOptimizedImage support the `background-image` css property?
+
+The NgOptimizedImage does not directly support the `background-image` css property, but it is designed to easily accommodate the use case of having an image as the background of another element.
+
+For a step-by-step process for migration from `background-image` to `NgOptimizedImage`, see the [How to migrate your background image](#how-to-migrate-your-background-image) section above.
+
+### Why can't I use `src` with `NgOptimizedImage`?
+
+The `ngSrc` attribute was chosen as the trigger for NgOptimizedImage due to technical considerations around how images are loaded by the browser. NgOptimizedImage makes programmatic changes to the `loading` attribute -- if the browser sees the `src` attribute before those changes are made, it will begin eagerly downloading the image file, and the loading changes will be ignored.
+
+### Why is a preconnect element not being generated for my image domain?
+Preconnect generation is performed based on static analysis of your application. That means that the image domain must be directly included in the loader parameter, as in the following example:
+
+```typescript
+providers: [
+  provideImgixLoader('https://my.base.url/'),
+],
+```
+If you use a variable to pass the domain string to the loader, or you're not using a loader, the static analysis will not be able to identify the domain, and no preconnect link will be generated. In this case you should manually add a preconnect link to the document head, as [described above](#add-resource-hints).
+### Can I use two different image domains in the same page?
+
+The [image loaders](#configuring-an-image-loader-for-ngoptimizedimage) provider pattern is designed to be as simple as possible for the common use case of having only a single image CDN used within a component. However, it's still very possible to manage multiple image CDNs using a single provider.
+
+To do this, we recommend writing a [custom image loader](#custom-loaders) which uses the [`loaderParams` property](#the-loaderparams-property) to pass a flag that specifies which image CDN should be used, and then invokes the appropriate loader based on that flag.
+
+### Can you add a new built-in loader for my preferred CDN?
+
+For maintenance reasons, we don't currently plan to support additional built-in loaders in the Angular repository. Instead, we encourage developers to publish any additional image loaders as third-party packages.
+
+### Can I use this with the `<picture>` tag
+
+No, but this is on our roadmap, so stay tuned.
+
+If you're waiting on this feature, please upvote the Github issue [here](https://github.com/angular/angular/issues/56594).
+
+### How do I find my LCP image with Chrome DevTools?
+
+1. Using the performance tab of the Chrome DevTools, click on the "start profiling and reload page" button on the top left. It looks like a page refresh icon.
+
+2. This will trigger a profiling snapshot of your Angular application.
+
+3. Once the profiling result is available, select "LCP" in the timings section.
+
+4. A summary entry should appear in the panel at the bottom. You can find the LCP element in the row for "related node".  Clicking on it will reveal the element in the Elements panel.
+
+<img alt="LCP in the Chrome DevTools" src="assets/images/guide/image-optimization/devtools-lcp.png">
+
+NOTE: This only identifies the LCP element within the viewport of the page you are testing. It is also recommended to use mobile emulation to identify the LCP element for smaller screens.
+In Angular, you use *signals* to create and manage state. A signal is a lightweight wrapper around a value.
+
+Use the `signal` function to create a signal for holding local state:
+
+```typescript
+import {signal} from '@angular/core';
+
+// Create a signal with the `signal` function.
+const firstName = signal('Morgan');
+
+// Read a signal value by calling it— signals are functions.
+console.log(firstName());
+
+// Change the value of this signal by calling its `set` method with a new value.
+firstName.set('Jaime');
+
+// You can also use the `update` method to change the value
+// based on the previous value.
+firstName.update(name => name.toUpperCase());
+```
+
+Angular tracks where signals are read and when they're updated. The framework uses this information to do additional work, such as updating the DOM with new state. This ability to respond to changing signal values over time is known as *reactivity*.
+
+## Computed expressions
+
+A `computed` is a signal that produces its value based on other signals.
+
+```typescript
+import {signal, computed} from '@angular/core';
+
+const firstName = signal('Morgan');
+const firstNameCapitalized = computed(() => firstName().toUpperCase());
+
+console.log(firstNameCapitalized()); // MORGAN
+```
+
+A `computed` signal is read-only; it does not have a `set` or an `update` method. Instead, the value of the `computed` signal automatically changes when any of the signals it reads change:
+
+```typescript
+import {signal, computed} from '@angular/core';
+
+const firstName = signal('Morgan');
+const firstNameCapitalized = computed(() => firstName().toUpperCase());
+console.log(firstNameCapitalized()); // MORGAN
+
+firstName.set('Jaime');
+console.log(firstNameCapitalized()); // JAIME
+```
+
+## Using signals in components
+
+Use `signal` and `computed` inside your components to create and manage state:
+
+```typescript
+@Component({/* ... */})
+export class UserProfile {
+  isTrial = signal(false);
+  isTrialExpired = signal(false);
+  showTrialDuration = computed(() => this.isTrial() && !this.isTrialExpired());
+
+  activateTrial() {
+    this.isTrial.set(true);
+  }
+}
+```
+
+TIP: Want to know more about Angular Signals? See the [In-depth Signals guide](guide/signals) for the full details.
+
+## Next Step
+
+Now that you have learned how to declare and manage dynamic data, it's time to learn how to use that data inside of templates.
+# Dependent state with `linkedSignal`
+
+You can use the `signal` function to hold some state in your Angular code. Sometimes, this state depends on some _other_ state. For example, imagine a component that lets the user select a shipping method for an order:
+
+```typescript
+@Component({/* ... */})
+export class ShippingMethodPicker {
+  shippingOptions: Signal<ShippingMethod[]> = getShippingOptions();
+
+  // Select the first shipping option by default.
+  selectedOption = signal(this.shippingOptions()[0]);
+
+  changeShipping(newOptionIndex: number) {
+    this.selectedOption.set(this.shippingOptions()[newOptionIndex]);
+  }
+}
+```
+
+In this example, the `selectedOption` defaults to the first option, but changes if the user selects another option. But `shippingOptions` is a signal— its value may change! If `shippingOptions` changes, `selectedOption` may contain a value that is no longer a valid option.
+
+**The `linkedSignal` function lets you create a signal to hold some state that is intrinsically _linked_ to some other state.** Revisiting the example above, `linkedSignal` can replace `signal`:
+
+```typescript
+@Component({/* ... */})
+export class ShippingMethodPicker {
+  shippingOptions: Signal<ShippingMethod[]> = getShippingOptions();
+
+  // Initialize selectedOption to the first shipping option.
+  selectedOption = linkedSignal(() => this.shippingOptions()[0]);
+
+  changeShipping(index: number) {
+    this.selectedOption.set(this.shippingOptions()[index]);
+  }
+}
+```
+
+`linkedSignal` works similarly to `signal` with one key difference— instead of passing a default value, you pass a _computation function_, just like `computed`. When the value of the computation changes, the value of the `linkedSignal` changes to the computation result. This helps ensure that the `linkedSignal` always has a valid value.
+
+The following example shows how the value of a `linkedSignal` can change based on its linked state:
+
+```typescript
+const shippingOptions = signal(['Ground', 'Air', 'Sea']);
+const selectedOption = linkedSignal(() => shippingOptions()[0]);
+console.log(selectedOption()); // 'Ground'
+
+selectedOption.set(shippingOptions()[2]);
+console.log(selectedOption()); // 'Sea'
+
+shippingOptions.set(['Email', 'Will Call', 'Postal service']);
+console.log(selectedOption()); // 'Email'
+```
+
+## Accounting for previous state
+
+In some cases, the computation for a `linkedSignal` needs to account for the previous value of the `linkedSignal`.
+
+In the example above, `selectedOption` always updates back to the first option when `shippingOptions` changes. You may, however, want to preserve the user's selection if their selected option is still somewhere in the list. To accomplish this, you can create a `linkedSignal` with a separate _source_ and _computation_:
+
+```typescript
+interface ShippingMethod {
+  id: number;
+  name: string;
+}
+
+@Component({/* ... */})
+export class ShippingMethodPicker {
+  constructor() {
+    this.changeShipping(2);
+    this.changeShippingOptions();
+    console.log(this.selectedOption()); // {"id":2,"name":"Postal Service"}
+  }
+
+  shippingOptions = signal<ShippingMethod[]>([
+    { id: 0, name: 'Ground' },
+    { id: 1, name: 'Air' },
+    { id: 2, name: 'Sea' },
+  ]);
+
+  selectedOption = linkedSignal<ShippingMethod[], ShippingMethod>({
+    // `selectedOption` is set to the `computation` result whenever this `source` changes.
+    source: this.shippingOptions,
+    computation: (newOptions, previous) => {
+      // If the newOptions contain the previously selected option, preserve that selection.
+      // Otherwise, default to the first option.
+      return (
+        newOptions.find((opt) => opt.id === previous?.value.id) ?? newOptions[0]
+      );
+    },
+  });
+
+  changeShipping(index: number) {
+    this.selectedOption.set(this.shippingOptions()[index]);
+  }
+
+  changeShippingOptions() {
+    this.shippingOptions.set([
+      { id: 0, name: 'Email' },
+      { id: 1, name: 'Sea' },
+      { id: 2, name: 'Postal Service' },
+    ]);
+  }
+}
+```
+
+When you create a `linkedSignal`, you can pass an object with separate `source` and `computation` properties instead of providing just a computation.
+
+The `source` can be any signal, such as a `computed` or component `input`. When the value of `source` changes, `linkedSignal` updates its value to the result of the provided `computation`.
+
+The `computation` is a function that receives the new value of `source` and a `previous` object. The `previous` object has two properties— `previous.source` is the previous value of `source`, and `previous.value` is the previous result of the `computation`. You can use these previous values to decide the new result of the computation.
+
+HELPFUL: When using the `previous` parameter, it is necessary to provide the generic type arguments of `linkedSignal` explicitly. The first generic type corresponds with the type of `source` and the second generic type determines the output type of `computation`.
+
+## Custom equality comparison
+
+`linkedSignal`, as any other signal, can be configured with a custom equality function. This function is used by downstream dependencies to determine if that value of the `linkedSignal` (result of a computation) changed:
+
+```typescript
+const activeUser = signal({id: 123, name: 'Morgan', isAdmin: true});
+
+const activeUserEditCopy = linkedSignal(() => activeUser(), {
+  // Consider the user as the same if it's the same `id`.
+  equal: (a, b) => a.id === b.id,
+});
+
+// Or, if separating `source` and `computation`
+const activeUserEditCopy = linkedSignal({
+  source: activeUser,
+  computation: user => user,
+  equal: (a, b) => a.id === b.id,
+});
+```
+# Async reactivity with resources
+
+IMPORTANT: `resource` is [experimental](reference/releases#experimental). It's ready for you to try, but it might change before it is stable.
+
+Most signal APIs are synchronous— `signal`, `computed`, `input`, etc. However, applications often need to deal with data that is available asynchronously. A `Resource` gives you a way to incorporate async data into your application's signal-based code.
+
+You can use a `Resource` to perform any kind of async operation, but the most common use-case for `Resource` is fetching data from a server. The following example creates a resource to fetch some user data.
+
+The easiest way to create a `Resource` is the `resource` function.
+
+```typescript
+import {resource, Signal} from '@angular/core';
+
+const userId: Signal<string> = getUserId();
+
+const userResource = resource({
+  // Define a reactive computation.
+  // The params value recomputes whenever any read signals change.
+  params: () => ({id: userId()}),
+
+  // Define an async loader that retrieves data.
+  // The resource calls this function every time the `params` value changes.
+  loader: ({params}) => fetchUser(params),
+});
+
+// Create a computed signal based on the result of the resource's loader function.
+const firstName = computed(() => {
+  if (userResource.hasValue()) {
+    // `hasValue` serves 2 purposes:
+    // - It acts as type guard to strip `undefined` from the type
+    // - If protects against reading a throwing `value` when the resource is in error state
+    return userResource.value().firstName;
+  }
+
+  // fallback in case the resource value is `undefined` or if the resource is in error state
+  return undefined;
+});
+```
+
+The `resource` function accepts a `ResourceOptions` object with two main properties: `params` and `loader`.
+
+The `params` property defines a reactive computation that produces a parameter value. Whenever signals read in this computation change, the resource produces a new parameter value, similar to `computed`.
+
+The `loader` property defines a `ResourceLoader`— an async function that retrieves some state. The resource calls the loader every time the `params` computation produces a new value, passing that value to the loader. See [Resource loaders](#resource-loaders) below for more details.
+
+`Resource` has a `value` signal that contains the results of the loader.
+
+## Resource loaders
+
+When creating a resource, you specify a `ResourceLoader`. This loader is an async function that accepts a single parameter— a `ResourceLoaderParams` object— and returns a value.
+
+The `ResourceLoaderParams` object contains three properties: `params`, `previous`, and `abortSignal`.
+
+| Property      | Description                                                                                                                                      |
+| ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
+| `params`      | The value of the resource's `params` computation.                                                                                                |
+| `previous`    | An object with a `status` property, containing the previous `ResourceStatus`.                                                                    |
+| `abortSignal` | An [`AbortSignal`](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal). See [Aborting requests](#aborting-requests) below for details. |
+
+If the `params` computation returns `undefined`, the loader function does not run and the resource status becomes `'idle'`.
+
+### Aborting requests
+
+A resource aborts an outstanding loading operation if the `params` computation changes while the resource is loading.
+
+You can use the `abortSignal` in `ResourceLoaderParams` to respond to aborted requests. For example, the native `fetch` function accepts an `AbortSignal`:
+
+```typescript
+const userId: Signal<string> = getUserId();
+
+const userResource = resource({
+  params: () => ({id: userId()}),
+  loader: ({params, abortSignal}): Promise<User> => {
+    // fetch cancels any outstanding HTTP requests when the given `AbortSignal`
+    // indicates that the request has been aborted.
+    return fetch(`users/${params.id}`, {signal: abortSignal});
+  },
+});
+```
+
+See [`AbortSignal` on MDN](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal) for more details on request cancellation with `AbortSignal`.
+
+### Reloading
+
+You can programmatically trigger a resource's `loader` by calling the `reload` method.
+
+```typescript
+const userId: Signal<string> = getUserId();
+
+const userResource = resource({
+  params: () => ({id: userId()}),
+  loader: ({params}) => fetchUser(params),
+});
+
+// ...
+
+userResource.reload();
+```
+
+## Resource status
+
+The resource object has several signal properties for reading the status of the asynchronous loader.
+
+| Property    | Description                                                                                                     |
+| ----------- | --------------------------------------------------------------------------------------------------------------- |
+| `value`     | The most recent value of the resource, or `undefined` if no value has been received.                            |
+| `hasValue`  | Whether the resource has a value.                                                                               |
+| `error`     | The most recent error encountered while running the resource's loader, or `undefined` if no error has occurred. |
+| `isLoading` | Whether the resource loader is currently running.                                                               |
+| `status`    | The resource's specific `ResourceStatus`, as described below.                                                   |
+
+The `status` signal provides a specific `ResourceStatus` that describes the state of the resource using a string constant.
+
+| Status        | `value()`         | Description                                                                  |
+| ------------- | :---------------- | ---------------------------------------------------------------------------- |
+| `'idle'`      | `undefined`       | The resource has no valid request and the loader has not run.                |
+| `'error'`     | `undefined`       | The loader has encountered an error.                                         |
+| `'loading'`   | `undefined`       | The loader is running as a result of the `request` value changing.           |
+| `'reloading'` | Previous value    | The loader is running as a result calling of the resource's `reload` method. |
+| `'resolved'`  | Resolved value    | The loader has completed.                                                    |
+| `'local'`     | Locally set value | The resource's value has been set locally via `.set()` or `.update()`        |
+
+You can use this status information to conditionally display user interface elements, such loading indicators and error messages.
+
+## Reactive data fetching with `httpResource`
+
+[`httpResource`](/guide/http/http-resource) is a wrapper around `HttpClient` that gives you the request status and response as signals. It makes HTTP requests through the Angular HTTP stack, including interceptors.
+# Understanding dependency injection
+
+Dependency injection, or DI, is one of the fundamental concepts in Angular. DI is wired into the Angular framework and allows classes with Angular decorators, such as Components, Directives, Pipes, and Injectables, to configure dependencies that they need.
+
+Two main roles exist in the DI system: dependency consumer and dependency provider.
+
+Angular facilitates the interaction between dependency consumers and dependency providers using an abstraction called `Injector`. When a dependency is requested, the injector checks its registry to see if there is an instance already available there. If not, a new instance is created and stored in the registry. Angular creates an application-wide injector (also known as the "root" injector) during the application bootstrap process. In most cases you don't need to manually create injectors, but you should know that there is a layer that connects providers and consumers.
+
+This topic covers basic scenarios of how a class can act as a dependency. Angular also allows you to use functions, objects, primitive types such as string or Boolean, or any other types as dependencies. For more information, see [Dependency providers](guide/di/dependency-injection-providers).
+
+## Providing a dependency
+
+Consider a class called `HeroService` that needs to act as a dependency in a component.
+
+The first step is to add the `@Injectable` decorator to show that the class can be injected.
+
+```typescript
+@Injectable()
+class HeroService {}
+```
+The next step is to make it available in the DI by providing it.
+A dependency can be provided in multiple places:
+
+- [**Preferred**: At the application root level using `providedIn`](#preferred-at-the-application-root-level-using-providedin)
+- [At the Component level](#at-the-component-level)
+- [At the application root level using `ApplicationConfig`](#at-the-application-root-level-using-applicationconfig)
+- [`NgModule` based applications](#ngmodule-based-applications)
+
+### **Preferred**: At the application root level using `providedIn`
+
+Providing a service at the application root level using `providedIn` allows injecting the service into all other classes.
+Using `providedIn` enables Angular and JavaScript code optimizers to effectively remove services that are unused (known as tree-shaking).
+
+You can provide a service by using `providedIn: 'root'` in the `@Injectable` decorator:
+
+```typescript
+@Injectable({
+  providedIn: 'root'
+})
+class HeroService {}
+```
+When you provide the service at the root level, Angular creates a single, shared instance of the `HeroService` and injects it into any class that asks for it.
+
+### At the Component level
+
+You can provide services at `@Component` level by using the `providers` field of the `@Component` decorator.
+In this case the `HeroService` becomes available to all instances of this component and other components and directives used in the template.
+
+For example:
+
+```typescript
+@Component({
+  selector: 'hero-list',
+  template: '...',
+  providers: [HeroService]
+})
+class HeroListComponent {}
+```
+When you register a provider at the component level, you get a new instance of the service with each new instance of that component.
+
+NOTE: Declaring a service like this causes `HeroService` to always be included in your application— even if the service is unused.
+
+### At the application root level using `ApplicationConfig`
+
+You can use the `providers` field of the `ApplicationConfig` (passed to the `bootstrapApplication` function) to provide a service or other `Injectable` at the application level.
+
+In the example below, the `HeroService` is available to all components, directives, and pipes:
+
+```typescript
+export const appConfig: ApplicationConfig = {
+    providers: [
+      { provide: HeroService },
+    ]
+};
+```
+Then, in `main.ts`:
+
+```typescript
+bootstrapApplication(AppComponent, appConfig)
+```
+NOTE: Declaring a service like this causes `HeroService` to always be included in your application— even if the service is unused.
+
+### `NgModule` based applications
+
+`@NgModule`-based applications use the `providers` field of the `@NgModule` decorator to provide a service or other `Injectable` available at the application level.
+
+A service provided in a module is available to all declarations of the module, or to any other modules which share the same `ModuleInjector`.
+To understand all edge-cases, see [Hierarchical injectors](guide/di/hierarchical-dependency-injection).
+
+NOTE: Declaring a service using `providers` causes the service to be included in your application— even if the service is unused.
+
+## Injecting/consuming a dependency
+
+Use Angular's `inject` function to retrieve dependencies.
+
+```ts
+import {inject, Component} from 'angular/core';
+
+@Component({/* ... */})
+export class UserProfile {
+  // You can use the `inject` function in property initializers.
+  private userClient = inject(UserClient);
+
+  constructor() {
+    // You can also use the `inject` function in a constructor.
+    const logger = inject(Logger);
+  }
+}
+```
+
+You can use the `inject` function in any [injection context](guide/di/dependency-injection-context). Most of the time, this is in a class property initializer or a class constructor for components, directives, services, and pipes.
+
+When Angular discovers that a component depends on a service, it first checks if the injector has any existing instances of that service. If a requested service instance doesn't yet exist, the injector creates one using the registered provider, and adds it to the injector before returning the service to Angular.
+
+When all requested services have been resolved and returned, Angular can call the component's constructor with those services as arguments.
+
+```mermaid
+graph TD;
+subgraph Injector
+serviceA[Service A]
+heroService[HeroService]
+serviceC[Service C]
+serviceD[Service D]
+end
+direction TB
+componentProperty["Component <br> heroService = inject(HeroService)"]
+heroService-->componentProperty
+style componentProperty text-align: left
+```
+
+## What's next
+# Creating an injectable service
+
+Service is a broad category encompassing any value, function, or feature that an application needs.
+A service is typically a class with a narrow, well-defined purpose.
+A component is one type of class that can use DI.
+
+Angular distinguishes components from services to increase modularity and reusability.
+By separating a component's view-related features from other kinds of processing, you can make your component classes lean and efficient.
+
+Ideally, a component's job is to enable the user experience and nothing more.
+A component should present properties and methods for data binding, to mediate between the view (rendered by the template) and the application logic (which often includes some notion of a model).
+
+A component can delegate certain tasks to services, such as fetching data from the server, validating user input, or logging directly to the console.
+By defining such processing tasks in an injectable service class, you make those tasks available to any component.
+You can also make your application more adaptable by configuring different providers of the same kind of service, as appropriate in different circumstances.
+
+Angular does not enforce these principles.
+Angular helps you follow these principles by making it easy to factor your application logic into services and make those services available to components through DI.
+
+## Service examples
+
+Here's an example of a service class that logs to the browser console:
+
+```
+export class Logger {
+  log(msg: unknown) { console.log(msg); }
+  error(msg: unknown) { console.error(msg); }
+  warn(msg: unknown) { console.warn(msg); }
+}
+```
+Services can depend on other services.
+For example, here's a `HeroService` that depends on the `Logger` service, and also uses `BackendService` to get heroes.
+That service in turn might depend on the `HttpClient` service to fetch heroes asynchronously from a server:
+
+```
+import { inject } from "@angular/core";
+
+export class HeroService {
+  private heroes: Hero[] = [];
+
+  private backend = inject(BackendService);
+  private logger = inject(Logger);
+
+  async getHeroes() {
+    // Fetch
+    this.heroes = await this.backend.getAll(Hero);
+    // Log
+    this.logger.log(`Fetched ${this.heroes.length} heroes.`);
+    return this.heroes;
+  }
+}
+```
+## Creating an injectable service
+
+The Angular CLI provides a command to create a new service. In the following example, you add a new service to an existing application.
+
+To generate a new `HeroService` class in the `src/app/heroes` folder, follow these steps:
+
+1. Run this [Angular CLI](/tools/cli) command:
+
+```sh
+ng generate service heroes/hero
+```
+This command creates the following default `HeroService`:
+
+```
+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class HeroService {}
+```
+The `@Injectable()` decorator specifies that Angular can use this class in the DI system.
+The metadata, `providedIn: 'root'`, means that the `HeroService` is provided throughout the application.
+
+Add a `getHeroes()` method that returns the heroes from `mock.heroes.ts` to get the hero mock data:
+
+```
+import { Injectable } from '@angular/core';
+import { HEROES } from './mock-heroes';
+
+@Injectable({
+  // declares that this service should be created
+  // by the root application injector.
+  providedIn: 'root',
+})
+export class HeroService {
+  getHeroes() {
+    return HEROES;
+  }
+}
+```
+For clarity and maintainability, it is recommended that you define components and services in separate files.
+
+## Injecting services
+
+To inject a service as a dependency into a component, you can declare a class field representing the dependency and use Angular's `inject` function to initialize it.
+
+The following example specifies the `HeroService` in the `HeroListComponent`.
+The type of `heroService` is `HeroService`.
+
+```
+import { inject } from "@angular/core";
+
+export class HeroListComponent {
+  private heroService = inject(HeroService);
+}
+```
+It is also possible to inject a service into a component using the component's constructor:
+
+```
+constructor(private heroService: HeroService)
+```
+The `inject` method can be used in both classes and functions, while the constructor method can naturally only be used in a class constructor. However, in either case a dependency may only be injected in a valid [injection context](guide/di/dependency-injection-context), usually in the construction or initialization of a component.
+
+## Injecting services in other services
+
+When a service depends on another service, follow the same pattern as injecting into a component.
+In the following example, `HeroService` depends on a `Logger` service to report its activities:
+
+```
+import { inject, Injectable } from '@angular/core';
+import { HEROES } from './mock-heroes';
+import { Logger } from '../logger.service';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class HeroService {
+  private logger = inject(Logger);
+
+  getHeroes() {
+    this.logger.log('Getting heroes.');
+    return HEROES;
+  }
+}
+```
+In this example, the `getHeroes()` method uses the `Logger` service by logging a message when fetching heroes.
+
+## What's next
+# Configuring dependency providers
+
+The previous sections described how to use class instances as dependencies.
+Aside from classes, you can also use values such as `boolean`, `string`, `Date`, and objects as dependencies.
+Angular provides the necessary APIs to make the dependency configuration flexible, so you can make those values available in DI.
+
+## Specifying a provider token
+
+If you specify the service class as the provider token, the default behavior is for the injector to instantiate that class using the `new` operator.
+
+In the following example, the app component provides a `Logger` instance:
+
+```
+providers: [Logger],
+```
+You can, however, configure DI to associate the `Logger` provider token with a different class or any other value.
+So when the `Logger` is injected, the configured value is used instead.
+
+In fact, the class provider syntax is a shorthand expression that expands into a provider configuration, defined by the `Provider` interface.
+Angular expands the `providers` value in this case into a full provider object as follows:
+
+```
+[{ provide: Logger, useClass: Logger }]
+```
+The expanded provider configuration is an object literal with two properties:
+
+- The `provide` property holds the token that serves as the key for consuming the dependency value.
+- The second property is a provider definition object, which tells the injector **how** to create the dependency value. The provider-definition can be one of the following:
+  - `useClass` - this option tells Angular DI to instantiate a provided class when a dependency is injected
+  - `useExisting` - allows you to alias a token and reference any existing one.
+  - `useFactory` - allows you to define a function that constructs a dependency.
+  - `useValue` - provides a static value that should be used as a dependency.
+
+The sections below describe how to use the different provider definitions.
+
+### Class providers: useClass
+
+The `useClass` provider key lets you create and return a new instance of the specified class.
+
+You can use this type of provider to substitute an alternative implementation for a common or default class.
+The alternative implementation can, for example, implement a different strategy, extend the default class, or emulate the behavior of the real class in a test case.
+
+In the following example, `BetterLogger` would be instantiated when the `Logger` dependency is requested in a component or any other class:
+
+```
+[{ provide: Logger, useClass: BetterLogger }]
+```
+If the alternative class providers have their own dependencies, specify both providers in the providers metadata property of the parent module or component:
+
+```
+[
+  UserService, // dependency needed in `EvenBetterLogger`.
+  { provide: Logger, useClass: EvenBetterLogger },
+]
+```
+In this example, `EvenBetterLogger` displays the user name in the log message. This logger gets the user from an injected `UserService` instance:
+
+```
+@Injectable()
+export class EvenBetterLogger extends Logger {
+  private userService = inject(UserService);
+
+  override log(message: string) {
+    const name = this.userService.user.name;
+    super.log(`Message to ${name}: ${message}`);
+  }
+}
+```
+Angular DI knows how to construct the `UserService` dependency, since it has been configured above and is available in the injector.
+
+### Alias providers: useExisting
+
+The `useExisting` provider key lets you map one token to another.
+In effect, the first token is an alias for the service associated with the second token, creating two ways to access the same service object.
+
+In the following example, the injector injects the singleton instance of `NewLogger` when the component asks for either the new or the old logger:
+In this way, `OldLogger` is an alias for `NewLogger`.
+
+```
+[
+  NewLogger,
+  // Alias OldLogger w/ reference to NewLogger
+  { provide: OldLogger, useExisting: NewLogger},
+]
+```
+NOTE: Ensure you do not alias `OldLogger` to `NewLogger` with `useClass`, as this creates two different `NewLogger` instances.
+
+### Factory providers: useFactory
+
+The `useFactory` provider key lets you create a dependency object by calling a factory function.
+With this approach, you can create a dynamic value based on information available in the DI and elsewhere in the app.
+
+In the following example, only authorized users should see secret heroes in the `HeroService`.
+Authorization can change during the course of a single application session, as when a different user logs in .
+
+To keep security-sensitive information in `UserService` and out of `HeroService`, give the `HeroService` constructor a boolean flag to control display of secret heroes:
+
+```
+class HeroService {
+  constructor(
+    private logger: Logger,
+    private isAuthorized: boolean) { }
+
+  getHeroes() {
+    const auth = this.isAuthorized ? 'authorized' : 'unauthorized';
+    this.logger.log(`Getting heroes for ${auth} user.`);
+    return HEROES.filter(hero => this.isAuthorized || !hero.isSecret);
+  }
+}
+```
+To implement the `isAuthorized` flag, use a factory provider to create a new logger instance for `HeroService`.
+This is necessary as we need to manually pass `Logger` when constructing the hero service:
+
+```
+const heroServiceFactory = (logger: Logger, userService: UserService) =>
+  new HeroService(logger, userService.user.isAuthorized);
+```
+The factory function has access to `UserService`.
+You inject both `Logger` and `UserService` into the factory provider so the injector can pass them along to the factory function:
+
+```
+export const heroServiceProvider = {
+  provide: HeroService,
+  useFactory: heroServiceFactory,
+  deps: [Logger, UserService]
+};
+```
+- The `useFactory` field specifies that the provider is a factory function whose implementation is `heroServiceFactory`.
+- The `deps` property is an array of provider tokens.
+The `Logger` and `UserService` classes serve as tokens for their own class providers.
+The injector resolves these tokens and injects the corresponding services into the matching `heroServiceFactory` factory function parameters, based on the order specified.
+
+Capturing the factory provider in the exported variable, `heroServiceProvider`, makes the factory provider reusable.
+
+### Value providers: useValue
+
+The `useValue` key lets you associate a static value with a DI token.
+
+Use this technique to provide runtime configuration constants such as website base addresses and feature flags.
+You can also use a value provider in a unit test to provide mock data in place of a production data service.
+
+The next section provides more information about the `useValue` key.
+
+## Using an `InjectionToken` object
+
+Use an `InjectionToken` object as provider token for non-class dependencies.
+The following example defines a token, `APP_CONFIG`. of the type `InjectionToken`:
+
+```
+import { InjectionToken } from '@angular/core';
+
+export interface AppConfig {
+  title: string;
+}
+
+export const APP_CONFIG = new InjectionToken<AppConfig>('app.config description');
+```
+The optional type parameter, `<AppConfig>`, and the token description, `app.config description`, specify the token's purpose.
+
+Next, register the dependency provider in the component using the `InjectionToken` object of `APP_CONFIG`:
+
+```
+const MY_APP_CONFIG_VARIABLE: AppConfig = {
+  title: 'Hello',
+};
+
+providers: [{ provide: APP_CONFIG, useValue: MY_APP_CONFIG_VARIABLE }]
+```
+Now, inject the configuration object in the constructor body with the `inject` function:
+
+```
+export class AppComponent {
+  constructor() {
+    const config = inject(APP_CONFIG);
+    this.title = config.title;
+  }
+}
+```
+### Interfaces and DI
+
+Though the TypeScript `AppConfig` interface supports typing within the class, the `AppConfig` interface plays no role in DI.
+In TypeScript, an interface is a design-time artifact, and does not have a runtime representation, or token, that the DI framework can use.
+
+When the TypeScript transpiles to JavaScript, the interface disappears because JavaScript doesn't have interfaces.
+Because there is no interface for Angular to find at runtime, the interface cannot be a token, nor can you inject it:
+
+```
+// Can't use interface as provider token
+[{ provide: AppConfig, useValue: MY_APP_CONFIG_VARIABLE })]
+```
+```
+export class AppComponent {
+  // Can't inject using the interface as the parameter type
+  private config = inject(AppConfig);
+}
+```
+
+# Injection context
+
+The dependency injection (DI) system relies internally on a runtime context where the current injector is available.
+This means that injectors can only work when code is executed in such a context.
+
+The injection context is available in these situations:
+
+* During construction (via the `constructor`) of a class being instantiated by the DI system, such as an `@Injectable` or `@Component`.
+* In the initializer for fields of such classes.
+* In the factory function specified for `useFactory` of a `Provider` or an `@Injectable`.
+* In the `factory` function specified for an `InjectionToken`.
+* Within a stack frame that runs in an injection context.
+
+Knowing when you are in an injection context will allow you to use the [`inject`](api/core/inject) function to inject instances.
+
+## Class constructors
+
+Every time the DI system instantiates a class, it does so in an injection context. This is handled by the framework itself. The constructor of the class is executed in that runtime context, which also allows injection of a token using the [`inject`](api/core/inject) function.
+
+```typescript
+class MyComponent  {
+  private service1: Service1;
+  private service2: Service2 = inject(Service2); // In context
+
+  constructor() {
+    this.service1 = inject(Service1) // In context
+  }
+}
+```
+## Stack frame in context
+
+Some APIs are designed to be run in an injection context. This is the case, for example, with router guards. This allows the use of [`inject`](api/core/inject) within the guard function to access a service.
+
+Here is an example for `CanActivateFn`
+
+```typescript
+const canActivateTeam: CanActivateFn =
+    (route: ActivatedRouteSnapshot, state: RouterStateSnapshot) => {
+      return inject(PermissionsService).canActivate(inject(UserToken), route.params.id);
+    };
+```
+## Run within an injection context
+
+When you want to run a given function in an injection context without already being in one, you can do so with `runInInjectionContext`.
+This requires access to a given injector, like the `EnvironmentInjector`, for example:
+
+```
+@Injectable({
+  providedIn: 'root',
+})
+export class HeroService {
+  private environmentInjector = inject(EnvironmentInjector);
+
+  someMethod() {
+    runInInjectionContext(this.environmentInjector, () => {
+      inject(SomeService); // Do what you need with the injected service
+    });
+  }
+}
+```
+Note that `inject` will return an instance only if the injector can resolve the required token.
+
+## Asserts the context
+
+Angular provides the `assertInInjectionContext` helper function to assert that the current context is an injection context.
+
+## Using DI outside of a context
+
+Calling [`inject`](api/core/inject) or calling `assertInInjectionContext` outside of an injection context will throw [error NG0203](/errors/NG0203).
+# Hierarchical injectors
+
+Injectors in Angular have rules that you can leverage to achieve the desired visibility of injectables in your applications.
+By understanding these rules, you can determine whether to declare a provider at the application level, in a Component, or in a Directive.
+
+The applications you build with Angular can become quite large, and one way to manage this complexity is to split up the application into a well-defined tree of components.
+
+There can be sections of your page that work in a completely independent way than the rest of the application, with its own local copies of the services and other dependencies that it needs.
+Some of the services that these sections of the application use might be shared with other parts of the application, or with parent components that are further up in the component tree, while other dependencies are meant to be private.
+
+With hierarchical dependency injection, you can isolate sections of the application and give them their own private dependencies not shared with the rest of the application, or have parent components share certain dependencies with its child components only but not with the rest of the component tree, and so on. Hierarchical dependency injection enables you to share dependencies between different parts of the application only when and if you need to.
+
+## Types of injector hierarchies
+
+Angular has two injector hierarchies:
+
+| Injector hierarchies        | Details |
+|:---                         |:---     |
+| `EnvironmentInjector` hierarchy | Configure an `EnvironmentInjector` in this hierarchy using `@Injectable()` or `providers` array in `ApplicationConfig`. |
+| `ElementInjector` hierarchy | Created implicitly at each DOM element. An `ElementInjector` is empty by default unless you configure it in the `providers` property on `@Directive()` or `@Component()`. |
+For `NgModule` based applications, you can provide dependencies with the `ModuleInjector` hierarchy using an `@NgModule()` or `@Injectable()` annotation.
+### `EnvironmentInjector`
+
+The `EnvironmentInjector` can be configured in one of two ways by using:
+
+* The `@Injectable()` `providedIn` property to refer to `root` or `platform`
+* The `ApplicationConfig` `providers` array
+Using the `@Injectable()` `providedIn` property is preferable to using the `ApplicationConfig` `providers` array. With `@Injectable()` `providedIn`, optimization tools can perform tree-shaking, which removes services that your application isn't using. This results in smaller bundle sizes.
+
+Tree-shaking is especially useful for a library because the application which uses the library may not have a need to inject it.
+`EnvironmentInjector` is configured by the `ApplicationConfig.providers`.
+
+Provide services using `providedIn` of `@Injectable()` as follows:
+
+```typescript
+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root'  // <--provides this service in the root EnvironmentInjector
+})
+export class ItemService {
+  name = 'telephone';
+}
+```
+The `@Injectable()` decorator identifies a service class.
+The `providedIn` property configures a specific `EnvironmentInjector`, here `root`, which makes the service available in the `root` `EnvironmentInjector`.
+
+### ModuleInjector
+
+In the case of `NgModule` based applications, the ModuleInjector can be configured in one of two ways by using:
+
+* The `@Injectable()` `providedIn` property to refer to `root` or `platform`
+* The `@NgModule()` `providers` array
+
+`ModuleInjector` is configured by the `@NgModule.providers` and `NgModule.imports` property. `ModuleInjector` is a flattening of all the providers arrays that can be reached by following the `NgModule.imports` recursively.
+
+Child `ModuleInjector` hierarchies are created when lazy loading other `@NgModules`.
+
+### Platform injector
+
+There are two more injectors above `root`, an additional `EnvironmentInjector` and `NullInjector()`.
+
+Consider how Angular bootstraps the application with the following in `main.ts`:
+
+```javascript
+bootstrapApplication(AppComponent, appConfig);
+```
+The `bootstrapApplication()` method creates a child injector of the platform injector which is configured by the `ApplicationConfig` instance.
+This is the `root` `EnvironmentInjector`.
+
+The `platformBrowserDynamic()` method creates an injector configured by a `PlatformModule`, which contains platform-specific dependencies.
+This allows multiple applications to share a platform configuration.
+For example, a browser has only one URL bar, no matter how many applications you have running.
+You can configure additional platform-specific providers at the platform level by supplying `extraProviders` using the `platformBrowser()` function.
+
+The next parent injector in the hierarchy is the `NullInjector()`, which is the top of the tree.
+If you've gone so far up the tree that you are looking for a service in the `NullInjector()`, you'll get an error unless you've used `@Optional()` because ultimately, everything ends at the `NullInjector()` and it returns an error or, in the case of `@Optional()`, `null`.
+For more information on `@Optional()`, see the [`@Optional()` section](#optional) of this guide.
+
+The following diagram represents the relationship between the `root` `ModuleInjector` and its parent injectors as the previous paragraphs describe.
+
+```mermaid
+stateDiagram-v2
+    elementInjector: EnvironmentInjector<br>(configured by Angular)<br>has special things like DomSanitizer => providedIn 'platform'
+    rootInjector: root EnvironmentInjector<br>(configured by AppConfig)<br>has things for your app => bootstrapApplication(..., AppConfig)
+    nullInjector: NullInjector<br>always throws an error unless<br>you use @Optional()
+
+    direction BT
+    rootInjector --> elementInjector
+    elementInjector --> nullInjector
+```
+
+While the name `root` is a special alias, other `EnvironmentInjector` hierarchies don't have aliases.
+You have the option to create `EnvironmentInjector` hierarchies whenever a dynamically loaded component is created, such as with the Router, which will create child `EnvironmentInjector` hierarchies.
+
+All requests forward up to the root injector, whether you configured it with the `ApplicationConfig` instance passed to the `bootstrapApplication()` method, or registered all providers with `root` in their own services.
+If you configure an app-wide provider in the `ApplicationConfig` of `bootstrapApplication`, it overrides one configured for `root` in the `@Injectable()` metadata.
+You can do this to configure a non-default provider of a service that is shared with multiple applications.
+
+Here is an example of the case where the component router configuration includes a non-default [location strategy](guide/routing#location-strategy) by listing its provider in the `providers` list of the `ApplicationConfig`.
+
+```ts
+providers: [
+  { provide: LocationStrategy, useClass: HashLocationStrategy }
+]
+```
+
+For `NgModule` based applications, configure app-wide providers in the `AppModule` `providers`.
+### `ElementInjector`
+
+Angular creates `ElementInjector` hierarchies implicitly for each DOM element.
+
+Providing a service in the `@Component()` decorator using its `providers` or `viewProviders` property configures an `ElementInjector`.
+For example, the following `TestComponent` configures the `ElementInjector` by providing the service as follows:
+
+```typescript
+@Component({
+  …
+  providers: [{ provide: ItemService, useValue: { name: 'lamp' } }]
+})
+export class TestComponent
+```
+HELPFUL: See the [resolution rules](#resolution-rules) section to understand the relationship between the `EnvironmentInjector` tree, the `ModuleInjector` and the `ElementInjector` tree.
+
+When you provide services in a component, that service is available by way of the `ElementInjector` at that component instance.
+It may also be visible at child component/directives based on visibility rules described in the [resolution rules](#resolution-rules) section.
+
+When the component instance is destroyed, so is that service instance.
+
+#### `@Directive()` and `@Component()`
+
+A component is a special type of directive, which means that just as `@Directive()` has a `providers` property, `@Component()` does too.
+This means that directives as well as components can configure providers, using the `providers` property.
+When you configure a provider for a component or directive using the `providers` property, that provider belongs to the `ElementInjector` of that component or directive.
+Components and directives on the same element share an injector.
+
+## Resolution rules
+
+When resolving a token for a component/directive, Angular resolves it in two phases:
+
+1. Against its parents in the `ElementInjector` hierarchy.
+2. Against its parents in the `EnvironmentInjector` hierarchy.
+
+When a component declares a dependency, Angular tries to satisfy that dependency with its own `ElementInjector`.
+If the component's injector lacks the provider, it passes the request up to its parent component's `ElementInjector`.
+
+The requests keep forwarding up until Angular finds an injector that can handle the request or runs out of ancestor `ElementInjector` hierarchies.
+
+If Angular doesn't find the provider in any `ElementInjector` hierarchies, it goes back to the element where the request originated and looks in the `EnvironmentInjector` hierarchy.
+If Angular still doesn't find the provider, it throws an error.
+
+If you have registered a provider for the same DI token at different levels, the first one Angular encounters is the one it uses to resolve the dependency.
+If, for example, a provider is registered locally in the component that needs a service,
+Angular doesn't look for another provider of the same service.
+
+HELPFUL: For `NgModule` based applications, Angular will search the `ModuleInjector` hierarchy if it cannot find a provider in the `ElementInjector` hierarchies.
+
+## Resolution modifiers
+
+Angular's resolution behavior can be modified with `optional`, `self`, `skipSelf` and `host`.
+Import each of them from `@angular/core` and use each in the `inject` configuration when you inject your service.
+
+### Types of modifiers
+
+Resolution modifiers fall into three categories:
+
+* What to do if Angular doesn't find what you're looking for, that is `optional`
+* Where to start looking, that is `skipSelf`
+* Where to stop looking, `host` and `self`
+
+By default, Angular always starts at the current `Injector` and keeps searching all the way up.
+Modifiers allow you to change the starting, or _self_, location and the ending location.
+
+Additionally, you can combine all of the modifiers except:
+
+* `host` and `self`
+* `skipSelf` and `self`.
+
+### `optional`
+
+`optional` allows Angular to consider a service you inject to be optional.
+This way, if it can't be resolved at runtime, Angular resolves the service as `null`, rather than throwing an error.
+In the following example, the service, `OptionalService`, isn't provided in the service, `ApplicationConfig`, `@NgModule()`, or component class, so it isn't available anywhere in the app.
+
+```
+export class OptionalComponent {
+  public optional? = inject(OptionalService, {optional: true});
+}
+```
+### `self`
+
+Use `self` so that Angular will only look at the `ElementInjector` for the current component or directive.
+
+A good use case for `self` is to inject a service but only if it is available on the current host element.
+To avoid errors in this situation, combine `self` with `optional`.
+
+For example, in the following `SelfNoDataComponent`, notice the injected `LeafService` as a property.
+
+```
+@Component({
+  selector: 'app-self-no-data',
+  templateUrl: './self-no-data.component.html',
+  styleUrls: ['./self-no-data.component.css']
+})
+export class SelfNoDataComponent {
+  public leaf = inject(LeafService, {optional: true, self: true});
+}
+```
+In this example, there is a parent provider and injecting the service will return the value, however, injecting the service with `self` and `optional` will return `null` because `self` tells the injector to stop searching in the current host element.
+
+Another example shows the component class with a provider for `FlowerService`.
+In this case, the injector looks no further than the current `ElementInjector` because it finds the `FlowerService` and returns the tulip <code>&#x1F337;</code>.
+
+```
+### `skipSelf`
+
+`skipSelf` is the opposite of `self`.
+With `skipSelf`, Angular starts its search for a service in the parent `ElementInjector`, rather than in the current one.
+So if the parent `ElementInjector` were using the fern <code>&#x1F33F;</code> value for `emoji`, but you had maple leaf <code>&#x1F341;</code> in the component's `providers` array, Angular would ignore maple leaf <code>&#x1F341;</code> and use fern <code>&#x1F33F;</code>.
+
+To see this in code, assume that the following value for `emoji` is what the parent component were using, as in this service:
+
+<docs-code header="src/app/leaf.service.ts" language="typescript">
+export class LeafService {
+  emoji = '🌿';
+}
+```
+Imagine that in the child component, you had a different value, maple leaf <code>&#x1F341;</code> but you wanted to use the parent's value instead.
+This is when you'd use `skipSelf`:
+
+```
+@Component({
+  selector: 'app-skipself',
+  templateUrl: './skipself.component.html',
+  styleUrls: ['./skipself.component.css'],
+  // Angular would ignore this LeafService instance
+  providers: [{ provide: LeafService, useValue: { emoji: '🍁' } }]
+})
+export class SkipselfComponent {
+  // Use skipSelf as inject option
+  public leaf = inject(LeafService, {skipSelf: true});
+}
+```
+In this case, the value you'd get for `emoji` would be fern <code>&#x1F33F;</code>, not maple leaf <code>&#x1F341;</code>.
+
+#### `skipSelf` option with `optional`
+
+Use the `skipSelf` option with `optional` to prevent an error if the value is `null`.
+
+In the following example, the `Person` service is injected during property initialization.
+`skipSelf` tells Angular to skip the current injector and `optional` will prevent an error should the `Person` service be `null`.
+
+```typescript
+class Person {
+  parent = inject(Person, {optional: true, skipSelf: true})
+}
+```
+### `host`
+
+<!-- TODO: Remove ambiguity between host and self. -->
+
+`host` lets you designate a component as the last stop in the injector tree when searching for providers.
+
+Even if there is a service instance further up the tree, Angular won't continue looking.
+Use `host` as follows:
+
+```
+@Component({
+  selector: 'app-host',
+  templateUrl: './host.component.html',
+  styleUrls: ['./host.component.css'],
+  //  provide the service
+  providers: [{ provide: FlowerService, useValue: { emoji: '🌷' } }]
+})
+export class HostComponent {
+  // use host when injecting the service
+  flower = inject(FlowerService, {host: true, optional: true});
+}
+```
+Since `HostComponent` has the `host` option , no matter what the parent of `HostComponent` might have as a `flower.emoji` value, the `HostComponent` will use tulip <code>&#x1F337;</code>.
+
+### Modifiers with constructor injection
+
+Similarly as presented before, the behavior of constructor injection can be modified with `@Optional()`, `@Self()`, `@SkipSelf()` and `@Host()`.
+
+Import each of them from `@angular/core` and use each in the component class constructor when you inject your service.
+
+```
+export class SelfNoDataComponent {
+  constructor(@Self() @Optional() public leaf?: LeafService) { }
+}
+```
+## Logical structure of the template
+
+When you provide services in the component class, services are visible within the `ElementInjector` tree relative to where and how you provide those services.
+
+Understanding the underlying logical structure of the Angular template will give you a foundation for configuring services and in turn control their visibility.
+
+Components are used in your templates, as in the following example:
+
+```html
+<app-root>
+  <app-child></app-child>;
+</app-root>
+```
+HELPFUL: Usually, you declare the components and their templates in separate files.
+For the purposes of understanding how the injection system works, it is useful to look at them from the point of view of a combined logical tree.
+The term _logical_ distinguishes it from the render tree, which is your application's DOM tree.
+To mark the locations of where the component templates are located, this guide uses the `<#VIEW>` pseudo-element, which doesn't actually exist in the render tree and is present for mental model purposes only.
+
+The following is an example of how the `<app-root>` and `<app-child>` view trees are combined into a single logical tree:
+
+```html
+<app-root>
+  <#VIEW>
+    <app-child>
+     <#VIEW>
+       …content goes here…
+     </#VIEW>
+    </app-child>
+  </#VIEW>
+</app-root>
+```
+Understanding the idea of the `<#VIEW>` demarcation is especially significant when you configure services in the component class.
+
+## Example: Providing services in `@Component()`
+
+How you provide services using a `@Component()` (or `@Directive()`) decorator determines their visibility.
+The following sections demonstrate `providers` and `viewProviders` along with ways to modify service visibility with `skipSelf` and `host`.
+
+A component class can provide services in two ways:
+
+| Arrays                       | Details |
+|:---                          |:---     |
+| With a `providers` array     | `@Component({ providers: [SomeService] })`     |
+| With a `viewProviders` array | `@Component({ viewProviders: [SomeService] })` |
+
+In the examples below, you will see the logical tree of an Angular application.
+To illustrate how the injector works in the context of templates, the logical tree will represent the HTML structure of the application.
+For example, the logical tree will show that `<child-component>` is a direct children of `<parent-component>`.
+
+In the logical tree, you will see special attributes: `@Provide`, `@Inject`, and `@ApplicationConfig`.
+These aren't real attributes but are here to demonstrate what is going on under the hood.
+
+| Angular service attribute                                                                                          | Details |
+|:---                                                                                                                |:---     |
+| `@Inject(Token)=>Value`     | If `Token` is injected at this location in the logical tree, its value would be `Value`.     |
+| `@Provide(Token=Value)`     | Indicates that `Token` is provided with `Value` at this location in the logical tree.        |
+| `@ApplicationConfig` | Demonstrates that a fallback `EnvironmentInjector` should be used at this location.          |
+
+### Example app structure
+
+The example application has a `FlowerService` provided in `root` with an `emoji` value of red hibiscus <code>&#x1F33A;</code>.
+
+```
+@Injectable({
+  providedIn: 'root'
+})
+export class FlowerService {
+  emoji = '🌺';
+}
+```
+Consider an application with only an `AppComponent` and a `ChildComponent`.
+The most basic rendered view would look like nested HTML elements such as the following:
+
+```html
+<app-root> <!-- AppComponent selector -->
+  <app-child> <!-- ChildComponent selector -->
+  </app-child>
+</app-root>
+```
+However, behind the scenes, Angular uses a logical view representation as follows when resolving injection requests:
+
+```html
+<app-root> <!-- AppComponent selector -->
+  <#VIEW>
+    <app-child> <!-- ChildComponent selector -->
+      <#VIEW>
+      </#VIEW>
+    </app-child>
+  </#VIEW>
+</app-root>
+```
+The `<#VIEW>` here represents an instance of a template.
+Notice that each component has its own `<#VIEW>`.
+
+Knowledge of this structure can inform how you provide and inject your services, and give you complete control of service visibility.
+
+Now, consider that `<app-root>` injects the `FlowerService`:
+
+```
+export class AppComponent  {
+  flower = inject(FlowerService);
+}
+```
+Add a binding to the `<app-root>` template to visualize the result:
+
+```
+<p>Emoji from FlowerService: {{flower.emoji}}</p>
+```
+The output in the view would be:
+
+```shell
+Emoji from FlowerService: &#x1F33A;
+```
+In the logical tree, this would be represented as follows:
+
+```html
+<app-root @ApplicationConfig
+        @Inject(FlowerService) flower=>"&#x1F33A;">
+  <#VIEW>
+    <p>Emoji from FlowerService: {{flower.emoji}} (&#x1F33A;)</p>
+    <app-child>
+      <#VIEW>
+      </#VIEW>
+    </app-child>
+  </#VIEW>
+</app-root>
+```
+When `<app-root>` requests the `FlowerService`, it is the injector's job to resolve the `FlowerService` token.
+The resolution of the token happens in two phases:
+
+1. The injector determines the starting location in the logical tree and an ending location of the search.
+    The injector begins with the starting location and looks for the token at each view level in the logical tree.
+    If the token is found it is returned.
+
+1. If the token is not found, the injector looks for the closest parent `EnvironmentInjector` to delegate the request to.
+
+In the example case, the constraints are:
+
+1. Start with `<#VIEW>` belonging to `<app-root>` and end with `<app-root>`.
+
+    * Normally the starting point for search is at the point of injection.
+        However, in this case `<app-root>` is a component. `@Component`s are special in that they also include their own `viewProviders`, which is why the search starts at `<#VIEW>` belonging to `<app-root>`.
+        This would not be the case for a directive matched at the same location.
+    * The ending location happens to be the same as the component itself, because it is the topmost component in this application.
+
+1. The `EnvironmentInjector` provided by the `ApplicationConfig` acts as the fallback injector when the injection token can't be found in the `ElementInjector` hierarchies.
+
+### Using the `providers` array
+
+Now, in the `ChildComponent` class, add a provider for `FlowerService` to demonstrate more complex resolution rules in the upcoming sections:
+
+```
+@Component({
+  selector: 'app-child',
+  templateUrl: './child.component.html',
+  styleUrls: ['./child.component.css'],
+  // use the providers array to provide a service
+  providers: [{ provide: FlowerService, useValue: { emoji: '🌻' } }]
+})
+export class ChildComponent {
+  // inject the service
+  flower = inject(FlowerService);
+}
+```
+Now that the `FlowerService` is provided in the `@Component()` decorator, when the `<app-child>` requests the service, the injector has only to look as far as the `ElementInjector` in the `<app-child>`.
+It won't have to continue the search any further through the injector tree.
+
+The next step is to add a binding to the `ChildComponent` template.
+
+```
+<p>Emoji from FlowerService: {{flower.emoji}}</p>
+```
+To render the new values, add `<app-child>` to the bottom of the `AppComponent` template so the view also displays the sunflower:
+
+```shell
+Child Component
+Emoji from FlowerService: &#x1F33B;
+```
+In the logical tree, this is represented as follows:
+
+```html
+<app-root @ApplicationConfig
+        @Inject(FlowerService) flower=>"&#x1F33A;">
+  <#VIEW>
+    <p>Emoji from FlowerService: {{flower.emoji}} (&#x1F33A;)</p>
+    <app-child @Provide(FlowerService="&#x1F33B;")
+               @Inject(FlowerService)=>"&#x1F33B;"> <!-- search ends here -->
+      <#VIEW> <!-- search starts here -->
+        <h2>Child Component</h2>
+        <p>Emoji from FlowerService: {{flower.emoji}} (&#x1F33B;)</p>
+      </#VIEW>
+    </app-child>
+  </#VIEW>
+</app-root>
+```
+When `<app-child>` requests the `FlowerService`, the injector begins its search at the `<#VIEW>` belonging to `<app-child>` \(`<#VIEW>` is included because it is injected from `@Component()`\) and ends with `<app-child>`.
+In this case, the `FlowerService` is resolved in the `providers` array with sunflower <code>&#x1F33B;</code> of the `<app-child>`.
+The injector doesn't have to look any further in the injector tree.
+It stops as soon as it finds the `FlowerService` and never sees the red hibiscus <code>&#x1F33A;</code>.
+
+### Using the `viewProviders` array
+
+Use the `viewProviders` array as another way to provide services in the `@Component()` decorator.
+Using `viewProviders` makes services visible in the `<#VIEW>`.
+
+HELPFUL: The steps are the same as using the `providers` array, with the exception of using the `viewProviders` array instead.
+
+For step-by-step instructions, continue with this section.
+If you can set it up on your own, skip ahead to [Modifying service availability](#visibility-of-provided-tokens).
+
+For demonstration, we are building an `AnimalService` to demonstrate `viewProviders`.
+First, create an `AnimalService` with an `emoji` property of whale <code>&#x1F433;</code>:
+
+```
+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class AnimalService {
+  emoji = '🐳';
+}
+```
+Following the same pattern as with the `FlowerService`, inject the `AnimalService` in the `AppComponent` class:
+
+```
+export class AppComponent {
+    public flower = inject(FlowerService);
+    public animal = inject(AnimalService);
+}
+```
+HELPFUL: You can leave all the `FlowerService` related code in place as it will allow a comparison with the `AnimalService`.
+
+Add a `viewProviders` array and inject the `AnimalService` in the `<app-child>` class, too, but give `emoji` a different value.
+Here, it has a value of dog <code>&#x1F436;</code>.
+
+```
+@Component({
+  selector: 'app-child',
+  templateUrl: './child.component.html',
+  styleUrls: ['./child.component.css'],
+  // provide services
+  providers: [{ provide: FlowerService, useValue: { emoji: '🌻' } }],
+  viewProviders: [{ provide: AnimalService, useValue: { emoji: '🐶' } }]
+})
+export class ChildComponent {
+  // inject services
+  flower = inject(FlowerService);
+  animal = inject(AnimalService)
+...
+}
+```
+Add bindings to the `ChildComponent` and the `AppComponent` templates.
+In the `ChildComponent` template, add the following binding:
+
+```
+<p>Emoji from AnimalService: {{animal.emoji}}</p>
+```
+Additionally, add the same to the `AppComponent` template:
+
+```
+<p>Emoji from AnimalService: {{animal.emoji}}</p>s
+```
+Now you should see both values in the browser:
+
+```
+AppComponent
+Emoji from AnimalService: &#x1F433;
+
+Child Component
+Emoji from AnimalService: &#x1F436;
+```
+The logic tree for this example of `viewProviders` is as follows:
+
+```html
+<app-root @ApplicationConfig
+         @Inject(AnimalService) animal=>"&#x1F433;">
+  <#VIEW>
+    <app-child>
+      <#VIEW @Provide(AnimalService="&#x1F436;")
+            @Inject(AnimalService=>"&#x1F436;")>
+       <!-- ^^using viewProviders means AnimalService is available in <#VIEW>-->
+       <p>Emoji from AnimalService: {{animal.emoji}} (&#x1F436;)</p>
+      </#VIEW>
+    </app-child>
+  </#VIEW>
+</app-root>
+```
+Just as with the `FlowerService` example, the `AnimalService` is provided in the `<app-child>` `@Component()` decorator.
+This means that since the injector first looks in the `ElementInjector` of the component, it finds the `AnimalService` value of dog <code>&#x1F436;</code>.
+It doesn't need to continue searching the `ElementInjector` tree, nor does it need to search the `ModuleInjector`.
+
+### `providers` vs. `viewProviders`
+
+The `viewProviders` field is conceptually similar to `providers`, but there is one notable difference.
+Configured providers in `viewProviders` are not visible to projected content that ends up as a logical children of the component.
+
+To see the difference between using `providers` and `viewProviders`, add another component to the example and call it `InspectorComponent`.
+`InspectorComponent` will be a child of the `ChildComponent`.
+In `inspector.component.ts`, inject the `FlowerService` and `AnimalService` during property initialization:
+
+```
+export class InspectorComponent {
+  flower = inject(FlowerService);
+  animal = inject(AnimalService);
+}
+```
+You do not need a `providers` or `viewProviders` array.
+Next, in `inspector.component.html`, add the same markup from previous components:
+
+```
+<p>Emoji from FlowerService: {{flower.emoji}}</p>
+<p>Emoji from AnimalService: {{animal.emoji}}</p>
+```
+Remember to add the `InspectorComponent` to the `ChildComponent` `imports` array.
+
+```
+@Component({
+  ...
+  imports: [InspectorComponent]
+})
+```
+Next, add the following to `child.component.html`:
+
+```
+...
+
+<div class="container">
+  <h3>Content projection</h3>
+  <ng-content></ng-content>
+</div>
+<h3>Inside the view</h3>
+
+<app-inspector></app-inspector>
+```
+`<ng-content>` allows you to project content, and `<app-inspector>` inside the `ChildComponent` template makes the `InspectorComponent` a child component of `ChildComponent`.
+
+Next, add the following to `app.component.html` to take advantage of content projection.
+
+```
+<app-child>
+  <app-inspector></app-inspector>
+</app-child>
+```
+The browser now renders the following, omitting the previous examples for brevity:
+
+```
+...
+Content projection
+
+Emoji from FlowerService: &#x1F33B;
+Emoji from AnimalService: &#x1F433;
+
+Emoji from FlowerService: &#x1F33B;
+Emoji from AnimalService: &#x1F436;
+```
+These four bindings demonstrate the difference between `providers` and `viewProviders`.
+Remember that the dog emoji <code>&#x1F436;</code> is declared inside the `<#VIEW>` of `ChildComponent` and isn't visible to the projected content.
+Instead, the projected content sees the whale <code>&#x1F433;</code>.
+
+However, in the next output section though, the `InspectorComponent` is an actual child component of `ChildComponent`, `InspectorComponent` is inside the `<#VIEW>`, so when it asks for the `AnimalService`, it sees the dog <code>&#x1F436;</code>.
+
+The `AnimalService` in the logical tree would look like this:
+
+```html
+<app-root @ApplicationConfig
+         @Inject(AnimalService) animal=>"&#x1F433;">
+  <#VIEW>
+    <app-child>
+      <#VIEW @Provide(AnimalService="&#x1F436;")
+            @Inject(AnimalService=>"&#x1F436;")>
+        <!-- ^^using viewProviders means AnimalService is available in <#VIEW>-->
+        <p>Emoji from AnimalService: {{animal.emoji}} (&#x1F436;)</p>
+
+        <div class="container">
+          <h3>Content projection</h3>
+          <app-inspector @Inject(AnimalService) animal=>"&#x1F433;">
+            <p>Emoji from AnimalService: {{animal.emoji}} (&#x1F433;)</p>
+          </app-inspector>
+        </div>
+
+        <app-inspector>
+          <#VIEW @Inject(AnimalService) animal=>"&#x1F436;">
+            <p>Emoji from AnimalService: {{animal.emoji}} (&#x1F436;)</p>
+          </#VIEW>
+        </app-inspector>
+      </#VIEW>
+    </app-child>
+  </#VIEW>
+</app-root>
+```
+The projected content of `<app-inspector>` sees the whale <code>&#x1F433;</code>, not the dog <code>&#x1F436;</code>, because the dog <code>&#x1F436;</code> is inside the `<app-child>` `<#VIEW>`.
+The `<app-inspector>` can only see the dog <code>&#x1F436;</code> if it is also within the `<#VIEW>`.
+
+### Visibility of provided tokens
+
+Visibility decorators influence where the search for the injection token begins and ends in the logic tree.
+To do this, place visibility configuration at the point of injection, that is, when invoking `inject()`, rather than at a point of declaration.
+
+To alter where the injector starts looking for `FlowerService`, add `skipSelf` to the `<app-child>` `inject()` invocation where `FlowerService` is injected.
+This invocation is a property initializer the `<app-child>` as shown in `child.component.ts`:
+
+```typescript
+flower = inject(FlowerService, { skipSelf: true })
+```
+With `skipSelf`, the `<app-child>` injector doesn't look to itself for the `FlowerService`.
+Instead, the injector starts looking for the `FlowerService` at the `ElementInjector` of the `<app-root>`, where it finds nothing.
+Then, it goes back to the `<app-child>` `ModuleInjector` and finds the red hibiscus <code>&#x1F33A;</code> value, which is available because `<app-child>` and `<app-root>` share the same `ModuleInjector`.
+The UI renders the following:
+
+```
+Emoji from FlowerService: &#x1F33A;
+```
+In a logical tree, this same idea might look like this:
+
+```html
+<app-root @ApplicationConfig
+        @Inject(FlowerService) flower=>"&#x1F33A;">
+  <#VIEW>
+    <app-child @Provide(FlowerService="&#x1F33B;")>
+      <#VIEW @Inject(FlowerService, SkipSelf)=>"&#x1F33A;">
+        <!-- With SkipSelf, the injector looks to the next injector up the tree (app-root) -->
+      </#VIEW>
+    </app-child>
+  </#VIEW>
+</app-root>
+```
+Though `<app-child>` provides the sunflower <code>&#x1F33B;</code>, the application renders the red hibiscus <code>&#x1F33A;</code> because `skipSelf` causes the current injector (`app-child`) to skip itself and look to its parent.
+
+If you now add `host` (in addition to the `skipSelf`), the result will be `null`.
+This is because `host` limits the upper bound of the search to the `app-child` `<#VIEW>`.
+Here's the idea in the logical tree:
+
+```html
+<app-root @ApplicationConfig
+        @Inject(FlowerService) flower=>"&#x1F33A;">
+  <#VIEW> <!-- end search here with null-->
+    <app-child @Provide(FlowerService="&#x1F33B;")> <!-- start search here -->
+      <#VIEW inject(FlowerService, {skipSelf: true, host: true, optional:true})=>null>
+      </#VIEW>
+      </app-parent>
+  </#VIEW>
+</app-root>
+```
+Here, the services and their values are the same, but `host` stops the injector from looking any further than the `<#VIEW>` for `FlowerService`, so it doesn't find it and returns `null`.
+
+### `skipSelf` and `viewProviders`
+
+Remember, `<app-child>` provides the `AnimalService` in the `viewProviders` array with the value of dog <code>&#x1F436;</code>.
+Because the injector has only to look at the `ElementInjector` of the `<app-child>` for the `AnimalService`, it never sees the whale <code>&#x1F433;</code>.
+
+As in the `FlowerService` example, if you add `skipSelf` to the `inject()` of `AnimalService`, the injector won't look in the  `ElementInjector` of the current `<app-child>` for the `AnimalService`.
+Instead, the injector will begin at the `<app-root>` `ElementInjector`.
+
+```typescript
+@Component({
+  selector: 'app-child',
+  …
+  viewProviders: [
+    { provide: AnimalService, useValue: { emoji: '&#x1F436;' } },
+  ],
+})
+```
+The logical tree looks like this with `skipSelf` in `<app-child>`:
+
+```html
+<app-root @ApplicationConfig
+          @Inject(AnimalService=>"&#x1F433;")>
+  <#VIEW><!-- search begins here -->
+    <app-child>
+      <#VIEW @Provide(AnimalService="&#x1F436;")
+             @Inject(AnimalService, SkipSelf=>"&#x1F433;")>
+        <!--Add skipSelf -->
+      </#VIEW>
+    </app-child>
+  </#VIEW>
+</app-root>
+```
+With `skipSelf` in the `<app-child>`, the injector begins its search for the `AnimalService` in the `<app-root>` `ElementInjector` and finds whale <code>&#x1F433;</code>.
+
+### `host` and `viewProviders`
+
+If you just use `host` for the injection of `AnimalService`, the result is dog <code>&#x1F436;</code> because the injector finds the `AnimalService` in the `<app-child>` `<#VIEW>` itself.
+The `ChildComponent` configures the `viewProviders` so that the dog emoji is provided as `AnimalService` value.
+You can also see `host` the `inject()`:
+
+```typescript
+@Component({
+  selector: 'app-child',
+  …
+  viewProviders: [
+    { provide: AnimalService, useValue: { emoji: '&#x1F436;' } },
+  ]
+})
+export class ChildComponent {
+  animal = inject(AnimalService, { host: true })
+}
+```
+`host: true` causes the injector to look until it encounters the edge of the `<#VIEW>`.
+
+```html
+<app-root @ApplicationConfig
+          @Inject(AnimalService=>"&#x1F433;")>
+  <#VIEW>
+    <app-child>
+      <#VIEW @Provide(AnimalService="&#x1F436;")
+             inject(AnimalService, {host: true}=>"&#x1F436;")> <!-- host stops search here -->
+      </#VIEW>
+    </app-child>
+  </#VIEW>
+</app-root>
+```
+Add a `viewProviders` array with a third animal, hedgehog <code>&#x1F994;</code>, to the `app.component.ts` `@Component()` metadata:
+
+```typescript
+@Component({
+  selector: 'app-root',
+  templateUrl: './app.component.html',
+  styleUrls: [ './app.component.css' ],
+  viewProviders: [
+    { provide: AnimalService, useValue: { emoji: '&#x1F994;' } },
+  ],
+})
+```
+Next, add `skipSelf` along with `host` to the `inject()` for the `AnimalService` injection in `child.component.ts`.
+Here are `host` and `skipSelf` in the `animal` property initialization:
+
+```typescript
+export class ChildComponent {
+  animal = inject(AnimalService, { host: true, skipSelf: true });
+}
+```
+<!-- TODO: This requires a rework. It seems not well explained what `viewProviders`/`injectors` is here
+  and how `host` works.
+ -->
+
+When `host` and `skipSelf` were applied to the `FlowerService`, which is in the `providers` array, the result was `null` because `skipSelf` starts its search in the `<app-child>` injector, but `host` stops searching at `<#VIEW>` —where there is no `FlowerService`
+In the logical tree, you can see that the `FlowerService` is visible in `<app-child>`, not its `<#VIEW>`.
+
+However, the `AnimalService`, which is provided in the `AppComponent` `viewProviders` array, is visible.
+
+The logical tree representation shows why this is:
+
+```html
+<app-root @ApplicationConfig
+        @Inject(AnimalService=>"&#x1F433;")>
+  <#VIEW @Provide(AnimalService="&#x1F994;")
+         @Inject(AnimalService, @Optional)=>"&#x1F994;">
+    <!-- ^^skipSelf starts here,  host stops here^^ -->
+    <app-child>
+      <#VIEW @Provide(AnimalService="&#x1F436;")
+             inject(AnimalService, {skipSelf:true, host: true, optional: true})=>"&#x1F994;">
+               <!-- Add skipSelf ^^-->
+      </#VIEW>
+      </app-child>
+  </#VIEW>
+</app-root>
+```
+`skipSelf`, causes the injector to start its search for the `AnimalService` at the `<app-root>`, not the `<app-child>`, where the request originates, and `host` stops the search at the `<app-root>` `<#VIEW>`.
+Since `AnimalService` is provided by way of the `viewProviders` array, the injector finds hedgehog <code>&#x1F994;</code> in the `<#VIEW>`.
+
+## Example: `ElementInjector` use cases
+
+The ability to configure one or more providers at different levels opens up useful possibilities.
+
+### Scenario: service isolation
+
+Architectural reasons may lead you to restrict access to a service to the application domain where it belongs.
+For example, consider we build a `VillainsListComponent` that displays a list of villains.
+It gets those villains from a `VillainsService`.
+
+If you provide `VillainsService` in the root `AppModule`, it will make `VillainsService` visible everywhere in the application.
+If you later modify the `VillainsService`, you could break something in other components that started depending this service by accident.
+
+Instead, you should provide the `VillainsService` in the `providers` metadata of the `VillainsListComponent` like this:
+
+```
+@Component({
+  selector: 'app-villains-list',
+  templateUrl: './villains-list.component.html',
+  providers: [VillainsService]
+})
+export class VillainsListComponent {}
+```
+By providing `VillainsService` in the `VillainsListComponent` metadata and nowhere else, the service becomes available only in the `VillainsListComponent` and its subcomponent tree.
+
+`VillainService` is a singleton with respect to `VillainsListComponent` because that is where it is declared.
+As long as `VillainsListComponent` does not get destroyed it will be the same instance of `VillainService` but if there are multiple instances of `VillainsListComponent`, then each instance of `VillainsListComponent` will have its own instance of `VillainService`.
+
+### Scenario: multiple edit sessions
+
+Many applications allow users to work on several open tasks at the same time.
+For example, in a tax preparation application, the preparer could be working on several tax returns, switching from one to the other throughout the day.
+
+To demonstrate that scenario, imagine a `HeroListComponent` that displays a list of super heroes.
+
+To open a hero's tax return, the preparer clicks on a hero name, which opens a component for editing that return.
+Each selected hero tax return opens in its own component and multiple returns can be open at the same time.
+
+Each tax return component has the following characteristics:
+
+* Is its own tax return editing session
+* Can change a tax return without affecting a return in another component
+* Has the ability to save the changes to its tax return or cancel them
+
+Suppose that the `HeroTaxReturnComponent` had logic to manage and restore changes.
+That would be a straightforward task for a hero tax return.
+In the real world, with a rich tax return data model, the change management would be tricky.
+You could delegate that management to a helper service, as this example does.
+
+The `HeroTaxReturnService` caches a single `HeroTaxReturn`, tracks changes to that return, and can save or restore it.
+It also delegates to the application-wide singleton `HeroService`, which it gets by injection.
+
+```
+import { Injectable } from '@angular/core';
+import { HeroTaxReturn } from './hero';
+import { HeroesService } from './heroes.service';
+
+@Injectable()
+export class HeroTaxReturnService {
+  private currentTaxReturn!: HeroTaxReturn;
+  private originalTaxReturn!: HeroTaxReturn;
+
+  private heroService = inject(HeroesService);
+
+  set taxReturn(htr: HeroTaxReturn) {
+    this.originalTaxReturn = htr;
+    this.currentTaxReturn  = htr.clone();
+  }
+
+  get taxReturn(): HeroTaxReturn {
+    return this.currentTaxReturn;
+  }
+
+  restoreTaxReturn() {
+    this.taxReturn = this.originalTaxReturn;
+  }
+
+  saveTaxReturn() {
+    this.taxReturn = this.currentTaxReturn;
+    this.heroService.saveTaxReturn(this.currentTaxReturn).subscribe();
+  }
+}
+```
+Here is the `HeroTaxReturnComponent` that makes use of `HeroTaxReturnService`.
+
+```
+import { Component, EventEmitter, input, output } from '@angular/core';
+import { HeroTaxReturn } from './hero';
+import { HeroTaxReturnService } from './hero-tax-return.service';
+
+@Component({
+  selector: 'app-hero-tax-return',
+  templateUrl: './hero-tax-return.component.html',
+  styleUrls: [ './hero-tax-return.component.css' ],
+  providers: [ HeroTaxReturnService ]
+})
+export class HeroTaxReturnComponent {
+  message = '';
+
+  close = output<void>();
+
+  get taxReturn(): HeroTaxReturn {
+    return this.heroTaxReturnService.taxReturn;
+  }
+
+  taxReturn = input.required<HeroTaxReturn>();
+
+  constructor() {
+    effect(() => {
+      this.heroTaxReturnService.taxReturn = this.taxReturn();
+    })
+  }
+
+  private heroTaxReturnService = inject(HeroTaxReturnService);
+
+  onCanceled()  {
+    this.flashMessage('Canceled');
+    this.heroTaxReturnService.restoreTaxReturn();
+  }
+
+  onClose() { this.close.emit(); }
+
+  onSaved() {
+    this.flashMessage('Saved');
+    this.heroTaxReturnService.saveTaxReturn();
+  }
+
+  flashMessage(msg: string) {
+    this.message = msg;
+    setTimeout(() => this.message = '', 500);
+  }
+}
+```
+The _tax-return-to-edit_ arrives by way of the `input` property, which is implemented with getters and setters.
+The setter initializes the component's own instance of the `HeroTaxReturnService` with the incoming return.
+The getter always returns what that service says is the current state of the hero.
+The component also asks the service to save and restore this tax return.
+
+This won't work if the service is an application-wide singleton.
+Every component would share the same service instance, and each component would overwrite the tax return that belonged to another hero.
+
+To prevent this, configure the component-level injector of `HeroTaxReturnComponent` to provide the service, using the `providers` property in the component metadata.
+
+```
+providers: [HeroTaxReturnService]
+```
+The `HeroTaxReturnComponent` has its own provider of the `HeroTaxReturnService`.
+Recall that every component _instance_ has its own injector.
+Providing the service at the component level ensures that _every_ instance of the component gets a private instance of the service. This makes sure that no tax return gets overwritten.
+
+HELPFUL: The rest of the scenario code relies on other Angular features and techniques that you can learn about elsewhere in the documentation.
+
+### Scenario: specialized providers
+
+Another reason to provide a service again at another level is to substitute a _more specialized_ implementation of that service, deeper in the component tree.
+
+For example, consider a `Car` component that includes tire service information and depends on other services to provide more details about the car.
+
+The root injector, marked as (A), uses _generic_ providers for details about `CarService` and `EngineService`.
+
+1. `Car` component (A).  Component (A) displays tire service data about a car and specifies generic services to provide more information about the car.
+
+2. Child component (B). Component (B) defines its own, _specialized_ providers for `CarService` and `EngineService` that have special capabilities suitable for what's going on in component (B).
+
+3. Child component (C) as a child of Component (B). Component (C) defines its own, even _more specialized_ provider for `CarService`.
+
+```mermaid
+graph TD;
+subgraph COMPONENT_A[Component A]
+subgraph COMPONENT_B[Component B]
+COMPONENT_C[Component C]
+end
+end
+
+style COMPONENT_A fill:#BDD7EE
+style COMPONENT_B fill:#FFE699
+style COMPONENT_C fill:#A9D18E,color:#000
+classDef noShadow filter:none
+class COMPONENT_A,COMPONENT_B,COMPONENT_C noShadow
+```
+
+Behind the scenes, each component sets up its own injector with zero, one, or more providers defined for that component itself.
+
+When you resolve an instance of `Car` at the deepest component (C), its injector produces:
+
+* An instance of `Car` resolved by injector (C)
+* An `Engine` resolved by injector (B)
+* Its `Tires` resolved by the root injector (A).
+
+```mermaid
+graph BT;
+
+subgraph A[" "]
+direction LR
+RootInjector["(A) RootInjector"]
+ServicesA["CarService, EngineService, TiresService"]
+end
+
+subgraph B[" "]
+direction LR
+ParentInjector["(B) ParentInjector"]
+ServicesB["CarService2, EngineService2"]
+end
+
+subgraph C[" "]
+direction LR
+ChildInjector["(C) ChildInjector"]
+ServicesC["CarService3"]
+end
+
+direction LR
+car["(C) Car"]
+engine["(B) Engine"]
+tires["(A) Tires"]
+
+direction BT
+car-->ChildInjector
+ChildInjector-->ParentInjector-->RootInjector
+
+class car,engine,tires,RootInjector,ParentInjector,ChildInjector,ServicesA,ServicesB,ServicesC,A,B,C noShadow
+style car fill:#A9D18E,color:#000
+style ChildInjector fill:#A9D18E,color:#000
+style engine fill:#FFE699,color:#000
+style ParentInjector fill:#FFE699,color:#000
+style tires fill:#BDD7EE,color:#000
+style RootInjector fill:#BDD7EE,color:#000
+```
+
+## More on dependency injection
+# Optimizing client application size with lightweight injection tokens
+
+This page provides a conceptual overview of a dependency injection technique that is recommended for library developers.
+Designing your library with *lightweight injection tokens* helps optimize the bundle size of client applications that use your library.
+
+You can manage the dependency structure among your components and injectable services to optimize bundle size by using tree-shakable providers.
+This normally ensures that if a provided component or service is never actually used by the application, the compiler can remove its code from the bundle.
+
+Due to the way Angular stores injection tokens, it is possible that such an unused component or service can end up in the bundle anyway.
+This page describes a dependency injection design pattern that supports proper tree-shaking by using lightweight injection tokens.
+
+The lightweight injection token design pattern is especially important for library developers.
+It ensures that when an application uses only some of your library's capabilities, the unused code can be eliminated from the client's application bundle.
+
+When an application uses your library, there might be some services that your library supplies which the client application doesn't use.
+In this case, the application developer should expect that service to be tree-shaken, and not contribute to the size of the compiled application.
+Because the application developer cannot know about or remedy a tree-shaking problem in the library, it is the responsibility of the library developer to do so.
+To prevent the retention of unused components, your library should use the lightweight injection token design pattern.
+
+## When tokens are retained
+
+To better explain the condition under which token retention occurs, consider a library that provides a library-card component.
+This component contains a body and can contain an optional header:
+
+```html
+<lib-card>;
+  <lib-header>…</lib-header>;
+</lib-card>;
+```
+In a likely implementation, the `<lib-card>` component uses `@ContentChild()` or `@ContentChildren()` to get `<lib-header>` and `<lib-body>`, as in the following:
+
+```typescript
+@Component({
+  selector: 'lib-header',
+  …,
+})
+class LibHeaderComponent {}
+
+@Component({
+  selector: 'lib-card',
+  …,
+})
+class LibCardComponent {
+  @ContentChild(LibHeaderComponent) header: LibHeaderComponent|null = null;
+}
+```
+Because `<lib-header>` is optional, the element can appear in the template in its minimal form, `<lib-card></lib-card>`.
+In this case, `<lib-header>` is not used and you would expect it to be tree-shaken, but that is not what happens.
+This is because `LibCardComponent` actually contains two references to the `LibHeaderComponent`:
+
+```typescript
+@ContentChild(LibHeaderComponent) header: LibHeaderComponent;
+```
+* One of these reference is in the *type position*-- that is, it specifies `LibHeaderComponent` as a type: `header: LibHeaderComponent;`.
+* The other reference is in the *value position*-- that is, LibHeaderComponent is the value of the `@ContentChild()` parameter decorator: `@ContentChild(LibHeaderComponent)`.
+
+The compiler handles token references in these positions differently:
+
+* The compiler erases *type position* references after conversion from TypeScript, so they have no impact on tree-shaking.
+* The compiler must keep *value position* references at runtime, which **prevents** the component from being tree-shaken.
+
+In the example, the compiler retains the `LibHeaderComponent` token that occurs in the value position.
+This prevents the referenced component from being tree-shaken, even if the application does not actually use `<lib-header>` anywhere.
+If `LibHeaderComponent` 's code, template, and styles combine to become too large, including it unnecessarily can significantly increase the size of the client application.
+
+## When to use the lightweight injection token pattern
+
+The tree-shaking problem arises when a component is used as an injection token.
+There are two cases when that can happen:
+
+* The token is used in the value position of a [content query](guide/components/queries#content-queries).
+* The token is used as a type specifier for constructor injection.
+
+In the following example, both uses of the `OtherComponent` token cause retention of `OtherComponent`, preventing it from being tree-shaken when it is not used:
+
+```typescript
+class MyComponent {
+  constructor(@Optional() other: OtherComponent) {}
+
+  @ContentChild(OtherComponent) other: OtherComponent|null;
+}
+```
+Although tokens used only as type specifiers are removed when converted to JavaScript, all tokens used for dependency injection are needed at runtime.
+These effectively change `constructor(@Optional() other: OtherComponent)` to `constructor(@Optional() @Inject(OtherComponent) other)`.
+The token is now in a value position, which causes the tree-shaker to keep the reference.
+
+HELPFUL: Libraries should use [tree-shakable providers](guide/di/dependency-injection#providing-dependency) for all services, providing dependencies at the root level rather than in components or modules.
+
+## Using lightweight injection tokens
+
+The lightweight injection token design pattern consists of using a small abstract class as an injection token, and providing the actual implementation at a later stage.
+The abstract class is retained, not tree-shaken, but it is small and has no material impact on the application size.
+
+The following example shows how this works for the `LibHeaderComponent`:
+
+```typescript
+abstract class LibHeaderToken {}
+
+@Component({
+  selector: 'lib-header',
+  providers: [
+    {provide: LibHeaderToken, useExisting: LibHeaderComponent}
+  ]
+  …,
+})
+class LibHeaderComponent extends LibHeaderToken {}
+
+@Component({
+  selector: 'lib-card',
+  …,
+})
+class LibCardComponent {
+  @ContentChild(LibHeaderToken) header: LibHeaderToken|null = null;
+}
+```
+In this example, the `LibCardComponent` implementation no longer refers to `LibHeaderComponent` in either the type position or the value position.
+This lets full tree-shaking of `LibHeaderComponent` take place.
+The `LibHeaderToken` is retained, but it is only a class declaration, with no concrete implementation.
+It is small and does not materially impact the application size when retained after compilation.
+
+Instead, `LibHeaderComponent` itself implements the abstract `LibHeaderToken` class.
+You can safely use that token as the provider in the component definition, allowing Angular to correctly inject the concrete type.
+
+To summarize, the lightweight injection token pattern consists of the following:
+
+1. A lightweight injection token that is represented as an abstract class.
+1. A component definition that implements the abstract class.
+1. Injection of the lightweight pattern, using `@ContentChild()` or `@ContentChildren()`.
+1. A provider in the implementation of the lightweight injection token which associates the lightweight injection token with the implementation.
+
+### Use the lightweight injection token for API definition
+
+A component that injects a lightweight injection token might need to invoke a method in the injected class.
+The token is now an abstract class. Since the injectable component implements that class, you must also declare an abstract method in the abstract lightweight injection token class.
+The implementation of the method, with all its code overhead, resides in the injectable component that can be tree-shaken.
+This lets the parent communicate with the child, if it is present, in a type-safe manner.
+
+For example, the `LibCardComponent` now queries `LibHeaderToken` rather than `LibHeaderComponent`.
+The following example shows how the pattern lets `LibCardComponent` communicate with the `LibHeaderComponent` without actually referring to `LibHeaderComponent`:
+
+```typescript
+abstract class LibHeaderToken {
+  abstract doSomething(): void;
+}
+
+@Component({
+  selector: 'lib-header',
+  providers: [
+    {provide: LibHeaderToken, useExisting: LibHeaderComponent}
+  ]
+  …,
+})
+class LibHeaderComponent extends LibHeaderToken {
+  doSomething(): void {
+    // Concrete implementation of `doSomething`
+  }
+}
+
+@Component({
+  selector: 'lib-card',
+  …,
+})
+class LibCardComponent implement AfterContentInit {
+  @ContentChild(LibHeaderToken) header: LibHeaderToken|null = null;
+
+  ngAfterContentInit(): void {
+    if (this.header !== null) {
+      this.header?.doSomething();
+    }
+  }
+}
+```
+In this example, the parent queries the token to get the child component, and stores the resulting component reference if it is present.
+Before calling a method in the child, the parent component checks to see if the child component is present.
+If the child component has been tree-shaken, there is no runtime reference to it, and no call to its method.
+
+### Naming your lightweight injection token
+
+Lightweight injection tokens are only useful with components.
+The Angular style guide suggests that you name components using the "Component" suffix.
+The example "LibHeaderComponent" follows this convention.
+
+You should maintain the relationship between the component and its token while still distinguishing between them.
+The recommended style is to use the component base name with the suffix "`Token`" to name your lightweight injection tokens: "`LibHeaderToken`."
+# RxJS interop with Angular signals
+
+The `@angular/rxjs-interop` package offers APIs that help you integrate RxJS and Angular signals.
+
+## Create a signal from an RxJs Observable with `toSignal`
+
+Use the `toSignal` function to create a signal which tracks the value of an Observable. It behaves similarly to the `async` pipe in templates, but is more flexible and can be used anywhere in an application.
+
+```ts
+import { Component } from '@angular/core';
+import { AsyncPipe } from '@angular/common';
+import { interval } from 'rxjs';
+import { toSignal } from '@angular/core/rxjs-interop';
+
+@Component({
+  template: `{{ counter() }}`,
+})
+export class Ticker {
+  counterObservable = interval(1000);
+
+  // Get a `Signal` representing the `counterObservable`'s value.
+  counter = toSignal(this.counterObservable, {initialValue: 0});
+}
+```
+
+Like the `async` pipe, `toSignal` subscribes to the Observable immediately, which may trigger side effects. The subscription created by `toSignal` automatically unsubscribes from the given Observable when the component or service which calls `toSignal` is destroyed.
+
+IMPORTANT: `toSignal` creates a subscription. You should avoid calling it repeatedly for the same Observable, and instead reuse the signal it returns.
+
+### Injection context
+
+`toSignal` by default needs to run in an [injection context](guide/di/dependency-injection-context), such as during construction of a component or service. If an injection context is not available, you can manually specify the `Injector` to use instead.
+
+### Initial values
+
+Observables may not produce a value synchronously on subscription, but signals always require a current value. There are several ways to deal with this "initial" value of `toSignal` signals.
+
+#### The `initialValue` option
+
+As in the example above, you can specify an `initialValue` option with the value the signal should return before the Observable emits for the first time.
+
+#### `undefined` initial values
+
+If you don't provide an `initialValue`, the resulting signal will return `undefined` until the Observable emits. This is similar to the `async` pipe's behavior of returning `null`.
+
+#### The `requireSync` option
+
+Some Observables are guaranteed to emit synchronously, such as `BehaviorSubject`. In those cases, you can specify the `requireSync: true` option.
+
+When `requiredSync` is `true`, `toSignal` enforces that the Observable emits synchronously on subscription. This guarantees that the signal always has a value, and no `undefined` type or initial value is required.
+
+### `manualCleanup`
+
+By default, `toSignal` automatically unsubscribes from the Observable when the component or service that creates it is destroyed.
+
+To override this behavior, you can pass the `manualCleanup` option. You can use this setting for Observables that complete themselves naturally.
+
+### Error and Completion
+
+If an Observable used in `toSignal` produces an error, that error is thrown when the signal is read.
+
+If an Observable used in `toSignal` completes, the signal continues to return the most recently emitted value before completion.
+
+## Create an RxJS Observable from a signal with `toObservable`
+
+Use the `toObservable` utility to create an `Observable` which tracks the value of a signal. The signal's value is monitored with an `effect` which emits the value to the Observable when it changes.
+
+```ts
+import { Component, signal } from '@angular/core';
+import { toObservable } from '@angular/core/rxjs-interop';
+
+@Component(...)
+export class SearchResults {
+  query: Signal<string> = inject(QueryService).query;
+  query$ = toObservable(this.query);
+
+  results$ = this.query$.pipe(
+    switchMap(query => this.http.get('/search?q=' + query ))
+  );
+}
+```
+
+As the `query` signal changes, the `query$` Observable emits the latest query and triggers a new HTTP request.
+
+### Injection context
+
+`toObservable` by default needs to run in an [injection context](guide/di/dependency-injection-context), such as during construction of a component or service. If an injection context is not available, you can manually specify the `Injector` to use instead.
+
+### Timing of `toObservable`
+
+`toObservable` uses an effect to track the value of the signal in a `ReplaySubject`. On subscription, the first value (if available) may be emitted synchronously, and all subsequent values will be asynchronous.
+
+Unlike Observables, signals never provide a synchronous notification of changes. Even if you update a signal's value multiple times, `toObservable` will only emit the value after the signal stabilizes.
+
+```ts
+const obs$ = toObservable(mySignal);
+obs$.subscribe(value => console.log(value));
+
+mySignal.set(1);
+mySignal.set(2);
+mySignal.set(3);
+```
+
+Here, only the last value (3) will be logged.
+# RxJS interop with component and directive outputs
+
+TIP: This guide assumes you're familiar with [component and directive outputs](guide/components/outputs).
+
+The `@angular/rxjs-interop` package offers two APIs related to component and directive outputs.
+
+## Creating an output based on an RxJs Observable
+
+The `outputFromObservable` lets you create a component or directive output that emits based on an RxJS observable:
+
+```ts
+import {Directive} from '@angular/core';
+import {outputFromObservable} from '@angular/core/rxjs-interop';
+
+@Directive({/*...*/})
+class Draggable {
+  pointerMoves$: Observable<PointerMovements> = listenToPointerMoves();
+
+  // Whenever `pointerMoves$` emits, the `pointerMove` event fires.
+  pointerMove = outputFromObservable(this.pointerMoves$);
+}
+```
+The `outputFromObservable` function has special meaning to the Angular compiler. **You may only call `outputFromObservable` in component and directive property initializers.**
+
+When you `subscribe` to the output, Angular automatically forwards the subscription to the underlying observable. Angular stops forwarding values when the component or directive is destroyed.
+
+HELPFUL: Consider using `output()` directly if you can emit values imperatively.
+
+## Creating an RxJS Observable from a component or directive output
+
+The `outputToObservable` function lets you create an RxJS observable from a component output.
+
+```ts
+import {outputToObservable} from '@angular/core/rxjs-interop';
+
+@Component(/*...*/)
+class CustomSlider {
+  valueChange = output<number>();
+}
+
+// Instance reference to `CustomSlider`.
+const slider: CustomSlider = createSlider();
+
+outputToObservable(slider.valueChange) // Observable<number>
+  .pipe(...)
+  .subscribe(...);
+```
+HELPFUL: Consider using the `subscribe` method on `OutputRef` directly if it meets your needs.
+# Setting up `HttpClient`
+
+Before you can use `HttpClient` in your app, you must configure it using [dependency injection](guide/di).
+
+## Providing `HttpClient` through dependency injection
+
+`HttpClient` is provided using the `provideHttpClient` helper function, which most apps include in the application `providers` in `app.config.ts`.
+
+```ts
+export const appConfig: ApplicationConfig = {
+  providers: [
+    provideHttpClient(),
+  ]
+};
+```
+If your app is using NgModule-based bootstrap instead, you can include `provideHttpClient` in the providers of your app's NgModule:
+
+```ts
+@NgModule({
+  providers: [
+    provideHttpClient(),
+  ],
+  // ... other application configuration
+})
+export class AppModule {}
+```
+You can then inject the `HttpClient` service as a dependency of your components, services, or other classes:
+
+```ts
+@Injectable({providedIn: 'root'})
+export class ConfigService {
+  private http = inject(HttpClient);
+  // This service can now make HTTP requests via `this.http`.
+}
+```
+## Configuring features of `HttpClient`
+
+`provideHttpClient` accepts a list of optional feature configurations, to enable or configure the behavior of different aspects of the client. This section details the optional features and their usages.
+
+### `withFetch`
+
+```ts
+export const appConfig: ApplicationConfig = {
+  providers: [
+    provideHttpClient(
+      withFetch(),
+    ),
+  ]
+};
+```
+By default, `HttpClient` uses the [`XMLHttpRequest`](https://developer.mozilla.org/docs/Web/API/XMLHttpRequest) API to make requests. The `withFetch` feature switches the client to use the [`fetch`](https://developer.mozilla.org/docs/Web/API/Fetch_API) API instead.
+
+`fetch` is a more modern API and is available in a few environments where `XMLHttpRequest` is not supported. It does have a few limitations, such as not producing upload progress events.
+
+### `withInterceptors(...)`
+
+`withInterceptors` configures the set of interceptor functions which will process requests made through `HttpClient`. See the [interceptor guide](guide/http/interceptors) for more information.
+
+### `withInterceptorsFromDi()`
+
+`withInterceptorsFromDi` includes the older style of class-based interceptors in the `HttpClient` configuration. See the [interceptor guide](guide/http/interceptors) for more information.
+
+HELPFUL: Functional interceptors (through `withInterceptors`) have more predictable ordering and we recommend them over DI-based interceptors.
+
+### `withRequestsMadeViaParent()`
+
+By default, when you configure `HttpClient` using `provideHttpClient` within a given injector, this configuration overrides any configuration for `HttpClient` which may be present in the parent injector.
+
+When you add `withRequestsMadeViaParent()`, `HttpClient` is configured to instead pass requests up to the `HttpClient` instance in the parent injector, once they've passed through any configured interceptors at this level. This is useful if you want to _add_ interceptors in a child injector, while still sending the request through the parent injector's interceptors as well.
+
+CRITICAL: You must configure an instance of `HttpClient` above the current injector, or this option is not valid and you'll get a runtime error when you try to use it.
+
+### `withJsonpSupport()`
+
+Including `withJsonpSupport` enables the `.jsonp()` method on `HttpClient`, which makes a GET request via the [JSONP convention](https://en.wikipedia.org/wiki/JSONP) for cross-domain loading of data.
+
+HELPFUL: Prefer using [CORS](https://developer.mozilla.org/docs/Web/HTTP/CORS) to make cross-domain requests instead of JSONP when possible.
+
+### `withXsrfConfiguration(...)`
+
+Including this option allows for customization of `HttpClient`'s built-in XSRF security functionality. See the [security guide](best-practices/security) for more information.
+
+### `withNoXsrfProtection()`
+
+Including this option disables `HttpClient`'s built-in XSRF security functionality. See the [security guide](best-practices/security) for more information.
+
+## `HttpClientModule`-based configuration
+
+Some applications may configure `HttpClient` using the older API based on NgModules.
+
+This table lists the NgModules available from `@angular/common/http` and how they relate to the provider configuration functions above.
+
+| **NgModule**                            | `provideHttpClient()` equivalent              |
+| --------------------------------------- | --------------------------------------------- |
+| `HttpClientModule`                      | `provideHttpClient(withInterceptorsFromDi())` |
+| `HttpClientJsonpModule`                 | `withJsonpSupport()`                          |
+| `HttpClientXsrfModule.withOptions(...)` | `withXsrfConfiguration(...)`                  |
+| `HttpClientXsrfModule.disable()`        | `withNoXsrfProtection()`                      |
+When `HttpClientModule` is present in multiple injectors, the behavior of interceptors is poorly defined and depends on the exact options and provider/import ordering.
+
+Prefer `provideHttpClient` for multi-injector configurations, as it has more stable behavior. See the `withRequestsMadeViaParent` feature above.
+
+# Making HTTP requests
+
+`HttpClient` has methods corresponding to the different HTTP verbs used to make requests, both to load data and to apply mutations on the server. Each method returns an [RxJS `Observable`](https://rxjs.dev/guide/observable) which, when subscribed, sends the request and then emits the results when the server responds.
+
+NOTE: `Observable`s created by `HttpClient` may be subscribed any number of times and will make a new backend request for each subscription.
+
+Through an options object passed to the request method, various properties of the request and the returned response type can be adjusted.
+
+## Fetching JSON data
+
+Fetching data from a backend often requires making a GET request using the [`HttpClient.get()`](api/common/http/HttpClient#get) method. This method takes two arguments: the string endpoint URL from which to fetch, and an *optional options* object to configure the request.
+
+For example, to fetch configuration data from a hypothetical API using the `HttpClient.get()` method:
+
+```ts
+http.get<Config>('/api/config').subscribe(config => {
+  // process the configuration.
+});
+```
+Note the generic type argument which specifies that the data returned by the server will be of type `Config`. This argument is optional, and if you omit it then the returned data will have type `Object`.
+
+TIP: When dealing with data of uncertain structure and potential `undefined` or `null` values, consider using the `unknown` type instead of `Object` as the response type.
+
+CRITICAL: The generic type of request methods is a type **assertion** about the data returned by the server. `HttpClient` does not verify that the actual return data matches this type.
+
+## Fetching other types of data
+
+By default, `HttpClient` assumes that servers will return JSON data. When interacting with a non-JSON API, you can tell `HttpClient` what response type to expect and return when making the request. This is done with the `responseType` option.
+
+| **`responseType` value** | **Returned response type** |
+| - | - |
+| `'json'` (default) | JSON data of the given generic type |
+| `'text'` | string data |
+| `'arraybuffer'` | [`ArrayBuffer`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer) containing the raw response bytes |
+| `'blob'` | [`Blob`](https://developer.mozilla.org/docs/Web/API/Blob) instance |
+
+For example, you can ask `HttpClient` to download the raw bytes of a `.jpeg` image into an `ArrayBuffer`:
+
+```ts
+http.get('/images/dog.jpg', {responseType: 'arraybuffer'}).subscribe(buffer => {
+  console.log('The image is ' + buffer.byteLength + ' bytes large');
+});
+```
+Because the value of `responseType` affects the type returned by `HttpClient`, it must have a literal type and not a `string` type.
+
+This happens automatically if the options object passed to the request method is a literal object, but if you're extracting the request options out into a variable or helper method you might need to explicitly specify it as a literal, such as `responseType: 'text' as const`.
+## Mutating server state
+
+Server APIs which perform mutations often require making POST requests with a request body specifying the new state or the change to be made.
+
+The [`HttpClient.post()`](api/common/http/HttpClient#post) method behaves similarly to `get()`, and accepts an additional `body` argument before its options:
+
+```ts
+http.post<Config>('/api/config', newConfig).subscribe(config => {
+  console.log('Updated config:', config);
+});
+```
+Many different types of values can be provided as the request's `body`, and `HttpClient` will serialize them accordingly:
+
+| **`body` type** | **Serialized as** |
+| - | - |
+| string | Plain text |
+| number, boolean, array, or plain object | JSON |
+| [`ArrayBuffer`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer) | raw data from the buffer |
+| [`Blob`](https://developer.mozilla.org/docs/Web/API/Blob) | raw data with the `Blob`'s content type |
+| [`FormData`](https://developer.mozilla.org/docs/Web/API/FormData) | `multipart/form-data` encoded data |
+| [`HttpParams`](api/common/http/HttpParams) or [`URLSearchParams`](https://developer.mozilla.org/docs/Web/API/URLSearchParams) | `application/x-www-form-urlencoded` formatted string |
+
+IMPORTANT: Remember to `.subscribe()` to mutation request `Observable`s in order to actually fire the request.
+
+## Setting URL parameters
+
+Specify request parameters that should be included in the request URL using the `params` option.
+
+Passing an object literal is the simplest way of configuring URL parameters:
+
+```ts
+http.get('/api/config', {
+  params: {filter: 'all'},
+}).subscribe(config => {
+  // ...
+});
+```
+Alternatively, pass an instance of `HttpParams` if you need more control over the construction or serialization of the parameters.
+
+IMPORTANT: Instances of `HttpParams` are _immutable_ and cannot be directly changed. Instead, mutation methods such as `append()` return a new instance of `HttpParams` with the mutation applied.
+
+```ts
+const baseParams = new HttpParams().set('filter', 'all');
+
+http.get('/api/config', {
+  params: baseParams.set('details', 'enabled'),
+}).subscribe(config => {
+  // ...
+});
+```
+You can instantiate `HttpParams` with a custom `HttpParameterCodec` that determines how `HttpClient` will encode the parameters into the URL.
+
+## Setting request headers
+
+Specify request headers that should be included in the request using the `headers` option.
+
+Passing an object literal is the simplest way of configuring request headers:
+
+```ts
+http.get('/api/config', {
+  headers: {
+    'X-Debug-Level': 'verbose',
+  }
+}).subscribe(config => {
+  // ...
+});
+```
+Alternatively, pass an instance of `HttpHeaders` if you need more control over the construction of headers
+
+IMPORTANT: Instances of `HttpHeaders` are _immutable_ and cannot be directly changed. Instead, mutation methods such as `append()` return a new instance of `HttpHeaders` with the mutation applied.
+
+```ts
+const baseHeaders = new HttpHeaders().set('X-Debug-Level', 'minimal');
+
+http.get<Config>('/api/config', {
+  headers: baseHeaders.set('X-Debug-Level', 'verbose'),
+}).subscribe(config => {
+  // ...
+});
+```
+## Interacting with the server response events
+
+For convenience, `HttpClient` by default returns an `Observable` of the data returned by the server (the response body). Occasionally it's desirable to examine the actual response, for example to retrieve specific response headers.
+
+To access the entire response, set the `observe` option to `'response'`:
+
+```ts
+http.get<Config>('/api/config', {observe: 'response'}).subscribe(res => {
+  console.log('Response status:', res.status);
+  console.log('Body:', res.body);
+});
+```
+Because the value of `observe` affects the type returned by `HttpClient`, it must have a literal type and not a `string` type.
+
+This happens automatically if the options object passed to the request method is a literal object, but if you're extracting the request options out into a variable or helper method you might need to explicitly specify it as a literal, such as `observe: 'response' as const`.
+## Receiving raw progress events
+
+In addition to the response body or response object, `HttpClient` can also return a stream of raw _events_ corresponding to specific moments in the request lifecycle. These events include when the request is sent, when the response header is returned, and when the body is complete. These events can also include _progress events_ which report upload and download status for large request or response bodies.
+
+Progress events are disabled by default (as they have a performance cost) but can be enabled with the `reportProgress` option.
+
+NOTE: The optional `fetch` implementation of `HttpClient` does not report _upload_ progress events.
+
+To observe the event stream, set the `observe` option to `'events'`:
+
+```ts
+http.post('/api/upload', myData, {
+  reportProgress: true,
+  observe: 'events',
+}).subscribe(event => {
+  switch (event.type) {
+    case HttpEventType.UploadProgress:
+      console.log('Uploaded ' + event.loaded + ' out of ' + event.total + ' bytes');
+      break;
+    case HttpEventType.Response:
+      console.log('Finished uploading!');
+      break;
+  }
+});
+```
+Because the value of `observe` affects the type returned by `HttpClient`, it must have a literal type and not a `string` type.
+
+This happens automatically if the options object passed to the request method is a literal object, but if you're extracting the request options out into a variable or helper method you might need to explicitly specify it as a literal, such as `observe: 'events' as const`.
+Each `HttpEvent` reported in the event stream has a `type` which distinguishes what the event represents:
+
+| **`type` value** | **Event meaning** |
+| - | - |
+| `HttpEventType.Sent` | The request has been dispatched to the server |
+| `HttpEventType.UploadProgress` | An `HttpUploadProgressEvent` reporting progress on uploading the request body |
+| `HttpEventType.ResponseHeader` | The head of the response has been received, including status and headers |
+| `HttpEventType.DownloadProgress` | An `HttpDownloadProgressEvent` reporting progress on downloading the response body |
+| `HttpEventType.Response` | The entire response has been received, including the response body |
+| `HttpEventType.User` | A custom event from an Http interceptor.
+
+## Handling request failure
+
+There are three ways an HTTP request can fail:
+
+* A network or connection error can prevent the request from reaching the backend server.
+* A request didn't respond in time when the timeout option was set.
+* The backend can receive the request but fail to process it, and return an error response.
+
+`HttpClient` captures all of the above kinds of errors in an `HttpErrorResponse` which it returns through the `Observable`'s error channel. Network and timeout errors have a `status` code of `0` and an `error` which is an instance of [`ProgressEvent`](https://developer.mozilla.org/docs/Web/API/ProgressEvent). Backend errors have the failing `status` code returned by the backend, and the error response as the `error`. Inspect the response to identify the error's cause and the appropriate action to handle the error.
+
+The [RxJS library](https://rxjs.dev/) offers several operators which can be useful for error handling.
+
+You can use the `catchError` operator to transform an error response into a value for the UI. This value can tell the UI to display an error page or value, and capture the error's cause if necessary.
+
+Sometimes transient errors such as network interruptions can cause a request to fail unexpectedly, and simply retrying the request will allow it to succeed. RxJS provides several *retry* operators which automatically re-subscribe to a failed `Observable` under certain conditions. For example, the `retry()` operator will automatically attempt to re-subscribe a specified number of times.
+
+### Timeouts
+
+To set a timeout for a request, you can set the `timeout` option to a number of milliseconds along other request options. If the backend request does not complete within the specified time, the request will be aborted and an error will be emitted.
+
+NOTE: The timeout will only apply to the backend HTTP request itself. It is not a timeout for the entire request handling chain. Therefore, this option is not affected by any delay introduced by interceptors.
+
+```ts
+http.get('/api/config', {
+  timeout: 3000,
+}).subscribe({
+  next: config => {
+    console.log('Config fetched successfully:', config);
+  },
+  error: err => {
+    // If the request times out, an error will have been emitted.
+  }
+});
+```
+## Advanced fetch options
+
+When using the `withFetch()` provider, Angular's `HttpClient` provides access to advanced fetch API options that can improve performance and user experience. These options are only available when using the fetch backend.
+
+### Fetch options
+
+The following options provide fine-grained control over request behavior when using the fetch backend.
+
+#### Keep-alive connections
+
+The `keepalive` option allows a request to outlive the page that initiated it. This is particularly useful for analytics or logging requests that need to complete even if the user navigates away from the page.
+
+```ts
+http.post('/api/analytics', analyticsData, {
+  keepalive: true
+}).subscribe();
+```
+#### HTTP caching control
+
+The `cache` option controls how the request interacts with the browser's HTTP cache, which can significantly improve performance for repeated requests.
+
+```ts
+//  Use cached response regardless of freshness
+http.get('/api/config', {
+  cache: 'force-cache'
+}).subscribe(config => {
+  // ...
+});
+
+// Always fetch from network, bypass cache
+http.get('/api/live-data', {
+  cache: 'no-cache'
+}).subscribe(data => {
+  // ...
+});
+
+// Use cached response only, fail if not in cache
+http.get('/api/static-data', {
+  cache: 'only-if-cached'
+}).subscribe(data => {
+  // ...
+});
+```
+#### Request priority for Core Web Vitals
+
+The `priority` option allows you to indicate the relative importance of a request, helping browsers optimize resource loading for better Core Web Vitals scores.
+
+```ts
+// High priority for critical resources
+http.get('/api/user-profile', {
+  priority: 'high'
+}).subscribe(profile => {
+  // ...
+});
+
+// Low priority for non-critical resources
+http.get('/api/recommendations', {
+  priority: 'low'
+}).subscribe(recommendations => {
+  // ...
+});
+
+// Auto priority (default) lets the browser decide
+http.get('/api/settings', {
+  priority: 'auto'
+}).subscribe(settings => {
+  // ...
+});
+```
+Available `priority` values:
+- `'high'`: High priority, loaded early (e.g., critical user data, above-the-fold content)
+- `'low'`: Low priority, loaded when resources are available (e.g., analytics, prefetch data)
+- `'auto'`: Browser determines priority based on request context (default)
+
+TIP: Use `priority: 'high'` for requests that affect Largest Contentful Paint (LCP) and `priority: 'low'` for requests that don't impact initial user experience.
+
+#### Request mode
+
+The `mode` option controls how the request handles cross-origin requests and determines the response type.
+
+```ts
+// Same-origin requests only
+http.get('/api/local-data', {
+  mode: 'same-origin'
+}).subscribe(data => {
+  // ...
+});
+
+// CORS-enabled cross-origin requests
+http.get('https://api.external.com/data', {
+  mode: 'cors'
+}).subscribe(data => {
+  // ...
+});
+
+// No-CORS mode for simple cross-origin requests
+http.get('https://external-api.com/public-data', {
+  mode: 'no-cors'
+}).subscribe(data => {
+  // ...
+});
+```
+Available `mode` values:
+- `'same-origin'`: Only allow same-origin requests, fail for cross-origin requests
+- `'cors'`: Allow cross-origin requests with CORS (default)
+- `'no-cors'`: Allow simple cross-origin requests without CORS, response is opaque
+
+TIP: Use `mode: 'same-origin'` for sensitive requests that should never go cross-origin.
+
+#### Redirect handling
+
+The `redirect` option specifies how to handle redirect responses from the server.
+
+```ts
+// Follow redirects automatically (default behavior)
+http.get('/api/resource', {
+  redirect: 'follow'
+}).subscribe(data => {
+  // ...
+});
+
+// Prevent automatic redirects
+http.get('/api/resource', {
+  redirect: 'manual'
+}).subscribe(response => {
+  // Handle redirect manually
+});
+
+// Treat redirects as errors
+http.get('/api/resource', {
+  redirect: 'error'
+}).subscribe({
+  next: data => {
+    // Success response
+  },
+  error: err => {
+    // Redirect responses will trigger this error handler
+  }
+});
+```
+Available `redirect` values:
+- `'follow'`: Automatically follow redirects (default)
+- `'error'`: Treat redirects as errors
+- `'manual'`: Don't follow redirects automatically, return redirect response
+
+TIP: Use `redirect: 'manual'` when you need to handle redirects with custom logic.
+
+#### Credentials handling
+
+The `credentials` option controls whether cookies, authorization headers, and other credentials are sent with cross-origin requests. This is particularly important for authentication scenarios.
+
+```ts
+// Include credentials for cross-origin requests
+http.get('https://api.example.com/protected-data', {
+  credentials: 'include'
+}).subscribe(data => {
+  // ...
+});
+
+// Never send credentials (default for cross-origin)
+http.get('https://api.example.com/public-data', {
+  credentials: 'omit'
+}).subscribe(data => {
+  // ...
+});
+
+// Send credentials only for same-origin requests
+http.get('/api/user-data', {
+  credentials: 'same-origin'
+}).subscribe(data => {
+  // ...
+});
+
+// withCredentials overrides credentials setting
+http.get('https://api.example.com/data', {
+  credentials: 'omit',        // This will be ignored
+  withCredentials: true       // This forces credentials: 'include'
+}).subscribe(data => {
+  // Request will include credentials despite credentials: 'omit'
+});
+
+// Legacy approach (still supported)
+http.get('https://api.example.com/data', {
+  withCredentials: true
+}).subscribe(data => {
+  // Equivalent to credentials: 'include'
+});
+```
+IMPORTANT: The `withCredentials` option takes precedence over the `credentials` option. If both are specified, `withCredentials: true` will always result in `credentials: 'include'`, regardless of the explicit `credentials` value.
+
+Available `credentials` values:
+- `'omit'`: Never send credentials
+- `'same-origin'`: Send credentials only for same-origin requests (default)
+- `'include'`: Always send credentials, even for cross-origin requests
+
+TIP: Use `credentials: 'include'` when you need to send authentication cookies or headers to a different domain that supports CORS. Avoid mixing `credentials` and `withCredentials` options to prevent confusion.
+
+## Http `Observable`s
+
+Each request method on `HttpClient` constructs and returns an `Observable` of the requested response type. Understanding how these `Observable`s work is important when using `HttpClient`.
+
+`HttpClient` produces what RxJS calls "cold" `Observable`s, meaning that no actual request happens until the `Observable` is subscribed. Only then is the request actually dispatched to the server. Subscribing to the same `Observable` multiple times will trigger multiple backend requests. Each subscription is independent.
+
+TIP: You can think of `HttpClient` `Observable`s as _blueprints_ for actual server requests.
+
+Once subscribed, unsubscribing will abort the in-progress request. This is very useful if the `Observable` is subscribed via the `async` pipe, as it will automatically cancel the request if the user navigates away from the current page. Additionally, if you use the `Observable` with an RxJS combinator like `switchMap`, this cancellation will clean up any stale requests.
+
+Once the response returns, `Observable`s from `HttpClient` usually complete (although interceptors can influence this).
+
+Because of the automatic completion, there is usually no risk of memory leaks if `HttpClient` subscriptions are not cleaned up. However, as with any async operation, we strongly recommend that you clean up subscriptions when the component using them is destroyed, as the subscription callback may otherwise run and encounter errors when it attempts to interact with the destroyed component.
+
+TIP: Using the `async` pipe or the `toSignal` operation to subscribe to `Observable`s ensures that subscriptions are disposed properly.
+
+## Best practices
+
+While `HttpClient` can be injected and used directly from components, generally we recommend you create reusable, injectable services which isolate and encapsulate data access logic. For example, this `UserService` encapsulates the logic to request data for a user by their id:
+
+```ts
+@Injectable({providedIn: 'root'})
+export class UserService {
+  private http = inject(HttpClient);
+
+  getUser(id: string): Observable<User> {
+    return this.http.get<User>(`/api/user/${id}`);
+  }
+}
+```
+Within a component, you can combine `@if` with the `async` pipe to render the UI for the data only after it's finished loading:
+
+```ts
+import { AsyncPipe } from '@angular/common';
+@Component({
+  imports: [AsyncPipe],
+  template: `
+    @if (user$ | async; as user) {
+      <p>Name: {{ user.name }}</p>
+      <p>Biography: {{ user.biography }}</p>
+    }
+  `,
+})
+export class UserProfileComponent {
+  userId = input.required<string>();
+  user$!: Observable<User>;
+
+  private userService = inject(UserService);
+
+  constructor(): void {
+    effect(() => {
+      this.user$ = this.userService.getUser(this.userId());
+    });
+  }
+}
+```
+
+# Interceptors
+
+`HttpClient` supports a form of middleware known as _interceptors_.
+
+TLDR: Interceptors are middleware that allows common patterns around retrying, caching, logging, and authentication to be abstracted away from individual requests.
+
+`HttpClient` supports two kinds of interceptors: functional and DI-based. Our recommendation is to use functional interceptors because they have more predictable behavior, especially in complex setups. Our examples in this guide use functional interceptors, and we cover [DI-based interceptors](#di-based-interceptors) in their own section at the end.
+
+## Interceptors
+
+Interceptors are generally functions which you can run for each request, and have broad capabilities to affect the contents and overall flow of requests and responses. You can install multiple interceptors, which form an interceptor chain where each interceptor processes the request or response before forwarding it to the next interceptor in the chain.
+
+You can use interceptors to implement a variety of common patterns, such as:
+
+* Adding authentication headers to outgoing requests to a particular API.
+* Retrying failed requests with exponential backoff.
+* Caching responses for a period of time, or until invalidated by mutations.
+* Customizing the parsing of responses.
+* Measuring server response times and log them.
+* Driving UI elements such as a loading spinner while network operations are in progress.
+* Collecting and batch requests made within a certain timeframe.
+* Automatically failing requests after a configurable deadline or timeout.
+* Regularly polling the server and refreshing results.
+
+## Defining an interceptor
+
+The basic form of an interceptor is a function which receives the outgoing `HttpRequest` and a `next` function representing the next processing step in the interceptor chain.
+
+For example, this `loggingInterceptor` will log the outgoing request URL to `console.log` before forwarding the request:
+
+```ts
+export function loggingInterceptor(req: HttpRequest<unknown>, next: HttpHandlerFn): Observable<HttpEvent<unknown>> {
+  console.log(req.url);
+  return next(req);
+}
+```
+In order for this interceptor to actually intercept requests, you must configure `HttpClient` to use it.
+
+## Configuring interceptors
+
+You declare the set of interceptors to use when configuring `HttpClient` through dependency injection, by using the `withInterceptors` feature:
+
+```ts
+bootstrapApplication(AppComponent, {providers: [
+  provideHttpClient(
+    withInterceptors([loggingInterceptor, cachingInterceptor]),
+  )
+]});
+```
+The interceptors you configure are chained together in the order that you've listed them in the providers. In the above example, the `loggingInterceptor` would process the request and then forward it to the `cachingInterceptor`.
+
+### Intercepting response events
+
+An interceptor may transform the `Observable` stream of `HttpEvent`s returned by `next` in order to access or manipulate the response. Because this stream includes all response events, inspecting the `.type` of each event may be necessary in order to identify the final response object.
+
+```ts
+export function loggingInterceptor(req: HttpRequest<unknown>, next: HttpHandlerFn): Observable<HttpEvent<unknown>> {
+  return next(req).pipe(tap(event => {
+    if (event.type === HttpEventType.Response) {
+      console.log(req.url, 'returned a response with status', event.status);
+    }
+  }));
+}
+```
+TIP: Interceptors naturally associate responses with their outgoing requests, because they transform the response stream in a closure that captures the request object.
+
+## Modifying requests
+
+Most aspects of `HttpRequest` and `HttpResponse` instances are _immutable_, and interceptors cannot directly modify them. Instead, interceptors apply mutations by cloning these objects using the `.clone()` operation, and specifying which properties should be mutated in the new instance. This might involve performing immutable updates on the value itself (like `HttpHeaders` or `HttpParams`).
+
+For example, to add a header to a request:
+
+```ts
+const reqWithHeader = req.clone({
+  headers: req.headers.set('X-New-Header', 'new header value'),
+});
+```
+This immutability allows most interceptors to be idempotent if the same `HttpRequest` is submitted to the interceptor chain multiple times. This can happen for a few reasons, including when a request is retried after failure.
+
+CRITICAL: The body of a request or response is **not** protected from deep mutations. If an interceptor must mutate the body, take care to handle running multiple times on the same request.
+
+## Dependency injection in interceptors
+
+Interceptors are run in the _injection context_ of the injector which registered them, and can use  Angular's `inject` API to retrieve dependencies.
+
+For example, suppose an application has a service called `AuthService`, which creates authentication tokens for outgoing requests. An interceptor can inject and use this service:
+
+```ts
+export function authInterceptor(req: HttpRequest<unknown>, next: HttpHandlerFn) {
+  // Inject the current `AuthService` and use it to get an authentication token:
+  const authToken = inject(AuthService).getAuthToken();
+
+  // Clone the request to add the authentication header.
+  const newReq = req.clone({
+    headers: req.headers.append('X-Authentication-Token', authToken),
+  });
+  return next(newReq);
+}
+```
+## Request and response metadata
+
+Often it's useful to include information in a request that's not sent to the backend, but is specifically meant for interceptors. `HttpRequest`s have a `.context` object which stores this kind of metadata as an instance of `HttpContext`. This object functions as a typed map, with keys of type `HttpContextToken`.
+
+To illustrate how this system works, let's use metadata to control whether a caching interceptor is enabled for a given request.
+
+### Defining context tokens
+
+To store whether the caching interceptor should cache a particular request in that request's `.context` map, define a new `HttpContextToken` to act as a key:
+
+```ts
+export const CACHING_ENABLED = new HttpContextToken<boolean>(() => true);
+```
+The provided function creates the default value for the token for requests that haven't explicitly set a value for it. Using a function ensures that if the token's value is an object or array, each request gets its own instance.
+
+### Reading the token in an interceptor
+
+An interceptor can then read the token and choose to apply caching logic or not based on its value:
+
+```ts
+export function cachingInterceptor(req: HttpRequest<unknown>, next: HttpHandlerFn): Observable<HttpEvent<unknown>> {
+  if (req.context.get(CACHING_ENABLED)) {
+    // apply caching logic
+    return ...;
+  } else {
+    // caching has been disabled for this request
+    return next(req);
+  }
+}
+```
+### Setting context tokens when making a request
+
+When making a request via the `HttpClient` API, you can provide values for `HttpContextToken`s:
+
+```ts
+const data$ = http.get('/sensitive/data', {
+  context: new HttpContext().set(CACHING_ENABLED, false),
+});
+```
+Interceptors can read these values from the `HttpContext` of the request.
+
+### The request context is mutable
+
+Unlike other properties of `HttpRequest`s, the associated `HttpContext` is _mutable_. If an interceptor changes the context of a request that is later retried, the same interceptor will observe the context mutation when it runs again. This is useful for passing state across multiple retries if needed.
+
+## Synthetic responses
+
+Most interceptors will simply invoke the `next` handler while transforming either the request or the response, but this is not strictly a requirement. This section discusses several of the ways in which an interceptor may incorporate more advanced behavior.
+
+Interceptors are not required to invoke `next`. They may instead choose to construct responses through some other mechanism, such as from a cache or by sending the request through an alternate mechanism.
+
+Constructing a response is possible using the `HttpResponse` constructor:
+
+```ts
+const resp = new HttpResponse({
+  body: 'response body',
+});
+```
+## DI-based interceptors
+
+`HttpClient` also supports interceptors which are defined as injectable classes and configured through the DI system. The capabilities of DI-based interceptors are identical to those of functional interceptors, but the configuration mechanism is different.
+
+A DI-based interceptor is an injectable class which implements the `HttpInterceptor` interface:
+
+```ts
+@Injectable()
+export class LoggingInterceptor implements HttpInterceptor {
+  intercept(req: HttpRequest<any>, handler: HttpHandler): Observable<HttpEvent<any>> {
+    console.log('Request URL: ' + req.url);
+    return handler.handle(req);
+  }
+}
+```
+DI-based interceptors are configured through a dependency injection multi-provider:
+
+```ts
+bootstrapApplication(AppComponent, {providers: [
+  provideHttpClient(
+    // DI-based interceptors must be explicitly enabled.
+    withInterceptorsFromDi(),
+  ),
+
+  {provide: HTTP_INTERCEPTORS, useClass: LoggingInterceptor, multi: true},
+]});
+```
+DI-based interceptors run in the order that their providers are registered. In an app with an extensive and hierarchical DI configuration, this order can be very hard to predict.
+# Test requests
+
+As for any external dependency, you must mock the HTTP backend so your tests can simulate interaction with a remote server. The `@angular/common/http/testing` library provides tools to capture requests made by the application, make assertions about them, and mock the responses to emulate your backend's behavior.
+
+The testing library is designed for a pattern in which the app executes code and makes requests first. The test then expects that certain requests have or have not been made, performs assertions against those requests, and finally provides responses by "flushing" each expected request.
+
+At the end, tests can verify that the app made no unexpected requests.
+
+## Setup for testing
+
+To begin testing usage of `HttpClient`, configure `TestBed` and include `provideHttpClient()` and `provideHttpClientTesting()` in your test's setup. This configures `HttpClient` to use a test backend instead of the real network. It also provides `HttpTestingController`, which you'll use to interact with the test backend, set expectations about which requests have been made, and flush responses to those requests. `HttpTestingController` can be injected from `TestBed` once configured.
+
+Keep in mind to provide `provideHttpClient()` **before** `provideHttpClientTesting()`, as `provideHttpClientTesting()` will overwrite parts of `provideHttpClient()`. Doing it the other way around can potentially break your tests.
+
+```ts
+TestBed.configureTestingModule({
+  providers: [
+    // ... other test providers
+    provideHttpClient(),
+    provideHttpClientTesting(),
+  ],
+});
+
+const httpTesting = TestBed.inject(HttpTestingController);
+```
+Now when your tests make requests, they will hit the testing backend instead of the normal one. You can use `httpTesting` to make assertions about those requests.
+
+## Expecting and answering requests
+
+For example, you can write a test that expects a GET request to occur and provides a mock response:
+
+```ts
+TestBed.configureTestingModule({
+  providers: [
+    ConfigService,
+    provideHttpClient(),
+    provideHttpClientTesting(),
+  ],
+});
+
+const httpTesting = TestBed.inject(HttpTestingController);
+
+// Load `ConfigService` and request the current configuration.
+const service = TestBed.inject(ConfigService);
+const config$ = this.configService.getConfig<Config>();
+
+// `firstValueFrom` subscribes to the `Observable`, which makes the HTTP request,
+// and creates a `Promise` of the response.
+const configPromise = firstValueFrom(config$);
+
+// At this point, the request is pending, and we can assert it was made
+// via the `HttpTestingController`:
+const req = httpTesting.expectOne('/api/config', 'Request to load the configuration');
+
+// We can assert various properties of the request if desired.
+expect(req.request.method).toBe('GET');
+
+// Flushing the request causes it to complete, delivering the result.
+req.flush(DEFAULT_CONFIG);
+
+// We can then assert that the response was successfully delivered by the `ConfigService`:
+expect(await configPromise).toEqual(DEFAULT_CONFIG);
+
+// Finally, we can assert that no other requests were made.
+httpTesting.verify();
+```
+NOTE: `expectOne` will fail if the test has made more than one request which matches the given criteria.
+
+As an alternative to asserting on `req.method`, you could instead use an expanded form of `expectOne` to also match the request method:
+
+```ts
+const req = httpTesting.expectOne({
+  method: 'GET',
+  url: '/api/config',
+}, 'Request to load the configuration');
+```
+HELPFUL: The expectation APIs match against the full URL of requests, including any query parameters.
+
+The last step, verifying that no requests remain outstanding, is common enough for you to move it into an `afterEach()` step:
+
+```ts
+afterEach(() => {
+  // Verify that none of the tests make any extra HTTP requests.
+  TestBed.inject(HttpTestingController).verify();
+});
+```
+## Handling more than one request at once
+
+If you need to respond to duplicate requests in your test, use the `match()` API instead of `expectOne()`. It takes the same arguments but returns an array of matching requests. Once returned, these requests are removed from future matching and you are responsible for flushing and verifying them.
+
+```ts
+const allGetRequests = httpTesting.match({method: 'GET'});
+for (const req of allGetRequests) {
+  // Handle responding to each request.
+}
+```
+## Advanced matching
+
+All matching functions accept a predicate function for custom matching logic:
+
+```ts
+// Look for one request that has a request body.
+const requestsWithBody = httpTesting.expectOne(req => req.body !== null);
+```
+The `expectNone` function asserts that no requests match the given criteria.
+
+```ts
+// Assert that no mutation requests have been issued.
+httpTesting.expectNone(req => req.method !== 'GET');
+```
+## Testing error handling
+
+You should test your app's responses when HTTP requests fail.
+
+### Backend errors
+
+To test handling of backend errors (when the server returns a non-successful status code), flush requests with an error response that emulates what your backend would return when a request fails.
+
+```ts
+const req = httpTesting.expectOne('/api/config');
+req.flush('Failed!', {status: 500, statusText: 'Internal Server Error'});
+
+// Assert that the application successfully handled the backend error.
+```
+### Network errors
+
+Requests can also fail due to network errors, which surface as `ProgressEvent` errors. These can be delivered with the `error()` method:
+
+```ts
+const req = httpTesting.expectOne('/api/config');
+req.error(new ProgressEvent('network error!'));
+
+// Assert that the application successfully handled the network error.
+```
+## Testing an Interceptor
+
+You should test that your interceptors work under the desired circumstances.
+
+For example, an application may be required to add an authentication token generated by a service to each outgoing request.
+This behavior can be enforced with the use of an interceptor:
+
+```ts
+export function authInterceptor(request: HttpRequest<unknown>, next: HttpHandlerFn): Observable<HttpEvent<unknown>> {
+  const authService = inject(AuthService);
+
+  const clonedRequest = request.clone({
+    headers: request.headers.append('X-Authentication-Token', authService.getAuthToken()),
+  });
+  return next(clonedRequest);
+}
+```
+The `TestBed` configuration for this interceptor should rely on the `withInterceptors` feature.
+
+```ts
+TestBed.configureTestingModule({
+  providers: [
+    AuthService,
+    // Testing one interceptor at a time is recommended.
+    provideHttpClient(withInterceptors([authInterceptor])),
+    provideHttpClientTesting(),
+  ],
+});
+```
+The `HttpTestingController` can retrieve the request instance which can then be inspected to ensure that the request was modified.
+
+```ts
+const service = TestBed.inject(AuthService);
+const req = httpTesting.expectOne('/api/config');
+
+expect(req.request.headers.get('X-Authentication-Token')).toEqual(service.getAuthToken());
+```
+A similar interceptor could be implemented with class based interceptors:
+
+```ts
+@Injectable()
+export class AuthInterceptor implements HttpInterceptor {
+  private authService = inject(AuthService);
+
+  intercept(request: HttpRequest<unknown>, next: HttpHandler): Observable<HttpEvent<unknown>> {
+    const clonedRequest = request.clone({
+      headers: request.headers.append('X-Authentication-Token', this.authService.getAuthToken()),
+    });
+    return next.handle(clonedRequest);
+  }
+}
+```
+In order to test it, the `TestBed` configuration should instead be:
+
+```ts
+TestBed.configureTestingModule({
+  providers: [
+    AuthService,
+    provideHttpClient(withInterceptorsFromDi()),
+    provideHttpClientTesting(),
+    // We rely on the HTTP_INTERCEPTORS token to register the AuthInterceptor as an HttpInterceptor
+    { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true },
+  ],
+});
+```
+
+# Reactive forms
+
+Reactive forms provide a model-driven approach to handling form inputs whose values change over time.
+This guide shows you how to create and update a basic form control, progress to using multiple controls in a group, validate form values, and create dynamic forms where you can add or remove controls at run time.
+
+## Overview of reactive forms
+
+Reactive forms use an explicit and immutable approach to managing the state of a form at a given point in time.
+Each change to the form state returns a new state, which maintains the integrity of the model between changes.
+Reactive forms are built around observable streams, where form inputs and values are provided as streams of input values, which can be accessed synchronously.
+
+Reactive forms also provide a straightforward path to testing because you are assured that your data is consistent and predictable when requested.
+Any consumers of the streams have access to manipulate that data safely.
+
+Reactive forms differ from [template-driven forms](guide/forms/template-driven-forms) in distinct ways.
+Reactive forms provide synchronous access to the data model, immutability with observable operators, and change tracking through observable streams.
+
+Template-driven forms let direct access modify data in your template, but are less explicit than reactive forms because they rely on directives embedded in the template, along with mutable data to track changes asynchronously.
+See the [Forms Overview](guide/forms) for detailed comparisons between the two paradigms.
+
+## Adding a basic form control
+
+There are three steps to using form controls.
+
+1. Generate a new component and register the reactive forms module. This module declares the reactive-form directives that you need to use reactive forms.
+1. Instantiate a new `FormControl`.
+1. Register the `FormControl` in the template.
+
+You can then display the form by adding the component to the template.
+
+The following examples show how to add a single form control.
+In the example, the user enters their name into an input field, captures that input value, and displays the current value of the form control element.
+
+<docs-workflow>
+
+<docs-step title="Generate a new component and import the ReactiveFormsModule">
+Use the CLI command `ng generate component` to generate a component in your project and import `ReactiveFormsModule` from the `@angular/forms` package and add it to your Component's `imports` array.
+
+```
+</docs-step>
+
+<docs-step title="Declare a FormControl instance">
+Use the constructor of `FormControl` to set its initial value, which in this case is an empty string. By creating these controls in your component class, you get immediate access to listen for, update, and validate the state of the form input.
+
+<docs-code header="src/app/name-editor/name-editor.component.ts" path="adev/src/content/examples/reactive-forms/src/app/name-editor/name-editor.component.ts" visibleRegion="create-control"/>
+</docs-step>
+
+<docs-step title="Register the control in the template">
+After you create the control in the component class, you must associate it with a form control element in the template. Update the template with the form control using the `formControl` binding provided by `FormControlDirective`, which is also included in the `ReactiveFormsModule`.
+
+<docs-code header="src/app/name-editor/name-editor.component.html" path="adev/src/content/examples/reactive-forms/src/app/name-editor/name-editor.component.html" visibleRegion="control-binding" />
+
+Using the template binding syntax, the form control is now registered to the `name` input element in the template. The form control and DOM element communicate with each other: the view reflects changes in the model, and the model reflects changes in the view.
+</docs-step>
+
+<docs-step title="Display the component">
+The `FormControl` assigned to the `name` property is displayed when the `<app-name-editor>` component is added to a template.
+
+<docs-code header="src/app/app.component.html (name editor)" path="adev/src/content/examples/reactive-forms/src/app/app.component.1.html" visibleRegion="app-name-editor"/>
+</docs-step>
+</docs-workflow>
+
+### Displaying a form control value
+
+You can display the value in the following ways.
+
+- Through the `valueChanges` observable where you can listen for changes in the form's value in the template using `AsyncPipe` or in the component class using the `subscribe()` method
+- With the `value` property, which gives you a snapshot of the current value
+
+The following example shows you how to display the current value using interpolation in the template.
+
+<docs-code header="src/app/name-editor/name-editor.component.html (control value)" path="adev/src/content/examples/reactive-forms/src/app/name-editor/name-editor.component.html" visibleRegion="display-value"/>
+
+The displayed value changes as you update the form control element.
+
+Reactive forms provide access to information about a given control through properties and methods provided with each instance.
+These properties and methods of the underlying [AbstractControl](api/forms/AbstractControl 'API reference') class are used to control form state and determine when to display messages when handling [input validation](#validating-form-input 'Learn more about validating form input').
+
+Read about other `FormControl` properties and methods in the [API Reference](api/forms/FormControl 'Detailed syntax reference').
+
+### Replacing a form control value
+
+Reactive forms have methods to change a control's value programmatically, which gives you the flexibility to update the value without user interaction.
+A form control instance provides a `setValue()` method that updates the value of the form control and validates the structure of the value provided against the control's structure.
+For example, when retrieving form data from a backend API or service, use the `setValue()` method to update the control to its new value, replacing the old value entirely.
+
+The following example adds a method to the component class to update the value of the control to _Nancy_ using the `setValue()` method.
+
+<docs-code header="src/app/name-editor/name-editor.component.ts (update value)" path="adev/src/content/examples/reactive-forms/src/app/name-editor/name-editor.component.ts" visibleRegion="update-value"/>
+
+Update the template with a button to simulate a name update.
+When you click the **Update Name** button, the value entered in the form control element is reflected as its current value.
+
+<docs-code header="src/app/name-editor/name-editor.component.html (update value)" path="adev/src/content/examples/reactive-forms/src/app/name-editor/name-editor.component.html" visibleRegion="update-value"/>
+
+The form model is the source of truth for the control, so when you click the button, the value of the input is changed within the component class, overriding its current value.
+
+HELPFUL: In this example, you're using a single control.
+When using the `setValue()` method with a [form group](#grouping-form-controls) or [form array](#creating-dynamic-forms) instance, the value needs to match the structure of the group or array.
+
+## Grouping form controls
+
+Forms typically contain several related controls.
+Reactive forms provide two ways of grouping multiple related controls into a single input form.
+
+| Form groups | Details                                                                                                                                                                                                                                                |
+| :---------- | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| Form group  | Defines a form with a fixed set of controls that you can manage together. Form group basics are discussed in this section. You can also [nest form groups](#creating-nested-form-groups 'See more about nesting groups') to create more complex forms. |
+| Form array  | Defines a dynamic form, where you can add and remove controls at run time. You can also nest form arrays to create more complex forms. For more about this option, see [Creating dynamic forms](#creating-dynamic-forms).                              |
+
+Just as a form control instance gives you control over a single input field, a form group instance tracks the form state of a group of form control instances \(for example, a form\).
+Each control in a form group instance is tracked by name when creating the form group.
+The following example shows how to manage multiple form control instances in a single group.
+
+Generate a `ProfileEditor` component and import the `FormGroup` and `FormControl` classes from the `@angular/forms` package.
+
+<docs-code language="shell">
+ng generate component ProfileEditor
+```
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (imports)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.1.ts" visibleRegion="imports"/>
+
+To add a form group to this component, take the following steps.
+
+1. Create a `FormGroup` instance.
+1. Associate the `FormGroup` model and view.
+1. Save the form data.
+
+<docs-workflow>
+
+<docs-step title="Create a FormGroup instance">
+Create a property in the component class named `profileForm` and set the property to a new form group instance. To initialize the form group, provide the constructor with an object of named keys mapped to their control.
+
+For the profile form, add two form control instances with the names `firstName` and `lastName`
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (form group)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.1.ts" visibleRegion="formgroup"/>
+
+The individual form controls are now collected within a group. A `FormGroup` instance provides its model value as an object reduced from the values of each control in the group. A form group instance has the same properties (such as `value` and `untouched`) and methods (such as `setValue()`) as a form control instance.
+</docs-step>
+
+<docs-step title="Associate the FormGroup model and view">
+A form group tracks the status and changes for each of its controls, so if one of the controls changes, the parent control also emits a new status or value change. The model for the group is maintained from its members. After you define the model, you must update the template to reflect the model in the view.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.html (template form group)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.1.html" visibleRegion="formgroup"/>
+
+Just as a form group contains a group of controls, the _profileForm_ `FormGroup` is bound to the `form` element with the `FormGroup` directive, creating a communication layer between the model and the form containing the inputs. The `formControlName` input provided by the `FormControlName` directive binds each individual input to the form control defined in `FormGroup`. The form controls communicate with their respective elements. They also communicate changes to the form group instance, which provides the source of truth for the model value.
+</docs-step>
+
+<docs-step title="Save form data">
+The `ProfileEditor` component accepts input from the user, but in a real scenario you want to capture the form value and make it available for further processing outside the component. The `FormGroup` directive listens for the `submit` event emitted by the `form` element and emits an `ngSubmit` event that you can bind to a callback function. Add an `ngSubmit` event listener to the `form` tag with the `onSubmit()` callback method.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.html (submit event)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.html" visibleRegion="ng-submit"/>
+
+The `onSubmit()` method in the `ProfileEditor` component captures the current value of `profileForm`. Use `EventEmitter` to keep the form encapsulated and to provide the form value outside the component. The following example uses `console.warn` to log a message to the browser console.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (submit method)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.ts" visibleRegion="on-submit"/>
+
+The `submit` event is emitted by the `form` tag using the built-in DOM event. You trigger the event by clicking a button with `submit` type. This lets the user press the **Enter** key to submit the completed form.
+
+Use a `button` element to add a button to the bottom of the form to trigger the form submission.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.html (submit button)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.html" visibleRegion="submit-button"/>
+
+The button in the preceding snippet also has a `disabled` binding attached to it to disable the button when `profileForm` is invalid. You aren't performing any validation yet, so the button is always enabled. Basic form validation is covered in the [Validating form input](#validating-form-input) section.
+</docs-step>
+
+<docs-step title="Display the component">
+To display the `ProfileEditor` component that contains the form, add it to a component template.
+
+<docs-code header="src/app/app.component.html (profile editor)" path="adev/src/content/examples/reactive-forms/src/app/app.component.1.html" visibleRegion="app-profile-editor"/>
+
+`ProfileEditor` lets you manage the form control instances for the `firstName` and `lastName` controls within the form group instance.
+
+### Creating nested form groups
+
+Form groups can accept both individual form control instances and other form group instances as children.
+This makes composing complex form models easier to maintain and logically group together.
+
+When building complex forms, managing the different areas of information is easier in smaller sections.
+Using a nested form group instance lets you break large forms groups into smaller, more manageable ones.
+
+To make more complex forms, use the following steps.
+
+1. Create a nested group.
+1. Group the nested form in the template.
+
+Some types of information naturally fall into the same group.
+A name and address are typical examples of such nested groups, and are used in the following examples.
+
+<docs-workflow>
+<docs-step title="Create a nested group">
+To create a nested group in `profileForm`, add a nested `address` element to the form group instance.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (nested form group)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.1.ts" visibleRegion="nested-formgroup"/>
+
+In this example, `address group` combines the current `firstName` and `lastName` controls with the new `street`, `city`, `state`, and `zip` controls. Even though the `address` element in the form group is a child of the overall `profileForm` element in the form group, the same rules apply with value and status changes. Changes in status and value from the nested form group propagate to the parent form group, maintaining consistency with the overall model.
+</docs-step>
+
+<docs-step title="Group the nested form in the template">
+After you update the model in the component class, update the template to connect the form group instance and its input elements. Add the `address` form group containing the `street`, `city`, `state`, and `zip` fields to the `ProfileEditor` template.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.html (template nested form group)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.1.html" visibleRegion="formgroupname"/>
+
+The `ProfileEditor` form is displayed as one group, but the model is broken down further to represent the logical grouping areas.
+
+Display the value for the form group instance in the component template using the `value` property and `JsonPipe`.
+</docs-step>
+</docs-workflow>
+
+### Updating parts of the data model
+
+When updating the value for a form group instance that contains multiple controls, you might only want to update parts of the model.
+This section covers how to update specific parts of a form control data model.
+
+There are two ways to update the model value:
+
+| Methods        | Details                                                                                                                                                               |
+| :------------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `setValue()`   | Set a new value for an individual control. The `setValue()` method strictly adheres to the structure of the form group and replaces the entire value for the control. |
+| `patchValue()` | Replace any properties defined in the object that have changed in the form model.                                                                                     |
+
+The strict checks of the `setValue()` method help catch nesting errors in complex forms, while `patchValue()` fails silently on those errors.
+
+In `ProfileEditorComponent`, use the `updateProfile` method with the following example to update the first name and street address for the user.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (patch value)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.1.ts" visibleRegion="patch-value"/>
+
+Simulate an update by adding a button to the template to update the user profile on demand.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.html (update value)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.1.html" visibleRegion="patch-value"/>
+
+When a user clicks the button, the `profileForm` model is updated with new values for `firstName` and `street`. Notice that `street` is provided in an object inside the `address` property.
+This is necessary because the `patchValue()` method applies the update against the model structure.
+`PatchValue()` only updates properties that the form model defines.
+
+## Using the FormBuilder service to generate controls
+
+Creating form control instances manually can become repetitive when dealing with multiple forms.
+The `FormBuilder` service provides convenient methods for generating controls.
+
+Use the following steps to take advantage of this service.
+
+1. Import the `FormBuilder` class.
+1. Inject the `FormBuilder` service.
+1. Generate the form contents.
+
+The following examples show how to refactor the `ProfileEditor` component to use the form builder service to create form control and form group instances.
+
+<docs-workflow>
+<docs-step title="Import the FormBuilder class">
+Import the `FormBuilder` class from the `@angular/forms` package.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (import)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.2.ts" visibleRegion="form-builder-imports"/>
+
+</docs-step>
+
+<docs-step title="Inject the FormBuilder service">
+The `FormBuilder` service is an injectable provider from the reactive forms module. Use the `inject()` function to inject this dependency in your component.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (property init)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.2.ts" visibleRegion="inject-form-builder"/>
+
+</docs-step>
+<docs-step title="Generate form controls">
+The `FormBuilder` service has three methods: `control()`, `group()`, and `array()`. These are factory methods for generating instances in your component classes including form controls, form groups, and form arrays. Use the `group` method to create the `profileForm` controls.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (form builder)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.2.ts" visibleRegion="form-builder"/>
+
+In the preceding example, you use the `group()` method with the same object to define the properties in the model. The value for each control name is an array containing the initial value as the first item in the array.
+
+TIP: You can define the control with just the initial value, but if your controls need sync or async validation, add sync and async validators as the second and third items in the array. Compare using the form builder to creating the instances manually.
+</docs-step>
+
+</docs-workflow>
+
+## Validating form input
+
+_Form validation_ is used to ensure that user input is complete and correct.
+This section covers adding a single validator to a form control and displaying the overall form status.
+Form validation is covered more extensively in the [Form Validation](guide/forms/form-validation) guide.
+
+Use the following steps to add form validation.
+
+1. Import a validator function in your form component.
+1. Add the validator to the field in the form.
+1. Add logic to handle the validation status.
+
+The most common validation is making a field required.
+The following example shows how to add a required validation to the `firstName` control and display the result of validation.
+
+<docs-workflow>
+<docs-step title="Import a validator function">
+Reactive forms include a set of validator functions for common use cases. These functions receive a control to validate against and return an error object or a null value based on the validation check.
+
+Import the `Validators` class from the `@angular/forms` package.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (import)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.ts" visibleRegion="validator-imports"/>
+</docs-step>
+
+<docs-step title="Make a field required">
+In the `ProfileEditor` component, add the `Validators.required` static method as the second item in the array for the `firstName` control.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (required validator)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.ts" visibleRegion="required-validator"/>
+</docs-step>
+
+<docs-step title="Display form status">
+When you add a required field to the form control, its initial status is invalid. This invalid status propagates to the parent form group element, making its status invalid. Access the current status of the form group instance through its `status` property.
+
+Display the current status of `profileForm` using interpolation.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.html (display status)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.html" visibleRegion="display-status"/>
+
+The **Submit** button is disabled because `profileForm` is invalid due to the required `firstName` form control. After you fill out the `firstName` input, the form becomes valid and the **Submit** button is enabled.
+
+For more on form validation, visit the [Form Validation](guide/forms/form-validation) guide.
+</docs-step>
+</docs-workflow>
+
+## Creating dynamic forms
+
+`FormArray` is an alternative to `FormGroup` for managing any number of unnamed controls.
+As with form group instances, you can dynamically insert and remove controls from form array instances, and the form array instance value and validation status is calculated from its child controls.
+However, you don't need to define a key for each control by name, so this is a great option if you don't know the number of child values in advance.
+
+To define a dynamic form, take the following steps.
+
+1. Import the `FormArray` class.
+1. Define a `FormArray` control.
+1. Access the `FormArray` control with a getter method.
+1. Display the form array in a template.
+
+The following example shows you how to manage an array of _aliases_ in `ProfileEditor`.
+
+<docs-workflow>
+<docs-step title="Import the `FormArray` class">
+Import the `FormArray` class from `@angular/forms` to use for type information. The `FormBuilder` service is ready to create a `FormArray` instance.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (import)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.2.ts" visibleRegion="form-array-imports"/>
+</docs-step>
+
+<docs-step title="Define a `FormArray` control">
+You can initialize a form array with any number of controls, from zero to many, by defining them in an array. Add an `aliases` property to the form group instance for `profileForm` to define the form array.
+
+Use the `FormBuilder.array()` method to define the array, and the `FormBuilder.control()` method to populate the array with an initial control.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (aliases form array)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.ts" visibleRegion="aliases"/>
+
+The aliases control in the form group instance is now populated with a single control until more controls are added dynamically.
+</docs-step>
+
+<docs-step title="Access the `FormArray` control">
+A getter provides access to the aliases in the form array instance compared to repeating the `profileForm.get()` method to get each instance. The form array instance represents an undefined number of controls in an array. It's convenient to access a control through a getter, and this approach is straightforward to repeat for additional controls. <br />
+
+Use the getter syntax to create an `aliases` class property to retrieve the alias's form array control from the parent form group.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (aliases getter)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.ts" visibleRegion="aliases-getter"/>
+
+Because the returned control is of the type `AbstractControl`, you need to provide an explicit type to access the method syntax for the form array instance. Define a method to dynamically insert an alias control into the alias's form array. The `FormArray.push()` method inserts the control as a new item in the array.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.ts (add alias)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.ts" visibleRegion="add-alias"/>
+
+In the template, each control is displayed as a separate input field.
+
+</docs-step>
+
+<docs-step title="Display the form array in the template">
+
+To attach the aliases from your form model, you must add it to the template. Similar to the `formGroupName` input provided by `FormGroupNameDirective`, `formArrayName` binds communication from the form array instance to the template with `FormArrayNameDirective`.
+
+Add the following template HTML after the `<div>` closing the `formGroupName` element.
+
+<docs-code header="src/app/profile-editor/profile-editor.component.html (aliases form array template)" path="adev/src/content/examples/reactive-forms/src/app/profile-editor/profile-editor.component.html" visibleRegion="formarrayname"/>
+
+The `@for` block iterates over each form control instance provided by the aliases form array instance. Because form array elements are unnamed, you assign the index to the `i` variable and pass it to each control to bind it to the `formControlName` input.
+
+Each time a new alias instance is added, the new form array instance is provided its control based on the index. This lets you track each individual control when calculating the status and value of the root control.
+
+</docs-step>
+
+<docs-step title="Add an alias">
+
+Initially, the form contains one `Alias` field. To add another field, click the **Add Alias** button. You can also validate the array of aliases reported by the form model displayed by `Form Value` at the bottom of the template. Instead of a form control instance for each alias, you can compose another form group instance with additional fields. The process of defining a control for each item is the same.
+</docs-step>
+
+</docs-workflow>
+
+## Reactive forms API summary
+
+The following table lists the base classes and services used to create and manage reactive form controls.
+For complete syntax details, see the API reference documentation for the [Forms package](api#forms 'API reference').
+
+### Classes
+
+| Class             | Details                                                                                                                                                                                 |
+| :---------------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `AbstractControl` | The abstract base class for the concrete form control classes `FormControl`, `FormGroup`, and `FormArray`. It provides their common behaviors and properties.                           |
+| `FormControl`     | Manages the value and validity status of an individual form control. It corresponds to an HTML form control such as `<input>` or `<select>`.                                            |
+| `FormGroup`       | Manages the value and validity state of a group of `AbstractControl` instances. The group's properties include its child controls. The top-level form in your component is `FormGroup`. |
+| `FormArray`       | Manages the value and validity state of a numerically indexed array of `AbstractControl` instances.                                                                                     |
+| `FormBuilder`     | An injectable service that provides factory methods for creating control instances.                                                                                                     |
+| `FormRecord`      | Tracks the value and validity state of a collection of `FormControl` instances, each of which has the same value type.                                                                  |
+
+### Directives
+
+| Directive              | Details                                                                                    |
+| :--------------------- | :----------------------------------------------------------------------------------------- |
+| `FormControlDirective` | Syncs a standalone `FormControl` instance to a form control element.                       |
+| `FormControlName`      | Syncs `FormControl` in an existing `FormGroup` instance to a form control element by name. |
+| `FormGroupDirective`   | Syncs an existing `FormGroup` instance to a DOM element.                                   |
+| `FormGroupName`        | Syncs a nested `FormGroup` instance to a DOM element.                                      |
+| `FormArrayName`        | Syncs a nested `FormArray` instance to a DOM element.                                      |
+# Typed Forms
+
+As of Angular 14, reactive forms are strictly typed by default.
+
+As background for this guide, you should already be familiar with [Angular Reactive Forms](guide/forms/reactive-forms).
+
+## Overview of Typed Forms
+
+<docs-video src="https://www.youtube.com/embed/L-odCf4MfJc" alt="Typed Forms in Angular" />
+
+With Angular reactive forms, you explicitly specify a *form model*. As a simple example, consider this basic user login form:
+
+```ts
+const login = new FormGroup({
+  email: new FormControl(''),
+  password: new FormControl(''),
+});
+```
+
+Angular provides many APIs for interacting with this `FormGroup`. For example, you may call `login.value`, `login.controls`, `login.patchValue`, etc. (For a full API reference, see the [API documentation](api/forms/FormGroup).)
+
+In previous Angular versions, most of these APIs included `any` somewhere in their types, and interacting with the structure of the controls, or the values themselves, was not type-safe. For example: you could write the following invalid code:
+
+```ts
+const emailDomain = login.value.email.domain;
+```
+
+With strictly typed reactive forms, the above code does not compile, because there is no `domain` property on `email`.
+
+In addition to the added safety, the types enable a variety of other improvements, such as better autocomplete in IDEs, and an explicit way to specify form structure.
+
+These improvements currently apply only to *reactive* forms (not [*template-driven* forms](guide/forms/template-driven-forms)).
+
+## Untyped Forms
+
+Non-typed forms are still supported, and will continue to work as before. To use them, you must import the `Untyped` symbols from `@angular/forms`:
+
+```ts
+const login = new UntypedFormGroup({
+  email: new UntypedFormControl(''),
+  password: new UntypedFormControl(''),
+});
+```
+
+Each `Untyped` symbol has exactly the same semantics as in previous Angular version. By removing the `Untyped` prefixes, you can incrementally enable the types.
+
+## `FormControl`: Getting Started
+
+The simplest possible form consists of a single control:
+
+```ts
+const email = new FormControl('angularrox@gmail.com');
+```
+
+This control will be automatically inferred to have the type `FormControl<string|null>`. TypeScript will automatically enforce this type throughout the [`FormControl` API](api/forms/FormControl), such as `email.value`, `email.valueChanges`, `email.setValue(...)`, etc.
+
+### Nullability
+
+You might wonder: why does the type of this control include `null`?  This is because the control can become `null` at any time, by calling reset:
+
+```ts
+const email = new FormControl('angularrox@gmail.com');
+email.reset();
+console.log(email.value); // null
+```
+
+TypeScript will enforce that you always handle the possibility that the control has become `null`. If you want to make this control non-nullable, you may use the `nonNullable` option. This will cause the control to reset to its initial value, instead of `null`:
+
+```ts
+const email = new FormControl('angularrox@gmail.com', {nonNullable: true});
+email.reset();
+console.log(email.value); // angularrox@gmail.com
+```
+
+To reiterate, this option affects the runtime behavior of your form when `.reset()` is called, and should be flipped with care.
+
+### Specifying an Explicit Type
+
+It is possible to specify the type, instead of relying on inference. Consider a control that is initialized to `null`. Because the initial value is `null`, TypeScript will infer `FormControl<null>`, which is narrower than we want.
+
+```ts
+const email = new FormControl(null);
+email.setValue('angularrox@gmail.com'); // Error!
+```
+
+To prevent this, we explicitly specify the type as `string|null`:
+
+```ts
+const email = new FormControl<string|null>(null);
+email.setValue('angularrox@gmail.com');
+```
+
+## `FormArray`: Dynamic, Homogenous Collections
+
+A `FormArray` contains an open-ended list of controls. The type parameter corresponds to the type of each inner control:
+
+```ts
+const names = new FormArray([new FormControl('Alex')]);
+names.push(new FormControl('Jess'));
+```
+
+This `FormArray` will have the inner controls type `FormControl<string|null>`.
+
+If you want to have multiple different element types inside the array, you must use `UntypedFormArray`, because TypeScript cannot infer which element type will occur at which position.
+
+## `FormGroup` and `FormRecord`
+
+Angular provides the `FormGroup` type for forms with an enumerated set of keys, and a type called `FormRecord`, for open-ended or dynamic groups.
+
+### Partial Values
+
+Consider again a login form:
+
+```ts
+const login = new FormGroup({
+    email: new FormControl('', {nonNullable: true}),
+    password: new FormControl('', {nonNullable: true}),
+});
+```
+
+On any `FormGroup`, it is [possible to disable controls](api/forms/FormGroup). Any disabled control will not appear in the group's value.
+
+As a consequence, the type of `login.value` is `Partial<{email: string, password: string}>`. The `Partial` in this type means that each member might be undefined.
+
+More specifically, the type of `login.value.email` is `string|undefined`, and TypeScript will enforce that you handle the possibly `undefined` value (if you have `strictNullChecks` enabled).
+
+If you want to access the value *including* disabled controls, and thus bypass possible `undefined` fields, you can use `login.getRawValue()`.
+
+### Optional Controls and Dynamic Groups
+
+Some forms have controls that may or may not be present, which can be added and removed at runtime. You can represent these controls using *optional fields*:
+
+```ts
+interface LoginForm {
+  email: FormControl<string>;
+  password?: FormControl<string>;
+}
+
+const login = new FormGroup<LoginForm>({
+  email: new FormControl('', {nonNullable: true}),
+  password: new FormControl('', {nonNullable: true}),
+});
+
+login.removeControl('password');
+```
+
+In this form, we explicitly specify the type, which allows us to make the `password` control optional. TypeScript will enforce that only optional controls can be added or removed.
+
+### `FormRecord`
+
+Some `FormGroup` usages do not fit the above pattern because the keys are not known ahead of time. The `FormRecord` class is designed for that case:
+
+```ts
+const addresses = new FormRecord<FormControl<string|null>>({});
+addresses.addControl('Andrew', new FormControl('2340 Folsom St'));
+```
+
+Any control of type `string|null` can be added to this `FormRecord`.
+
+If you need a `FormGroup` that is both dynamic (open-ended) and heterogeneous (the controls are different types), no improved type safety is possible, and you should use `UntypedFormGroup`.
+
+A `FormRecord` can also be built with the `FormBuilder`:
+
+```ts
+const addresses = fb.record({'Andrew': '2340 Folsom St'});
+```
+
+## `FormBuilder` and `NonNullableFormBuilder`
+
+The `FormBuilder` class has been upgraded to support the new types as well, in the same manner as the above examples.
+
+Additionally, an additional builder is available: `NonNullableFormBuilder`. This type is shorthand for specifying `{nonNullable: true}` on every control, and can eliminate significant boilerplate from large non-nullable forms. You can access it using the `nonNullable` property on a `FormBuilder`:
+
+```ts
+const fb = new FormBuilder();
+const login = fb.nonNullable.group({
+  email: '',
+  password: '',
+});
+```
+
+On the above example, both inner controls will be non-nullable (i.e. `nonNullable` will be set).
+
+You can also inject it using the name `NonNullableFormBuilder`.
+# Building a template-driven form
+
+This tutorial shows you how to create a template-driven form. The control elements in the form are bound to data properties that have input validation. The input validation helps maintain data integrity and styling to improve the user experience.
+
+Template-driven forms use [two-way data binding](guide/templates/two-way-binding) to update the data model in the component as changes are made in the template and vice versa.
+Angular supports two design approaches for interactive forms. Template-driven forms allow you to use form-specific directives in your Angular template. Reactive forms provide a model-driven approach to building forms.
+
+Template-driven forms are a great choice for small or simple forms, while reactive forms are more scalable and suitable for complex forms. For a comparison of the two approaches, see [Choosing an approach](guide/forms#choosing-an-approach)
+You can build almost any kind of form with an Angular template —login forms, contact forms, and pretty much any business form.
+You can lay out the controls creatively and bind them to the data in your object model.
+You can specify validation rules and display validation errors, conditionally allow input from specific controls, trigger built-in visual feedback, and much more.
+
+## Objectives
+
+This tutorial teaches you how to do the following:
+
+- Build an Angular form with a component and template
+- Use `ngModel` to create two-way data bindings for reading and writing input-control values
+- Provide visual feedback using special CSS classes that track the state of the controls
+- Display validation errors to users and conditionally allow input from form controls based on the form status
+- Share information across HTML elements using [template reference variables](guide/templates/variables#template-reference-variables)
+
+## Build a template-driven form
+
+Template-driven forms rely on directives defined in the `FormsModule`.
+
+| Directives     | Details                                                                                                                                                                                                                                                                         |
+| :------------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| `NgModel`      | Reconciles value changes in the attached form element with changes in the data model, allowing you to respond to user input with input validation and error handling.                                                                                                           |
+| `NgForm`       | Creates a top-level `FormGroup` instance and binds it to a `<form>` element to track aggregated form value and validation status. As soon as you import `FormsModule`, this directive becomes active by default on all `<form>` tags. You don't need to add a special selector. |
+| `NgModelGroup` | Creates and binds a `FormGroup` instance to a DOM element.                                                                                                                                                                                                                      |
+
+### Step overview
+
+In the course of this tutorial, you bind a sample form to data and handle user input using the following steps.
+
+1. Build the basic form.
+   - Define a sample data model
+   - Include required infrastructure such as the `FormsModule`
+1. Bind form controls to data properties using the `ngModel` directive and two-way data-binding syntax.
+   - Examine how `ngModel` reports control states using CSS classes
+   - Name controls to make them accessible to `ngModel`
+1. Track input validity and control status using `ngModel`.
+   - Add custom CSS to provide visual feedback on the status
+   - Show and hide validation-error messages
+1. Respond to a native HTML button-click event by adding to the model data.
+1. Handle form submission using the [`ngSubmit`](api/forms/NgForm#properties) output property of the form.
+   - Disable the **Submit** button until the form is valid
+   - After submit, swap out the finished form for different content on the page
+
+## Build the form
+
+<!-- TODO: link to preview -->
+<!-- ```
+-->
+
+1. The provided sample application creates the `Actor` class which defines the data model reflected in the form.
+
+<docs-code header="src/app/actor.ts" language="typescript" path="adev/src/content/examples/forms/src/app/actor.ts"/>
+
+1. The form layout and details are defined in the `ActorFormComponent` class.
+
+   <docs-code header="src/app/actor-form/actor-form.component.ts (v1)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.ts" visibleRegion="v1"/>
+
+   The component's `selector` value of "app-actor-form" means you can drop this form in a parent template using the `<app-actor-form>` tag.
+
+1. The following code creates a new actor instance, so that the initial form can show an example actor.
+
+   <docs-code language="typescript" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.ts" language="typescript" visibleRegion="Marilyn"/>
+
+   This demo uses dummy data for `model` and `skills`.
+   In a real app, you would inject a data service to get and save real data, or expose these properties as inputs and outputs.
+
+1. The component enables the Forms feature by importing the `FormsModule` module.
+
+   <docs-code language="typescript" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.ts" language="typescript" visibleRegion="imports"/>
+
+1. The form is displayed in the application layout defined by the root component's template.
+
+   <docs-code header="src/app/app.component.html" language="html" path="adev/src/content/examples/forms/src/app/app.component.html"/>
+
+   The initial template defines the layout for a form with two form groups and a submit button.
+   The form groups correspond to two properties of the Actor data model, name and studio.
+   Each group has a label and a box for user input.
+
+   - The **Name** `<input>` control element has the HTML5 `required` attribute
+   - The **Studio** `<input>` control element does not because `studio` is optional
+
+   The **Submit** button has some classes on it for styling.
+   At this point, the form layout is all plain HTML5, with no bindings or directives.
+
+1. The sample form uses some style classes from [Twitter Bootstrap](https://getbootstrap.com/css): `container`, `form-group`, `form-control`, and `btn`.
+   To use these styles, the application's style sheet imports the library.
+
+<docs-code header="src/styles.css" path="adev/src/content/examples/forms/src/styles.1.css"/>
+
+1. The form requires that an actor's skill is chosen from a predefined list of `skills` maintained internally in `ActorFormComponent`.
+   The Angular `@for` loop iterates over the data values to populate the `<select>` element.
+
+<docs-code header="src/app/actor-form/actor-form.component.html (skills)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.html" visibleRegion="skills"/>
+
+If you run the application right now, you see the list of skills in the selection control.
+The input elements are not yet bound to data values or events, so they are still blank and have no behavior.
+
+## Bind input controls to data properties
+
+The next step is to bind the input controls to the corresponding `Actor` properties with two-way data binding, so that they respond to user input by updating the data model, and also respond to programmatic changes in the data by updating the display.
+
+The `ngModel` directive declared in the `FormsModule` lets you bind controls in your template-driven form to properties in your data model.
+When you include the directive using the syntax for two-way data binding, `[(ngModel)]`, Angular can track the value and user interaction of the control and keep the view synced with the model.
+
+1. Edit the template file `actor-form.component.html`.
+1. Find the `<input>` tag next to the **Name** label.
+1. Add the `ngModel` directive, using two-way data binding syntax `[(ngModel)]="..."`.
+
+<docs-code header="src/app/actor-form/actor-form.component.html (excerpt)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.html" visibleRegion="ngModelName-1"/>
+
+HELPFUL: This example has a temporary diagnostic interpolation after each input tag, `{{model.name}}`, to show the current data value of the corresponding property. The comment reminds you to remove the diagnostic lines when you have finished observing the two-way data binding at work.
+
+### Access the overall form status
+
+When you imported the `FormsModule` in your component, Angular automatically created and attached an [NgForm](api/forms/NgForm) directive to the `<form>` tag in the template (because `NgForm` has the selector `form` that matches `<form>` elements).
+
+To get access to the `NgForm` and the overall form status, declare a [template reference variable](guide/templates/variables#template-reference-variables).
+
+1. Edit the template file `actor-form.component.html`.
+1. Update the `<form>` tag with a template reference variable, `#actorForm`, and set its value as follows.
+
+   <docs-code header="src/app/actor-form/actor-form.component.html (excerpt)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.html" visibleRegion="template-variable"/>
+
+   The `actorForm` template variable is now a reference to the `NgForm` directive instance that governs the form as a whole.
+
+1. Run the app.
+1. Start typing in the **Name** input box.
+
+   As you add and delete characters, you can see them appear and disappear from the data model.
+
+The diagnostic line that shows interpolated values demonstrates that values are really flowing from the input box to the model and back again.
+
+### Naming control elements
+
+When you use `[(ngModel)]` on an element, you must define a `name` attribute for that element.
+Angular uses the assigned name to register the element with the `NgForm` directive attached to the parent `<form>` element.
+
+The example added a `name` attribute to the `<input>` element and set it to "name", which makes sense for the actor's name.
+Any unique value will do, but using a descriptive name is helpful.
+
+1. Add similar `[(ngModel)]` bindings and `name` attributes to **Studio** and **Skill**.
+1. You can now remove the diagnostic messages that show interpolated values.
+1. To confirm that two-way data binding works for the entire actor model, add a new text binding with the [`json`](api/common/JsonPipe) pipe at the top to the component's template, which serializes the data to a string.
+
+After these revisions, the form template should look like the following:
+
+<docs-code header="src/app/actor-form/actor-form.component.html (excerpt)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.html" visibleRegion="ngModel-2"/>
+
+You'll notice that:
+
+- Each `<input>` element has an `id` property.
+  This is used by the `<label>` element's `for` attribute to match the label to its input control.
+  This is a [standard HTML feature](https://developer.mozilla.org/docs/Web/HTML/Element/label).
+
+- Each `<input>` element also has the required `name` property that Angular uses to register the control with the form.
+
+When you have observed the effects, you can delete the `{{ model | json }}` text binding.
+
+## Track form states
+
+Angular applies the `ng-submitted` class to `form` elements after the form has been submitted. This class can be used to change the form's style after it has been submitted.
+
+## Track control states
+
+Adding the `NgModel` directive to a control adds class names to the control that describe its state.
+These classes can be used to change a control's style based on its state.
+
+The following table describes the class names that Angular applies based on the control's state.
+
+| States                           | Class if true | Class if false |
+| :------------------------------- | :------------ | :------------- |
+| The control has been visited.    | `ng-touched`  | `ng-untouched` |
+| The control's value has changed. | `ng-dirty`    | `ng-pristine`  |
+| The control's value is valid.    | `ng-valid`    | `ng-invalid`   |
+
+Angular also applies the `ng-submitted` class to `form` elements upon submission,
+but not to the controls inside the `form` element.
+
+You use these CSS classes to define the styles for your control based on its status.
+
+### Observe control states
+
+To see how the classes are added and removed by the framework, open the browser's developer tools and inspect the `<input>` element that represents the actor name.
+
+1. Using your browser's developer tools, find the `<input>` element that corresponds to the **Name** input box.
+   You can see that the element has multiple CSS classes in addition to "form-control".
+
+1. When you first bring it up, the classes indicate that it has a valid value, that the value has not been changed since initialization or reset, and that the control has not been visited since initialization or reset.
+
+   <docs-code language="html">
+
+   <input class="form-control ng-untouched ng-pristine ng-valid">;
+```
+1. Take the following actions on the **Name** `<input>` box, and observe which classes appear.
+
+   - Look but don't touch.
+     The classes indicate that it is untouched, pristine, and valid.
+
+   - Click inside the name box, then click outside it.
+     The control has now been visited, and the element has the `ng-touched` class instead of the `ng-untouched` class.
+
+   - Add slashes to the end of the name.
+     It is now touched and dirty.
+
+   - Erase the name.
+     This makes the value invalid, so the `ng-invalid` class replaces the `ng-valid` class.
+
+### Create visual feedback for states
+
+The `ng-valid`/`ng-invalid` pair is particularly interesting, because you want to send a
+strong visual signal when the values are invalid.
+You also want to mark required fields.
+
+You can mark required fields and invalid data at the same time with a colored bar
+on the left of the input box.
+
+To change the appearance in this way, take the following steps.
+
+1. Add definitions for the `ng-*` CSS classes.
+1. Add these class definitions to a new `forms.css` file.
+1. Add the new file to the project as a sibling to `index.html`:
+
+<docs-code header="src/assets/forms.css" language="css" path="adev/src/content/examples/forms/src/assets/forms.css"/>
+
+1. In the `index.html` file, update the `<head>` tag to include the new style sheet.
+
+<docs-code header="src/index.html (styles)" path="adev/src/content/examples/forms/src/index.html" visibleRegion="styles"/>
+
+### Show and hide validation error messages
+
+The **Name** input box is required and clearing it turns the bar red.
+That indicates that something is wrong, but the user doesn't know what is wrong or what to do about it.
+You can provide a helpful message by checking for and responding to the control's state.
+
+The **Skill** select box is also required, but it doesn't need this kind of error handling because the selection box already constrains the selection to valid values.
+
+To define and show an error message when appropriate, take the following steps.
+
+<docs-workflow>
+<docs-step title="Add a local reference to the input">
+Extend the `input` tag with a template reference variable that you can use to access the input box's Angular control from within the template. In the example, the variable is `#name="ngModel"`.
+
+The template reference variable (`#name`) is set to `"ngModel"` because that is the value of the [`NgModel.exportAs`](api/core/Directive#exportAs) property. This property tells Angular how to link a reference variable to a directive.
+</docs-step>
+
+<docs-step title="Add the error message">
+Add a `<div>` that contains a suitable error message.
+</docs-step>
+
+<docs-step title="Make the error message conditional">
+Show or hide the error message by binding properties of the `name` control to the message `<div>` element's `hidden` property.
+</docs-step>
+
+<docs-code header="src/app/actor-form/actor-form.component.html (hidden-error-msg)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.html" visibleRegion="hidden-error-msg"/>
+
+<docs-step title="Add a conditional error message to name">
+Add a conditional error message to the `name` input box, as in the following example.
+
+<docs-code header="src/app/actor-form/actor-form.component.html (excerpt)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.html" visibleRegion="name-with-error-msg"/>
+</docs-step>
+</docs-workflow>
+In this example, you hide the message when the control is either valid or _pristine_.
+Pristine means the user hasn't changed the value since it was displayed in this form.
+If you ignore the `pristine` state, you would hide the message only when the value is valid.
+If you arrive in this component with a new, blank actor or an invalid actor, you'll see the error message immediately, before you've done anything.
+
+You might want the message to display only when the user makes an invalid change.
+Hiding the message while the control is in the `pristine` state achieves that goal.
+You'll see the significance of this choice when you add a new actor to the form in the next step.
+## Add a new actor
+
+This exercise shows how you can respond to a native HTML button-click event by adding to the model data.
+To let form users add a new actor, you will add a **New Actor** button that responds to a click event.
+
+1. In the template, place a "New Actor" `<button>` element at the bottom of the form.
+1. In the component file, add the actor-creation method to the actor data model.
+
+<docs-code header="src/app/actor-form/actor-form.component.ts (New Actor method)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.ts" visibleRegion="new-actor"/>
+
+1. Bind the button's click event to an actor-creation method, `newActor()`.
+
+<docs-code header="src/app/actor-form/actor-form.component.html (New Actor button)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.html" visibleRegion="new-actor-button-no-reset"/>
+
+1. Run the application again and click the **New Actor** button.
+
+   The form clears, and the _required_ bars to the left of the input box are red, indicating invalid `name` and `skill` properties.
+   Notice that the error messages are hidden.
+   This is because the form is pristine; you haven't changed anything yet.
+
+1. Enter a name and click **New Actor** again.
+
+   Now the application displays a `Name is required` error message, because the input box is no longer pristine.
+   The form remembers that you entered a name before clicking **New Actor**.
+
+1. To restore the pristine state of the form controls, clear all of the flags imperatively by calling the form's `reset()` method after calling the `newActor()` method.
+
+   <docs-code header="src/app/actor-form/actor-form.component.html (Reset the form)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.html" visibleRegion="new-actor-button-form-reset"/>
+
+   Now clicking **New Actor** resets both the form and its control flags.
+
+## Submit the form with `ngSubmit`
+
+The user should be able to submit this form after filling it in.
+The **Submit** button at the bottom of the form does nothing on its own, but it does trigger a form-submit event because of its type (`type="submit"`).
+
+To respond to this event, take the following steps.
+
+<docs-workflow>
+
+<docs-step title="Listen to ngOnSubmit">
+Bind the form's [`ngSubmit`](api/forms/NgForm#properties) event property to the actor-form component's `onSubmit()` method.
+
+<docs-code header="src/app/actor-form/actor-form.component.html (ngSubmit)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.html" visibleRegion="ngSubmit"/>
+</docs-step>
+
+<docs-step title="Bind the disabled property">
+Use the template reference variable, `#actorForm` to access the form that contains the **Submit** button and create an event binding.
+
+You will bind the form property that indicates its overall validity to the **Submit** button's `disabled` property.
+
+<docs-code header="src/app/actor-form/actor-form.component.html (submit-button)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.html" visibleRegion="submit-button"/>
+</docs-step>
+
+<docs-step title="Run the application">
+Notice that the button is enabled —although it doesn't do anything useful yet.
+</docs-step>
+
+<docs-step title="Delete the Name value">
+This violates the "required" rule, so it displays the error message —and notice that it also disables the **Submit** button.
+
+You didn't have to explicitly wire the button's enabled state to the form's validity.
+The `FormsModule` did this automatically when you defined a template reference variable on the enhanced form element, then referred to that variable in the button control.
+</docs-step>
+</docs-workflow>
+
+### Respond to form submission
+
+To show a response to form submission, you can hide the data entry area and display something else in its place.
+
+<docs-workflow>
+<docs-step title="Wrap the form">
+Wrap the entire form in a `<div>` and bind its `hidden` property to the `ActorFormComponent.submitted` property.
+
+<docs-code header="src/app/actor-form/actor-form.component.html (excerpt)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.html" visibleRegion="edit-div"/>
+
+The main form is visible from the start because the `submitted` property is false until you submit the form, as this fragment from the `ActorFormComponent` shows:
+
+<docs-code header="src/app/actor-form/actor-form.component.ts (submitted)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.ts" visibleRegion="submitted"/>
+
+When you click the **Submit** button, the `submitted` flag becomes true and the form disappears.
+</docs-step>
+
+<docs-step title="Add the submitted state">
+To show something else while the form is in the submitted state, add the following HTML below the new `<div>` wrapper.
+
+<docs-code header="src/app/actor-form/actor-form.component.html (excerpt)" path="adev/src/content/examples/forms/src/app/actor-form/actor-form.component.html" visibleRegion="submitted"/>
+
+This `<div>`, which shows a read-only actor with interpolation bindings, appears only while the component is in the submitted state.
+
+The alternative display includes an _Edit_ button whose click event is bound to an expression that clears the `submitted` flag.
+</docs-step>
+
+<docs-step title="Test the Edit button">
+Click the *Edit* button to switch the display back to the editable form.
+</docs-step>
+</docs-workflow>
+
+## Summary
+
+The Angular form discussed in this page takes advantage of the following
+framework features to provide support for data modification, validation, and more.
+
+- An Angular HTML form template
+- A form component class with a `@Component` decorator
+- Handling form submission by binding to the `NgForm.ngSubmit` event property
+- Template-reference variables such as `#actorForm` and `#name`
+- `[(ngModel)]` syntax for two-way data binding
+- The use of `name` attributes for validation and form-element change tracking
+- The reference variable's `valid` property on input controls indicates whether a control is valid or should show error messages
+- Controlling the **Submit** button's enabled state by binding to `NgForm` validity
+- Custom CSS classes that provide visual feedback to users about controls that are not valid
+
+Here's the code for the final version of the application:
+# Validating form input
+
+You can improve overall data quality by validating user input for accuracy and completeness.
+This page shows how to validate user input from the UI and display useful validation messages, in both reactive and template-driven forms.
+
+## Validating input in template-driven forms
+
+To add validation to a template-driven form, you add the same validation attributes as you would with [native HTML form validation](https://developer.mozilla.org/docs/Web/Guide/HTML/HTML5/Constraint_validation).
+Angular uses directives to match these attributes with validator functions in the framework.
+
+Every time the value of a form control changes, Angular runs validation and generates either a list of validation errors that results in an `INVALID` status, or null, which results in a VALID status.
+
+You can then inspect the control's state by exporting `ngModel` to a local template variable.
+The following example exports `NgModel` into a variable called `name`:
+
+```
+Notice the following features illustrated by the example.
+
+* The `<input>` element carries the HTML validation attributes: `required` and `minlength`.
+    It also carries a custom validator directive, `forbiddenName`.
+    For more information, see the [Custom validators](#defining-custom-validators) section.
+
+* `#name="ngModel"` exports `NgModel` into a local variable called `name`.
+    `NgModel` mirrors many of the properties of its underlying `FormControl` instance, so you can use this in the template to check for control states such as `valid` and `dirty`.
+    For a full list of control properties, see the [AbstractControl](api/forms/AbstractControl) API reference.
+
+  * The outermost `@if` reveals a set of nested messages but only if the `name` is invalid and the control is either `dirty` or `touched`.
+
+  * Each nested `@if` can present a custom message for one of the possible validation errors.
+        There are messages for `required`, `minlength`, and `forbiddenName`.
+
+HELPFUL: To prevent the validator from displaying errors before the user has a chance to edit the form, you should check for either the `dirty` or `touched` states in a control.
+
+* When the user changes the value in the watched field, the control is marked as "dirty"
+* When the user blurs the form control element, the control is marked as "touched"
+
+## Validating input in reactive forms
+
+In a reactive form, the source of truth is the component class.
+Instead of adding validators through attributes in the template, you add validator functions directly to the form control model in the component class.
+Angular then calls these functions whenever the value of the control changes.
+
+### Validator functions
+
+Validator functions can be either synchronous or asynchronous.
+
+| Validator type   | Details |
+|:---              |:---     |
+| Sync validators  | Synchronous functions that take a control instance and immediately return either a set of validation errors or `null`. Pass these in as the second argument when you instantiate a `FormControl`.                       |
+| Async validators | Asynchronous functions that take a control instance and return a Promise or Observable that later emits a set of validation errors or `null`. Pass these in as the third argument when you instantiate a `FormControl`. |
+
+For performance reasons, Angular only runs async validators if all sync validators pass.
+Each must complete before errors are set.
+
+### Built-in validator functions
+
+You can choose to [write your own validator functions](#defining-custom-validators), or you can use some of Angular's built-in validators.
+
+The same built-in validators that are available as attributes in template-driven forms, such as `required` and `minlength`, are all available to use as functions from the `Validators` class.
+For a full list of built-in validators, see the [Validators](api/forms/Validators) API reference.
+
+To update the actor form to be a reactive form, use some of the same
+built-in validators —this time, in function form, as in the following example.
+
+<docs-code header="reactive/actor-form-reactive.component.ts (validator functions)" path="adev/src/content/examples/form-validation/src/app/reactive/actor-form-reactive.component.1.ts" visibleRegion="form-group"/>
+
+In this example, the `name` control sets up two built-in validators —`Validators.required` and `Validators.minLength(4)`— and one custom validator, `forbiddenNameValidator`.
+
+All of these validators are synchronous, so they are passed as the second argument.
+Notice that you can support multiple validators by passing the functions in as an array.
+
+This example also adds a few getter methods.
+In a reactive form, you can always access any form control through the `get` method on its parent group, but sometimes it's useful to define getters as shorthand for the template.
+
+If you look at the template for the `name` input again, it is fairly similar to the template-driven example.
+
+<docs-code header="reactive/actor-form-reactive.component.html (name with error msg)" path="adev/src/content/examples/form-validation/src/app/reactive/actor-form-reactive.component.html" visibleRegion="name-with-error-msg"/>
+
+This form differs from the template-driven version in that it no longer exports any directives. Instead, it uses the `name` getter defined in  the component class.
+
+Notice that the `required` attribute is still present in the template. Although it's not necessary for validation, it should be retained for accessibility purposes.
+
+## Defining custom validators
+
+The built-in validators don't always match the exact use case of your application, so you sometimes need to create a custom validator.
+
+Consider the `forbiddenNameValidator` function from the previous example.
+Here's what the definition of that function looks like.
+
+<docs-code header="shared/forbidden-name.directive.ts (forbiddenNameValidator)" path="adev/src/content/examples/form-validation/src/app/shared/forbidden-name.directive.ts" visibleRegion="custom-validator"/>
+
+The function is a factory that takes a regular expression to detect a *specific* forbidden name and returns a validator function.
+
+In this sample, the forbidden name is "bob", so the validator rejects any actor name containing "bob".
+Elsewhere it could reject "alice" or any name that the configuring regular expression matches.
+
+The `forbiddenNameValidator` factory returns the configured validator function.
+That function takes an Angular control object and returns *either* null if the control value is valid *or* a validation error object.
+The validation error object typically has a property whose name is the validation key, `'forbiddenName'`, and whose value is an arbitrary dictionary of values that you could insert into an error message, `{name}`.
+
+Custom async validators are similar to sync validators, but they must instead return a Promise or observable that later emits null or a validation error object.
+In the case of an observable, the observable must complete, at which point the form uses the last value emitted for validation.
+
+### Adding custom validators to reactive forms
+
+In reactive forms, add a custom validator by passing the function directly to the `FormControl`.
+
+<docs-code header="reactive/actor-form-reactive.component.ts (validator functions)" path="adev/src/content/examples/form-validation/src/app/reactive/actor-form-reactive.component.1.ts" visibleRegion="custom-validator"/>
+
+### Adding custom validators to template-driven forms
+
+In template-driven forms, add a directive to the template, where the directive wraps the validator function.
+For example, the corresponding `ForbiddenValidatorDirective` serves as a wrapper around the `forbiddenNameValidator`.
+
+Angular recognizes the directive's role in the validation process because the directive registers itself with the `NG_VALIDATORS` provider, as shown in the following example.
+`NG_VALIDATORS` is a predefined provider with an extensible collection of validators.
+
+<docs-code header="shared/forbidden-name.directive.ts (providers)" path="adev/src/content/examples/form-validation/src/app/shared/forbidden-name.directive.ts" visibleRegion="directive-providers"/>
+
+The directive class then implements the `Validator` interface, so that it can easily integrate with Angular forms.
+Here is the rest of the directive to help you get an idea of how it all comes together.
+
+<docs-code header="shared/forbidden-name.directive.ts (directive)" path="adev/src/content/examples/form-validation/src/app/shared/forbidden-name.directive.ts" visibleRegion="directive"/>
+
+Once the `ForbiddenValidatorDirective` is ready, you can add its selector, `appForbiddenName`, to any input element to activate it.
+For example:
+
+<docs-code header="template/actor-form-template.component.html (forbidden-name-input)" path="adev/src/content/examples/form-validation/src/app/template/actor-form-template.component.html" visibleRegion="name-input"/>
+
+HELPFUL: Notice that the custom validation directive is instantiated with `useExisting` rather than `useClass`.
+The registered validator must be *this instance* of the `ForbiddenValidatorDirective` —the instance in the form with its `forbiddenName` property bound to "bob".
+
+If you were to replace `useExisting` with `useClass`, then you'd be registering a new class instance, one that doesn't have a `forbiddenName`.
+
+## Control status CSS classes
+
+Angular automatically mirrors many control properties onto the form control element as CSS classes.
+Use these classes to style form control elements according to the state of the form.
+The following classes are currently supported.
+
+* `.ng-valid`
+* `.ng-invalid`
+* `.ng-pending`
+* `.ng-pristine`
+* `.ng-dirty`
+* `.ng-untouched`
+* `.ng-touched`
+* `.ng-submitted` \(enclosing form element only\)
+
+In the following example, the actor form uses the `.ng-valid` and `.ng-invalid` classes to
+set the color of each form control's border.
+
+<docs-code header="forms.css (status classes)" path="adev/src/content/examples/form-validation/src/assets/forms.css"/>
+
+## Cross-field validation
+
+A cross-field validator is a [custom validator](#defining-custom-validators "Read about custom validators") that compares the values of different fields in a form and accepts or rejects them in combination.
+For example, you might have a form that offers mutually incompatible options, so that if the user can choose A or B, but not both.
+Some field values might also depend on others; a user might be allowed to choose B only if A is also chosen.
+
+The following cross validation examples show how to do the following:
+
+* Validate reactive or template-based form input based on the values of two sibling controls,
+* Show a descriptive error message after the user interacted with the form and the validation failed.
+
+The examples use cross-validation to ensure that actors do not reuse the same name in their role by filling out the Actor Form.
+The validators do this by checking that the actor names and roles do not match.
+
+### Adding cross-validation to reactive forms
+
+The form has the following structure:
+
+<docs-code language="javascript">
+
+const actorForm = new FormGroup({
+  'name': new FormControl(),
+  'role': new FormControl(),
+  'skill': new FormControl()
+});
+```
+Notice that the `name` and `role` are sibling controls.
+To evaluate both controls in a single custom validator, you must perform the validation in a common ancestor control: the `FormGroup`.
+You query the `FormGroup` for its child controls so that you can compare their values.
+
+To add a validator to the `FormGroup`, pass the new validator in as the second argument on creation.
+
+```javascript
+const actorForm = new FormGroup({
+  'name': new FormControl(),
+  'role': new FormControl(),
+  'skill': new FormControl()
+}, { validators: unambiguousRoleValidator });
+```
+The validator code is as follows.
+
+```
+The `unambiguousRoleValidator` validator implements the `ValidatorFn` interface.
+It takes an Angular control object as an argument and returns either null if the form is valid, or `ValidationErrors` otherwise.
+
+The validator retrieves the child controls by calling the `FormGroup`'s [get](api/forms/AbstractControl#get) method, then compares the values of the `name` and `role` controls.
+
+If the values do not match, the role is unambiguous, both are valid, and the validator returns null.
+If they do match, the actor's role is ambiguous and the validator must mark the form as invalid by returning an error object.
+
+To provide better user experience, the template shows an appropriate error message when the form is invalid.
+
+<docs-code header="reactive/actor-form-template.component.html" path="adev/src/content/examples/form-validation/src/app/reactive/actor-form-reactive.component.html" visibleRegion="cross-validation-error-message"/>
+
+This `@if` displays the error if the `FormGroup` has the cross validation error returned by the `unambiguousRoleValidator` validator, but only if the user finished [interacting with the form](#control-status-css-classes).
+
+### Adding cross-validation to template-driven forms
+
+For a template-driven form, you must create a directive to wrap the validator function.
+You provide that directive as the validator using the [`NG_VALIDATORS` token](/api/forms/NG_VALIDATORS), as shown in the following example.
+
+<docs-code header="shared/unambiguous-role.directive.ts" path="adev/src/content/examples/form-validation/src/app/shared/unambiguous-role.directive.ts" visibleRegion="cross-validation-directive"/>
+
+You must add the new directive to the HTML template.
+Because the validator must be registered at the highest level in the form, the following template puts the directive on the `form` tag.
+
+<docs-code header="template/actor-form-template.component.html" path="adev/src/content/examples/form-validation/src/app/template/actor-form-template.component.html" visibleRegion="cross-validation-register-validator"/>
+
+To provide better user experience, an appropriate error message appears when the form is invalid.
+
+<docs-code header="template/actor-form-template.component.html" path="adev/src/content/examples/form-validation/src/app/template/actor-form-template.component.html" visibleRegion="cross-validation-error-message"/>
+
+This is the same in both template-driven and reactive forms.
+
+## Creating asynchronous validators
+
+Asynchronous validators implement the `AsyncValidatorFn` and `AsyncValidator` interfaces.
+These are very similar to their synchronous counterparts, with the following differences.
+
+* The `validate()` functions must return a Promise or an observable,
+* The observable returned must be finite, meaning it must complete at some point.
+    To convert an infinite observable into a finite one, pipe the observable through a filtering operator such as `first`, `last`, `take`, or `takeUntil`.
+
+Asynchronous validation happens after the synchronous validation, and is performed only if the synchronous validation is successful.
+This check lets forms avoid potentially expensive async validation processes \(such as an HTTP request\) if the more basic validation methods have already found invalid input.
+
+After asynchronous validation begins, the form control enters a `pending` state.
+Inspect the control's `pending` property and use it to give visual feedback about the ongoing validation operation.
+
+A common UI pattern is to show a spinner while the async validation is being performed.
+The following example shows how to achieve this in a template-driven form.
+
+<docs-code language="html">
+
+<input [(ngModel)]="name" #model="ngModel" appSomeAsyncValidator>
+@if(model.pending) {
+  <app-spinner />
+}
+```
+### Implementing a custom async validator
+
+In the following example, an async validator ensures that actors are cast for a role that is not already taken.
+New actors are constantly auditioning and old actors are retiring, so the list of available roles cannot be retrieved ahead of time.
+To validate the potential role entry, the validator must initiate an asynchronous operation to consult a central database of all currently cast actors.
+
+The following code creates the validator class, `UniqueRoleValidator`, which implements the `AsyncValidator` interface.
+
+```
+The `actorsService` property is initialized with an instance of the `ActorsService` token, which defines the following interface.
+
+<docs-code language="typescript">
+interface ActorsService {
+  isRoleTaken: (role: string) => Observable<boolean>;
+}
+```
+In a real world application, the `ActorsService` would be responsible for making an HTTP request to the actor database to check if the role is available.
+From the validator's point of view, the actual implementation of the service is not important, so the example can just code against the `ActorsService` interface.
+
+As the validation begins, the `UnambiguousRoleValidator` delegates to the `ActorsService` `isRoleTaken()` method with the current control value.
+At this point the control is marked as `pending` and remains in this state until the observable chain returned from the `validate()` method completes.
+
+The `isRoleTaken()` method dispatches an HTTP request that checks if the role is available, and returns `Observable<boolean>` as the result.
+The `validate()` method pipes the response through the `map` operator and transforms it into a validation result.
+
+The method then, like any validator, returns `null` if the form is valid, and `ValidationErrors` if it is not.
+This validator handles any potential errors with the `catchError` operator.
+In this case, the validator treats the `isRoleTaken()` error as a successful validation, because failure to make a validation request does not necessarily mean that the role is invalid.
+You could handle the error differently and return the `ValidationError` object instead.
+
+After some time passes, the observable chain completes and the asynchronous validation is done.
+The `pending` flag is set to `false`, and the form validity is updated.
+
+### Adding async validators to reactive forms
+
+To use an async validator in reactive forms, begin by injecting the validator into a property of the component class.
+
+```
+Then, pass the validator function directly to the `FormControl` to apply it.
+
+In the following example, the `validate` function of `UnambiguousRoleValidator` is applied to `roleControl` by passing it to the control's `asyncValidators` option and binding it to the instance of `UnambiguousRoleValidator` that was injected into `ActorFormReactiveComponent`.
+The value of `asyncValidators` can be either a single async validator function, or an array of functions.
+To learn more about `FormControl` options, see the [AbstractControlOptions](api/forms/AbstractControlOptions) API reference.
+
+<docs-code path="adev/src/content/examples/form-validation/src/app/reactive/actor-form-reactive.component.2.ts" visibleRegion="async-validator-usage"/>
+
+### Adding async validators to template-driven forms
+
+To use an async validator in template-driven forms, create a new directive and register the `NG_ASYNC_VALIDATORS` provider on it.
+
+In the example below, the directive injects the `UniqueRoleValidator` class that contains the actual validation logic and invokes it in the `validate` function, triggered by Angular when validation should happen.
+
+<docs-code path="adev/src/content/examples/form-validation/src/app/shared/role.directive.ts" visibleRegion="async-validator-directive"/>
+
+Then, as with synchronous validators, add the directive's selector to an input to activate it.
+
+<docs-code header="template/actor-form-template.component.html (unique-unambiguous-role-input)" path="adev/src/content/examples/form-validation/src/app/template/actor-form-template.component.html" visibleRegion="role-input"/>
+
+### Optimizing performance of async validators
+
+By default, all validators run after every form value change.
+With synchronous validators, this does not normally have a noticeable impact on application performance.
+Async validators, however, commonly perform some kind of HTTP request to validate the control.
+Dispatching an HTTP request after every keystroke could put a strain on the backend API, and should be avoided if possible.
+
+You can delay updating the form validity by changing the `updateOn` property from `change` (default) to `submit` or `blur`.
+
+With template-driven forms, set the property in the template.
+
+<docs-code language="html">
+<input [(ngModel)]="name" [ngModelOptions]="{updateOn: 'blur'}">
+```
+With reactive forms, set the property in the `FormControl` instance.
+
+```typescript
+new FormControl('', {updateOn: 'blur'});
+```
+## Interaction with native HTML form validation
+
+By default, Angular disables [native HTML form validation](https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation) by adding the `novalidate` attribute on the enclosing `<form>` and uses directives to match these attributes with validator functions in the framework.
+If you want to use native validation **in combination** with Angular-based validation, you can re-enable it with the `ngNativeValidate` directive.
+See the [API docs](api/forms/NgForm#native-dom-validation-ui) for details.
+# Building dynamic forms
+
+Many forms, such as questionnaires, can be very similar to one another in format and intent.
+To make it faster and easier to generate different versions of such a form, you can create a _dynamic form template_ based on metadata that describes the business object model.
+Then, use the template to generate new forms automatically, according to changes in the data model.
+
+The technique is particularly useful when you have a type of form whose content must change frequently to meet rapidly changing business and regulatory requirements.
+A typical use-case is a questionnaire.
+You might need to get input from users in different contexts.
+The format and style of the forms a user sees should remain constant, while the actual questions you need to ask vary with the context.
+
+In this tutorial you will build a dynamic form that presents a basic questionnaire.
+You build an online application for heroes seeking employment.
+The agency is constantly tinkering with the application process, but by using the dynamic form
+you can create the new forms on the fly without changing the application code.
+
+The tutorial walks you through the following steps.
+
+1. Enable reactive forms for a project.
+1. Establish a data model to represent form controls.
+1. Populate the model with sample data.
+1. Develop a component to create form controls dynamically.
+
+The form you create uses input validation and styling to improve the user experience.
+It has a Submit button that is only enabled when all user input is valid, and flags invalid input with color coding and error messages.
+
+The basic version can evolve to support a richer variety of questions, more graceful rendering, and superior user experience.
+
+## Enable reactive forms for your project
+
+Dynamic forms are based on reactive forms.
+
+To give the application access reactive forms directives, import `ReactiveFormsModule` from the `@angular/forms` library into the necessary components.
+## Create a form object model
+
+A dynamic form requires an object model that can describe all scenarios needed by the form functionality.
+The example hero-application form is a set of questions — that is, each control in the form must ask a question and accept an answer.
+
+The data model for this type of form must represent a question.
+The example includes the `DynamicFormQuestionComponent`, which defines a question as the fundamental object in the model.
+
+The following `QuestionBase` is a base class for a set of controls that can represent the question and its answer in the form.
+
+<docs-code header="src/app/question-base.ts" path="adev/src/content/examples/dynamic-form/src/app/question-base.ts"/>
+
+### Define control classes
+
+From this base, the example derives two new classes, `TextboxQuestion` and `DropdownQuestion`, that represent different control types.
+When you create the form template in the next step, you instantiate these specific question types in order to render the appropriate controls dynamically.
+
+The `TextboxQuestion` control type is represented in a form template using an `<input>` element. It presents a question and lets users enter input. The `type` attribute of the element is defined based on the `type` field specified in the `options` argument (for example `text`, `email`, `url`).
+
+<docs-code header="question-textbox.ts" path="adev/src/content/examples/dynamic-form/src/app/question-textbox.ts"/>
+
+The `DropdownQuestion` control type presents a list of choices in a select box.
+
+ <docs-code header="question-dropdown.ts" path="adev/src/content/examples/dynamic-form/src/app/question-dropdown.ts"/>
+
+### Compose form groups
+
+A dynamic form uses a service to create grouped sets of input controls, based on the form model.
+The following `QuestionControlService` collects a set of `FormGroup` instances that consume the metadata from the question model.
+You can specify default values and validation rules.
+
+<docs-code header="src/app/question-control.service.ts" path="adev/src/content/examples/dynamic-form/src/app/question-control.service.ts"/>
+
+## Compose dynamic form contents
+
+The dynamic form itself is represented by a container component, which you add in a later step.
+Each question is represented in the form component's template by an `<app-question>` tag, which matches an instance of `DynamicFormQuestionComponent`.
+
+The `DynamicFormQuestionComponent` is responsible for rendering the details of an individual question based on values in the data-bound question object.
+The form relies on a [`[formGroup]` directive](api/forms/FormGroupDirective "API reference") to connect the template HTML to the underlying control objects.
+The `DynamicFormQuestionComponent` creates form groups and populates them with controls defined in the question model, specifying display and validation rules.
+The goal of the `DynamicFormQuestionComponent` is to present question types defined in your model.
+You only have two types of questions at this point but you can imagine many more.
+The `@switch` block in the template determines which type of question to display.
+The switch uses directives with the [`formControlName`](api/forms/FormControlName "FormControlName directive API reference") and [`formGroup`](api/forms/FormGroupDirective "FormGroupDirective API reference") selectors.
+Both directives are defined in `ReactiveFormsModule`.
+
+### Supply data
+
+Another service is needed to supply a specific set of questions from which to build an individual form.
+For this exercise you create the `QuestionService` to supply this array of questions from the hard-coded sample data.
+In a real-world app, the service might fetch data from a backend system.
+The key point, however, is that you control the hero job-application questions entirely through the objects returned from `QuestionService`.
+To maintain the questionnaire as requirements change, you only need to add, update, and remove objects from the `questions` array.
+
+The `QuestionService` supplies a set of questions in the form of an array bound to `input()` questions.
+
+<docs-code header="src/app/question.service.ts" path="adev/src/content/examples/dynamic-form/src/app/question.service.ts"/>
+
+## Create a dynamic form template
+
+The `DynamicFormComponent` component is the entry point and the main container for the form, which is represented using the `<app-dynamic-form>` in a template.
+
+The `DynamicFormComponent` component presents a list of questions by binding each one to an `<app-question>` element that matches the `DynamicFormQuestionComponent`.
+### Display the form
+
+To display an instance of the dynamic form, the `AppComponent` shell template passes the `questions` array returned by the `QuestionService` to the form container component, `<app-dynamic-form>`.
+
+<docs-code header="app.component.ts" path="adev/src/content/examples/dynamic-form/src/app/app.component.ts"/>
+
+This separation of model and data lets you repurpose the components for any type of survey, as long as it's compatible with the _question_ object model.
+
+### Ensuring valid data
+
+The form template uses dynamic data binding of metadata to render the form without making any hardcoded assumptions about specific questions.
+It adds both control metadata and validation criteria dynamically.
+
+To ensure valid input, the _Save_ button is disabled until the form is in a valid state.
+When the form is valid, click _Save_ and the application renders the current form values as JSON.
+
+The following figure shows the final form.
+
+<img alt="Dynamic-Form" src="assets/images/guide/dynamic-form/dynamic-form.png">
+
+## Next steps
+Angular Router (`@angular/router`) is the official library for managing navigation in Angular applications and a core part of the framework. It is included by default in all projects created by Angular CLI.
+
+## Installation
+
+Angular Router is included by default in all Angular projects setup with the Angular CLI `ng new` command.
+
+### Prerequisite
+
+- Angular CLI
+
+### Add to an existing project
+
+If your project does not include Angular Router, you can install it manually with the following command:
+
+```bash
+ng add @angular/router
+```
+
+The Angular CLI will then install all the necessary dependencies.
+
+## Why is routing necessary in a SPA?
+
+When you navigate to a URL in your web browser, the browser normally makes a network request to a web server and displays the returned HTML page. When you navigate to a different URL, such as clicking a link, the browser makes another network request and replaces the entire page with a new one.
+
+A single-page application (SPA) differs in that the browser only makes a request to a web server for the first page, the `index.html`. After that, a client-side router takes over, controlling which content displays based on the URL. When a user navigates to a different URL, the router updates the page's content in place without triggering a full-page reload.
+
+## How Angular manages routing
+
+Routing in Angular is comprised of three primary parts:
+
+1. **Routes** define which component displays when a user visits a specific URL.
+2. **Outlets** are placeholders in your templates that dynamically load and render components based on the active route.
+3. **Links** provide a way for users to navigate between different routes in your application without triggering a full page reload.
+
+In addition, the Angular Routing library offers additional functionality such as:
+
+- Nested routes
+- Programmatic navigation
+- Route params, queries and wildcards
+- Activated route information with `ActivatedRoute`
+- View transition effects
+- Navigation guards
+
+## Next steps
+
+Learn about how you can [define routes using Angular router](/guide/routing/define-routes).
+# Define routes
+
+Routes serve as the fundamental building blocks for navigation within an Angular app.
+
+## What are routes?
+
+In Angular, a **route** is an object that defines which component should render for a specific URL path or pattern, as well as additional configuration options about what happens when a user navigates to that URL.
+
+Here is a basic example of a route:
+
+```typescript
+import { AdminPage } from './app-admin/app-admin.component';
+
+const adminPage = {
+  path: 'admin',
+  component: AdminPage
+}
+```
+
+For this route, when a user visits the `/admin` path, the app will display the `AdminPage` component.
+
+### Managing routes in your application
+
+Most projects define routes in a separate file that contains `routes` in the filename.
+
+A collection of routes looks like this:
+
+```typescript
+import { Routes } from '@angular/router';
+import { HomePage } from './home-page/home-page.component';
+import { AdminPage } from './about-page/admin-page.component';
+
+export const routes: Routes = [
+  {
+    path: '',
+    component: HomePage,
+  },
+  {
+    path: 'admin',
+    component: AdminPage,
+  },
+];
+```
+
+Tip: If you generated a project with Angular CLI, your routes are defined in `src/app/app.routes.ts`.
+
+### Adding the router to your application
+
+When bootstrapping an Angular application without the Angular CLI, you can pass a configuration object that includes a `providers` array.
+
+Inside of the `providers` array, you can add the Angular router to your application by adding a `provideRouter` function call with your routes.
+
+```typescript
+import { ApplicationConfig } from '@angular/core';
+import { provideRouter } from '@angular/router';
+
+import { routes } from './app.routes';
+
+export const appConfig: ApplicationConfig = {
+  providers: [
+    provideRouter(routes),
+    // ...
+  ]
+};
+```
+
+## Route URL Paths
+
+### Static URL Paths
+
+Static URL Paths refer to routes with predefined paths that don't change based on dynamic parameters. These are routes that match a `path` string exactly and have a fixed outcome.
+
+Examples of this include:
+
+- "/admin"
+- "/blog"
+- "/settings/account"
+
+### Define URL Paths with Route Parameters
+
+Parameterized URLs allow you to define dynamic paths that allow multiple URLs to the same component while dynamically displaying data based on parameters in the URL.
+
+You can define this type of pattern by adding parameters to your route’s `path` string and prefixing each parameter with the colon (`:`) character.
+
+IMPORTANT: Parameters are distinct from information in the URL's [query string](https://en.wikipedia.org/wiki/Query_string).
+Learn more about [query parameters in Angular in this guide](/guide/routing/read-route-state#query-parameters).
+
+The following example displays a user profile component based on the user id passed in through the URL.
+
+```typescript
+import { Routes } from '@angular/router';
+import { UserProfile } from './user-profile/user-profile;
+
+const routes: Routes = [
+  { path: 'user/:id', component: UserProfile }
+];
+```
+
+In this example, URLs such as `/user/leeroy` and `/user/jenkins` render the `UserProfile` component. This component can then read the `id` parameter and use it to perform additional work, such as fetching data. See [reading route state guide](/guide/routing/read-route-state) for details on reading route parameters.
+
+Valid route parameter names must start with a letter (a-z, A-Z) and can only contain:
+
+- Letters (a-z, A-Z)
+- Numbers (0-9)
+- Underscore (\_)
+- Hyphen (-)
+
+You can also define paths with multiple parameters:
+
+```typescript
+import { Routes } from '@angular/router';
+import { UserProfile } from './user-profile/user-profile.component';
+import { SocialMediaFeed } from './user-profile/social–media-feed.component';
+
+const routes: Routes = [
+  { path: 'user/:id/:social-media', component: SocialMediaFeed },
+  { path: 'user/:id/', component: UserProfile },
+];
+```
+
+With this new path, users can visit `/user/leeroy/youtube` and `/user/leeroy/bluesky` and see respective social media feeds based on the parameter for the user leeroy.
+
+See [Reading route state](/guide/routing/read-route-state) for details on reading route parameters.
+
+### Wildcards
+
+When you need to catch all routes for a specific path, the solution is a wildcard route which is defined with the double asterisk (`**`).
+
+A common example is defining a Page Not Found component.
+
+```typescript
+import { Home } from './home/home.component';
+import { UserProfile } from './user-profile/user-profile.component';
+import { NotFound } from './not-found/not-found.component';
+
+const routes: Routes = [
+  { path: 'home', component: Home },
+  { path: 'user/:id', component: UserProfile },
+  { path: '**', component: NotFound }
+];
+```
+
+In this routes array, the app displays the `NotFound` component when the user visits any path outside of `home` and `user/:id`.
+
+Tip: Wildcard routes are typically placed at the end of a routes array.
+
+## How Angular matches URLs
+
+When you define routes, the order is important because Angular uses a first-match wins strategy. This means that once Angular matches a URL with a route `path`, it stops checking any further routes. As a result, always put more specific routes before less specific routes.
+
+The following example shows routes defined from most-specific to least specific:
+
+```typescript
+const routes: Routes = [
+  { path: '', component: HomeComponent },              // Empty path
+  { path: 'users/new', component: NewUserComponent },  // Static, most specific
+  { path: 'users/:id', component: UserDetailComponent }, // Dynamic
+  { path: 'users', component: UsersComponent },        // Static, less specific
+  { path: '**', component: NotFoundComponent }         // Wildcard - always last
+];
+```
+
+If a user visits `/users/new`, Angular router would go through the following steps:
+
+1. Checks `''` - doesn't match
+1. Checks `users/new` - matches! Stops here
+1. Never reaches `users/:id` even though it could match
+1. Never reaches `users`
+1. Never reaches `**`
+
+## Loading Route Component Strategies
+
+Understanding how and when components load in Angular routing is crucial for building responsive web applications. Angular offers two primary strategies to control component loading behavior:
+
+1. **Eagerly loaded**: Components that are loaded immediately
+2. **Lazily loaded**: Components loaded only when needed
+
+Each approach offers distinct advantages for different scenarios.
+
+### Eagerly loaded components
+
+When you define a route with the `component` property, the referenced component is eagerly loaded as part of the same JavaScript bundle as the route configuration.
+
+```typescript
+import { Routes } from "@angular/router";
+import { HomePage } from "./components/home/home-page"
+import { LoginPage } from "./components/auth/login-page"
+
+export const routes: Routes = [
+  // HomePage and LoginPage are both directly referenced in this config,
+  // so their code is eagerly included in the same JavaScript bundle as this file.
+  {
+    path: "",
+    component: HomePage
+  },
+  {
+    path: "login",
+    component: LoginPage
+  }
+]
+```
+
+Eagerly loading route components like this means that the browser has to download and parse all of the JavaScript for these components as part of your initial page load, but the components are available to Angular immediately.
+
+While including more JavaScript in your initial page load leads to slower initial load times, this can lead to more seamless transitions as the user navigates through an application.
+
+### Lazily loaded components
+
+You can use the `loadComponent` property to lazily load the JavaScript for a route only at the point at which that route would become active.
+
+```typescript
+import { Routes } from "@angular/router";
+
+export const routes: Routes = [
+  // The HomePage and LoginPage components are loaded lazily at the point at which
+  // their corresponding routes become active.
+  {
+    path: 'login',
+    loadComponent: () => import('./components/auth/login-page').then(m => m.LoginPage)
+  },
+  {
+    path: '',
+    loadComponent: () => import('./components/home/home-page').then(m => m.HomePage)
+  }
+]
+```
+
+The `loadComponent` property accepts a loader function that returns a Promise that resolves to an Angular component. In most cases, this function uses the standard [JavaScript dynamic import API](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import). You can, however, use any arbitrary async loader function.
+
+Lazily loading routes can significantly improve the load speed of your Angular application by removing large portions of JavaScript from the initial bundle. These portions of your code compile into separate JavaScript "chunks" that the router requests only when the user visits the corresponding route.
+
+### Should I use an eager or a lazy route?
+
+There are many factors to consider when deciding on whether a route should be eager or lazy.
+
+In general, eager loading is recommended for primary landing page(s) while other pages would be lazy-loaded.
+
+Note: While lazy routes have the upfront performance benefit of reducing the amount of initial data requested by the user, it adds future data requests that could be undesirable. This is particularly true when dealing with nested lazy loading at multiple levels, which can significantly impact performance.
+
+## Redirects
+
+You can define a route that redirects to another route instead of rendering a component:
+
+```typescript
+import { BlogComponent } from './home/blog.component';
+
+const routes: Routes = [
+  {
+    path: 'articles',
+    redirectTo: '/blog',
+  },
+  {
+    path: 'blog',
+    component: BlogComponent
+  },
+];
+```
+
+If you modify or remove a route, some users may still click on out-of-date links or bookmarks to that route. You can add a redirect to direct those users to an appropriate alternative route instead of a "not found" page.
+
+## Page titles
+
+You can associate a **title** with each route. Angular automatically updates the [page title](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/title) when a route activates. Always define appropriate page titles for your application, as these titles are necessary to create an accessible experience.
+
+```ts
+import { Routes } from '@angular/router';
+import { HomeComponent } from './home/home.component';
+import { AboutComponent } from './about/about.component';
+import { ProductsComponent } from './products/products.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: HomeComponent,
+    title: 'Home Page'
+  },
+  {
+    path: 'about',
+    component: AboutComponent,
+    title: 'About Us'
+  },
+];
+```
+
+The page `title` property can be set dynamincally to a resolver function using [`ResolveFn`](/api/router/ResolveFn).
+
+```ts
+const titleResolver: ResolveFn<string> = (route) => route.queryParams['id'];
+const routes: Routes = [
+   ...
+  {
+    path: 'products',
+    component: ProductsComponent,
+    title: titleResolver,
+  }
+];
+
+```
+
+Route titles can also be set via a service extending the [`TitleStrategy`](/api/router/TitleStrategy) abstract class. By default, Angular uses the [`DefaultTitleStrategy`](/api/router/DefaultTitleStrategy).
+
+## Route-level providers for dependency injection
+
+Each route has a `providers` property that lets you provide dependencies to that route's content via [dependency injection](/guide/di).
+
+Common scenarios where this can be helpful include applications that have different services based on whether the user is an admin or not.
+
+```typescript
+export const ROUTES: Route[] = [
+  {
+    path: 'admin',
+    providers: [
+      AdminService,
+      {provide: ADMIN_API_KEY, useValue: '12345'},
+    ],
+    children: [
+      {path: 'users', component: AdminUsersComponent},
+      {path: 'teams', component: AdminTeamsComponent},
+    ],
+  },
+  // ... other application routes that don't
+  //     have access to ADMIN_API_KEY or AdminService.
+];
+```
+
+In this code sample, the `admin` path contains a protected data property of `ADMIN_API_KEY` that is only available to children within its section. As a result, no other paths will be able to access the data provided via `ADMIN_API_KEY`.
+
+See the [Dependency injection guide](/guide/di) for more information about providers and injection in Angular.
+
+## Associating data with routes
+
+Route data enables you to attach additional information to routes. You are able to configure how components behave based on this data.
+
+There are two ways to work with route data: static data that remains constant, and dynamic data that can change based on runtime conditions.
+
+### Static data
+
+You can associate arbitrary static data with a route via the `data` property in order to centralize things like route-specific metadata (e.g., analytics tracking, permissions, etc.):
+
+```typescript
+import { Routes } from '@angular/router';
+import { HomeComponent } from './home/home.component';
+import { AboutComponent } from './about/about.component';
+import { ProductsComponent } from './products/products.component';
+
+const routes: Routes = [
+  {
+    path: 'about',
+    component: AboutComponent,
+    data: { analyticsId: '456' }
+  },
+  {
+    path: '',
+    component: HomeComponent,
+    data: { analyticsId: '123' }
+  }
+];
+```
+
+In this code sample, the home and about page are configured with specific `analyticsId` which would then be used in their respective components for page tracking analytics.
+
+You can read this static data by injecting the `ActivatedRoute`. See [Reading route state](/guide/routing/read-route-state) for details.
+
+### Dynamic data with data resolvers
+
+When you need to provide dynamic data to a route, check out the [guide on route data resolvers](/guide/routing/data-resolvers).
+
+## Nested Routes
+
+Nested routes, also known as child routes, are a common technique for managing more complex navigation routes where a component has a sub-view that changes based on the URL.
+
+<img alt="Diagram to illustrate nested routes" src="assets/images/guide/router/nested-routing-diagram.svg">
+
+You can add child routes to any route definition with the `children` property:
+
+```typescript
+const routes: Routes = [
+  {
+    path: 'product/:id',
+    component: ProductComponent,
+    children: [
+      {
+        path: 'info',
+        component: ProductInfoComponent
+      },
+      {
+        path: 'reviews',
+        component: ProductReviewsComponent
+      }
+    ]
+  }
+]
+```
+
+The above example defines a route for a product page that allows a user to change whether the product info or reviews are displayed based on the url.
+
+The `children` property accepts an array of `Route` objects.
+
+To display child routes, the parent component (`ProductComponent` in the example above) includes its own `<router-outlet>`.
+
+```html
+<!-- ProductComponent -->
+<article>
+  <h1>Product {{ id }}</h1>
+  <router-outlet />
+</article>
+```
+
+After adding child routes to the configuration and adding a `<router-outlet>` to the component, navigation between URLs that match the child routes updates only the nested outlet.
+
+## Next steps
+
+Learn how to [display the contents of your routes with Outlets](/guide/routing/show-routes-with-outlets).
+# Show routes with outlets
+
+The `RouterOutlet` directive is a placeholder that marks the location where the router should render the component for the current URL.
+
+```html
+<app-header />
+<router-outlet />  <!-- Angular inserts your route content here -->
+<app-footer />
+```
+
+```typescript
+import { Component } from '@angular/core';
+import { RouterOutlet } from '@angular/router';
+
+@Component({
+  selector: 'app-root',
+  imports: [RouterOutlet],
+  templateUrl: './app.component.html',
+  styleUrl: './app.component.css'
+})
+export class AppComponent {}
+```
+
+In this example, if an application has the following routes defined:
+
+```typescript
+import { Routes } from '@angular/router';
+import { HomeComponent } from './home/home.component';
+import { ProductsComponent } from './products/products.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: HomeComponent,
+    title: 'Home Page'
+  },
+  {
+    path: 'products',
+    component: ProductsComponent,
+    title: 'Our Products'
+  }
+];
+```
+
+When a user visits `/products`, Angular renders the following:
+
+```html
+<app-header />
+<app-products />
+<app-footer />
+```
+
+If the user goes back to the home page, then Angular renders:
+
+```html
+<app-header />
+<app-home />
+<app-footer />
+```
+
+When displaying a route, the `<router-outlet>` element remains present in the DOM as a reference point for future navigations. Angular inserts routed content just after the outlet element as a sibling.
+
+```html
+<!-- Contents of the component's template -->
+<app-header />
+<router-outlet />
+<app-footer />
+```
+
+```html
+<!-- Content rendered on the page when the user visits /admin -->
+<app-header>...</app-header>
+<router-outlet></router-outlet>
+<app-admin-page>...</app-admin-page>
+<app-footer>...</app-footer>
+```
+
+## Nesting routes with child routes
+
+As your application grows more complex, you might want to create routes that are relative to a component other than your root component. This enables you to create experiences where only part of the application changes when the URL changes, as opposed to the users feeling like the entire page is refreshed.
+
+These types of nested routes are called child routes. This means you're adding a second `<router-outlet>` to your app, because it is in addition to the `<router-outlet>` in AppComponent.
+
+In this example, the `Settings` component will display the desired panel based on what the user selects. One of the unique things you’ll notice about child routes is that the component often has its own `<nav>` and `<router-outlet>`.
+
+```html
+<h1>Settings</h1>
+<nav>
+  <ul>
+    <li><a routerLink="profile">Profile</a></li>
+    <li><a routerLink="security">Security</a></li>
+  </ul>
+</nav>
+<router-outlet />
+```
+
+A child route is like any other route, in that it needs both a `path` and a `component`. The one difference is that you place child routes in a children array within the parent route.
+
+```typescript
+const routes: Routes = [
+  {
+    path: 'settings-component',
+    component: SettingsComponent, // this is the component with the <router-outlet> in the template
+    children: [
+      {
+        path: 'profile', // child route path
+        component: ProfileComponent, // child route component that the router renders
+      },
+      {
+        path: 'security',
+        component: SecurityComponent, // another child route component that the router renders
+      },
+    ],
+  },
+];
+```
+
+Once both the `routes` and `<router-outlet>` are configured correctly, your application is now using nested routes!
+
+## Secondary routes with named outlets
+
+Pages may have multiple outlets— you can assign a name to each outlet to specify which content belongs to which outlet.
+
+```html
+<app-header />
+<router-outlet />
+<router-outlet name='read-more' />
+<router-outlet name='additional-actions' />
+<app-footer />
+```
+
+Each outlet must have a unique name. The name cannot be set or changed dynamically. By default, the name is `'primary'`.
+
+Angular matches the outlet's name to the `outlet` property defined on each route:
+
+```typescript
+{
+  path: 'user/:id',
+  component: UserDetails,
+  outlet: 'additional-actions'
+}
+```
+
+## Outlet lifecycle events
+
+There are four lifecycle events that a router outlet can emit:
+
+| Event        | Description                                                              |
+| ------------ | ------------------------------------------------------------------------ |
+| `activate`   | When a new component is instantiated                                     |
+| `deactivate` | When a component is destroyed                                            |
+| `attach`     | When the `RouteReuseStrategy` instructs the outlet to attach the subtree |
+| `detach`     | When the `RouteReuseStrategy` instructs the outlet to detach the subtree |
+
+You can add event listeners with the standard event binding syntax:
+
+```html
+<router-outlet
+  (activate)='onActivate($event)'
+  (deactivate)='onDeactivate($event)'
+  (attach)='onAttach($event)'
+  (detach)='onDetach($event)'
+/>
+```
+
+Check out the [API docs for RouterOutlet](/api/router/RouterOutlet?tab=api) if you’d like to learn more.
+
+## Next steps
+
+Learn how to [navigate to routes](/guide/routing/navigate-to-routes) with Angular Router.
+# Navigate to routes
+
+The RouterLink directive is Angular's declarative approach to navigation. It allows you to use standard anchor elements (`<a>`) that seamlessly integrate with Angular's routing system.
+
+## How to use RouterLink
+
+Instead of using regular anchor elements `<a>` with an `href` attribute, you add a RouterLink directive with the appropriate path in order to leverage Angular routing.
+```typescript
+import {RouterLink} from '@angular/router';
+@Component({
+  template: `
+    <nav>
+      <a routerLink="/user-profile">User profile</a>
+      <a routerLink="/settings">Settings</a>
+    </nav>
+  `
+  imports: [RouterLink],
+  ...
+})
+export class App {}
+```
+
+### Using absolute or relative links
+
+**Relative URLs** in Angular routing allow you to define navigation paths relative to the current route's location. This is in contrast to **absolute URLs** which contain the full path with the protocol (e.g., `http://`) and the **root domain** (e.g., `google.com`).
+
+```html
+<!-- Absolute URL -->
+<a href="https://www.angular.dev/essentials">Angular Essentials Guide</a>
+
+<!-- Relative URL -->
+<a href="/essentials">Angular Essentials Guide</a>
+```
+
+In this example, the first example contains the full path with the protocol (i.e., `https://`) and the root domain (i.e., `angular.dev`) explicitly defined for the essentials page. In contrast, the second example assumes the user is already on the correct root domain for `/essentials`.
+
+Generally speaking, relative URLs are preferred because they are more maintainable across applications because they don’t need to know their absolute position within the routing hierarchy.
+
+### How relative URLs work
+
+Angular routing has two syntaxes for defining relative URLs: strings and arrays.
+
+```html
+<!-- Navigates user to /dashboard -->
+<a routerLink="dashboard">Dashboard</a>
+<a [routerLink]="['dashboard']">Dashboard</a>
+```
+
+HELPFUL: Passing a string is the most common way to define relative URLs.
+
+When you need to define dynamic parameters in a relative URL, use the array syntax:
+
+```html
+<a [routerLink]="['user', currentUserId]">Current User</a>
+```
+
+In addition, Angular routing allows you specify whether you want the path to be relative to the current URL or to the root domain based on whether the relative path is prefixed with a forward slash (`/`) or not.
+
+For example, if the user is on `example.com/settings`, here is how different relative paths can be defined for various scenarios:
+
+```html
+<!-- Navigates to /settings/notifications -->
+<a routerLink="notifications">Notifications</a>
+<a routerLink="/settings/notifications">Notifications</a>
+
+<!-- Navigates to /team/:teamId/user/:userId -->
+<a routerLink="/team/123/user/456">User 456</a>
+<a [routerLink]="['/team', teamId, 'user', userId]">Current User</a>”
+```
+
+## Programmatic navigation to routes
+
+While `RouterLink` handles declarative navigation in templates, Angular provides programmatic navigation for scenarios where you need to navigate based on logic, user actions, or application state. By injecting `Router`, you can dynamically navigate to routes, pass parameters, and control navigation behavior in your TypeScript code.
+
+### `router.navigate()`
+
+You can use the `router.navigate()` method to programmatically navigate between routes by specifying a URL path array.
+
+```typescript
+import { Router } from '@angular/router';
+
+@Component({
+  selector: 'app-dashboard',
+  template: `
+    <button (click)="navigateToProfile()">View Profile</button>
+  `
+})
+export class AppDashboard {
+  private router = inject(Router);
+
+  navigateToProfile() {
+    // Standard navigation
+    this.router.navigate(['/profile']);
+
+    // With route parameters
+    this.router.navigate(['/users', userId]);
+
+    // With query parameters
+    this.router.navigate(['/search'], {
+      queryParams: { category: 'books', sort: 'price' }
+    });
+  }
+}
+```
+
+`router.navigate()` supports both simple and complex routing scenarios, allowing you to pass route parameters, [query parameters](/guide/routing/read-route-state#query-parameters), and control navigation behavior.
+
+You can also build dynamic navigation paths relative to your component’s location in the routing tree using the `relativeTo` option.
+
+```typescript
+import { Router, ActivatedRoute } from '@angular/router';
+
+@Component({
+  selector: 'app-user-detail',
+  template: `
+    <button (click)="navigateToEdit()">Edit User</button>
+    <button (click)="navigateToParent()">Back to List</button>
+  `
+})
+export class UserDetailComponent {
+  private route = inject(ActivatedRoute);
+  private router = inject(Router);
+
+  constructor() {}
+
+  // Navigate to a sibling route
+  navigateToEdit() {
+    // From: /users/123
+    // To:   /users/123/edit
+    this.router.navigate(['edit'], { relativeTo: this.route });
+  }
+
+  // Navigate to parent
+  navigateToParent() {
+    // From: /users/123
+    // To:   /users
+    this.router.navigate(['..'], { relativeTo: this.route });
+  }
+}
+```
+
+### `router.navigateByUrl()`
+
+The `router.navigateByUrl()` method provides a direct way to programmatically navigate using URL path strings rather than array segments. This method is ideal when you have a full URL path and need to perform absolute navigation, especially when working with externally provided URLs or deep linking scenarios.
+
+```typescript
+// Standard route navigation
+router.navigateByUrl('/products);
+
+// Navigate to nested route
+router.navigateByUrl('/products/featured');
+
+// Complete URL with parameters and fragment
+router.navigateByUrl('/products/123?view=details#reviews');
+
+// Navigate with query parameters
+router.navigateByUrl('/search?category=books&sortBy=price');
+```
+
+In the event you need to replace the current URL in history, `navigateByUrl` also accepts a configuration object that has a `replaceUrl` option.
+
+```typescript
+// Replace current URL in history
+router.navigateByUrl('/checkout', {
+  replaceUrl: true
+});
+```
+
+## Next steps
+
+Learn how to [read route state](/guide/routing/read-route-state) to create responsive and context-aware components.
+# Read route state
+
+Angular Router allows you to read and use information associated with a route to create responsive and context-aware components.
+
+## Get information about the current route with ActivatedRoute
+
+`ActivatedRoute` is a service from `@angular/router` that provides all the information associated with the current route.
+
+```typescript
+import { Component } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+
+@Component({
+  selector: 'app-product',
+})
+export class ProductComponent {
+  private activatedRoute = inject(ActivatedRoute);
+
+  constructor() {
+    console.log(this.activatedRoute);
+  }
+}
+```
+
+The `ActivatedRoute` can provide different information about the route. Some common properties include:
+
+| Property      | Details                                                                                                                           |
+| :------------ | :-------------------------------------------------------------------------------------------------------------------------------- |
+| `url`         | An `Observable` of the route paths, represented as an array of strings for each part of the route path.                           |
+| `data`        | An `Observable` that contains the `data` object provided for the route. Also contains any resolved values from the resolve guard. |
+| `params`      | An `Observable` that contains the required and optional parameters specific to the route.                                         |
+| `queryParams` | An `Observable` that contains the query parameters available to all routes.                                                       |
+
+Check out the [`ActivatedRoute` API docs](/api/router/ActivatedRoute) for a complete list of what you can access with in the route.
+
+## Understanding route snapshots
+
+Page navigations are events over time, and you can access the router state at a given time by retrieving a route snapshot.
+
+Route snapshots contain essential information about the route, including its parameters, data, and child routes. In addition, snapshots are static and will not reflect future changes.
+
+Here’s an example of how you’d access a route snapshot:
+
+```typescript
+import { ActivatedRoute, ActivatedRouteSnapshot } from '@angular/router';
+
+@Component({ ... })
+export class UserProfileComponent {
+  readonly userId: string;
+  private route = inject(ActivatedRoute);
+
+  constructor() {
+    // Example URL: https://www.angular.dev/users/123?role=admin&status=active#contact
+
+    // Access route parameters from snapshot
+    this.userId = this.route.snapshot.paramMap.get('id');
+
+    // Access multiple route elements
+    const snapshot = this.route.snapshot;
+    console.log({
+      url: snapshot.url,           // https://www.angular.dev
+      // Route parameters object: {id: '123'}
+      params: snapshot.params,
+      // Query parameters object: {role: 'admin', status: 'active'}
+      queryParams: snapshot.queryParams,  // Query parameters
+    });
+  }
+}
+```
+
+Check out the [`ActivatedRoute` API docs](/api/router/ActivatedRoute) and [`ActivatedRouteSnapshot` API docs](/api/router/ActivatedRouteSnapshot) for a complete list of all properties you can access.
+
+## Reading parameters on a route
+
+There are two types of parameters that developers can utilize from a route: route and query parameters.
+
+### Route Parameters
+
+Route parameters allow you to pass data to a component through the URL. This is useful when you want to display specific content based on an identifier in the URL, like a user ID or a product ID.
+
+You can [define route parameters](/guide/routing/define-routes#define-url-paths-with-route-parameters) by prefixing the parameter name with a colon (`:`).
+
+```typescript
+import { Routes } from '@angular/router';
+import { ProductComponent } from './product/product.component';
+
+const routes: Routes = [
+  { path: 'product/:id', component: ProductComponent }
+];
+```
+
+You can access parameters by subscribing to `route.params`.
+
+```typescript
+import { Component, inject, signal } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+
+@Component({
+  selector: 'app-product-detail',
+  template: `<h1>Product Details: {{ productId() }}</h1>`,
+})
+export class ProductDetailComponent {
+  productId = signal('');
+  private activatedRoute = inject(ActivatedRoute);
+
+  constructor() {
+    // Access route parameters
+    this.activatedRoute.params.subscribe((params) => {
+      this.productId.set(params['id']);
+    });
+  }
+}
+```
+
+### Query Parameters
+
+[Query parameters](https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams) provide a flexible way to pass optional data through URLs without affecting the route structure. Unlike route parameters, query parameters can persist across navigation events and are perfect for handling filtering, sorting, pagination, and other stateful UI elements.
+
+```typescript
+// Single parameter structure
+// /products?category=electronics
+router.navigate(['/products'], {
+  queryParams: { category: 'electronics' }
+});
+
+// Multiple parameters
+// /products?category=electronics&sort=price&page=1
+router.navigate(['/products'], {
+  queryParams: {
+    category: 'electronics',
+    sort: 'price',
+    page: 1
+  }
+});
+```
+
+You can access query parameters with `route.queryParams`.
+
+Here is an example of a `ProductListComponent` that updates the query parameters that affect how it displays a list of products:
+
+```typescript
+import { ActivatedRoute, Router } from '@angular/router';
+
+@Component({
+  selector: 'app-product-list',
+  template: `
+    <div>
+      <select (change)="updateSort($event)">
+        <option value="price">Price</option>
+        <option value="name">Name</option>
+      </select>
+      <!-- Products list -->
+    </div>
+  `
+})
+export class ProductListComponent implements OnInit {
+  private route = inject(ActivatedRoute);
+  private router = inject(Router);
+
+  constructor() {
+    // Access query parameters reactively
+    this.route.queryParams.subscribe(params => {
+      const sort = params['sort'] || 'price';
+      const page = Number(params['page']) || 1;
+      this.loadProducts(sort, page);
+    });
+  }
+
+  updateSort(event: Event) {
+    const sort = (event.target as HTMLSelectElement).value;
+    // Update URL with new query parameter
+    this.router.navigate([], {
+      queryParams: { sort },
+      queryParamsHandling: 'merge' // Preserve other query parameters
+    });
+  }
+}
+```
+
+In this example, users can use a select element to sort the product list by name or price. The associated change handler updates the URL’s query parameters, which in turn triggers a change event that can read the updated query parameters and update the product list.
+
+For more information, check out the [official docs on QueryParamsHandling](/api/router/QueryParamsHandling).
+
+## Detect active current route with RouterLinkActive
+
+You can use the `RouterLinkActive` directive to dynamically style navigation elements based on the current active route. This is common in navigation elements to inform users what the active route is.
+
+```html
+<nav>
+  <a class="button"
+     routerLink="/about"
+     routerLinkActive="active-button"
+     ariaCurrentWhenActive="page">
+    About
+  </a> |
+  <a class="button"
+     routerLink="/settings"
+     routerLinkActive="active-button"
+     ariaCurrentWhenActive="page">
+    Settings
+  </a>
+</nav>
+```
+
+In this example, Angular Router will apply the `active-button` class to the correct anchor link and `ariaCurrentWhenActive` to `page` when the URL matches the corresponding `routerLink`.
+
+If you need to add multiple classes onto the element, you can use either a space-separated string or an array:
+
+```html
+<!-- Space-separated string syntax -->
+<a routerLink="/user/bob" routerLinkActive="class1 class2">Bob</a>
+
+<!-- Array syntax -->
+<a routerLink="/user/bob" [routerLinkActive]="['class1', 'class2']">Bob</a>
+```
+
+When you specify a value for routerLinkActive, you are also defining the same value for `ariaCurrentWhenActive`. This makes sure that visually impaired users (which may not perceive the different styling being applied) can also identify the active button.
+
+If you want to define a different value for aria, you’ll need to explicitly set the value using the `ariaCurrentWhenActive` directive.
+
+### Route matching strategy
+
+By default, `RouterLinkActive` considers any ancestors in the route a match.
+
+```html
+<a [routerLink]="['/user/jane']" routerLinkActive="active-link">
+  User
+</a>
+<a [routerLink]="['/user/jane/role/admin']" routerLinkActive="active-link">
+  Role
+</a>
+```
+
+When the user visits `/user/jane/role/admin`, both links would have the `active-link` class.
+
+### Only apply RouterLinkActive on exact route matches
+
+If you only want to apply the class on an exact match, you need to provide the `routerLinkActiveOptions` directive with a configuration object that contains the value `exact: true`.
+
+```html
+<a [routerLink]="['/user/jane']"
+  routerLinkActive="active-link"
+  [routerLinkActiveOptions]="{exact: true}"
+>
+  User
+</a>
+<a [routerLink]="['/user/jane/role/admin']"
+  routerLinkActive="active-link"
+  [routerLinkActiveOptions]="{exact: true}"
+>
+  Role
+</a>
+```
+
+If you want to be more precise in how a route is matched, it’s worth noting that `exact: true` is actually syntactic sugar for the full set of matching options:
+
+```typescript
+// `exact: true` is equivalent to
+{
+  paths: 'exact',
+  fragment: 'ignored',
+  matrixParams: 'ignored',
+  queryParams: 'exact',
+}
+
+// `exact: false` is equivalent
+{
+  paths: 'subset',
+  fragment: 'ignored',
+  matrixParams: 'ignored',
+  queryParams: 'subset',
+}
+```
+
+For more information, check out the official docs for [isActiveMatchOptions](/api/router/IsActiveMatchOptions).
+
+### Apply RouterLinkActive to an ancestor
+
+The RouterLinkActive directive can also be applied to an ancestor element in order to allow developers to style the elements as desired.
+
+```html
+<div routerLinkActive="active-link" [routerLinkActiveOptions]="{exact: true}">
+  <a routerLink="/user/jim">Jim</a>
+  <a routerLink="/user/bob">Bob</a>
+</div>
+```
+
+For more information, check out the [API docs for RouterLinkActive](/api/router/RouterLinkActive).
+# Other common Routing Tasks
+
+This guide covers some other common tasks associated with using Angular router in your application.
+
+## Getting route information
+
+Often, as a user navigates your application, you want to pass information from one component to another.
+For example, consider an application that displays a shopping list of grocery items.
+Each item in the list has a unique `id`.
+To edit an item, users click an Edit button, which opens an `EditGroceryItem` component.
+You want that component to retrieve the `id` for the grocery item so it can display the right information to the user.
+
+Use a route to pass this type of information to your application components.
+To do so, you use the [`withComponentInputBinding`](api/router/withComponentInputBinding) feature with `provideRouter` or the `bindToComponentInputs` option of `RouterModule.forRoot`.
+
+To get information from a route:
+
+<docs-workflow>
+
+<docs-step title="Add `withComponentInputBinding`">
+
+Add the `withComponentInputBinding` feature to the `provideRouter` method.
+
+```ts
+providers: [
+  provideRouter(appRoutes, withComponentInputBinding()),
+]
+```
+
+</docs-step>
+
+<docs-step title="Add an `input` to the component">
+
+Update the component to have an `input()` property matching the name of the parameter.
+
+```ts
+id = input.required<string>()
+hero = computed(() => this.service.getHero(id));
+```
+
+</docs-step>
+<docs-step title="Optional: Use a default value">
+The router assigns values to all inputs based on the current route when `withComponentInputBinding` is enabled.
+The router assigns `undefined` if no route data matches the input key, such as when an optional query parameter is missing.
+You should include `undefined` in the `input`'s type when there's a possibility that an input might not be matched by the route.
+
+Provide a default value by either using the `transform` option on the input or managing a local state with a `linkedSignal`.
+
+```ts
+id = input.required({
+  transform: (maybeUndefined: string | undefined) => maybeUndefined ?? '0',
+});
+// or
+id = input<string|undefined>();
+internalId = linkedSignal(() => this.id() ?? getDefaultId());
+```
+
+</docs-step>
+</docs-workflow>
+
+NOTE: You can bind all route data with key, value pairs to component inputs: static or resolved route data, path parameters, matrix parameters, and query parameters.
+If you want to use the parent components route info you will need to set the router `paramsInheritanceStrategy` option:
+`withRouterConfig({paramsInheritanceStrategy: 'always'})`
+
+## Displaying a 404 page
+
+To display a 404 page, set up a [wildcard route](guide/routing/common-router-tasks#setting-up-wildcard-routes) with the `component` property set to the component you'd like to use for your 404 page as follows:
+
+```ts
+const routes: Routes = [
+  { path: 'first-component', component: FirstComponent },
+  { path: 'second-component', component: SecondComponent },
+  { path: '**', component: PageNotFoundComponent },  // Wildcard route for a 404 page
+];
+```
+
+The last route with the `path` of `**` is a wildcard route.
+The router selects this route if the requested URL doesn't match any of the paths earlier in the list and sends the user to the `PageNotFoundComponent`.
+
+## Link parameters array
+
+A link parameters array holds the following ingredients for router navigation:
+
+- The path of the route to the destination component
+- Required and optional route parameters that go into the route URL
+
+Bind the `RouterLink` directive to such an array like this:
+
+```html
+<a [routerLink]="['/heroes']">Heroes</a>
+```
+
+The following is a two-element array when specifying a route parameter:
+
+```html
+<a [routerLink]="['/hero', hero.id]">
+  <span class="badge">{{ hero.id }}</span>{{ hero.name }}
+</a>
+```
+
+Provide optional route parameters in an object, as in `{ foo: 'foo' }`:
+
+```html
+<a [routerLink]="['/crisis-center', { foo: 'foo' }]">Crisis Center</a>
+```
+
+These three examples cover the needs of an application with one level of routing.
+However, with a child router, such as in the crisis center, you create new link array possibilities.
+
+The following minimal `RouterLink` example builds upon a specified default child route for the crisis center.
+
+```html
+<a [routerLink]="['/crisis-center']">Crisis Center</a>
+```
+
+Review the following:
+
+- The first item in the array identifies the parent route \(`/crisis-center`\)
+- There are no parameters for this parent route
+- There is no default for the child route so you need to pick one
+- You're navigating to the `CrisisListComponent`, whose route path is `/`, but you don't need to explicitly add the slash
+
+Consider the following router link that navigates from the root of the application down to the Dragon Crisis:
+
+```html
+<a [routerLink]="['/crisis-center', 1]">Dragon Crisis</a>
+```
+
+- The first item in the array identifies the parent route \(`/crisis-center`\)
+- There are no parameters for this parent route
+- The second item identifies the child route details about a particular crisis \(`/:id`\)
+- The details child route requires an `id` route parameter
+- You added the `id` of the Dragon Crisis as the second item in the array \(`1`\)
+- The resulting path is `/crisis-center/1`
+
+You could also redefine the `AppComponent` template with Crisis Center routes exclusively:
+
+```typescript
+@Component({
+  template: `
+    <h1 class="title">Angular Router</h1>
+    <nav>
+      <a [routerLink]="['/crisis-center']">Crisis Center</a>
+      <a [routerLink]="['/crisis-center/1', { foo: 'foo' }]">Dragon Crisis</a>
+      <a [routerLink]="['/crisis-center/2']">Shark Crisis</a>
+    </nav>
+    <router-outlet />
+  `
+})
+export class AppComponent {}
+```
+
+In summary, you can write applications with one, two or more levels of routing.
+The link parameters array affords the flexibility to represent any routing depth and any legal sequence of route paths, \(required\) router parameters, and \(optional\) route parameter objects.
+
+## `LocationStrategy` and browser URL styles
+
+When the router navigates to a new component view, it updates the browser's location and history with a URL for that view.
+
+Modern HTML5 browsers support [history.pushState](https://developer.mozilla.org/docs/Web/API/History_API/Working_with_the_History_API#adding_and_modifying_history_entries 'HTML5 browser history push-state'), a technique that changes a browser's location and history without triggering a server page request.
+The router can compose a "natural" URL that is indistinguishable from one that would otherwise require a page load.
+
+Here's the Crisis Center URL in this "HTML5 pushState" style:
+
+```text
+localhost:3002/crisis-center
+```
+
+Older browsers send page requests to the server when the location URL changes unless the change occurs after a "#" \(called the "hash"\).
+Routers can take advantage of this exception by composing in-application route URLs with hashes.
+Here's a "hash URL" that routes to the Crisis Center.
+
+```text
+localhost:3002/src/#/crisis-center
+```
+
+The router supports both styles with two `LocationStrategy` providers:
+
+| Providers              | Details                              |
+| :--------------------- | :----------------------------------- |
+| `PathLocationStrategy` | The default "HTML5 pushState" style. |
+| `HashLocationStrategy` | The "hash URL" style.                |
+
+The `RouterModule.forRoot()` function sets the `LocationStrategy` to the `PathLocationStrategy`, which makes it the default strategy.
+You also have the option of switching to the `HashLocationStrategy` with an override during the bootstrapping process.
+
+HELPFUL: For more information on providers and the bootstrap process, see [Dependency Injection](guide/di/dependency-injection-providers).
+# Using Angular routes in a single-page application
+
+This tutorial describes how to build a single-page application, SPA that uses multiple Angular routes.
+
+In a Single Page Application \(SPA\), all of your application's functions exist in a single HTML page.
+As users access your application's features, the browser needs to render only the parts that matter to the user, instead of loading a new page.
+This pattern can significantly improve your application's user experience.
+
+To define how users navigate through your application, you use routes.
+Add routes to define how users navigate from one part of your application to another.
+You can also configure routes to guard against unexpected or unauthorized behavior.
+
+## Objectives
+
+* Organize a sample application's features into modules.
+* Define how to navigate to a component.
+* Pass information to a component using a parameter.
+* Structure routes by nesting several routes.
+* Check whether users can access a route.
+* Control whether the application can discard unsaved changes.
+* Improve performance by pre-fetching route data and lazy loading feature modules.
+* Require specific criteria to load components.
+
+## Create a sample application
+
+Using the Angular CLI, create a new application, *angular-router-sample*.
+This application will have two components: *crisis-list* and *heroes-list*.
+
+1. Create a new Angular project, *angular-router-sample*.
+
+    ```shell
+ng new angular-router-sample
+```
+    When prompted with `Would you like to add Angular routing?`, select `N`.
+
+    When prompted with `Which stylesheet format would you like to use?`, select `CSS`.
+
+    After a few moments, a new project, `angular-router-sample`, is ready.
+
+1. From your terminal, navigate to the `angular-router-sample` directory.
+1. Create a component, *crisis-list*.
+
+    ```shell
+ng generate component crisis-list
+```
+1. In your code editor, locate the file, `crisis-list.component.html` and replace the placeholder content with the following HTML.
+
+    ```
+1. Create a second component, *heroes-list*.
+
+    <docs-code language="shell">
+    ng generate component heroes-list
+```
+1. In your code editor, locate the file, `heroes-list.component.html` and replace the placeholder content with the following HTML.
+
+    ```
+1. In your code editor, open the file, `app.component.html` and replace its contents with the following HTML.
+
+    <docs-code header="src/app/app.component.html" path="adev/src/content/examples/router-tutorial/src/app/app.component.html" visibleRegion="setup"/>
+
+1. Verify that your new application runs as expected by running the `ng serve` command.
+
+    <docs-code language="shell">
+    ng serve
+```
+1. Open a browser to `http://localhost:4200`.
+
+    You should see a single web page, consisting of a title and the HTML of your two components.
+
+## Define your routes
+
+In this section, you'll define two routes:
+
+* The route `/crisis-center` opens the `crisis-center` component.
+* The route `/heroes-list` opens the `heroes-list` component.
+
+A route definition is a JavaScript object.
+Each route typically has two properties.
+The first property, `path`, is a string that specifies the URL path for the route.
+The second property, `component`, is a string that specifies what component your application should display for that path.
+
+1. From your code editor, create and open the `app.routes.ts` file.
+1. Create and export a routes list for your application:
+
+    ```ts
+import {Routes} from '@angular/router';
+
+    export const routes = [];
+    ```
+
+1. Add two routes for your first two components:
+
+    ```ts
+{path: 'crisis-list', component: CrisisListComponent},
+    {path: 'heroes-list', component: HeroesListComponent},
+    ```
+
+This routes list is an array of JavaScript objects, with each object defining the properties of a route.
+
+## Import `provideRouter` from `@angular/router`
+
+Routing lets you display specific views of your application depending on the URL path.
+To add this functionality to your sample application, you need to update the `app.config.ts` file to use the router providers function, `provideRouter`.
+You import this provider function from `@angular/router`.
+
+1. From your code editor, open the `app.config.ts` file.
+1. Add the following import statements:
+
+    ```ts
+import { provideRouter } from '@angular/router';
+    import { routes } from './app.routes';
+    ```
+
+1. Update the providers in the `appConfig`:
+
+    ```ts
+providers: [provideRouter(routes)]
+    ```
+
+For `NgModule` based applications, put the `provideRouter` in the `providers` list of the `AppModule`, or whichever module is passed to `bootstrapModule` in the application.
+
+## Update your component with `router-outlet`
+
+At this point, you have defined two routes for your application.
+However, your application still has both the `crisis-list` and `heroes-list` components hard-coded in your `app.component.html` template.
+For your routes to work, you need to update your template to dynamically load a component based on the URL path.
+
+To implement this functionality, you add the `router-outlet` directive to your template file.
+
+1. From your code editor, open the `app.component.html` file.
+1. Delete the following lines.
+
+    ```
+1. Add the `router-outlet` directive.
+
+    <docs-code header="src/app/app.component.html" path="adev/src/content/examples/router-tutorial/src/app/app.component.html" visibleRegion="router-outlet"/>
+
+1. Add `RouterOutlet` to the imports of the `AppComponent` in `app.component.ts`
+
+    ```ts
+imports: [RouterOutlet],
+    ```
+
+View your updated application in your browser.
+You should see only the application title.
+To view the `crisis-list` component, add `crisis-list` to the end of the path in your browser's address bar.
+For example:
+
+<docs-code language="http">
+http://localhost:4200/crisis-list
+```
+Notice that the `crisis-list` component displays.
+Angular is using the route you defined to dynamically load the component.
+You can load the `heroes-list` component the same way:
+
+```http
+http://localhost:4200/heroes-list
+```
+## Control navigation with UI elements
+
+Currently, your application supports two routes.
+However, the only way to use those routes is for the user to manually type the path in the browser's address bar.
+In this section, you'll add two links that users can click to navigate between the `heroes-list` and `crisis-list` components.
+You'll also add some CSS styles.
+While these styles are not required, they make it easier to identify the link for the currently-displayed component.
+You'll add that functionality in the next section.
+
+1. Open the `app.component.html` file and add the following HTML below the title.
+
+    ```
+This HTML uses an Angular directive, `routerLink`.
+    This directive connects the routes you defined to your template files.
+
+1. Add the `RouterLink` directive to the imports list of `AppComponent` in `app.component.ts`.
+
+1. Open the `app.component.css` file and add the following styles.
+
+    <docs-code header="src/app/app.component.css" path="adev/src/content/examples/router-tutorial/src/app/app.component.css"/>
+
+If you view your application in the browser, you should see these two links.
+When you click on a link, the corresponding component appears.
+
+## Identify the active route
+
+While users can navigate your application using the links you added in the previous section, they don't have a straightforward way to identify what the active route is.
+Add this functionality using Angular's `routerLinkActive` directive.
+
+1. From your code editor, open the `app.component.html` file.
+1. Update the anchor tags to include the `routerLinkActive` directive.
+
+    <docs-code header="src/app/app.component.html" path="adev/src/content/examples/router-tutorial/src/app/app.component.html" visibleRegion="routeractivelink"/>
+1. Add the `RouterLinkActive` directive to the `imports` list of `AppComponent` in `app.component.ts`.
+
+View your application again.
+As you click one of the buttons, the style for that button updates automatically, identifying the active component to the user.
+By adding the `routerLinkActive` directive, you inform your application to apply a specific CSS class to the active route.
+In this tutorial, that CSS class is `activebutton`, but you could use any class that you want.
+
+Note that we are also specifying a value for the `routerLinkActive`'s `ariaCurrentWhenActive`. This makes sure that visually impaired users (which may not perceive the different styling being applied) can also identify the active button. For more information see the Accessibility Best Practices [Active links identification section](/best-practices/a11y#active-links-identification).
+
+## Adding a redirect
+
+In this step of the tutorial, you add a route that redirects the user to display the `/heroes-list` component.
+
+1. From your code editor, open the `app.routes.ts` file.
+1. Update the `routes` section as follows.
+
+    ```ts
+{path: '', redirectTo: '/heroes-list', pathMatch: 'full'},
+    ```
+
+    Notice that this new route uses an empty string as its path.
+    In addition, it replaces the `component` property with two new ones:
+
+    | Properties   | Details |
+    |:---        |:---    |
+    | `redirectTo` | This property instructs Angular to redirect from an empty path to the `heroes-list` path.                                                                                                                                                       |
+    | `pathMatch`  | This property instructs Angular on how much of the URL to match. For this tutorial, you should set this property to `full`. This strategy is recommended when you have an empty string for a path. For more information about this property, see the [Route API documentation](api/router/Route). |
+
+Now when you open your application, it displays the `heroes-list` component by default.
+
+## Adding a 404 page
+
+It is possible for a user to try to access a route that you have not defined.
+To account for this behavior, the best practice is to display a 404 page.
+In this section, you'll create a 404 page and update your route configuration to show that page for any unspecified routes.
+
+1. From the terminal, create a new component, `PageNotFound`.
+
+    <docs-code language="shell">
+    ng generate component page-not-found
+```
+1. From your code editor, open the `page-not-found.component.html` file and replace its contents with the following HTML.
+
+    <docs-code header="src/app/page-not-found/page-not-found.component.html" path="adev/src/content/examples/router-tutorial/src/app/page-not-found/page-not-found.component.html"/>
+
+1. Open the `app.routes.ts` file and add the following route to the routes list:
+
+    ```ts
+{path: '**', component: PageNotFoundComponent}
+    ```
+
+    The new route uses a path, `**`.
+    This path is how Angular identifies a wildcard route.
+    Any route that does not match an existing route in your configuration will use this route.
+
+IMPORTANT: Notice that the wildcard route is placed at the end of the array.
+The order of your routes is important, as Angular applies routes in order and uses the first match it finds.
+
+Try navigating to a non-existing route on your application, such as `http://localhost:4200/powers`.
+This route doesn't match anything defined in your `app.routes.ts` file.
+However, because you defined a wildcard route, the application automatically displays your `PageNotFound` component.
+
+## Next steps
+
+At this point, you have a basic application that uses Angular's routing feature to change what components the user can see based on the URL address.
+You have extended these features to include a redirect, as well as a wildcard route to display a custom 404 page.
+
+For more information about routing, see the following topics:
+# Creating custom route matches
+
+The Angular Router supports a powerful matching strategy that you can use to help users navigate your application.
+This matching strategy supports static routes, variable routes with parameters, wildcard routes, and so on.
+Also, build your own custom pattern matching for situations in which the URLs are more complicated.
+
+In this tutorial, you'll build a custom route matcher using Angular's `UrlMatcher`.
+This matcher looks for a Twitter handle in the URL.
+
+## Objectives
+
+Implement Angular's `UrlMatcher` to create a custom route matcher.
+
+## Create a sample application
+
+Using the Angular CLI, create a new application, *angular-custom-route-match*.
+In addition to the default Angular application framework, you will also create a *profile* component.
+
+1. Create a new Angular project, *angular-custom-route-match*.
+
+    ```shell
+ng new angular-custom-route-match
+    ```
+
+    When prompted with `Would you like to add Angular routing?`, select `Y`.
+
+    When prompted with `Which stylesheet format would you like to use?`, select `CSS`.
+
+    After a few moments, a new project, `angular-custom-route-match`, is ready.
+
+1. From your terminal, navigate to the `angular-custom-route-match` directory.
+1. Create a component, *profile*.
+
+    ```shell
+ng generate component profile
+    ```
+
+1. In your code editor, locate the file, `profile.component.html` and replace the placeholder content with the following HTML.
+
+    ```
+1. In your code editor, locate the file, `app.component.html` and replace the placeholder content with the following HTML.
+
+    <docs-code header="src/app/app.component.html" path="adev/src/content/examples/routing-with-urlmatcher/src/app/app.component.html"/>
+
+## Configure your routes for your application
+
+With your application framework in place, you next need to add routing capabilities to the `app.config.ts` file.
+As a part of this process, you will create a custom URL matcher that looks for a Twitter handle in the URL.
+This handle is identified by a preceding `@` symbol.
+
+1. In your code editor, open your `app.config.ts` file.
+1. Add an `import` statement for Angular's `provideRouter` and `withComponentInputBinding` as well as the application routes.
+
+    ```ts
+import {provideRouter, withComponentInputBinding} from '@angular/router';
+
+    import {routes} from './app.routes';
+    ```
+
+1. In the providers array, add a `provideRouter(routes, withComponentInputBinding())` statement.
+
+1. Define the custom route matcher by adding the following code to the application routes.
+
+    <docs-code header="src/app/app.routes.ts" path="adev/src/content/examples/routing-with-urlmatcher/src/app/app.routes.ts" visibleRegion="matcher"/>
+
+This custom matcher is a function that performs the following tasks:
+
+* The matcher verifies that the array contains only one segment
+* The matcher employs a regular expression to ensure that the format of the username is a match
+* If there is a match, the function returns the entire URL, defining a `username` route parameter as a substring of the path
+* If there isn't a match, the function returns null and the router continues to look for other routes that match the URL
+
+HELPFUL: A custom URL matcher behaves like any other route definition. Define child routes or lazy loaded routes as you would with any other route.
+
+## Reading the route parameters
+
+With the custom matcher in place, you can now bind the route parameter in the `profile` component.
+
+In your code editor, open your `profile.component.ts` file and create an `Input` matching the `username` parameter.
+We added the `withComponentInputBinding` feature earlier
+in `provideRouter`. This allows the `Router` to bind information directly to the route components.
+
+```ts
+@Input() username!: string;
+```
+
+## Test your custom URL matcher
+
+With your code in place, you can now test your custom URL matcher.
+
+1. From a terminal window, run the `ng serve` command.
+
+    <docs-code language="shell">
+    ng serve
+```
+1. Open a browser to `http://localhost:4200`.
+
+    You should see a single web page, consisting of a sentence that reads `Navigate to my profile`.
+
+1. Click the **my profile** hyperlink.
+
+    A new sentence, reading `Hello, Angular!` appears on the page.
+
+## Next steps
+
+Pattern matching with the Angular Router provides you with a lot of flexibility when you have dynamic URLs in your application.
+To learn more about the Angular Router, see the following topics:
+HELPFUL: This content is based on [Custom Route Matching with the Angular Router](https://medium.com/@brandontroberts/custom-route-matching-with-the-angular-router-fbdd48665483), by [Brandon Roberts](https://twitter.com/brandontroberts).
+# Server and hybrid rendering
+
+Angular ships all applications as client-side rendered (CSR) by default. While this approach delivers a initial payload that's lightweight, it introduces trade-offs including slower load times, degraded performance metrics, and higher resource demands since the user's device performs most of the computations. As a result, many applications achieve significant performance improvements by integrating server-side rendering (SSR) into a hybrid rendering strategy.
+
+## What is hybrid rendering?
+
+Hybrid rendering allows developers to leverage the benefits of server-side rendering (SSR), pre-rendering (also known as "static site generation" or SSG) and client-side rendering (CSR) to optimize your Angular application. It gives you fine-grained control over how your different parts of your app is rendered to give your users the best experience possible.
+
+## Setting up hybrid rendering
+
+You can create a **new** project with hybrid rendering by using the server-side rendering flag (i.e., `--ssr`) with the Angular CLI `ng new` command:
+
+```shell
+ng new --ssr
+```
+
+You can also enable hybrid rendering by adding server-side rendering to an existing project with the `ng add` command:
+
+```shell
+ng add @angular/ssr
+```
+
+NOTE: By default, Angular prerenders your entire application and generates a server file. To disable this and create a fully static app, set `outputMode` to `static`. To enable SSR, update the server routes to use `RenderMode.Server`. For more details, see [`Server routing`](#server-routing) and [`Generate a fully static application`](#generate-a-fully-static-application).
+
+## Server routing
+
+### Configuring server routes
+
+You can create a server route config by declaring an array of [`ServerRoute`](api/ssr/ServerRoute 'API reference') objects. This configuration typically lives in a file named `app.routes.server.ts`.
+
+```typescript
+// app.routes.server.ts
+import { RenderMode, ServerRoute } from '@angular/ssr';
+
+export const serverRoutes: ServerRoute[] = [
+  {
+    path: '', // This renders the "/" route on the client (CSR)
+    renderMode: RenderMode.Client,
+  },
+  {
+    path: 'about', // This page is static, so we prerender it (SSG)
+    renderMode: RenderMode.Prerender,
+  },
+  {
+    path: 'profile', // This page requires user-specific data, so we use SSR
+    renderMode: RenderMode.Server,
+  },
+  {
+    path: '**', // All other routes will be rendered on the server (SSR)
+    renderMode: RenderMode.Server,
+  },
+];
+```
+
+You can add this config to your application with [`provideServerRendering`](api/ssr/provideServerRendering 'API reference') using the [`withRoutes`](api/ssr/withRoutes 'API reference') function:
+
+```typescript
+import { provideServerRendering, withRoutes } from '@angular/ssr';
+import { serverRoutes } from './app.routes.server';
+
+// app.config.server.ts
+const serverConfig: ApplicationConfig = {
+  providers: [
+    provideServerRendering(withRoutes(serverRoutes)),
+    // ... other providers ...
+  ]
+};
+```
+
+When using the [App shell pattern](ecosystem/service-workers/app-shell), you must specify the component to be used as the app shell for client-side rendered routes. To do this, use the [`withAppShell`](api/ssr/withAppShell 'API reference') feature:
+
+```typescript
+import { provideServerRendering, withRoutes, withAppShell } from '@angular/ssr';
+import { AppShellComponent } from './app-shell/app-shell.component';
+
+const serverConfig: ApplicationConfig = {
+  providers: [
+    provideServerRendering(
+      withRoutes(serverRoutes),
+      withAppShell(AppShellComponent),
+    ),
+    // ... other providers ...
+  ]
+};
+```
+
+### Rendering modes
+
+The server routing configuration lets you specify how each route in your application should render by setting a [`RenderMode`](api/ssr/RenderMode 'API reference'):
+
+| Rendering mode      | Description                                                                                                 |
+| ------------------- | ----------------------------------------------------------------------------------------------------------- |
+| **Server (SSR)**    | Renders the application on the server for each request, sending a fully populated HTML page to the browser. |
+| **Client (CSR)**    | Renders the application in the browser. This is the default Angular behavior.                               |
+| **Prerender (SSG)** | Prerenders the application at build time, generating static HTML files for each route.                      |
+
+#### Choosing a rendering mode
+
+Each rendering mode has different benefits and drawbacks. You can choose rendering modes based on the specific needs of your application.
+
+##### Client-side rendering
+
+Client-side rendering has the simplest development model, as you can write code that assumes it always runs in a web browser. This lets you use a wide range of client-side libraries that also assume they run in a browser.
+
+Client-side rendering generally has worse performance than other rendering modes, as it must download, parse, and execute your page's JavaScript before the user can see any rendered content. If your page fetches more data from the server as it renders, users also have to wait for those additional requests before they can view the complete content.
+
+If your page is indexed by search crawlers, client-side rendering may negatively affect search engine optimization (SEO), as search crawlers have limits to how much JavaScript they execute when indexing a page.
+
+When client-side rendering, the server does not need to do any work to render a page beyond serving static JavaScript assets. You may consider this factor if server cost is a concern.
+
+Applications that support installable, offline experiences with [service workers](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API) can rely on client-side rendering without needing to communicate with a server.
+
+##### Server-side rendering
+
+Server-side rendering offers faster page loads than client-side rendering. Instead of waiting for JavaScript to download and run, the server directly renders an HTML document upon receiving a request from the browser. The user experiences only the latency necessary for the server to fetch data and render the requested page. This mode also eliminates the need for additional network requests from the browser, as your code can fetch data during rendering on the server.
+
+Server-side rendering generally has excellent search engine optimization (SEO), as search crawlers receive a fully rendered HTML document.
+
+Server-side rendering requires you to author code that does not strictly depend on browser APIs and limits your selection of JavaScript libraries that assume they run in a browser.
+
+When server-side rendering, your server runs Angular to produce an HTML response for every request which may increase server hosting costs.
+
+##### Build-time prerendering
+
+Prerendering offers faster page loads than both client-side rendering and server-side rendering. Because prerendering creates HTML documents at _build-time_, the server can directly respond to requests with the static HTML document without any additional work.
+
+Prerendering requires that all information necessary to render a page is available at _build-time_. This means that prerendered pages cannot include any data to the specific user loading the page. Prerendering is primarily useful for pages that are the same for all users of your application.
+
+Because prerendering occurs at build-time, it may add significant time to your production builds. Using [`getPrerenderParams`](api/ssr/ServerRoutePrerenderWithParams#getPrerenderParams 'API reference') to produce a large number of HTML documents may affect the total file size of your deployments, and thus lead to slower deployments.
+
+Prerendering generally has excellent search engine optimization (SEO), as search crawlers receive a fully rendered HTML document.
+
+Prerendering requires you to author code that does not strictly depend on browser APIs and limits your selection of JavaScript libraries that assume they run in a browser.
+
+Prerendering incurs extremely little overhead per server request, as your server responds with static HTML documents. Static files are also easily cached by Content Delivery Networks (CDNs), browsers, and intermediate caching layers for even faster subsequent page loads. Fully static sites can also be deployed solely through a CDN or static file server, eliminating the need to maintain a custom server runtime for your application. This enhances scalability by offloading work from an application web server, making it particularly beneficial for high-traffic applications.
+
+NOTE: When using Angular service worker, the first request is server-rendered, but all subsequent requests are handled by the service worker and rendered client-side.
+
+### Setting headers and status codes
+
+You can set custom headers and status codes for individual server routes using the `headers` and `status` properties in the `ServerRoute` configuration.
+
+```typescript
+// app.routes.server.ts
+import { RenderMode, ServerRoute } from '@angular/ssr';
+
+export const serverRoutes: ServerRoute[] = [
+  {
+    path: 'profile',
+    renderMode: RenderMode.Server,
+    headers: {
+      'X-My-Custom-Header': 'some-value',
+    },
+    status: 201,
+  },
+  // ... other routes
+];
+```
+
+### Redirects
+
+Angular handles redirects specified by the [`redirectTo`](api/router/Route#redirectTo 'API reference') property in route configurations, differently on the server-side.
+
+**Server-Side Rendering (SSR)**
+Redirects are performed using standard HTTP redirects (e.g., 301, 302) within the server-side rendering process.
+
+**Prerendering (SSG)**
+Redirects are implemented as "soft redirects" using [`<meta http-equiv="refresh">`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta#refresh) tags in the prerendered HTML.
+
+### Customizing build-time prerendering (SSG)
+
+When using [`RenderMode.Prerender`](api/ssr/RenderMode#Prerender 'API reference'), you can specify several configuration options to customize the prerendering and serving process.
+
+#### Parameterized routes
+
+For each route with [`RenderMode.Prerender`](api/ssr/RenderMode#Prerender 'API reference'), you can specify a [`getPrerenderParams`](api/ssr/ServerRoutePrerenderWithParams#getPrerenderParams 'API reference') function. This function lets you control which specific parameters produce separate prerendered documents.
+
+The [`getPrerenderParams`](api/ssr/ServerRoutePrerenderWithParams#getPrerenderParams 'API reference') function returns a `Promise` that resolves to an array of objects. Each object is a key-value map of route parameter name to value. For example, if you define a route like `post/:id`, `getPrerenderParams ` could return the array `[{id: 123}, {id: 456}]`, and thus render separate documents for `post/123` and `post/456`.
+
+The body of [`getPrerenderParams`](api/ssr/ServerRoutePrerenderWithParams#getPrerenderParams 'API reference') can use Angular's [`inject`](api/core/inject 'API reference') function to inject dependencies and perform any work to determine which routes to prerender. This typically includes making requests to fetch data to construct the array of parameter values.
+
+You can also use this function with catch-all routes (e.g., `/**`), where the parameter name will be `"**"` and the return value will be the segments of the path, such as `foo/bar`. These can be combined with other parameters (e.g., `/post/:id/**`) to handle more complex route configuration.
+
+```ts
+// app.routes.server.ts
+import { RenderMode, ServerRoute } from '@angular/ssr';
+
+export const serverRoutes: ServerRoute[] = [
+  {
+    path: 'post/:id',
+    renderMode: RenderMode.Prerender,
+    async getPrerenderParams() {
+      const dataService = inject(PostService);
+      const ids = await dataService.getIds(); // Assuming this returns ['1', '2', '3']
+
+      return ids.map(id => ({ id })); // Generates paths like: /post/1, /post/2, /post/3
+    },
+  },
+  {
+    path: 'post/:id/**',
+    renderMode: RenderMode.Prerender,
+    async getPrerenderParams() {
+      return [
+        { id: '1', '**': 'foo/3' },
+        { id: '2', '**': 'bar/4' },
+      ]; // Generates paths like: /post/1/foo/3, /post/2/bar/4
+    },
+  },
+];
+```
+
+Because [`getPrerenderParams`](api/ssr/ServerRoutePrerenderWithParams#getPrerenderParams 'API reference') exclusively applies to [`RenderMode.Prerender`](api/ssr/RenderMode#Prerender 'API reference'), this function always runs at _build-time_. `getPrerenderParams` must not rely on any browser-specific or server-specific APIs for data.
+
+IMPORTANT: When using [`inject`](api/core/inject 'API reference') inside `getPrerenderParams`, please remember that `inject` must be used synchronously. It cannot be invoked within asynchronous callbacks or following any `await` statements. For more information, refer to [`runInInjectionContext`](api/core/runInInjectionContext).
+
+#### Fallback strategies
+
+When using [`RenderMode.Prerender`](api/ssr/RenderMode#Prerender 'API reference') mode, you can specify a fallback strategy to handle requests for paths that haven't been prerendered.
+
+The available fallback strategies are:
+
+- **Server:** Falls back to server-side rendering. This is the **default** behavior if no `fallback` property is specified.
+- **Client:** Falls back to client-side rendering.
+- **None:** No fallback. Angular will not handle requests for paths that are not prerendered.
+
+```typescript
+// app.routes.server.ts
+import { RenderMode, PrerenderFallback, ServerRoute } from '@angular/ssr';
+
+export const serverRoutes: ServerRoute[] = [
+  {
+    path: 'post/:id',
+    renderMode: RenderMode.Prerender,
+    fallback: PrerenderFallback.Client, // Fallback to CSR if not prerendered
+    async getPrerenderParams() {
+      // This function returns an array of objects representing prerendered posts at the paths:
+      // `/post/1`, `/post/2`, and `/post/3`.
+      // The path `/post/4` will utilize the fallback behavior if it's requested.
+      return [{ id: 1 }, { id: 2 }, { id: 3 }];
+    },
+  },
+];
+```
+
+## Authoring server-compatible components
+
+Some common browser APIs and capabilities might not be available on the server. Applications cannot make use of browser-specific global objects like `window`, `document`, `navigator`, or `location` as well as certain properties of `HTMLElement`.
+
+In general, code which relies on browser-specific symbols should only be executed in the browser, not on the server. This can be enforced through the [`afterEveryRender`](api/core/afterEveryRender) and [`afterNextRender`](api/core/afterNextRender) lifecycle hooks. These are only executed on the browser and skipped on the server.
+
+```typescript
+import { Component, ViewChild, afterNextRender } from '@angular/core';
+
+@Component({
+  selector: 'my-cmp',
+  template: `<span #content>{{ ... }}</span>`,
+})
+export class MyComponent {
+  @ViewChild('content') contentRef: ElementRef;
+
+  constructor() {
+    afterNextRender(() => {
+      // Safe to check `scrollHeight` because this will only run in the browser, not the server.
+      console.log('content height: ' + this.contentRef.nativeElement.scrollHeight);
+    });
+  }
+}
+```
+
+## Accessing Request and Response via DI
+
+The `@angular/core` package provides several tokens for interacting with the server-side rendering environment. These tokens give you access to crucial information and objects within your Angular application during SSR.
+
+- **[`REQUEST`](api/core/REQUEST 'API reference'):** Provides access to the current request object, which is of type [`Request`](https://developer.mozilla.org/en-US/docs/Web/API/Request) from the Web API. This allows you to access headers, cookies, and other request information.
+- **[`RESPONSE_INIT`](api/core/RESPONSE_INIT 'API reference'):** Provides access to the response initialization options, which is of type [`ResponseInit`](https://developer.mozilla.org/en-US/docs/Web/API/Response/Response#parameters) from the Web API. This allows you to set headers and the status code for the response dynamically. Use this token to set headers or status codes that need to be determined at runtime.
+- **[`REQUEST_CONTEXT`](api/core/REQUEST_CONTEXT 'API reference'):** Provides access to additional context related to the current request. This context can be passed as the second parameter of the [`handle`](api/ssr/AngularAppEngine#handle 'API reference') function. Typically, this is used to provide additional request-related information that is not part of the standard Web API.
+
+```typescript
+import { inject, REQUEST } from '@angular/core';
+
+@Component({
+  selector: 'app-my-component',
+  template: `<h1>My Component</h1>`,
+})
+export class MyComponent {
+  constructor() {
+    const request = inject(REQUEST);
+    console.log(request?.url);
+  }
+}
+```
+
+IMPORTANT: The above tokens will be `null` in the following scenarios:
+
+- During the build processes.
+- When the application is rendered in the browser (CSR).
+- When performing static site generation (SSG).
+- During route extraction in development (at the time of the request).
+
+## Generate a fully static application
+
+By default, Angular prerenders your entire application and generates a server file for handling requests. This allows your app to serve pre-rendered content to users. However, if you prefer a fully static site without a server, you can opt out of this behavior by setting the `outputMode` to `static` in your `angular.json` configuration file.
+
+When `outputMode` is set to `static`, Angular generates pre-rendered HTML files for each route at build time, but it does not generate a server file or require a Node.js server to serve the app. This is useful for deploying to static hosting providers where a backend server is not needed.
+
+To configure this, update your `angular.json` file as follows:
+
+```json
+{
+  "projects": {
+    "your-app": {
+      "architect": {
+        "build": {
+          "options": {
+            "outputMode": "static"
+          }
+        }
+      }
+    }
+  }
+}
+```
+
+## Caching data when using HttpClient
+
+[`HttpClient`](api/common/http/HttpClient) cached outgoing network requests when running on the server. This information is serialized and transferred to the browser as part of the initial HTML sent from the server. In the browser, `HttpClient` checks whether it has data in the cache and if so, reuses it instead of making a new HTTP request during initial application rendering. `HttpClient` stops using the cache once an application becomes [stable](api/core/ApplicationRef#isStable) while running in a browser.
+
+By default, `HttpClient` caches all `HEAD` and `GET` requests which don't contain `Authorization` or `Proxy-Authorization` headers. You can override those settings by using [`withHttpTransferCacheOptions`](api/platform-browser/withHttpTransferCacheOptions) when providing hydration.
+
+```typescript
+bootstrapApplication(AppComponent, {
+  providers: [
+    provideClientHydration(withHttpTransferCacheOptions({
+      includePostRequests: true
+    }))
+  ]
+});
+```
+
+## Configuring a server
+
+### Node.js
+
+The `@angular/ssr/node` extends `@angular/ssr` specifically for Node.js environments. It provides APIs that make it easier to implement server-side rendering within your Node.js application. For a complete list of functions and usage examples, refer to the [`@angular/ssr/node` API reference](api/ssr/node/AngularNodeAppEngine) API reference.
+
+```typescript
+// server.ts
+import { AngularNodeAppEngine, createNodeRequestHandler, writeResponseToNodeResponse } from '@angular/ssr/node';
+import express from 'express';
+
+const app = express();
+const angularApp = new AngularNodeAppEngine();
+
+app.use('*', (req, res, next) => {
+  angularApp
+    .handle(req)
+    .then(response => {
+      if (response) {
+        writeResponseToNodeResponse(response, res);
+      } else {
+        next(); // Pass control to the next middleware
+      }
+    })
+    .catch(next);
+});
+
+/**
+ * The request handler used by the Angular CLI (dev-server and during build).
+ */
+export const reqHandler = createNodeRequestHandler(app);
+```
+
+### Non-Node.js
+
+The `@angular/ssr` provides essential APIs for server-side rendering your Angular application on platforms other than Node.js. It leverages the standard [`Request`](https://developer.mozilla.org/en-US/docs/Web/API/Request) and [`Response`](https://developer.mozilla.org/en-US/docs/Web/API/Response) objects from the Web API, enabling you to integrate Angular SSR into various server environments. For detailed information and examples, refer to the [`@angular/ssr` API reference](api/ssr/AngularAppEngine).
+
+```typescript
+// server.ts
+import { AngularAppEngine, createRequestHandler } from '@angular/ssr';
+
+const angularApp = new AngularAppEngine();
+
+/**
+ * This is a request handler used by the Angular CLI (dev-server and during build).
+ */
+export const reqHandler = createRequestHandler(async (req: Request) => {
+  const res: Response|null = await angularApp.render(req);
+
+  // ...
+});
+```
+# Hydration
+
+## What is hydration
+
+Hydration is the process that restores the server-side rendered application on the client. This includes things like reusing the server rendered DOM structures, persisting the application state, transferring application data that was retrieved already by the server, and other processes.
+
+## Why is hydration important?
+
+Hydration improves application performance by avoiding extra work to re-create DOM nodes. Instead, Angular tries to match existing DOM elements to the applications structure at runtime and reuses DOM nodes when possible. This results in a performance improvement that can be measured using [Core Web Vitals (CWV)](https://web.dev/learn-core-web-vitals/) statistics, such as reducing the First Input Delay ([FID](https://web.dev/fid/)) and Largest Contentful Paint ([LCP](https://web.dev/lcp/)), as well as Cumulative Layout Shift ([CLS](https://web.dev/cls/)). Improving these numbers also affects things like SEO performance.
+
+Without hydration enabled, server-side rendered Angular applications will destroy and re-render the application's DOM, which may result in a visible UI flicker. This re-rendering can negatively impact [Core Web Vitals](https://web.dev/learn-core-web-vitals/) like [LCP](https://web.dev/lcp/) and cause a layout shift. Enabling hydration allows the existing DOM to be re-used and prevents a flicker.
+
+## How do you enable hydration in Angular
+
+Hydration can be enabled for server-side rendered (SSR) applications only. Follow the [Angular SSR Guide](guide/ssr) to enable server-side rendering first.
+
+### Using Angular CLI
+
+If you've used Angular CLI to enable SSR (either by enabling it during application creation or later via `ng add @angular/ssr`), the code that enables hydration should already be included into your application.
+
+### Manual setup
+
+If you have a custom setup and didn't use Angular CLI to enable SSR, you can enable hydration manually by visiting your main application component or module and importing `provideClientHydration` from `@angular/platform-browser`. You'll then add that provider to your app's bootstrapping providers list.
+
+```typescript
+import {
+  bootstrapApplication,
+  provideClientHydration,
+} from '@angular/platform-browser';
+...
+
+bootstrapApplication(AppComponent, {
+  providers: [provideClientHydration()]
+});
+```
+
+Alternatively if you are using NgModules, you would add `provideClientHydration` to your root app module's provider list.
+
+```typescript
+import {provideClientHydration} from '@angular/platform-browser';
+import {NgModule} from '@angular/core';
+
+@NgModule({
+  declarations: [AppComponent],
+  exports: [AppComponent],
+  bootstrap: [AppComponent],
+  providers: [provideClientHydration()],
+})
+export class AppModule {}
+```
+
+IMPORTANT: Make sure that the `provideClientHydration()` call is also included into a set of providers that is used to bootstrap an application on the **server**. In applications with the default project structure (generated by the `ng new` command), adding a call to the root `AppModule` should be sufficient, since this module is imported by the server module. If you use a custom setup, add the `provideClientHydration()` call to the providers list in the server bootstrap configuration.
+
+### Verify that hydration is enabled
+
+After you've configured hydration and have started up your server, load your application in the browser.
+
+HELPFUL: You will likely need to fix instances of Direct DOM Manipulation before hydration will fully work either by switching to Angular constructs or by using `ngSkipHydration`. See [Constraints](#constraints), [Direct DOM Manipulation](#direct-dom-manipulation), and [How to skip hydration for particular components](#how-to-skip-hydration-for-particular-components) for more details.
+
+While running an application in dev mode, you can confirm hydration is enabled by opening the Developer Tools in your browser and viewing the console. You should see a message that includes hydration-related stats, such as the number of components and nodes hydrated. Angular calculates the stats based on all components rendered on a page, including those that come from third-party libraries.
+
+You can also use [Angular DevTools browser extension](tools/devtools) to see hydration status of components on a page. Angular DevTools also allows to enable an overlay to indicate which parts of the page were hydrated. If there is a hydration mismatch error - DevTools would also highlight a component that caused the error.
+
+## Capturing and replaying events
+
+When an application is rendered on the server, it is visible in a browser as soon as produced HTML loads. Users may assume that they can interact with the page, but event listeners are not attached until hydration completes. Starting from v18, you can enable the Event Replay feature that allows to capture all events that happen before hydration and replay those events once hydration has completed. You can enable it using the `withEventReplay()` function, for example:
+
+```typescript
+import {provideClientHydration, withEventReplay} from '@angular/platform-browser';
+
+bootstrapApplication(App, {
+  providers: [
+    provideClientHydration(withEventReplay())
+  ]
+});
+```
+
+### How event replay works
+Event Replay is a feature that improves user experience by capturing user events that were triggered before the hydration process is complete. Then those events are replayed, ensuring none of that interaction was lost.
+
+The Event Replay is divided into three main phases:
+
+- **Capturing user interactions**<br>
+Prior to **Hydration**, Event Replay captures and stores all interactions that the user may perform, such as clicks and other browser native events.
+
+- **Storing events**<br>
+The **Event Contract** keeps in memory all the interactions recorded in the previous step, ensuring that they are not lost for later replay.
+
+- **Relaunch of events**<br>
+Once **Hydration** is complete, Angular re-invokes the captured events.
+
+Event replay supports _native browser events_, for example `click`, `mouseover`, and `focusin`. If you'd like to learn more about JSAction, the library that powers event replay, you can read more [on the readme](https://github.com/angular/angular/tree/main/packages/core/primitives/event-dispatch#readme).
+
+---
+
+This feature ensures a consistent user experience, preventing user actions performed before Hydration from being ignored. NOTE: if you have [incremental hydration](guide/incremental-hydration) enabled, event replay is automatically enabled under the hood.
+
+## Constraints
+
+Hydration imposes a few constraints on your application that are not present without hydration enabled. Your application must have the same generated DOM structure on both the server and the client. The process of hydration expects the DOM tree to have the same structure in both places. This also includes whitespaces and comment nodes that Angular produces during the rendering on the server. Those whitespaces and nodes must be present in the HTML generated by the server-side rendering process.
+
+IMPORTANT: The HTML produced by the server side rendering operation **must not** be altered between the server and the client.
+
+If there is a mismatch between server and client DOM tree structures, the hydration process will encounter problems attempting to match up what was expected to what is actually present in the DOM. Components that do direct DOM manipulation using native DOM APIs are the most common culprit.
+
+### Direct DOM Manipulation
+
+If you have components that manipulate the DOM using native DOM APIs or use `innerHTML` or `outerHTML`, the hydration process will encounter errors. Specific cases where DOM manipulation is a problem are situations like accessing the `document`, querying for specific elements, and injecting additional nodes using `appendChild`. Detaching DOM nodes and moving them to other locations will also result in errors.
+
+This is because Angular is unaware of these DOM changes and cannot resolve them during the hydration process. Angular will expect a certain structure, but it will encounter a different structure when attempting to hydrate. This mismatch will result in hydration failure and throw a DOM mismatch error ([see below](#errors)).
+
+It is best to refactor your component to avoid this sort of DOM manipulation. Try to use Angular APIs to do this work, if you can. If you cannot refactor this behavior, use the `ngSkipHydration` attribute ([described below](#how-to-skip-hydration-for-particular-components)) until you can refactor into a hydration friendly solution.
+
+### Valid HTML structure
+
+There are a few cases where if you have a component template that does not have valid HTML structure, this could result in a DOM mismatch error during hydration.
+
+As an example, here are some of the most common cases of this issue.
+
+- `<table>` without a `<tbody>`
+- `<div>` inside a `<p>`
+- `<a>` inside another `<a>`
+
+If you are uncertain about whether your HTML is valid, you can use a [syntax validator](https://validator.w3.org/) to check it.
+
+NOTE: While the HTML standard does not require the `<tbody>` element inside tables, modern browsers automatically create a `<tbody>` element in tables that do not declare one. Because of this inconsistency, always explicitly declare a `<tbody>` element in tables to avoid hydration errors.
+
+### Preserve Whitespaces Configuration
+
+When using the hydration feature, we recommend using the default setting of `false` for `preserveWhitespaces`. If this setting is not in your tsconfig, the value will be `false` and no changes are required. If you choose to enable preserving whitespaces by adding `preserveWhitespaces: true` to your tsconfig, it is possible you may encounter issues with hydration. This is not yet a fully supported configuration.
+
+HELPFUL: Make sure that this setting is set **consistently** in `tsconfig.server.json` for your server and `tsconfig.app.json` for your browser builds. A mismatched value will cause hydration to break.
+
+If you choose to set this setting in your tsconfig, we recommend to set it only in `tsconfig.app.json` which by default the `tsconfig.server.json` will inherit it from.
+
+### Custom or Noop Zone.js are not yet supported
+
+Hydration relies on a signal from Zone.js when it becomes stable inside an application, so that Angular can start the serialization process on the server or post-hydration cleanup on the client to remove DOM nodes that remained unclaimed.
+
+Providing a custom or a "noop" Zone.js implementation may lead to a different timing of the "stable" event, thus triggering the serialization or the cleanup too early or too late. This is not yet a fully supported configuration and you may need to adjust the timing of the `onStable` event in the custom Zone.js implementation.
+
+## Errors
+
+There are several hydration related errors you may encounter ranging from node mismatches to cases when the `ngSkipHydration` was used on an invalid host node. The most common error case that may occur is due to direct DOM manipulation using native APIs that results in hydration being unable to find or match the expected DOM tree structure on the client that was rendered by the server. The other case you may encounter this type of error was mentioned in the [Valid HTML structure](#valid-html-structure) section earlier. So, make sure the HTML in your templates are using valid structure, and you'll avoid that error case.
+
+For a full reference on hydration related errors, visit the [Errors Reference Guide](/errors).
+
+## How to skip hydration for particular components
+
+Some components may not work properly with hydration enabled due to some of the aforementioned issues, like [Direct DOM Manipulation](#direct-dom-manipulation). As a workaround, you can add the `ngSkipHydration` attribute to a component's tag in order to skip hydrating the entire component.
+
+```html
+<app-example ngSkipHydration />
+```
+
+Alternatively you can set `ngSkipHydration` as a host binding.
+
+```typescript
+@Component({
+  ...
+  host: {ngSkipHydration: 'true'},
+})
+class ExampleComponent {}
+```
+
+The `ngSkipHydration` attribute will force Angular to skip hydrating the entire component and its children. Using this attribute means that the component will behave as if hydration is not enabled, meaning it will destroy and re-render itself.
+
+HELPFUL: This will fix rendering issues, but it means that for this component (and its children), you don't get the benefits of hydration. You will need to adjust your component's implementation to avoid hydration-breaking patterns (i.e. Direct DOM Manipulation) to be able to remove the skip hydration annotation.
+
+The `ngSkipHydration` attribute can only be used on component host nodes. Angular throws an error if this attribute is added to other nodes.
+
+Keep in mind that adding the `ngSkipHydration` attribute to your root application component would effectively disable hydration for your entire application. Be careful and thoughtful about using this attribute. It is intended as a last resort workaround. Components that break hydration should be considered bugs that need to be fixed.
+
+## Hydration Timing and Application Stability
+
+Application stability is an important part of the hydration process. Hydration and any post-hydration processes only occur once the application has reported stability. There are a number of ways that stability can be delayed. Examples include setting timeouts and intervals, unresolved promises, and pending microtasks. In those cases, you may encounter the [Application remains unstable](errors/NG0506) error, which indicates that your app has not yet reached the stable state after 10 seconds. If you're finding that your application is not hydrating right away, take a look at what is impacting application stability and refactor to avoid causing these delays.
+
+## I18N
+
+HELPFUL: By default, Angular will skip hydration for components that use i18n blocks, effectively re-rendering those components from scratch.
+
+To enable hydration for i18n blocks, you can add [`withI18nSupport`](/api/platform-browser/withI18nSupport) to your `provideClientHydration` call.
+
+```typescript
+import {
+  bootstrapApplication,
+  provideClientHydration,
+  withI18nSupport,
+} from '@angular/platform-browser';
+...
+
+bootstrapApplication(AppComponent, {
+  providers: [provideClientHydration(withI18nSupport())]
+});
+```
+
+## Consistent rendering across server-side and client-side
+Avoid introducing `@if` blocks and other conditionals that display different content when server-side rendering than client-side rendering, such as using an `@if` block with Angular's `isPlatformBrowser` function. These rendering differences cause layout shifts, negatively impacting end-user experience and core web vitals.
+
+## Third Party Libraries with DOM Manipulation
+
+There are a number of third party libraries that depend on DOM manipulation to be able to render. D3 charts is a prime example. These libraries worked without hydration, but they may cause DOM mismatch errors when hydration is enabled. For now, if you encounter DOM mismatch errors using one of these libraries, you can add the `ngSkipHydration` attribute to the component that renders using that library.
+
+## Third Party Scripts with DOM Manipulation
+
+Many third party scripts, such as ad trackers and analytics, modify the DOM before hydration can occur. These scripts may cause hydration errors because the page no longer matches the structure expected by Angular. Prefer deferring this type of script until after hydration whenever possible. Consider using [`AfterNextRender`](api/core/afterNextRender) to delay the script until post-hydration processes have occurred.
+
+## Incremental Hydration
+
+Incremental hydration is an advanced form of hydration that allows for more granular control over when hydration happens. See the [incremental hydration guide](guide/incremental-hydration) for more information.
+# Incremental Hydration
+
+**Incremental hydration** is an advanced type of [hydration](guide/hydration) that can leave sections of your application dehydrated and _incrementally_ trigger hydration of those sections as they are needed.
+
+## Why use incremental hydration?
+
+Incremental hydration is a performance improvement that builds on top of full application hydration. It can produce smaller initial bundles while still providing an end-user experience that is comparable to a full application hydration experience. Smaller bundles improve initial load times, reducing [First Input Delay (FID)](https://web.dev/fid) and [Cumulative Layout Shift (CLS)](https://web.dev/cls).
+
+Incremental hydration also lets you use deferrable views (`@defer`) for content that may not have been deferrable before. Specifically, you can now use deferrable views for content that is above the fold. Prior to incremental hydration, putting a `@defer` block above the fold would result in placeholder content rendering and then being replaced by the `@defer` block's main template content. This would result in a layout shift. Incremental hydration means the main template of the `@defer` block will render with no layout shift on hydration.
+
+## How do you enable incremental hydration in Angular?
+
+You can enable incremental hydration for applications that already use server-side rendering (SSR) with hydration. Follow the [Angular SSR Guide](guide/ssr) to enable server-side rendering and the [Angular Hydration Guide](guide/hydration) to enable hydration first.
+
+Enable incremental hydration by adding the `withIncrementalHydration()` function to the `provideClientHydration` provider.
+
+```typescript
+import {
+  bootstrapApplication,
+  provideClientHydration,
+  withIncrementalHydration,
+} from '@angular/platform-browser';
+...
+
+bootstrapApplication(AppComponent, {
+  providers: [provideClientHydration(withIncrementalHydration())]
+});
+```
+
+Incremental Hydration depends on and enables [event replay](guide/hydration#capturing-and-replaying-events) automatically. If you already have `withEventReplay()` in your list, you can safely remove it after enabling incremental hydration.
+
+## How does incremental hydration work?
+
+Incremental hydration builds on top of full-application [hydration](guide/hydration), [deferrable views](guide/defer), and [event replay](guide/hydration#capturing-and-replaying-events). With incremental hydration, you can add additional triggers to `@defer` blocks that define incremental hydration boundaries. Adding a `hydrate` trigger to a defer block tells Angular that it should load that defer block's dependencies during server-side rendering and render the main template rather than the `@placeholder`. When client-side rendering, the dependencies are still deferred, and the defer block content stays dehydrated until its `hydrate` trigger fires. That trigger tells the defer block to fetch its dependencies and hydrate the content. Any browser events, specifically those that match listeners registered in your component, that are triggered by the user prior to hydration are queued up and replayed once the hydration process is complete.
+
+## Controlling hydration of content with triggers
+
+You can specify **hydrate triggers** that control when Angular loads and hydrates deferred content. These are additional triggers that can be used alongside regular `@defer` triggers.
+
+Each `@defer` block may have multiple hydrate event triggers, separated with a semicolon (`;`). Angular triggers hydration when _any_ of the triggers fire.
+
+There are three types of hydrate triggers: `hydrate on`, `hydrate when`, and `hydrate never`.
+
+### `hydrate on`
+
+`hydrate on` specifies a condition for when hydration is triggered for the `@defer` block.
+
+The available triggers are as follows:
+
+| Trigger                                             | Description                                                            |
+| --------------------------------------------------- | ---------------------------------------------------------------------- |
+| [`hydrate on idle`](#hydrate-on-idle)               | Triggers when the browser is idle.                                     |
+| [`hydrate on viewport`](#hydrate-on-viewport)       | Triggers when specified content enters the viewport                    |
+| [`hydrate on interaction`](#hydrate-on-interaction) | Triggers when the user interacts with specified element                |
+| [`hydrate on hover`](#hydrate-on-hover)             | Triggers when the mouse hovers over specified area                     |
+| [`hydrate on immediate`](#hydrate-on-immediate)     | Triggers immediately after non-deferred content has finished rendering |
+| [`hydrate on timer`](#hydrate-on-timer)             | Triggers after a specific duration                                     |
+
+#### `hydrate on idle`
+
+The `hydrate on idle` trigger loads the deferrable view's dependencies and hydrates the content once the browser has reached an idle state, based on `requestIdleCallback`.
+
+```html
+@defer (hydrate on idle) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+#### `hydrate on viewport`
+
+The `hydrate on viewport` trigger loads the deferrable view's dependencies and hydrates the corresponding page of the app when the specified content enters the viewport using the
+[Intersection Observer API](https://developer.mozilla.org/docs/Web/API/Intersection_Observer_API).
+
+```html
+@defer (hydrate on viewport) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+#### `hydrate on interaction`
+
+The `hydrate on interaction` trigger loads the deferrable view's dependencies and hydrates the content when the user interacts with the specified element through
+`click` or `keydown` events.
+
+```html
+@defer (hydrate on interaction) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+#### `hydrate on hover`
+
+The `hydrate on hover` trigger loads the deferrable view's dependencies and hydrates the content when the mouse has hovered over the triggered area through the
+`mouseover` and `focusin` events.
+
+```html
+@defer (hydrate on hover) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+#### `hydrate on immediate`
+
+The `hydrate on immediate` trigger loads the deferrable view's dependencies and hydrates the content immediately. This means that the deferred block loads as soon
+as all other non-deferred content has finished rendering.
+
+```html
+@defer (hydrate on immediate) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+#### `hydrate on timer`
+
+The `hydrate on timer` trigger loads the deferrable view's dependencies and hydrates the content after a specified duration.
+
+```html
+@defer (hydrate on timer(500ms)) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+The duration parameter must be specified in milliseconds (`ms`) or seconds (`s`).
+
+### `hydrate when`
+
+The `hydrate when` trigger accepts a custom conditional expression and loads the deferrable view's dependencies and hydrates the content when the
+condition becomes truthy.
+
+```html
+@defer (hydrate when condition) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+NOTE: `hydrate when` conditions only trigger when they are the top-most dehydrated `@defer` block. The condition provided for the trigger is
+specified in the parent component, which needs to exist before it can be triggered. If the parent block is dehydrated, that expression will not yet
+be resolvable by Angular.
+
+### `hydrate never`
+
+The `hydrate never` allows users to specify that the content in the defer block should remain dehydrated indefinitely, effectively becoming static
+content. Note that this applies to the initial render only. During a subsequent client-side render, a `@defer` block with `hydrate never` would
+still fetch dependencies, as hydration only applies to initial load of server-side rendered content. In the example below, subsequent client-side
+renders would load the `@defer` block dependencies on viewport.
+
+```html
+@defer (on viewport; hydrate never) {
+  <large-cmp />
+} @placeholder {
+  <div>Large component placeholder</div>
+}
+```
+
+NOTE: Using `hydrate never` prevents hydration of the entire nested subtree of a given `@defer` block. No other `hydrate` triggers fire for content nested underneath that block.
+
+## Hydrate triggers alongside regular triggers
+
+Hydrate triggers are additional triggers that are used alongside regular triggers on a `@defer` block. Hydration is an initial load optimization, and that means hydrate triggers only apply to that initial load. Any subsequent client side render will still use the regular trigger.
+
+```html
+@defer (on idle; hydrate on interaction) {
+  <example-cmp />
+} @placeholder{
+  <div>Example Placeholder</div>
+}
+```
+
+In this example, on the initial load, the `hydrate on interaction` applies. Hydration will be triggered on interaction with the `<example-cmp />` component. On any subsequent page load that is client-side rendered, for example when a user clicks a routerLink that loads a page with this component, the `on idle` will apply.
+
+## How does incremental hydration work with nested `@defer` blocks?
+
+Angular's component and dependency system is hierarchical, which means hydrating any component requires all of its parents also be hydrated. So if hydration is triggered for a child `@defer` block of a nested set of dehydrated `@defer` blocks, hydration is triggered from the top-most dehydrated `@defer` block down to the triggered child and fire in that order.
+
+```html
+@defer (hydrate on interaction) {
+  <parent-block-cmp />
+  @defer (hydrate on hover) {
+    <child-block-cmp />
+  } @placeholder {
+    <div>Child placeholder</div>
+  }
+} @placeholder{
+  <div>Parent Placeholder</div>
+}
+```
+
+In the above example, hovering over the nested `@defer` block triggers hydration. The parent `@defer` block with the `<parent-block-cmp />` hydrates first, then the child `@defer` block with `<child-block-cmp />` hydrates after.
+
+## Constraints
+
+Incremental hydration has the same constraints as full-application hydration, including limits on direct DOM manipulation and requiring valid HTML structure. Visit the [Hydration guide constraints](guide/hydration#constraints) section for more details.
+
+## Do I still need to specify `@placeholder` blocks?
+
+Yes. `@placeholder` block content is not used for incremental hydration, but a `@placeholder` is still necessary for subsequent client-side rendering cases. If your content was not on the route that was part of the initial load, then any navigation to the route that has your `@defer` block content renders like a regular `@defer` block. So the `@placeholder` is rendered in those client-side rendering cases.
+# Testing
+
+Testing your Angular application helps you check that your application is working as you expect.
+
+## Set up testing
+
+The Angular CLI downloads and installs everything you need to test an Angular application with [Jasmine testing framework](https://jasmine.github.io).
+
+The project you create with the CLI is immediately ready to test.
+Just run the [`ng test`](cli/test) CLI command:
+
+```shell
+ng test
+```
+The `ng test` command builds the application in *watch mode*,
+and launches the [Karma test runner](https://karma-runner.github.io).
+
+The console output looks like below:
+
+```shell
+02 11 2022 09:08:28.605:INFO [karma-server]: Karma v6.4.1 server started at http://localhost:9876/
+02 11 2022 09:08:28.607:INFO [launcher]: Launching browsers Chrome with concurrency unlimited
+02 11 2022 09:08:28.620:INFO [launcher]: Starting browser Chrome
+02 11 2022 09:08:31.312:INFO [Chrome]: Connected on socket -LaEYvD2R7MdcS0-AAAB with id 31534482
+Chrome: Executed 3 of 3 SUCCESS (0.193 secs / 0.172 secs)
+TOTAL: 3 SUCCESS
+```
+The last line of the log shows that Karma ran three tests that all passed.
+
+The test output is displayed in the browser using [Karma Jasmine HTML Reporter](https://github.com/dfederm/karma-jasmine-html-reporter).
+
+<img alt="Jasmine HTML Reporter in the browser" src="assets/images/guide/testing/initial-jasmine-html-reporter.png">
+
+Click on a test row to re-run just that test or click on a description to re-run the tests in the selected test group \("test suite"\).
+
+Meanwhile, the `ng test` command is watching for changes.
+
+To see this in action, make a small change to `app.component.ts` and save.
+The tests run again, the browser refreshes, and the new test results appear.
+
+## Configuration
+
+The Angular CLI takes care of Jasmine and Karma configuration for you. It constructs the full configuration in memory, based on options specified in the `angular.json` file.
+
+If you want to customize Karma, you can create a `karma.conf.js` by running the following command:
+
+```shell
+ng generate config karma
+```
+HELPFUL: Read more about Karma configuration in the [Karma configuration guide](http://karma-runner.github.io/6.4/config/configuration-file.html).
+
+### Other test frameworks
+
+You can also unit test an Angular application with other testing libraries and test runners.
+Each library and runner has its own distinctive installation procedures, configuration, and syntax.
+
+### Test file name and location
+
+Inside the `src/app` folder the Angular CLI generated a test file for the `AppComponent` named `app.component.spec.ts`.
+
+IMPORTANT: The test file extension **must be `.spec.ts`** so that tooling can identify it as a file with tests \(also known as a *spec* file\).
+
+The `app.component.ts` and `app.component.spec.ts` files are siblings in the same folder.
+The root file names \(`app.component`\) are the same for both files.
+
+Adopt these two conventions in your own projects for *every kind* of test file.
+
+#### Place your spec file next to the file it tests
+
+It's a good idea to put unit test spec files in the same folder
+as the application source code files that they test:
+
+* Such tests are painless to find
+* You see at a glance if a part of your application lacks tests
+* Nearby tests can reveal how a part works in context
+* When you move the source \(inevitable\), you remember to move the test
+* When you rename the source file \(inevitable\), you remember to rename the test file
+
+#### Place your spec files in a test folder
+
+Application integration specs can test the interactions of multiple parts
+spread across folders and modules.
+They don't really belong to any part in particular, so they don't have a
+natural home next to any one file.
+
+It's often better to create an appropriate folder for them in the `tests` directory.
+
+Of course specs that test the test helpers belong in the `test` folder,
+next to their corresponding helper files.
+
+## Testing in continuous integration
+
+One of the best ways to keep your project bug-free is through a test suite, but you might forget to run tests all the time.
+
+Continuous integration \(CI\) servers let you set up your project repository so that your tests run on every commit and pull request.
+
+To test your Angular CLI application in Continuous integration \(CI\) run the following command:
+
+```shell
+ng test --no-watch --no-progress --browsers=ChromeHeadless
+```
+## More information on testing
+
+After you've set up your application for testing, you might find the following testing guides useful.
+
+|                                                                    | Details |
+|:---                                                                |:---     |
+| [Code coverage](guide/testing/code-coverage)                       | How much of your app your tests are covering and how to specify required amounts. |
+| [Testing services](guide/testing/services)                         | How to test the services your application uses.                                   |
+| [Basics of testing components](guide/testing/components-basics)    | Basics of testing Angular components.                                             |
+| [Component testing scenarios](guide/testing/components-scenarios)  | Various kinds of component testing scenarios and use cases.                       |
+| [Testing attribute directives](guide/testing/attribute-directives) | How to test your attribute directives.                                            |
+| [Testing pipes](guide/testing/pipes)                               | How to test pipes.                                                                |
+| [Debugging tests](guide/testing/debugging)                            | Common testing bugs.                                                              |
+| [Testing utility APIs](guide/testing/utility-apis)                 | Angular testing features.                                                         |
+
+# Find out how much code you're testing
+
+The Angular CLI can run unit tests and create code coverage reports.
+Code coverage reports show you any parts of your code base that might not be properly tested by your unit tests.
+
+To generate a coverage report run the following command in the root of your project.
+
+```shell
+ng test --no-watch --code-coverage
+```
+When the tests are complete, the command creates a new `/coverage` directory in the project.
+Open the `index.html` file to see a report with your source code and code coverage values.
+
+If you want to create code-coverage reports every time you test, set the following option in the Angular CLI configuration file, `angular.json`:
+
+```json
+"test": {
+  "options": {
+    "codeCoverage": true
+  }
+}
+```
+## Code coverage enforcement
+
+The code coverage percentages let you estimate how much of your code is tested.
+If your team decides on a set minimum amount to be unit tested, enforce this minimum with the Angular CLI.
+
+For example, suppose you want the code base to have a minimum of 80% code coverage.
+To enable this, open the [Karma](https://karma-runner.github.io) test platform configuration file, `karma.conf.js`, and add the `check` property in the `coverageReporter:` key.
+
+```javascript
+coverageReporter: {
+  dir: require('path').join(__dirname, './coverage/<project-name>'),
+  subdir: '.',
+  reporters: [
+    { type: 'html' },
+    { type: 'text-summary' }
+  ],
+  check: {
+    global: {
+      statements: 80,
+      branches: 80,
+      functions: 80,
+      lines: 80
+    }
+  }
+}
+```
+HELPFUL: Read more about creating and fine tuning Karma configuration in the [testing guide](guide/testing#configuration).
+
+The `check` property causes the tool to enforce a minimum of 80% code coverage when the unit tests are run in the project.
+
+Read more on coverage configuration options in the [karma coverage documentation](https://github.com/karma-runner/karma-coverage/blob/master/docs/configuration.md).
+# Testing services
+
+To check that your services are working as you intend, you can write tests specifically for them.
+
+Services are often the smoothest files to unit test.
+Here are some synchronous and asynchronous unit tests of the `ValueService` written without assistance from Angular testing utilities.
+
+```
+## Services with dependencies
+
+Services often depend on other services that Angular injects into the constructor.
+In many cases, you can create and *inject* these dependencies by hand while calling the service's constructor.
+
+The `MasterService` is a simple example:
+
+<docs-code header="app/demo/demo.ts" path="adev/src/content/examples/testing/src/app/demo/demo.ts" visibleRegion="MasterService"/>
+
+`MasterService` delegates its only method, `getValue`, to the injected `ValueService`.
+
+Here are several ways to test it.
+
+<docs-code header="app/demo/demo.spec.ts" path="adev/src/content/examples/testing/src/app/demo/demo.spec.ts" visibleRegion="MasterService"/>
+
+The first test creates a `ValueService` with `new` and passes it to the `MasterService` constructor.
+
+However, injecting the real service rarely works well as most dependent services are difficult to create and control.
+
+Instead, mock the dependency, use a dummy value, or create a [spy](https://jasmine.github.io/tutorials/your_first_suite#section-Spies) on the pertinent service method.
+
+HELPFUL: Prefer spies as they are usually the best way to mock services.
+
+These standard testing techniques are great for unit testing services in isolation.
+
+However, you almost always inject services into application classes using Angular dependency injection and you should have tests that reflect that usage pattern.
+Angular testing utilities make it straightforward to investigate how injected services behave.
+
+## Testing services with the `TestBed`
+
+Your application relies on Angular [dependency injection (DI)](guide/di) to create services.
+When a service has a dependent service, DI finds or creates that dependent service.
+And if that dependent service has its own dependencies, DI finds-or-creates them as well.
+
+As a service *consumer*, you don't worry about any of this.
+You don't worry about the order of constructor arguments or how they're created.
+
+As a service *tester*, you must at least think about the first level of service dependencies but you *can* let Angular DI do the service creation and deal with constructor argument order when you use the `TestBed` testing utility to provide and create services.
+
+## Angular `TestBed`
+
+The `TestBed` is the most important of the Angular testing utilities.
+The `TestBed` creates a dynamically-constructed Angular *test* module that emulates an Angular [@NgModule](guide/ngmodules).
+
+The `TestBed.configureTestingModule()` method takes a metadata object that can have most of the properties of an [@NgModule](guide/ngmodules).
+
+To test a service, you set the `providers` metadata property with an array of the services that you'll test or mock.
+
+<docs-code header="app/demo/demo.testbed.spec.ts (provide ValueService in beforeEach)" path="adev/src/content/examples/testing/src/app/demo/demo.testbed.spec.ts" visibleRegion="value-service-before-each"/>
+
+Then inject it inside a test by calling `TestBed.inject()` with the service class as the argument.
+
+HELPFUL: `TestBed.get()` was deprecated as of Angular version 9.
+To help minimize breaking changes, Angular introduces a new function called `TestBed.inject()`, which you should use instead.
+
+<docs-code path="adev/src/content/examples/testing/src/app/demo/demo.testbed.spec.ts" visibleRegion="value-service-inject-it"/>
+
+Or inside the `beforeEach()` if you prefer to inject the service as part of your setup.
+
+<docs-code path="adev/src/content/examples/testing/src/app/demo/demo.testbed.spec.ts" visibleRegion="value-service-inject-before-each">
+```
+When testing a service with a dependency, provide the mock in the `providers` array.
+
+In the following example, the mock is a spy object.
+
+<docs-code path="adev/src/content/examples/testing/src/app/demo/demo.testbed.spec.ts" visibleRegion="master-service-before-each"/>
+
+The test consumes that spy in the same way it did earlier.
+
+<docs-code path="adev/src/content/examples/testing/src/app/demo/demo.testbed.spec.ts" visibleRegion="master-service-it"/>
+
+## Testing without `beforeEach()`
+
+Most test suites in this guide call `beforeEach()` to set the preconditions for each `it()` test and rely on the `TestBed` to create classes and inject services.
+
+There's another school of testing that never calls `beforeEach()` and prefers to create classes explicitly rather than use the `TestBed`.
+
+Here's how you might rewrite one of the `MasterService` tests in that style.
+
+Begin by putting re-usable, preparatory code in a *setup* function instead of `beforeEach()`.
+
+<docs-code header="app/demo/demo.spec.ts (setup)" path="adev/src/content/examples/testing/src/app/demo/demo.spec.ts" visibleRegion="no-before-each-setup"/>
+
+The `setup()` function returns an object literal with the variables, such as `masterService`, that a test might reference.
+You don't define *semi-global* variables \(for example, `let masterService: MasterService`\) in the body of the `describe()`.
+
+Then each test invokes `setup()` in its first line, before continuing with steps that manipulate the test subject and assert expectations.
+
+<docs-code path="adev/src/content/examples/testing/src/app/demo/demo.spec.ts" visibleRegion="no-before-each-test"/>
+
+Notice how the test uses [*destructuring assignment*](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment) to extract the setup variables that it needs.
+
+<docs-code path="adev/src/content/examples/testing/src/app/demo/demo.spec.ts" visibleRegion="no-before-each-setup-call"/>
+
+Many developers feel this approach is cleaner and more explicit than the traditional `beforeEach()` style.
+
+Although this testing guide follows the traditional style and the default [CLI schematics](https://github.com/angular/angular-cli) generate test files with `beforeEach()` and `TestBed`, feel free to adopt *this alternative approach* in your own projects.
+
+## Testing HTTP services
+
+Data services that make HTTP calls to remote servers typically inject and delegate to the Angular [`HttpClient`](guide/http/testing) service for XHR calls.
+
+You can test a data service with an injected `HttpClient` spy as you would test any service with a dependency.
+
+<docs-code header="app/model/hero.service.spec.ts (tests with spies)" path="adev/src/content/examples/testing/src/app/model/hero.service.spec.ts" visibleRegion="test-with-spies"/>
+
+IMPORTANT: The `HeroService` methods return `Observables`.
+You must *subscribe* to an observable to \(a\) cause it to execute and \(b\) assert that the method succeeds or fails.
+
+The `subscribe()` method takes a success \(`next`\) and fail \(`error`\) callback.
+Make sure you provide *both* callbacks so that you capture errors.
+Neglecting to do so produces an asynchronous uncaught observable error that the test runner will likely attribute to a completely different test.
+
+## `HttpClientTestingModule`
+
+Extended interactions between a data service and the `HttpClient` can be complex and difficult to mock with spies.
+
+The `HttpClientTestingModule` can make these testing scenarios more manageable.
+
+While the *code sample* accompanying this guide demonstrates `HttpClientTestingModule`, this page defers to the [Http guide](guide/http/testing), which covers testing with the `HttpClientTestingModule` in detail.
+# Basics of testing components
+
+A component, unlike all other parts of an Angular application, combines an HTML template and a TypeScript class.
+The component truly is the template and the class *working together*.
+To adequately test a component, you should test that they work together as intended.
+
+Such tests require creating the component's host element in the browser DOM, as Angular does, and investigating the component class's interaction with the DOM as described by its template.
+
+The Angular `TestBed` facilitates this kind of testing as you'll see in the following sections.
+But in many cases, *testing the component class alone*, without DOM involvement, can validate much of the component's behavior in a straightforward, more obvious way.
+
+## Component DOM testing
+
+A component is more than just its class.
+A component interacts with the DOM and with other components.
+Classes alone cannot tell you if the component is going to render properly, respond to user input and gestures, or integrate with its parent and child components.
+
+* Is `Lightswitch.clicked()` bound to anything such that the user can invoke it?
+* Is the `Lightswitch.message` displayed?
+* Can the user actually select the hero displayed by `DashboardHeroComponent`?
+* Is the hero name displayed as expected \(such as uppercase\)?
+* Is the welcome message displayed by the template of `WelcomeComponent`?
+
+These might not be troubling questions for the preceding simple components illustrated.
+But many components have complex interactions with the DOM elements described in their templates, causing HTML to appear and disappear as the component state changes.
+
+To answer these kinds of questions, you have to create the DOM elements associated with the components, you must examine the DOM to confirm that component state displays properly at the appropriate times, and you must simulate user interaction with the screen to determine whether those interactions cause the component to behave as expected.
+
+To write these kinds of test, you'll use additional features of the `TestBed` as well as other testing helpers.
+
+### CLI-generated tests
+
+The CLI creates an initial test file for you by default when you ask it to generate a new component.
+
+For example, the following CLI command generates a `BannerComponent` in the `app/banner` folder \(with inline template and styles\):
+
+```shell
+ng generate component banner --inline-template --inline-style --module app
+```
+It also generates an initial test file for the component, `banner-external.component.spec.ts`, that looks like this:
+
+<docs-code header="app/banner/banner-external.component.spec.ts (initial)" path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="v1"/>
+
+HELPFUL: Because `compileComponents` is asynchronous, it uses the [`waitForAsync`](api/core/testing/waitForAsync) utility function imported from `@angular/core/testing`.
+
+Refer to the [waitForAsync](guide/testing/components-scenarios#waitForAsync) section for more details.
+
+### Reduce the setup
+
+Only the last three lines of this file actually test the component and all they do is assert that Angular can create the component.
+
+The rest of the file is boilerplate setup code anticipating more advanced tests that *might* become necessary if the component evolves into something substantial.
+
+You'll learn about these advanced test features in the following sections.
+For now, you can radically reduce this test file to a more manageable size:
+
+<docs-code header="app/banner/banner-initial.component.spec.ts (minimal)" path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="v2"/>
+
+In this example, the metadata object passed to `TestBed.configureTestingModule` simply declares `BannerComponent`, the component to test.
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="configureTestingModule"/>
+
+HELPFUL: There's no need to declare or import anything else.
+The default test module is pre-configured with something like the `BrowserModule` from `@angular/platform-browser`.
+
+Later you'll call `TestBed.configureTestingModule()` with imports, providers, and more declarations to suit your testing needs.
+Optional `override` methods can further fine-tune aspects of the configuration.
+
+### `createComponent()`
+
+After configuring `TestBed`, you call its `createComponent()` method.
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="createComponent"/>
+
+`TestBed.createComponent()` creates an instance of the `BannerComponent`, adds a corresponding element to the test-runner DOM, and returns a [`ComponentFixture`](#componentfixture).
+
+IMPORTANT: Do not re-configure `TestBed` after calling `createComponent`.
+
+The `createComponent` method freezes the current `TestBed` definition, closing it to further configuration.
+
+You cannot call any more `TestBed` configuration methods, not `configureTestingModule()`, nor `get()`, nor any of the `override...` methods.
+If you try, `TestBed` throws an error.
+
+### `ComponentFixture`
+
+The [ComponentFixture](api/core/testing/ComponentFixture) is a test harness for interacting with the created component and its corresponding element.
+
+Access the component instance through the fixture and confirm it exists with a Jasmine expectation:
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="componentInstance"/>
+
+### `beforeEach()`
+
+You will add more tests as this component evolves.
+Rather than duplicate the `TestBed` configuration for each test, you refactor to pull the setup into a Jasmine `beforeEach()` and some supporting variables:
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="v3"/>
+
+Now add a test that gets the component's element from `fixture.nativeElement` and looks for the expected text.
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="v4-test-2"/>
+
+### `nativeElement`
+
+The value of `ComponentFixture.nativeElement` has the `any` type.
+Later you'll encounter the `DebugElement.nativeElement` and it too has the `any` type.
+
+Angular can't know at compile time what kind of HTML element the `nativeElement` is or if it even is an HTML element.
+The application might be running on a *non-browser platform*, such as the server or a [Web Worker](https://developer.mozilla.org/docs/Web/API/Web_Workers_API), where the element might have a diminished API or not exist at all.
+
+The tests in this guide are designed to run in a browser so a `nativeElement` value will always be an `HTMLElement` or one of its derived classes.
+
+Knowing that it is an `HTMLElement` of some sort, use the standard HTML `querySelector` to dive deeper into the element tree.
+
+Here's another test that calls `HTMLElement.querySelector` to get the paragraph element and look for the banner text:
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="v4-test-3"/>
+
+### `DebugElement`
+
+The Angular *fixture* provides the component's element directly through the `fixture.nativeElement`.
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="nativeElement"/>
+
+This is actually a convenience method, implemented as `fixture.debugElement.nativeElement`.
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="debugElement-nativeElement"/>
+
+There's a good reason for this circuitous path to the element.
+
+The properties of the `nativeElement` depend upon the runtime environment.
+You could be running these tests on a *non-browser* platform that doesn't have a DOM or whose DOM-emulation doesn't support the full `HTMLElement` API.
+
+Angular relies on the `DebugElement` abstraction to work safely across *all supported platforms*.
+Instead of creating an HTML element tree, Angular creates a `DebugElement` tree that wraps the *native elements* for the runtime platform.
+The `nativeElement` property unwraps the `DebugElement` and returns the platform-specific element object.
+
+Because the sample tests for this guide are designed to run only in a browser, a `nativeElement` in these tests is always an `HTMLElement` whose familiar methods and properties you can explore within a test.
+
+Here's the previous test, re-implemented with `fixture.debugElement.nativeElement`:
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="v4-test-4"/>
+
+The `DebugElement` has other methods and properties that are useful in tests, as you'll see elsewhere in this guide.
+
+You import the `DebugElement` symbol from the Angular core library.
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="import-debug-element"/>
+
+### `By.css()`
+
+Although the tests in this guide all run in the browser, some applications might run on a different platform at least some of the time.
+
+For example, the component might render first on the server as part of a strategy to make the application launch faster on poorly connected devices.
+The server-side renderer might not support the full HTML element API.
+If it doesn't support `querySelector`, the previous test could fail.
+
+The `DebugElement` offers query methods that work for all supported platforms.
+These query methods take a *predicate* function that returns `true` when a node in the `DebugElement` tree matches the selection criteria.
+
+You create a *predicate* with the help of a `By` class imported from a library for the runtime platform.
+Here's the `By` import for the browser platform:
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="import-by"/>
+
+The following example re-implements the previous test with `DebugElement.query()` and the browser's `By.css` method.
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner-initial.component.spec.ts" visibleRegion="v4-test-5"/>
+
+Some noteworthy observations:
+
+* The `By.css()` static method selects `DebugElement` nodes with a [standard CSS selector](https://developer.mozilla.org/docs/Learn/CSS/Building_blocks/Selectors 'CSS selectors').
+* The query returns a `DebugElement` for the paragraph.
+* You must unwrap that result to get the paragraph element.
+
+When you're filtering by CSS selector and only testing properties of a browser's *native element*, the `By.css` approach might be overkill.
+
+It's often more straightforward and clear to filter with a standard `HTMLElement` method such as `querySelector()` or `querySelectorAll()`.
+# Component testing scenarios
+
+This guide explores common component testing use cases.
+
+## Component binding
+
+In the example application, the `BannerComponent` presents static title text in the HTML template.
+
+After a few changes, the `BannerComponent` presents a dynamic title by binding to the component's `title` property like this.
+
+```
+As minimal as this is, you decide to add a test to confirm that component actually displays the right content where you think it should.
+
+### Query for the `<h1>`
+
+You'll write a sequence of tests that inspect the value of the `<h1>` element that wraps the *title* property interpolation binding.
+
+You update the `beforeEach` to find that element with a standard HTML `querySelector` and assign it to the `h1` variable.
+
+<docs-code header="app/banner/banner.component.spec.ts (setup)" path="adev/src/content/examples/testing/src/app/banner/banner.component.spec.ts" visibleRegion="setup"/>
+
+### `createComponent()` does not bind data
+
+For your first test you'd like to see that the screen displays the default `title`.
+Your instinct is to write a test that immediately inspects the `<h1>` like this:
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner.component.spec.ts" visibleRegion="expect-h1-default-v1"/>
+
+*That test fails* with the message:
+
+<docs-code language="javascript">
+
+expected '' to contain 'Test Tour of Heroes'.
+```
+Binding happens when Angular performs **change detection**.
+
+In production, change detection kicks in automatically when Angular creates a component or the user enters a keystroke, for example.
+
+The `TestBed.createComponent` does not trigger change detection by default; a fact confirmed in the revised test:
+
+```
+### `detectChanges()`
+
+You can tell the `TestBed` to perform data binding by calling `fixture.detectChanges()`.
+Only then does the `<h1>` have the expected title.
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner.component.spec.ts" visibleRegion="expect-h1-default"/>
+
+Delayed change detection is intentional and useful.
+It gives the tester an opportunity to inspect and change the state of the component *before Angular initiates data binding and calls [lifecycle hooks](guide/components/lifecycle)*.
+
+Here's another test that changes the component's `title` property *before* calling `fixture.detectChanges()`.
+
+<docs-code path="adev/src/content/examples/testing/src/app/banner/banner.component.spec.ts" visibleRegion="after-change"/>
+
+### Automatic change detection
+
+The `BannerComponent` tests frequently call `detectChanges`.
+Many testers prefer that the Angular test environment run change detection automatically like it does in production.
+
+That's possible by configuring the `TestBed` with the `ComponentFixtureAutoDetect` provider.
+First import it from the testing utility library:
+
+<docs-code header="app/banner/banner.component.detect-changes.spec.ts (import)" path="adev/src/content/examples/testing/src/app/banner/banner.component.detect-changes.spec.ts" visibleRegion="import-ComponentFixtureAutoDetect"/>
+
+Then add it to the `providers` array of the testing module configuration:
+
+<docs-code header="app/banner/banner.component.detect-changes.spec.ts (AutoDetect)" path="adev/src/content/examples/testing/src/app/banner/banner.component.detect-changes.spec.ts" visibleRegion="auto-detect"/>
+
+HELPFUL: You can also use the `fixture.autoDetectChanges()` function instead if you only want to enable automatic change detection
+after making updates to the state of the fixture's component. In addition, automatic change detection is on by default
+when using `provideZonelessChangeDetection` and turning it off is not recommended.
+
+Here are three tests that illustrate how automatic change detection works.
+
+<docs-code header="app/banner/banner.component.detect-changes.spec.ts (AutoDetect Tests)" path="adev/src/content/examples/testing/src/app/banner/banner.component.detect-changes.spec.ts" visibleRegion="auto-detect-tests"/>
+
+The first test shows the benefit of automatic change detection.
+
+The second and third test reveal an important limitation.
+The Angular testing environment does not run change detection synchronously when updates happen inside the test case that changed the component's `title`.
+The test must call `await fixture.whenStable` to wait for another round of change detection.
+
+HELPFUL: Angular does not know about direct updates to values that are not signals. The easiest way to ensure that
+change detection will be scheduled is to use signals for values read in the template.
+
+### Change an input value with `dispatchEvent()`
+
+To simulate user input, find the input element and set its `value` property.
+
+But there is an essential, intermediate step.
+
+Angular doesn't know that you set the input element's `value` property.
+It won't read that property until you raise the element's `input` event by calling `dispatchEvent()`.
+
+The following example demonstrates the proper sequence.
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (pipe test)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="title-case-pipe"/>
+
+## Component with external files
+
+The preceding `BannerComponent` is defined with an *inline template* and *inline css*, specified in the `@Component.template` and `@Component.styles` properties respectively.
+
+Many components specify *external templates* and *external css* with the `@Component.templateUrl` and `@Component.styleUrls` properties respectively, as the following variant of `BannerComponent` does.
+
+<docs-code header="app/banner/banner-external.component.ts (metadata)" path="adev/src/content/examples/testing/src/app/banner/banner-external.component.ts" visibleRegion="metadata"/>
+
+This syntax tells the Angular compiler to read the external files during component compilation.
+
+That's not a problem when you run the CLI `ng test` command because it *compiles the application before running the tests*.
+
+However, if you run the tests in a **non-CLI environment**, tests of this component might fail.
+For example, if you run the `BannerComponent` tests in a web coding environment such as [plunker](https://plnkr.co), you'll see a message like this one:
+
+<docs-code hideCopy language="shell">
+
+Error: This test module uses the component BannerComponent
+which is using a "templateUrl" or "styleUrls", but they were never compiled.
+Please call "TestBed.compileComponents" before your test.
+```
+You get this test failure message when the runtime environment compiles the source code *during the tests themselves*.
+
+To correct the problem, call `compileComponents()` as explained in the following [Calling compileComponents](#calling-compilecomponents) section.
+
+## Component with a dependency
+
+Components often have service dependencies.
+
+The `WelcomeComponent` displays a welcome message to the logged-in user.
+It knows who the user is based on a property of the injected `UserService`:
+
+```
+The `WelcomeComponent` has decision logic that interacts with the service, logic that makes this component worth testing.
+
+### Provide service test doubles
+
+A *component-under-test* doesn't have to be provided with real services.
+
+Injecting the real `UserService` could be difficult.
+The real service might ask the user for login credentials and attempt to reach an authentication server.
+These behaviors can be hard to intercept. Be aware that using test doubles makes the test behave differently from production so use them sparingly.
+
+### Get injected services
+
+The tests need access to the `UserService` injected into the `WelcomeComponent`.
+
+Angular has a hierarchical injection system.
+There can be injectors at multiple levels, from the root injector created by the `TestBed` down through the component tree.
+
+The safest way to get the injected service, the way that ***always works***,
+is to **get it from the injector of the *component-under-test***.
+The component injector is a property of the fixture's `DebugElement`.
+
+<docs-code header="WelcomeComponent's injector" path="adev/src/content/examples/testing/src/app/welcome/welcome.component.spec.ts" visibleRegion="injected-service"/>
+
+HELPFUL: This is _usually_ not necessary. Services are often provided in the root or the TestBed overrides and can be retrieved more easily with `TestBed.inject()` (see below).
+
+### `TestBed.inject()`
+
+This is easier to remember and less verbose than retrieving a service using the fixture's `DebugElement`.
+
+In this test suite, the *only* provider of `UserService` is the root testing module, so it is safe to call `TestBed.inject()` as follows:
+
+<docs-code header="TestBed injector" path="adev/src/content/examples/testing/src/app/welcome/welcome.component.spec.ts" visibleRegion="inject-from-testbed" />
+
+HELPFUL: For a use case in which `TestBed.inject()` does not work, see the [*Override component providers*](#override-component-providers) section that explains when and why you must get the service from the component's injector instead.
+
+### Final setup and tests
+
+Here's the complete `beforeEach()`, using `TestBed.inject()`:
+
+<docs-code header="app/welcome/welcome.component.spec.ts" path="adev/src/content/examples/testing/src/app/welcome/welcome.component.spec.ts" visibleRegion="setup"/>
+
+And here are some tests:
+
+<docs-code header="app/welcome/welcome.component.spec.ts" path="adev/src/content/examples/testing/src/app/welcome/welcome.component.spec.ts" visibleRegion="tests"/>
+
+The first is a sanity test; it confirms that the `UserService` is called and working.
+
+HELPFUL: The withContext function \(for example, `'expected name'`\) is an optional failure label.
+If the expectation fails, Jasmine appends this label to the expectation failure message.
+In a spec with multiple expectations, it can help clarify what went wrong and which expectation failed.
+
+The remaining tests confirm the logic of the component when the service returns different values.
+The second test validates the effect of changing the user name.
+The third test checks that the component displays the proper message when there is no logged-in user.
+
+## Component with async service
+
+In this sample, the `AboutComponent` template hosts a `TwainComponent`.
+The `TwainComponent` displays Mark Twain quotes.
+
+<docs-code header="app/twain/twain.component.ts (template)" path="adev/src/content/examples/testing/src/app/twain/twain.component.ts" visibleRegion="template" />
+
+HELPFUL: The value of the component's `quote` property passes through an `AsyncPipe`.
+That means the property returns either a `Promise` or an `Observable`.
+
+In this example, the `TwainComponent.getQuote()` method tells you that the `quote` property returns an `Observable`.
+
+<docs-code header="app/twain/twain.component.ts (getQuote)" path="adev/src/content/examples/testing/src/app/twain/twain.component.ts" visibleRegion="get-quote"/>
+
+The `TwainComponent` gets quotes from an injected `TwainService`.
+The component starts the returned `Observable` with a placeholder value \(`'...'`\), before the service can return its first quote.
+
+The `catchError` intercepts service errors, prepares an error message, and returns the placeholder value on the success channel.
+
+These are all features you'll want to test.
+
+### Testing with a spy
+
+When testing a component, only the service's public API should matter.
+In general, tests themselves should not make calls to remote servers.
+They should emulate such calls.
+The setup in this `app/twain/twain.component.spec.ts` shows one way to do that:
+
+<docs-code header="app/twain/twain.component.spec.ts (setup)" path="adev/src/content/examples/testing/src/app/twain/twain.component.spec.ts" visibleRegion="setup"/>
+
+Focus on the spy.
+
+<docs-code path="adev/src/content/examples/testing/src/app/twain/twain.component.spec.ts" visibleRegion="spy"/>
+
+The spy is designed such that any call to `getQuote` receives an observable with a test quote.
+Unlike the real `getQuote()` method, this spy bypasses the server and returns a synchronous observable whose value is available immediately.
+
+You can write many useful tests with this spy, even though its `Observable` is synchronous.
+
+HELPFUL: It is best to limit the usage of spies to only what is necessary for the test. Creating mocks or spies for more than what's necessary can be brittle. As the component and injectable evolves, the unrelated tests can fail because they no longer mock enough behaviors that would otherwise not affect the test.
+### Async test with `fakeAsync()`
+
+To use `fakeAsync()` functionality, you must import `zone.js/testing` in your test setup file.
+If you created your project with the Angular CLI, `zone-testing` is already imported in `src/test.ts`.
+
+The following test confirms the expected behavior when the service returns an `ErrorObservable`.
+
+<docs-code path="adev/src/content/examples/testing/src/app/twain/twain.component.spec.ts" visibleRegion="error-test"/>
+
+HELPFUL: The `it()` function receives an argument of the following form.
+
+<docs-code language="javascript">
+
+fakeAsync(() => { /*test body*/ })
+```
+The `fakeAsync()` function enables a linear coding style by running the test body in a special `fakeAsync test zone`.
+The test body appears to be synchronous.
+There is no nested syntax \(like a `Promise.then()`\) to disrupt the flow of control.
+
+HELPFUL: Limitation: The `fakeAsync()` function won't work if the test body makes an `XMLHttpRequest` \(XHR\) call.
+XHR calls within a test are rare, but if you need to call XHR, see the [`waitForAsync()`](#waitForAsync) section.
+
+IMPORTANT: Be aware that asynchronous tasks that happen inside the `fakeAsync` zone need to be manually executed with `flush` or `tick`. If you attempt to
+wait for them to complete (i.e. using `fixture.whenStable`) without using the
+`fakeAsync` test helpers to advance time, your test will likely fail. See below for more information.
+
+### The `tick()` function
+
+You do have to call [tick()](api/core/testing/tick) to advance the virtual clock.
+
+Calling [tick()](api/core/testing/tick) simulates the passage of time until all pending asynchronous activities finish.
+In this case, it waits for the observable's `setTimeout()`.
+
+The [tick()](api/core/testing/tick) function accepts `millis` and `tickOptions` as parameters. The `millis` parameter specifies how much the virtual clock advances and defaults to `0` if not provided.
+For example, if you have a `setTimeout(fn, 100)` in a `fakeAsync()` test, you need to use `tick(100)` to trigger the fn callback.
+The optional `tickOptions` parameter has a property named `processNewMacroTasksSynchronously`. The `processNewMacroTasksSynchronously` property represents whether to invoke new generated macro tasks when ticking and defaults to `true`.
+
+```
+The [tick()](api/core/testing/tick) function is one of the Angular testing utilities that you import with `TestBed`.
+It's a companion to `fakeAsync()` and you can only call it within a `fakeAsync()` body.
+
+### tickOptions
+
+In this example, you have a new macro task, the nested `setTimeout` function. By default, when the `tick` is setTimeout, `outside` and `nested` will both be triggered.
+
+<docs-code path="adev/src/content/examples/testing/src/app/demo/async-helper.spec.ts" visibleRegion="fake-async-test-tick-new-macro-task-sync"/>
+
+In some case, you don't want to trigger the new macro task when ticking. You can use `tick(millis, {processNewMacroTasksSynchronously: false})` to not invoke a new macro task.
+
+<docs-code path="adev/src/content/examples/testing/src/app/demo/async-helper.spec.ts" visibleRegion="fake-async-test-tick-new-macro-task-async"/>
+
+### Comparing dates inside fakeAsync()
+
+`fakeAsync()` simulates passage of time, which lets you calculate the difference between dates inside `fakeAsync()`.
+
+<docs-code path="adev/src/content/examples/testing/src/app/demo/async-helper.spec.ts" visibleRegion="fake-async-test-date"/>
+
+### jasmine.clock with fakeAsync()
+
+Jasmine also provides a `clock` feature to mock dates.
+Angular automatically runs tests that are run after `jasmine.clock().install()` is called inside a `fakeAsync()` method until `jasmine.clock().uninstall()` is called.
+`fakeAsync()` is not needed and throws an error if nested.
+
+By default, this feature is disabled.
+To enable it, set a global flag before importing `zone-testing`.
+
+If you use the Angular CLI, configure this flag in `src/test.ts`.
+
+<docs-code language="typescript">
+
+[window as any]('&lowbar;&lowbar;zone&lowbar;symbol__fakeAsyncPatchLock') = true;
+import 'zone.js/testing';
+```
+```
+### Using the RxJS scheduler inside fakeAsync()
+
+You can also use RxJS scheduler in `fakeAsync()` just like using `setTimeout()` or `setInterval()`, but you need to import `zone.js/plugins/zone-patch-rxjs-fake-async` to patch RxJS scheduler.
+
+<docs-code path="adev/src/content/examples/testing/src/app/demo/async-helper.spec.ts" visibleRegion="fake-async-test-rxjs"/>
+
+### Support more macroTasks
+
+By default, `fakeAsync()` supports the following macro tasks.
+
+* `setTimeout`
+* `setInterval`
+* `requestAnimationFrame`
+* `webkitRequestAnimationFrame`
+* `mozRequestAnimationFrame`
+
+If you run other macro tasks such as `HTMLCanvasElement.toBlob()`, an *"Unknown macroTask scheduled in fake async test"* error is thrown.
+If you want to support such a case, you need to define the macro task you want to support in `beforeEach()`.
+For example:
+
+<docs-code header="src/app/shared/canvas.component.spec.ts (excerpt)" path="adev/src/content/examples/testing/src/app/shared/canvas.component.spec.ts" visibleRegion="enable-toBlob-macrotask"/>
+
+HELPFUL: In order to make the `<canvas>` element Zone.js-aware in your app, you need to import the `zone-patch-canvas` patch \(either in `polyfills.ts` or in the specific file that uses `<canvas>`\):
+
+<docs-code header="src/polyfills.ts or src/app/shared/canvas.component.ts" path="adev/src/content/examples/testing/src/app/shared/canvas.component.ts" visibleRegion="import-canvas-patch"/>
+
+### Async observables
+
+You might be satisfied with the test coverage of these tests.
+
+However, you might be troubled by the fact that the real service doesn't quite behave this way.
+The real service sends requests to a remote server.
+A server takes time to respond and the response certainly won't be available immediately as in the previous two tests.
+
+Your tests will reflect the real world more faithfully if you return an *asynchronous* observable from the `getQuote()` spy like this.
+
+<docs-code path="adev/src/content/examples/testing/src/app/twain/twain.component.spec.ts" visibleRegion="async-setup"/>
+
+### Async observable helpers
+
+The async observable was produced by an `asyncData` helper.
+The `asyncData` helper is a utility function that you'll have to write yourself, or copy this one from the sample code.
+
+<docs-code header="testing/async-observable-helpers.ts" path="adev/src/content/examples/testing/src/testing/async-observable-helpers.ts" visibleRegion="async-data"/>
+
+This helper's observable emits the `data` value in the next turn of the JavaScript engine.
+
+The [RxJS `defer()` operator](http://reactivex.io/documentation/operators/defer.html) returns an observable.
+It takes a factory function that returns either a promise or an observable.
+When something subscribes to *defer*'s observable, it adds the subscriber to a new observable created with that factory.
+
+The `defer()` operator transforms the `Promise.resolve()` into a new observable that, like `HttpClient`, emits once and completes.
+Subscribers are unsubscribed after they receive the data value.
+
+There's a similar helper for producing an async error.
+
+<docs-code path="adev/src/content/examples/testing/src/testing/async-observable-helpers.ts" visibleRegion="async-error"/>
+
+### More async tests
+
+Now that the `getQuote()` spy is returning async observables, most of your tests will have to be async as well.
+
+Here's a `fakeAsync()` test that demonstrates the data flow you'd expect in the real world.
+
+<docs-code path="adev/src/content/examples/testing/src/app/twain/twain.component.spec.ts" visibleRegion="fake-async-test"/>
+
+Notice that the quote element displays the placeholder value \(`'...'`\) after `ngOnInit()`.
+The first quote hasn't arrived yet.
+
+To flush the first quote from the observable, you call [tick()](api/core/testing/tick).
+Then call `detectChanges()` to tell Angular to update the screen.
+
+Then you can assert that the quote element displays the expected text.
+
+### Async test without `fakeAsync()`
+
+Here's the previous `fakeAsync()` test, re-written with the `async`.
+
+<docs-code path="adev/src/content/examples/testing/src/app/twain/twain.component.spec.ts" visibleRegion="async-test"/>
+
+### `whenStable`
+
+The test must wait for the `getQuote()` observable to emit the next quote.
+Instead of calling [tick()](api/core/testing/tick), it calls `fixture.whenStable()`.
+
+The `fixture.whenStable()` returns a promise that resolves when the JavaScript engine's task queue becomes empty.
+In this example, the task queue becomes empty when the observable emits the first quote.
+## Component with inputs and outputs
+
+A component with inputs and outputs typically appears inside the view template of a host component.
+The host uses a property binding to set the input property and an event binding to listen to events raised by the output property.
+
+The testing goal is to verify that such bindings work as expected.
+The tests should set input values and listen for output events.
+
+The `DashboardHeroComponent` is a tiny example of a component in this role.
+It displays an individual hero provided by the `DashboardComponent`.
+Clicking that hero tells the `DashboardComponent` that the user has selected the hero.
+
+The `DashboardHeroComponent` is embedded in the `DashboardComponent` template like this:
+
+<docs-code header="app/dashboard/dashboard.component.html (excerpt)" path="adev/src/content/examples/testing/src/app/dashboard/dashboard.component.html" visibleRegion="dashboard-hero"/>
+
+The `DashboardHeroComponent` appears in an `@for` block, which sets each component's `hero` input property to the looping value and listens for the component's `selected` event.
+
+Here's the component's full definition:
+
+<docs-code header="app/dashboard/dashboard-hero.component.ts (component)" path="adev/src/content/examples/testing/src/app/dashboard/dashboard-hero.component.ts" visibleRegion="component"/>
+
+While testing a component this simple has little intrinsic value, it's worth knowing how.
+Use one of these approaches:
+
+* Test it as used by `DashboardComponent`
+* Test it as a standalone component
+* Test it as used by a substitute for `DashboardComponent`
+
+The immediate goal is to test the `DashboardHeroComponent`, not the `DashboardComponent`, so, try the second and third options.
+
+### Test `DashboardHeroComponent` standalone
+
+Here's the meat of the spec file setup.
+
+<docs-code header="app/dashboard/dashboard-hero.component.spec.ts (setup)" path="adev/src/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts" visibleRegion="setup"/>
+
+Notice how the setup code assigns a test hero \(`expectedHero`\) to the component's `hero` property, emulating the way the `DashboardComponent` would set it using the property binding in its repeater.
+
+The following test verifies that the hero name is propagated to the template using a binding.
+
+<docs-code path="adev/src/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts" visibleRegion="name-test"/>
+
+Because the [template](#dashboard-hero-component) passes the hero name through the Angular `UpperCasePipe`, the test must match the element value with the upper-cased name.
+
+### Clicking
+
+Clicking the hero should raise a `selected` event that the host component \(`DashboardComponent` presumably\) can hear:
+
+<docs-code path="adev/src/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts" visibleRegion="click-test"/>
+
+The component's `selected` property returns an `EventEmitter`, which looks like an RxJS synchronous `Observable` to consumers.
+The test subscribes to it *explicitly* just as the host component does *implicitly*.
+
+If the component behaves as expected, clicking the hero's element should tell the component's `selected` property to emit the `hero` object.
+
+The test detects that event through its subscription to `selected`.
+
+### `triggerEventHandler`
+
+The `heroDe` in the previous test is a `DebugElement` that represents the hero `<div>`.
+
+It has Angular properties and methods that abstract interaction with the native element.
+This test calls the `DebugElement.triggerEventHandler` with the "click" event name.
+The "click" event binding responds by calling `DashboardHeroComponent.click()`.
+
+The Angular `DebugElement.triggerEventHandler` can raise *any data-bound event* by its *event name*.
+The second parameter is the event object passed to the handler.
+
+The test triggered a "click" event.
+
+<docs-code path="adev/src/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts" visibleRegion="trigger-event-handler"/>
+
+In this case, the test correctly assumes that the runtime event handler, the component's `click()` method, doesn't care about the event object.
+
+HELPFUL: Other handlers are less forgiving.
+For example, the `RouterLink` directive expects an object with a `button` property that identifies which mouse button, if any, was pressed during the click.
+The `RouterLink` directive throws an error if the event object is missing.
+
+### Click the element
+
+The following test alternative calls the native element's own `click()` method, which is perfectly fine for *this component*.
+
+<docs-code path="adev/src/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts" visibleRegion="click-test-2"/>
+
+### `click()` helper
+
+Clicking a button, an anchor, or an arbitrary HTML element is a common test task.
+
+Make that consistent and straightforward by encapsulating the *click-triggering* process in a helper such as the following `click()` function:
+
+<docs-code header="testing/index.ts (click helper)" path="adev/src/content/examples/testing/src/testing/index.ts" visibleRegion="click-event"/>
+
+The first parameter is the *element-to-click*.
+If you want, pass a custom event object as the second parameter.
+The default is a partial [left-button mouse event object](https://developer.mozilla.org/docs/Web/API/MouseEvent/button) accepted by many handlers including the `RouterLink` directive.
+
+IMPORTANT: The `click()` helper function is **not** one of the Angular testing utilities.
+It's a function defined in *this guide's sample code*.
+All of the sample tests use it.
+If you like it, add it to your own collection of helpers.
+
+Here's the previous test, rewritten using the click helper.
+
+<docs-code header="app/dashboard/dashboard-hero.component.spec.ts (test with click helper)" path="adev/src/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts" visibleRegion="click-test-3"/>
+
+## Component inside a test host
+
+The previous tests played the role of the host `DashboardComponent` themselves.
+But does the `DashboardHeroComponent` work correctly when properly data-bound to a host component?
+
+<docs-code header="app/dashboard/dashboard-hero.component.spec.ts (test host)" path="adev/src/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts" visibleRegion="test-host"/>
+
+The test host sets the component's `hero` input property with its test hero.
+It binds the component's `selected` event with its `onSelected` handler, which records the emitted hero in its `selectedHero` property.
+
+Later, the tests will be able to check `selectedHero` to verify that the `DashboardHeroComponent.selected` event emitted the expected hero.
+
+The setup for the `test-host` tests is similar to the setup for the stand-alone tests:
+
+<docs-code header="app/dashboard/dashboard-hero.component.spec.ts (test host setup)" path="adev/src/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts" visibleRegion="test-host-setup"/>
+
+This testing module configuration shows three important differences:
+
+* It *imports* both the `DashboardHeroComponent` and the `TestHostComponent`
+* It *creates* the `TestHostComponent` instead of the `DashboardHeroComponent`
+* The `TestHostComponent` sets the `DashboardHeroComponent.hero` with a binding
+
+The `createComponent` returns a `fixture` that holds an instance of `TestHostComponent` instead of an instance of `DashboardHeroComponent`.
+
+Creating the `TestHostComponent` has the side effect of creating a `DashboardHeroComponent` because the latter appears within the template of the former.
+The query for the hero element \(`heroEl`\) still finds it in the test DOM, albeit at greater depth in the element tree than before.
+
+The tests themselves are almost identical to the stand-alone version:
+
+<docs-code header="app/dashboard/dashboard-hero.component.spec.ts (test-host)" path="adev/src/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts" visibleRegion="test-host-tests"/>
+
+Only the selected event test differs.
+It confirms that the selected `DashboardHeroComponent` hero really does find its way up through the event binding to the host component.
+
+## Routing component
+
+A *routing component* is a component that tells the `Router` to navigate to another component.
+The `DashboardComponent` is a *routing component* because the user can navigate to the `HeroDetailComponent` by clicking on one of the *hero buttons* on the dashboard.
+
+Angular provides test helpers to reduce boilerplate and more effectively test code which depends on `HttpClient`. The `provideRouter` function can be used directly in the test module as well.
+
+<docs-code header="app/dashboard/dashboard.component.spec.ts" path="adev/src/content/examples/testing/src/app/dashboard/dashboard.component.spec.ts" visibleRegion="router-harness"/>
+
+The following test clicks the displayed hero and confirms that we navigate to the expected URL.
+
+<docs-code header="app/dashboard/dashboard.component.spec.ts (navigate test)" path="adev/src/content/examples/testing/src/app/dashboard/dashboard.component.spec.ts" visibleRegion="navigate-test"/>
+
+## Routed components
+
+A *routed component* is the destination of a `Router` navigation.
+It can be trickier to test, especially when the route to the component *includes parameters*.
+The `HeroDetailComponent` is a *routed component* that is the destination of such a route.
+
+When a user clicks a *Dashboard* hero, the `DashboardComponent` tells the `Router` to navigate to `heroes/:id`.
+The `:id` is a route parameter whose value is the `id` of the hero to edit.
+
+The `Router` matches that URL to a route to the `HeroDetailComponent`.
+It creates an `ActivatedRoute` object with the routing information and injects it into a new instance of the `HeroDetailComponent`.
+
+Here are the services injected into `HeroDetailComponent`:
+
+<docs-code header="app/hero/hero-detail.component.ts (inject)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.ts" visibleRegion="inject"/>
+
+The `HeroDetail` component needs the `id` parameter so it can fetch the corresponding hero using the `HeroDetailService`.
+The component has to get the `id` from the `ActivatedRoute.paramMap` property which is an `Observable`.
+
+It can't just reference the `id` property of the `ActivatedRoute.paramMap`.
+The component has to *subscribe* to the `ActivatedRoute.paramMap` observable and be prepared for the `id` to change during its lifetime.
+
+<docs-code header="app/hero/hero-detail.component.ts (constructor)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.ts" visibleRegion="ctor"/>
+
+Tests can explore how the `HeroDetailComponent` responds to different `id` parameter values by navigating to different routes.
+
+### Testing with the `RouterTestingHarness`
+
+Here's a test demonstrating the component's behavior when the observed `id` refers to an existing hero:
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (existing id)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="route-good-id"/>
+
+HELPFUL: In the following section, the `createComponent()` method and `page` object are discussed.
+Rely on your intuition for now.
+
+When the `id` cannot be found, the component should re-route to the `HeroListComponent`.
+
+The test suite setup provided the same router harness [described above](#routing-component).
+
+This test expects the component to try to navigate to the `HeroListComponent`.
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (bad id)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="route-bad-id"/>
+
+## Nested component tests
+
+Component templates often have nested components, whose templates might contain more components.
+
+The component tree can be very deep and sometimes the nested components play no role in testing the component at the top of the tree.
+
+The `AppComponent`, for example, displays a navigation bar with anchors and their `RouterLink` directives.
+
+<docs-code header="app/app.component.html" path="adev/src/content/examples/testing/src/app/app.component.html"/>
+
+To validate the links but not the navigation, you don't need the `Router` to navigate and you don't need the `<router-outlet>` to mark where the `Router` inserts *routed components*.
+
+The `BannerComponent` and `WelcomeComponent` \(indicated by `<app-banner>` and `<app-welcome>`\) are also irrelevant.
+
+Yet any test that creates the `AppComponent` in the DOM also creates instances of these three components and, if you let that happen, you'll have to configure the `TestBed` to create them.
+
+If you neglect to declare them, the Angular compiler won't recognize the `<app-banner>`, `<app-welcome>`, and `<router-outlet>` tags in the `AppComponent` template and will throw an error.
+
+If you declare the real components, you'll also have to declare *their* nested components and provide for *all* services injected in *any* component in the tree.
+
+This section describes two techniques for minimizing the setup.
+Use them, alone or in combination, to stay focused on testing the primary component.
+
+### Stubbing unneeded components
+
+In the first technique, you create and declare stub versions of the components and directive that play little or no role in the tests.
+
+<docs-code header="app/app.component.spec.ts (stub declaration)" path="adev/src/content/examples/testing/src/app/app.component.spec.ts" visibleRegion="component-stubs"/>
+
+The stub selectors match the selectors for the corresponding real components.
+But their templates and classes are empty.
+
+Then declare them in the `TestBed` configuration next to the components, directives, and pipes that need to be real.
+
+<docs-code header="app/app.component.spec.ts (TestBed stubs)" path="adev/src/content/examples/testing/src/app/app.component.spec.ts" visibleRegion="testbed-stubs"/>
+
+The `AppComponent` is the test subject, so of course you declare the real version.
+
+The rest are stubs.
+
+### `NO_ERRORS_SCHEMA`
+
+In the second approach, add `NO_ERRORS_SCHEMA` to the `TestBed.schemas` metadata.
+
+<docs-code header="app/app.component.spec.ts (NO_ERRORS_SCHEMA)" path="adev/src/content/examples/testing/src/app/app.component.spec.ts" visibleRegion="no-errors-schema"/>
+
+The `NO_ERRORS_SCHEMA` tells the Angular compiler to ignore unrecognized elements and attributes.
+
+The compiler recognizes the `<app-root>` element and the `routerLink` attribute because you declared a corresponding `AppComponent` and `RouterLink` in the `TestBed` configuration.
+
+But the compiler won't throw an error when it encounters `<app-banner>`, `<app-welcome>`, or `<router-outlet>`.
+It simply renders them as empty tags and the browser ignores them.
+
+You no longer need the stub components.
+
+### Use both techniques together
+
+These are techniques for *Shallow Component Testing*, so-named because they reduce the visual surface of the component to just those elements in the component's template that matter for tests.
+
+The `NO_ERRORS_SCHEMA` approach is the easier of the two but don't overuse it.
+
+The `NO_ERRORS_SCHEMA` also prevents the compiler from telling you about the missing components and attributes that you omitted inadvertently or misspelled.
+You could waste hours chasing phantom bugs that the compiler would have caught in an instant.
+
+The *stub component* approach has another advantage.
+While the stubs in *this* example were empty, you could give them stripped-down templates and classes if your tests need to interact with them in some way.
+
+In practice you will combine the two techniques in the same setup, as seen in this example.
+
+<docs-code header="app/app.component.spec.ts (mixed setup)" path="adev/src/content/examples/testing/src/app/app.component.spec.ts" visibleRegion="mixed-setup"/>
+
+The Angular compiler creates the `BannerStubComponent` for the `<app-banner>` element and applies the `RouterLink` to the anchors with the `routerLink` attribute, but it ignores the `<app-welcome>` and `<router-outlet>` tags.
+
+### `By.directive` and injected directives
+
+A little more setup triggers the initial data binding and gets references to the navigation links:
+
+<docs-code header="app/app.component.spec.ts (test setup)" path="adev/src/content/examples/testing/src/app/app.component.spec.ts" visibleRegion="test-setup"/>
+
+Three points of special interest:
+
+* Locate the anchor elements with an attached directive using `By.directive`
+* The query returns `DebugElement` wrappers around the matching elements
+* Each `DebugElement` exposes a dependency injector with the specific instance of the directive attached to that element
+
+The `AppComponent` links to validate are as follows:
+
+<docs-code header="app/app.component.html (navigation links)" path="adev/src/content/examples/testing/src/app/app.component.html" visibleRegion="links"/>
+
+Here are some tests that confirm those links are wired to the `routerLink` directives as expected:
+
+<docs-code header="app/app.component.spec.ts (selected tests)" path="adev/src/content/examples/testing/src/app/app.component.spec.ts" visibleRegion="tests"/>
+
+## Use a `page` object
+
+The `HeroDetailComponent` is a simple view with a title, two hero fields, and two buttons.
+
+But there's plenty of template complexity even in this simple form.
+
+<docs-code
+  path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.html" header="app/hero/hero-detail.component.html"/>
+
+Tests that exercise the component need …
+
+* To wait until a hero arrives before elements appear in the DOM
+* A reference to the title text
+* A reference to the name input box to inspect and set it
+* References to the two buttons so they can click them
+
+Even a small form such as this one can produce a mess of tortured conditional setup and CSS element selection.
+
+Tame the complexity with a `Page` class that handles access to component properties and encapsulates the logic that sets them.
+
+Here is such a `Page` class for the `hero-detail.component.spec.ts`
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (Page)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="page"/>
+
+Now the important hooks for component manipulation and inspection are neatly organized and accessible from an instance of `Page`.
+
+A `createComponent` method creates a `page` object and fills in the blanks once the `hero` arrives.
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (createComponent)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="create-component"/>
+
+Here are a few more `HeroDetailComponent` tests to reinforce the point.
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (selected tests)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="selected-tests"/>
+
+## Calling `compileComponents()`
+
+HELPFUL: Ignore this section if you *only* run tests with the CLI `ng test` command because the CLI compiles the application before running the tests.
+
+If you run tests in a **non-CLI environment**, the tests might fail with a message like this one:
+
+<docs-code hideCopy language="shell">
+
+Error: This test module uses the component BannerComponent
+which is using a "templateUrl" or "styleUrls", but they were never compiled.
+Please call "TestBed.compileComponents" before your test.
+```
+The root of the problem is at least one of the components involved in the test specifies an external template or CSS file as the following version of the `BannerComponent` does.
+
+```
+The test fails when the `TestBed` tries to create the component.
+
+<docs-code avoid header="app/banner/banner-external.component.spec.ts (setup that fails)" path="adev/src/content/examples/testing/src/app/banner/banner-external.component.spec.ts" visibleRegion="setup-may-fail"/>
+
+Recall that the application hasn't been compiled.
+So when you call `createComponent()`, the `TestBed` compiles implicitly.
+
+That's not a problem when the source code is in memory.
+But the `BannerComponent` requires external files that the compiler must read from the file system, an inherently *asynchronous* operation.
+
+If the `TestBed` were allowed to continue, the tests would run and fail mysteriously before the compiler could finish.
+
+The preemptive error message tells you to compile explicitly with `compileComponents()`.
+
+### `compileComponents()` is async
+
+You must call `compileComponents()` within an asynchronous test function.
+
+CRITICAL: If you neglect to make the test function async (for example, forget to use `waitForAsync()` as described), you'll see this error message
+
+<docs-code hideCopy language="shell">
+
+Error: ViewDestroyedError: Attempt to use a destroyed view
+```
+A typical approach is to divide the setup logic into two separate `beforeEach()` functions:
+
+| Functions                   | Details                      |
+| :-------------------------- | :--------------------------- |
+| Asynchronous `beforeEach()` | Compiles the components      |
+| Synchronous `beforeEach()`  | Performs the remaining setup |
+
+### The async `beforeEach`
+
+Write the first async `beforeEach` like this.
+
+```
+The `TestBed.configureTestingModule()` method returns the `TestBed` class so you can chain calls to other `TestBed` static methods such as `compileComponents()`.
+
+In this example, the `BannerComponent` is the only component to compile.
+Other examples configure the testing module with multiple components and might import application modules that hold yet more components.
+Any of them could require external files.
+
+The `TestBed.compileComponents` method asynchronously compiles all components configured in the testing module.
+
+IMPORTANT: Do not re-configure the `TestBed` after calling `compileComponents()`.
+
+Calling `compileComponents()` closes the current `TestBed` instance to further configuration.
+You cannot call any more `TestBed` configuration methods, not `configureTestingModule()` nor any of the `override...` methods.
+The `TestBed` throws an error if you try.
+
+Make `compileComponents()` the last step before calling `TestBed.createComponent()`.
+
+### The synchronous `beforeEach`
+
+The second, synchronous `beforeEach()` contains the remaining setup steps, which include creating the component and querying for elements to inspect.
+
+<docs-code header="app/banner/banner-external.component.spec.ts (synchronous beforeEach)" path="adev/src/content/examples/testing/src/app/banner/banner-external.component.spec.ts" visibleRegion="sync-before-each"/>
+
+Count on the test runner to wait for the first asynchronous `beforeEach` to finish before calling the second.
+
+### Consolidated setup
+
+You can consolidate the two `beforeEach()` functions into a single, async `beforeEach()`.
+
+The `compileComponents()` method returns a promise so you can perform the synchronous setup tasks *after* compilation by moving the synchronous code after the `await` keyword, where the promise has been resolved.
+
+<docs-code header="app/banner/banner-external.component.spec.ts (one beforeEach)" path="adev/src/content/examples/testing/src/app/banner/banner-external.component.spec.ts" visibleRegion="one-before-each"/>
+
+### `compileComponents()` is harmless
+
+There's no harm in calling `compileComponents()` when it's not required.
+
+The component test file generated by the CLI calls `compileComponents()` even though it is never required when running `ng test`.
+
+The tests in this guide only call `compileComponents` when necessary.
+
+## Setup with module imports
+
+Earlier component tests configured the testing module with a few `declarations` like this:
+
+<docs-code header="app/dashboard/dashboard-hero.component.spec.ts (configure TestBed)" path="adev/src/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts" visibleRegion="config-testbed"/>
+
+The `DashboardComponent` is simple.
+It needs no help.
+But more complex components often depend on other components, directives, pipes, and providers and these must be added to the testing module too.
+
+Fortunately, the `TestBed.configureTestingModule` parameter parallels the metadata passed to the `@NgModule` decorator which means you can also specify `providers` and `imports`.
+
+The `HeroDetailComponent` requires a lot of help despite its small size and simple construction.
+In addition to the support it receives from the default testing module `CommonModule`, it needs:
+
+* `NgModel` and friends in the `FormsModule` to enable two-way data binding
+* The `TitleCasePipe` from the `shared` folder
+* The Router services
+* The Hero data access services
+
+One approach is to configure the testing module from the individual pieces as in this example:
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (FormsModule setup)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="setup-forms-module"/>
+
+HELPFUL: Notice that the `beforeEach()` is asynchronous and calls `TestBed.compileComponents` because the `HeroDetailComponent` has an external template and css file.
+
+As explained in [Calling `compileComponents()`](#calling-compilecomponents), these tests could be run in a non-CLI environment where Angular would have to compile them in the browser.
+
+### Import a shared module
+
+Because many application components need the `FormsModule` and the `TitleCasePipe`, the developer created a `SharedModule` to combine these and other frequently requested parts.
+
+The test configuration can use the `SharedModule` too as seen in this alternative setup:
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (SharedModule setup)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="setup-shared-module"/>
+
+It's a bit tighter and smaller, with fewer import statements, which are not shown in this example.
+
+### Import a feature module
+
+The `HeroDetailComponent` is part of the `HeroModule` [Feature Module](guide/ngmodules/feature-modules) that aggregates more of the interdependent pieces including the `SharedModule`.
+Try a test configuration that imports the `HeroModule` like this one:
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (HeroModule setup)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="setup-hero-module"/>
+
+Only the *test doubles* in the `providers` remain.
+Even the `HeroDetailComponent` declaration is gone.
+
+In fact, if you try to declare it, Angular will throw an error because `HeroDetailComponent` is declared in both the `HeroModule` and the `DynamicTestModule` created by the `TestBed`.
+
+HELPFUL: Importing the component's feature module can be the best way to configure tests when there are many mutual dependencies within the module and the module is small, as feature modules tend to be.
+
+## Override component providers
+
+The `HeroDetailComponent` provides its own `HeroDetailService`.
+
+<docs-code header="app/hero/hero-detail.component.ts (prototype)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.ts" visibleRegion="prototype"/>
+
+It's not possible to stub the component's `HeroDetailService` in the `providers` of the `TestBed.configureTestingModule`.
+Those are providers for the *testing module*, not the component.
+They prepare the dependency injector at the *fixture level*.
+
+Angular creates the component with its *own* injector, which is a *child* of the fixture injector.
+It registers the component's providers \(the `HeroDetailService` in this case\) with the child injector.
+
+A test cannot get to child injector services from the fixture injector.
+And `TestBed.configureTestingModule` can't configure them either.
+
+Angular has created new instances of the real `HeroDetailService` all along!
+
+HELPFUL: These tests could fail or timeout if the `HeroDetailService` made its own XHR calls to a remote server.
+There might not be a remote server to call.
+
+Fortunately, the `HeroDetailService` delegates responsibility for remote data access to an injected `HeroService`.
+
+<docs-code header="app/hero/hero-detail.service.ts (prototype)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.service.ts" visibleRegion="prototype"/>
+
+The [previous test configuration](#import-a-feature-module) replaces the real `HeroService` with a `TestHeroService` that intercepts server requests and fakes their responses.
+
+What if you aren't so lucky.
+What if faking the `HeroService` is hard?
+What if `HeroDetailService` makes its own server requests?
+
+The `TestBed.overrideComponent` method can replace the component's `providers` with easy-to-manage *test doubles* as seen in the following setup variation:
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (Override setup)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="setup-override"/>
+
+Notice that `TestBed.configureTestingModule` no longer provides a fake `HeroService` because it's [not needed](#spy-stub).
+
+### The `overrideComponent` method
+
+Focus on the `overrideComponent` method.
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (overrideComponent)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="override-component-method"/>
+
+It takes two arguments: the component type to override \(`HeroDetailComponent`\) and an override metadata object.
+The [override metadata object](guide/testing/utility-apis#metadata-override-object) is a generic defined as follows:
+
+<docs-code language="javascript">
+
+type MetadataOverride<T> = {
+  add?: Partial<T>;
+  remove?: Partial<T>;
+  set?: Partial<T>;
+};
+```
+A metadata override object can either add-and-remove elements in metadata properties or completely reset those properties.
+This example resets the component's `providers` metadata.
+
+The type parameter, `T`, is the kind of metadata you'd pass to the `@Component` decorator:
+
+```javascript
+selector?: string;
+template?: string;
+templateUrl?: string;
+providers?: any[];
+…
+```
+### Provide a *spy stub* (`HeroDetailServiceSpy`)
+
+This example completely replaces the component's `providers` array with a new array containing a `HeroDetailServiceSpy`.
+
+The `HeroDetailServiceSpy` is a stubbed version of the real `HeroDetailService` that fakes all necessary features of that service.
+It neither injects nor delegates to the lower level `HeroService` so there's no need to provide a test double for that.
+
+The related `HeroDetailComponent` tests will assert that methods of the `HeroDetailService` were called by spying on the service methods.
+Accordingly, the stub implements its methods as spies:
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (HeroDetailServiceSpy)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="hds-spy"/>
+
+### The override tests
+
+Now the tests can control the component's hero directly by manipulating the spy-stub's `testHero` and confirm that service methods were called.
+
+<docs-code header="app/hero/hero-detail.component.spec.ts (override tests)" path="adev/src/content/examples/testing/src/app/hero/hero-detail.component.spec.ts" visibleRegion="override-tests"/>
+
+### More overrides
+
+The `TestBed.overrideComponent` method can be called multiple times for the same or different components.
+The `TestBed` offers similar `overrideDirective`, `overrideModule`, and `overridePipe` methods for digging into and replacing parts of these other classes.
+
+Explore the options and combinations on your own.
+# Debugging tests
+
+If your tests aren't working as you expect them to, you can inspect and debug them in the browser.
+
+Debug specs in the browser in the same way that you debug an application.
+
+1. Reveal the Karma browser window.
+    See [Set up testing](guide/testing#set-up-testing) if you need help with this step.
+
+1. Click the **DEBUG** button to open a new browser tab and re-run the tests.
+1. Open the browser's **Developer Tools**. On Windows, press `Ctrl-Shift-I`. On macOS, press `Command-Option-I`.
+1. Pick the **Sources** section.
+1. Press `Control/Command-P`, and then start typing the name of your test file to open it.
+1. Set a breakpoint in the test.
+1. Refresh the browser, and notice how it stops at the breakpoint.
+
+<img alt="Karma debugging" src="assets/images/guide/testing/karma-1st-spec-debug.png">
+# Testing Utility APIs
+
+This page describes the most useful Angular testing features.
+
+The Angular testing utilities include the `TestBed`, the `ComponentFixture`, and a handful of functions that control the test environment.
+The [`TestBed`](#testbed-api-summary) and [`ComponentFixture`](#component-fixture-api-summary) classes are covered separately.
+
+Here's a summary of the stand-alone functions, in order of likely utility:
+
+| Function                     | Details |
+|:---                          |:---     |
+| `waitForAsync`               | Runs the body of a test \(`it`\) or setup \(`beforeEach`\) function within a special *async test zone*. See [waitForAsync](guide/testing/components-scenarios#waitForAsync).                                                                                                                                                                                                                                                                                                                                                                                                                                                          |
+| `fakeAsync`                  | Runs the body of a test \(`it`\) within a special *fakeAsync test zone*, enabling a linear control flow coding style. See [fakeAsync](guide/testing/components-scenarios#fake-async).                                                                                                                                                                                                                                                                                                                                                                                                                                                 |
+| `tick`                       | Simulates the passage of time and the completion of pending asynchronous activities by flushing both *timer* and *micro-task* queues within the *fakeAsync test zone*.  The curious, dedicated reader might enjoy this lengthy blog post, ["*Tasks, microtasks, queues and schedules*"](https://jakearchibald.com/2015/tasks-microtasks-queues-and-schedules).  Accepts an optional argument that moves the virtual clock forward by the specified number of milliseconds, clearing asynchronous activities scheduled within that timeframe. See [tick](guide/testing/components-scenarios#tick). |
+| `inject`                     | Injects one or more services from the current `TestBed` injector into a test function. It cannot inject a service provided by the component itself. See discussion of the [debugElement.injector](guide/testing/components-scenarios#get-injected-services).                                                                                                                                                                                                                                                                                                                                                                          |
+| `discardPeriodicTasks`       | When a `fakeAsync()` test ends with pending timer event *tasks* \(queued `setTimeOut` and `setInterval` callbacks\), the test fails with a clear error message. <br /> In general, a test should end with no queued tasks. When pending timer tasks are expected, call `discardPeriodicTasks` to flush the *task* queue and avoid the error.                                                                                                                                                                                                                                                                                          |
+| `flushMicrotasks`            | When a `fakeAsync()` test ends with pending *micro-tasks* such as unresolved promises, the test fails with a clear error message. <br /> In general, a test should wait for micro-tasks to finish. When pending microtasks are expected, call `flushMicrotasks` to flush the  *micro-task* queue and avoid the error.                                                                                                                                                                                                                                                                                                                 |
+| `ComponentFixtureAutoDetect` | A provider token for a service that turns on [automatic change detection](guide/testing/components-scenarios#automatic-change-detection).                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             |
+| `getTestBed`                 | Gets the current instance of the `TestBed`. Usually unnecessary because the static class methods of the `TestBed` class are typically sufficient. The `TestBed` instance exposes a few rarely used members that are not available as static methods.                                                                                                                                                                                                                                                                                                                                                                                  |
+
+## `TestBed` class summary
+
+The `TestBed` class is one of the principal Angular testing utilities.
+Its API is quite large and can be overwhelming until you've explored it, a little at a time.
+Read the early part of this guide first to get the basics before trying to absorb the full API.
+
+The module definition passed to `configureTestingModule` is a subset of the `@NgModule` metadata properties.
+
+```javascript
+type TestModuleMetadata = {
+  providers?: any[];
+  declarations?: any[];
+  imports?: any[];
+  schemas?: Array<SchemaMetadata | any[]>;
+};
+```
+Each override method takes a `MetadataOverride<T>` where `T` is the kind of metadata appropriate to the method, that is, the parameter of an `@NgModule`, `@Component`, `@Directive`, or `@Pipe`.
+
+```javascript
+type MetadataOverride<T> = {
+  add?: Partial<T>;
+  remove?: Partial<T>;
+  set?: Partial<T>;
+};
+```
+The `TestBed` API consists of static class methods that either update or reference a *global* instance of the `TestBed`.
+
+Internally, all static methods cover methods of the current runtime `TestBed` instance, which is also returned by the `getTestBed()` function.
+
+Call `TestBed` methods *within* a `beforeEach()` to ensure a fresh start before each individual test.
+
+Here are the most important static methods, in order of likely utility.
+
+| Methods                                                        | Details |
+|:---                                                            |:---     |
+| `configureTestingModule`                                       | The testing shims \(`karma-test-shim`, `browser-test-shim`\) establish the [initial test environment](guide/testing) and a default testing module. The default testing module is configured with basic declaratives and some Angular service substitutes that every tester needs. <br /> Call `configureTestingModule` to refine the testing module configuration for a particular set of tests by adding and removing imports, declarations \(of components, directives, and pipes\), and providers.                                                                                                                                              |
+| `compileComponents`                                            | Compile the testing module asynchronously after you've finished configuring it. You **must** call this method if *any* of the testing module components have a `templateUrl` or `styleUrls` because fetching component template and style files is necessarily asynchronous. See [compileComponents](guide/testing/components-scenarios#calling-compilecomponents). <br /> After calling `compileComponents`, the `TestBed` configuration is frozen for the duration of the current spec.                                                                                                                                                                 |
+| `createComponent<T>`                                     | Create an instance of a component of type `T` based on the current `TestBed` configuration. After calling `createComponent`, the `TestBed` configuration is frozen for the duration of the current spec.                                                                                                                                                                                                                                                                                                                                                                                                                                          |
+| `overrideModule`                                               | Replace metadata for the given `NgModule`. Recall that modules can import other modules. The `overrideModule` method can reach deeply into the current testing module to modify one of these inner modules.                                                                                                                                                                                                                                                                                                                                                                                                                                        |
+| `overrideComponent`                                            | Replace metadata for the given component class, which could be nested deeply within an inner module.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               |
+| `overrideDirective`                                            | Replace metadata for the given directive class, which could be nested deeply within an inner module.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               |
+| `overridePipe`                                                 | Replace metadata for the given pipe class, which could be nested deeply within an inner module.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    |
+|
+ `inject`                           | Retrieve a service from the current `TestBed` injector. The `inject` function is often adequate for this purpose. But `inject` throws an error if it can't provide the service. <br /> What if the service is optional? <br /> The `TestBed.inject()` method takes an optional second parameter, the object to return if Angular can't find the provider \(`null` in this example\): <docs-code header="app/demo/demo.testbed.spec.ts" path="adev/src/content/examples/testing/src/app/demo/demo.testbed.spec.ts" visibleRegion="testbed-get-w-null"/> After calling `TestBed.inject`, the `TestBed` configuration is frozen for the duration of the current spec. |
+|
+ `initTestEnvironment` | Initialize the testing environment for the entire test run. <br /> The testing shims \(`karma-test-shim`, `browser-test-shim`\) call it for you so there is rarely a reason for you to call it yourself. <br /> Call this method *exactly once*. To change this default in the middle of a test run, call `resetTestEnvironment` first. <br /> Specify the Angular compiler factory, a `PlatformRef`, and a default Angular testing module. Alternatives for non-browser platforms are available in the general form `@angular/platform-<platform_name>/testing/<platform_name>`.                                                                  |
+| `resetTestEnvironment`                                         | Reset the initial test environment, including the default testing module.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |
+
+A few of the `TestBed` instance methods are not covered by static `TestBed` *class* methods.
+These are rarely needed.
+
+## The `ComponentFixture`
+
+The `TestBed.createComponent<T>` creates an instance of the component `T` and returns a strongly typed `ComponentFixture` for that component.
+
+The `ComponentFixture` properties and methods provide access to the component, its DOM representation, and aspects of its Angular environment.
+
+### `ComponentFixture` properties
+
+Here are the most important properties for testers, in order of likely utility.
+
+| Properties          | Details |
+|:---                 |:---     |
+| `componentInstance` | The instance of the component class created by `TestBed.createComponent`.                                                                                                                                                                                                                          |
+| `debugElement`      | The `DebugElement` associated with the root element of the component. <br /> The `debugElement` provides insight into the component and its DOM element during test and debugging. It's a critical property for testers. The most interesting members are covered [below](#debug-element-details). |
+| `nativeElement`     | The native DOM element at the root of the component.                                                                                                                                                                                                                                               |
+| `changeDetectorRef` | The `ChangeDetectorRef` for the component. <br /> The `ChangeDetectorRef` is most valuable when testing a component that has the `ChangeDetectionStrategy.OnPush` method or the component's change detection is under your programmatic control.                                                   |
+
+### `ComponentFixture` methods
+
+The *fixture* methods cause Angular to perform certain tasks on the component tree.
+Call these method to trigger Angular behavior in response to simulated user action.
+
+Here are the most useful methods for testers.
+
+| Methods             | Details |
+|:---                 |:---     |
+| `detectChanges`     | Trigger a change detection cycle for the component. <br /> Call it to initialize the component \(it calls `ngOnInit`\) and after your test code, change the component's data bound property values. Angular can't see that you've changed `personComponent.name` and won't update the `name` binding until you call `detectChanges`. <br /> Runs `checkNoChanges` afterwards to confirm that there are no circular updates unless called as `detectChanges(false)`;                                                                                    |
+| `autoDetectChanges` | Set this to `true` when you want the fixture to detect changes automatically. <br /> When autodetect is `true`, the test fixture calls `detectChanges` immediately after creating the component. Then it listens for pertinent zone events and calls `detectChanges` accordingly. When your test code modifies component property values directly, you probably still have to call `fixture.detectChanges` to trigger data binding updates. <br /> The default is `false`. Testers who prefer fine control over test behavior tend to keep it `false`. |
+| `checkNoChanges`    | Do a change detection run to make sure there are no pending changes. Throws an exceptions if there are.                                                                                                                                                                                                                                                                                                                                                                                                                                                |
+| `isStable`          | If the fixture is currently *stable*, returns `true`. If there are async tasks that have not completed, returns `false`.                                                                                                                                                                                                                                                                                                                                                                                                                               |
+| `whenStable`        | Returns a promise that resolves when the fixture is stable. <br /> To resume testing after completion of asynchronous activity or asynchronous change detection, hook that promise. See [whenStable](guide/testing/components-scenarios#whenstable).                                                                                                                                                                                                                                                                                                  |
+| `destroy`           | Trigger component destruction.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         |
+
+#### `DebugElement`
+
+The `DebugElement` provides crucial insights into the component's DOM representation.
+
+From the test root component's `DebugElement` returned by `fixture.debugElement`, you can walk \(and query\) the fixture's entire element and component subtrees.
+
+Here are the most useful `DebugElement` members for testers, in approximate order of utility:
+
+| Members               | Details |
+|:---                   |:---     |
+| `nativeElement`       | The corresponding DOM element in the browser                                                                                                                                                                                                                                                                        |
+| `query`               | Calling `query(predicate: Predicate<DebugElement>)` returns the first `DebugElement` that matches the [predicate](#query-predicate) at any depth in the subtree.                                                                                                                                                                                                                                        |
+| `queryAll`            | Calling `queryAll(predicate: Predicate<DebugElement>)` returns all `DebugElements` that matches the [predicate](#query-predicate) at any depth in subtree.                                                                                                                                                                                                                                              |
+| `injector`            | The host dependency injector. For example, the root element's component instance injector.                                                                                                                                                                                                                                                                                                              |
+| `componentInstance`   | The element's own component instance, if it has one.                                                                                                                                                                                                                                                                                                                                                    |
+| `context`             | An object that provides parent context for this element. Often an ancestor component instance that governs this element. <br /> When an element is repeated within `@for` block, the context is an `RepeaterContext` whose `$implicit` property is the value of the row instance value. For example, the `hero` in `@for(hero of heroes; ...)`.                                                                   |
+| `children`            | The immediate `DebugElement` children. Walk the tree by descending through `children`.  `DebugElement` also has `childNodes`, a list of `DebugNode` objects. `DebugElement` derives from `DebugNode` objects and there are often more nodes than elements. Testers can usually ignore plain nodes.                                                                  |
+| `parent`              | The `DebugElement` parent. Null if this is the root element.                                                                                                                                                                                                                                                                                                                                            |
+| `name`                | The element tag name, if it is an element.                                                                                                                                                                                                                                                                                                                                                              |
+| `triggerEventHandler` | Triggers the event by its name if there is a corresponding listener in the element's `listeners` collection. The second parameter is the *event object* expected by the handler. See [triggerEventHandler](guide/testing/components-scenarios#trigger-event-handler). <br /> If the event lacks a listener or there's some other problem, consider calling `nativeElement.dispatchEvent(eventObject)`. |
+| `listeners`           | The callbacks attached to the component's `@Output` properties and/or the element's event properties.                                                                                                                                                                                                                                                                                                   |
+| `providerTokens`      | This component's injector lookup tokens. Includes the component itself plus the tokens that the component lists in its `providers` metadata.                                                                                                                                                                                                                                                            |
+| `source`              | Where to find this element in the source component template.                                                                                                                                                                                                                                                                                                                                            |
+| `references`          | Dictionary of objects associated with template local variables \(for example, `#foo`\), keyed by the local variable name.                                                                                                                                                                                                                                                                                        |
+
+The `DebugElement.query(predicate)` and `DebugElement.queryAll(predicate)` methods take a predicate that filters the source element's subtree for matching `DebugElement`.
+
+The predicate is any method that takes a `DebugElement` and returns a *truthy* value.
+The following example finds all `DebugElements` with a reference to a template local variable named "content":
+
+<docs-code header="app/demo/demo.testbed.spec.ts" path="adev/src/content/examples/testing/src/app/demo/demo.testbed.spec.ts" visibleRegion="custom-predicate"/>
+
+The Angular `By` class has three static methods for common predicates:
+
+| Static method             | Details |
+|:---                       |:---     |
+| `By.all`                  | Return all elements                                                        |
+| `By.css(selector)`        | Return elements with matching CSS selectors                                |
+| `By.directive(directive)` | Return elements that Angular matched to an instance of the directive class |
+
+<docs-code header="app/hero/hero-list.component.spec.ts" path="adev/src/content/examples/testing/src/app/hero/hero-list.component.spec.ts" visibleRegion="by"/>
+# Component harnesses overview
+
+A <strong>component harness</strong> is a class that allows tests to interact with components the way an end user does via a supported API. You can create test harnesses for any component, ranging from small reusable widgets to full pages.
+
+Harnesses offer several benefits:
+
+- They make tests less brittle by insulating themselves against implementation details of a component, such as its DOM structure
+- They make tests become more readable and easier to maintain
+- They can be used across multiple testing environments
+
+```typescript
+// Example of test with a harness for a component called MyButtonComponent
+it('should load button with exact text', async () => {
+  const button = await loader.getHarness(MyButtonComponentHarness);
+  expect(await button.getText()).toBe('Confirm');
+});
+```
+Component harnesses are especially useful for shared UI widgets. Developers often write tests that depend on private implementation details of widgets, such as DOM structure and CSS classes. Those dependencies make tests brittle and hard to maintain. Harnesses offer an alternative— a supported API that interacts with the widget the same way an end-user does. Widget implementation changes now become less likely to break user tests. For example, [Angular Material](https://material.angular.dev/components/categories) provides a test harness for each component in the library.
+
+Component harnesses support multiple testing environments. You can use the same harness implementation in both unit and end-to-end tests. Test authors only need to learn one API and component authors don't have to maintain separate unit and end-to-end test implementations.
+
+Many developers can be categorized by one of the following developer type categories: test authors, component harness authors, and harness environment authors. Use the table below to find the most relevant section in this guide based on these categories:
+
+| Developer Type              | Description                                                                                                                                                                                                                                                                                            | Relevant Section                                                                                             |
+| :-------------------------- | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------- |
+| Test Authors                | Developers that use component harnesses written by someone else to test their application. For example, this could be an app developer who uses a third-party menu component and needs to interact with the menu in a unit test.                                                                       | [Using component harnesses in tests](guide/testing/using-component-harnesses)                                |
+| Component harness authors   | Developers who maintain some reusable Angular components and want to create a test harness for its users to use in their tests. For example, an author of a third party Angular component library or a developer who maintains a set of common components for a large Angular application.             | [Creating component harnesses for your components](guide/testing/creating-component-harnesses)               |
+| Harness environment authors | Developers who want to add support for using component harnesses in additional testing environments. For information on supported testing environments out-of-the-box, see the [test harness environments and loaders](guide/testing/using-component-harnesses#test-harness-environments-and-loaders). | [Adding support for additional testing environments](guide/testing/component-harnesses-testing-environments) |
+
+For the full API reference, please see the [Angular CDK's component harness API reference page](/api#angular_cdk_testing).
+# Using component harnesses in tests
+
+## Before you start
+
+TIP: This guide assumes you've already read the [component harnesses overview guide](guide/testing/component-harnesses-overview). Read that first if you're new to using component harnesses.
+
+### CDK Installation
+
+The [Component Dev Kit (CDK)](https://material.angular.dev/cdk/categories) is a set of behavior primitives for building components. To use the component harnesses, first install `@angular/cdk` from npm. You can do this from your terminal using the Angular CLI:
+
+```shell
+ng add @angular/cdk
+```
+## Test harness environments and loaders
+
+You can use component test harnesses in different test environments. Angular CDK supports two built-in environments:
+
+- Unit tests with Angular's `TestBed`
+- End-to-end tests with [WebDriver](https://developer.mozilla.org/en-US/docs/Web/WebDriver)
+
+Each environment provides a <strong>harness loader</strong>. The loader creates the harness instances you use throughout your tests. See below for more specific guidance on supported testing environments.
+
+Additional testing environments require custom bindings. See the [adding harness support for additional testing environments guide](guide/testing/component-harnesses-testing-environments) for more information.
+
+### Using the loader from `TestbedHarnessEnvironment` for unit tests
+
+For unit tests you can create a harness loader from [TestbedHarnessEnvironment](/api/cdk/testing/TestbedHarnessEnvironment). This environment uses a [component fixture](api/core/testing/ComponentFixture) created by Angular's `TestBed`.
+
+To create a harness loader rooted at the fixture's root element, use the `loader()` method:
+
+```typescript
+const fixture = TestBed.createComponent(MyComponent);
+
+// Create a harness loader from the fixture
+const loader = TestbedHarnessEnvironment.loader(fixture);
+...
+
+// Use the loader to get harness instances
+const myComponentHarness = await loader.getHarness(MyComponent);
+```
+To create a harness loader for harnesses for elements that fall outside the fixture, use the `documentRootLoader()` method. For example, code that displays a floating element or pop-up often attaches DOM elements directly to the document body, such as the `Overlay` service in Angular CDK.
+
+You can also create a harness loader directly with `harnessForFixture()` for a harness at that fixture's root element directly.
+
+### Using the loader from `SeleniumWebDriverHarnessEnvironment` for end-to-end tests
+
+For WebDriver-based end-to-end tests you can create a harness loader with `SeleniumWebDriverHarnessEnvironment`.
+
+Use the `loader()` method to get the harness loader instance for the current HTML document, rooted at the document's root element. This environment uses a WebDriver client.
+
+```typescript
+let wd: webdriver.WebDriver = getMyWebDriverClient();
+const loader = SeleniumWebDriverHarnessEnvironment.loader(wd);
+...
+const myComponentHarness = await loader.getHarness(MyComponent);
+```
+## Using a harness loader
+
+Harness loader instances correspond to a specific DOM element and are used to create component harness instances for elements under that specific element.
+
+To get `ComponentHarness` for the first instance of the element, use the `getHarness()` method. To get all `ComponentHarness` instances, use the `getAllHarnesses()` method.
+
+```typescript
+// Get harness for first instance of the element
+const myComponentHarness = await loader.getHarness(MyComponent);
+
+// Get harnesses for all instances of the element
+const myComponentHarnesses = await loader.getHarnesses(MyComponent);
+```
+As an example, consider a reusable dialog-button component that opens a dialog on click. It contains the following components, each with a corresponding harness:
+
+- `MyDialogButton` (composes the `MyButton` and `MyDialog` with a convenient API)
+- `MyButton` (a standard button component)
+- `MyDialog` (a dialog appended to `document.body` by `MyDialogButton` upon click)
+
+The following test loads harnesses for each of these components:
+
+```typescript
+let fixture: ComponentFixture<MyDialogButton>;
+let loader: HarnessLoader;
+let rootLoader: HarnessLoader;
+
+beforeEach(() => {
+  fixture = TestBed.createComponent(MyDialogButton);
+  loader = TestbedHarnessEnvironment.loader(fixture);
+  rootLoader = TestbedHarnessEnvironment.documentRootLoader(fixture);
+});
+
+it('loads harnesses', async () => {
+  // Load a harness for the bootstrapped component with `harnessForFixture`
+  dialogButtonHarness =
+    await TestbedHarnessEnvironment.harnessForFixture(fixture, MyDialogButtonHarness);
+
+  // The button element is inside the fixture's root element, so we use `loader`.
+  const buttonHarness = await loader.getHarness(MyButtonHarness);
+
+  // Click the button to open the dialog
+  await buttonHarness.click();
+
+  // The dialog is appended to `document.body`, outside of the fixture's root element,
+  // so we use `rootLoader` in this case.
+  const dialogHarness = await rootLoader.getHarness(MyDialogHarness);
+
+  // ... make some assertions
+});
+```
+### Harness behavior in different environments
+
+Harnesses may not behave exactly the same in all environments. Some differences are unavoidable between the real user interaction versus the simulated events generated in unit tests. Angular CDK makes a best effort to normalize the behavior to the extent possible.
+
+### Interacting with child elements
+
+To interact with elements below the root element of this harness loader, use the `HarnessLoader` instance of a child element. For the first instance of the child element, use the `getChildLoader()` method. For all instances of the child element, use the `getAllChildLoaders()` method.
+
+```typescript
+const myComponentHarness = await loader.getHarness(MyComponent);
+
+// Get loader for first instance of child element with '.child' selector
+const childLoader = await myComponentHarness.getLoader('.child');
+
+// Get loaders for all instances of child elements with '.child' selector
+const allChildLoaders = await myComponentHarness.getAllChildLoaders('.child');
+```
+### Filtering harnesses
+
+When a page contains multiple instances of a particular component, you may want to filter based on some property of the component to get a particular component instance. You can use a <strong>harness predicate</strong>, a class used to associate a `ComponentHarness` class with predicates functions that can be used to filter component instances, to do so.
+
+When you ask a `HarnessLoader` for a harness, you're actually providing a HarnessQuery. A query can be one of two things:
+
+- A harness constructor. This just gets that harness
+- A `HarnessPredicate`, which gets harnesses that are filtered based on one or more conditions
+
+`HarnessPredicate` does support some base filters (selector, ancestor) that work on anything that extends `ComponentHarness`.
+
+```typescript
+// Example of loading a MyButtonComponentHarness with a harness predicate
+const disabledButtonPredicate = new HarnessPredicate(MyButtonComponentHarness, {selector: '[disabled]'});
+const disabledButton = await loader.getHarness(disabledButtonPredicate);
+```
+However it's common for harnesses to implement a static `with()` method that accepts component-specific filtering options and returns a `HarnessPredicate`.
+
+```typescript
+// Example of loading a MyButtonComponentHarness with a specific selector
+const button = await loader.getHarness(MyButtonComponentHarness.with({selector: 'btn'}))
+```
+For more details refer to the specific harness documentation since additional filtering options are specific to each harness implementation.
+
+## Using test harness APIs
+
+While every harness defines an API specific to its corresponding component, they all share a common base class, [ComponentHarness](/api/cdk/testing/ComponentHarness). This base class defines a static property, `hostSelector`, that matches the harness class to instances of the component in the DOM.
+
+Beyond that, the API of any given harness is specific to its corresponding component; refer to the component's documentation to learn how to use a specific harness.
+
+As an example, the following is a test for a component that uses the [Angular Material slider component harness](https://material.angular.dev/components/slider/api#MatSliderHarness):
+
+```typescript
+it('should get value of slider thumb', async () => {
+  const slider = await loader.getHarness(MatSliderHarness);
+  const thumb = await slider.getEndThumb();
+  expect(await thumb.getValue()).toBe(50);
+});
+```
+## Interop with Angular change detection
+
+By default, test harnesses runs Angular's [change detection](https://angular.dev/best-practices/runtime-performance) before reading the state of a DOM element and after interacting with a DOM element.
+
+There may be times that you need finer-grained control over change detection in your tests. such as checking the state of a component while an async operation is pending. In these cases use the `manualChangeDetection` function to disable automatic handling of change detection for a block of code.
+
+```typescript
+it('checks state while async action is in progress', async () => {
+  const buttonHarness = loader.getHarness(MyButtonHarness);
+  await manualChangeDetection(async () => {
+    await buttonHarness.click();
+    fixture.detectChanges();
+    // Check expectations while async click operation is in progress.
+    expect(isProgressSpinnerVisible()).toBe(true);
+    await fixture.whenStable();
+    // Check expectations after async click operation complete.
+    expect(isProgressSpinnerVisible()).toBe(false);
+  });
+});
+```
+Almost all harness methods are asynchronous and return a `Promise` to support the following:
+
+- Support for unit tests
+- Support for end-to-end tests
+- Insulate tests against changes in asynchronous behavior
+
+The Angular team recommends using [await](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function) to improve the test readability. Calling `await` blocks the execution of your test until the associated `Promise` resolves.
+
+Occasionally, you may want to perform multiple actions simultaneously and wait until they're all done rather than performing each action sequentially. For example, read multiple properties of a single component. In these situations use the `parallel` function to parallelize the operations. The parallel function works similarly to `Promise.all`, while also optimizing change detection checks.
+
+```typescript
+it('reads properties in parallel', async () => {
+  const checkboxHarness = loader.getHarness(MyCheckboxHarness);
+  // Read the checked and intermediate properties simultaneously.
+  const [checked, indeterminate] = await parallel(() => [
+    checkboxHarness.isChecked(),
+    checkboxHarness.isIndeterminate()
+  ]);
+  expect(checked).toBe(false);
+  expect(indeterminate).toBe(true);
+});
+```
+
+# Creating harnesses for your components
+
+## Before you start
+
+TIP: This guide assumes you've already read the [component harnesses overview guide](guide/testing/component-harnesses-overview). Read that first if you're new to using component harnesses.
+
+### When does creating a test harness make sense?
+
+The Angular team recommends creating component test harnesses for shared components that are used in many places and have some user interactivity. This most commonly applies to widget libraries and similar reusable components. Harnesses are valuable for these cases because they provide the consumers of these shared components a well- supported API for interacting with a component. Tests that use harnesses can avoid depending on unreliable implementation details of these shared components, such as DOM structure and specific event listeners.
+
+For components that appear in only one place, such as a page in an application, harnesses don't provide as much benefit. In these situations, a component's tests can reasonably depend on the implementation details of this component, as the tests and components are updated at the same time. However, harnesses still provide some value if you would use the harness in both unit and end-to-end tests.
+
+### CDK Installation
+
+The [Component Dev Kit (CDK)](https://material.angular.dev/cdk/categories) is a set of behavior primitives for building components. To use the component harnesses, first install `@angular/cdk` from npm. You can do this from your terminal using the Angular CLI:
+
+```shell
+ng add @angular/cdk
+```
+## Extending `ComponentHarness`
+
+The abstract `ComponentHarness` class is the base class for all component harnesses. To create a custom component harness, extend `ComponentHarness` and implement the static property `hostSelector`.
+
+The `hostSelector` property identifies elements in the DOM that match this harness subclass. In most cases, the `hostSelector` should be the same as the selector of the corresponding `Component` or `Directive`. For example, consider a simple popup component:
+
+```typescript
+@Component({
+  selector: 'my-popup',
+  template: `
+    <button (click)="toggle()">{{triggerText()}}</button>
+    @if (isOpen()) {
+      <div class="my-popup-content"><ng-content></ng-content></div>
+    }
+  `
+})
+class MyPopup {
+  triggerText = input('');
+
+  isOpen = signal(false);
+
+  toggle() {
+    this.isOpen.update((value) => !value);
+  }
+}
+```
+In this case, a minimal harness for the component would look like the following:
+
+```typescript
+class MyPopupHarness extends ComponentHarness {
+  static hostSelector = 'my-popup';
+}
+```
+While `ComponentHarness` subclasses require only the `hostSelector` property, most harnesses should also implement a static `with` method to generate `HarnessPredicate` instances. The [filtering harnesses section](guide/testing/using-component-harnesses#filtering-harnesses) covers this in more detail.
+
+## Finding elements in the component's DOM
+
+Each instance of a `ComponentHarness` subclass represents a particular instance of the corresponding component. You can access the component's host element via the `host() `method from the `ComponentHarness` base class.
+
+`ComponentHarness` also offers several methods for locating elements within the component's DOM. These methods are `locatorFor()`, `locatorForOptional()`, and `locatorForAll()`. These methods create functions that find elements, they do not directly find elements. This approach safeguards against caching references to out-of-date elements. For example, when an `@if` block hides and then shows an element, the result is a new DOM element; using functions ensures that tests always reference the current state of the DOM.
+
+See the [ComponentHarness API reference page](/api/cdk/testing/ComponentHarness) for the full list details of the different `locatorFor` methods.
+
+For example, the `MyPopupHarness` example discussed above could provide methods to get the trigger and content elements as follows:
+
+```typescript
+class MyPopupHarness extends ComponentHarness {
+  static hostSelector = 'my-popup';
+
+  // Gets the trigger element
+  getTriggerElement = this.locatorFor('button');
+
+  // Gets the content element.
+  getContentElement = this.locatorForOptional('.my-popup-content');
+}
+```
+## Working with `TestElement` instances
+
+`TestElement` is an abstraction designed to work across different test environments (Unit tests, WebDriver, etc). When using harnesses, you should perform all DOM interaction via this interface. Other means of accessing DOM elements, such as `document.querySelector()`, do not work in all test environments.
+
+`TestElement` has a number of methods to interact with the underlying DOM, such as `blur()`, `click()`, `getAttribute()`, and more. See the [TestElement API reference page](/api/cdk/testing/TestElement) for the full list of methods.
+
+Do not expose `TestElement` instances to harness users unless it's an element the component consumer defines directly, such as the component's host element. Exposing `TestElement` instances for internal elements leads users to depend on a component's internal DOM structure.
+
+Instead, provide more narrow-focused methods for specific actions the end-user may take or particular state they may observe. For example, `MyPopupHarness` from previous sections could provide methods like `toggle` and `isOpen`:
+
+```typescript
+class MyPopupHarness extends ComponentHarness {
+  static hostSelector = 'my-popup';
+
+  protected getTriggerElement = this.locatorFor('button');
+  protected getContentElement = this.locatorForOptional('.my-popup-content');
+
+  /** Toggles the open state of the popup. */
+  async toggle() {
+    const trigger = await this.getTriggerElement();
+    return trigger.click();
+  }
+
+  /** Checks if the popup us open. */
+  async isOpen() {
+    const content = await this.getContentElement();
+    return !!content;
+  }
+}
+```
+## Loading harnesses for subcomponents
+
+Larger components often compose sub-components. You can reflect this structure in a component's harness as well. Each of the `locatorFor` methods on `ComponentHarness` has an alternate signature that can be used for locating sub-harnesses rather than elements.
+
+See the [ComponentHarness API reference page](/api/cdk/testing/ComponentHarness) for the full list of the different locatorFor methods.
+
+For example, consider a menu build using the popup from above:
+
+```typescript
+@Directive({
+  selector: 'my-menu-item'
+})
+class MyMenuItem {}
+
+@Component({
+  selector: 'my-menu',
+  template: `
+    <my-popup>
+      <ng-content></ng-content>
+    </my-popup>
+  `
+})
+class MyMenu {
+  triggerText = input('');
+
+  @ContentChildren(MyMenuItem) items: QueryList<MyMenuItem>;
+}
+```
+The harness for `MyMenu` can then take advantage of other harnesses for `MyPopup` and `MyMenuItem`:
+
+```typescript
+class MyMenuHarness extends ComponentHarness {
+  static hostSelector = 'my-menu';
+
+  protected getPopupHarness = this.locatorFor(MyPopupHarness);
+
+  /** Gets the currently shown menu items (empty list if menu is closed). */
+  getItems = this.locatorForAll(MyMenuItemHarness);
+
+  /** Toggles open state of the menu. */
+  async toggle() {
+    const popupHarness = await this.getPopupHarness();
+    return popupHarness.toggle();
+  }
+}
+
+class MyMenuItemHarness extends ComponentHarness {
+  static hostSelector = 'my-menu-item';
+}
+```
+## Filtering harness instances with `HarnessPredicate`
+
+When a page contains multiple instances of a particular component, you may want to filter based on some property of the component to get a particular component instance. For example, you may want a button with some specific text, or a menu with a specific ID. The `HarnessPredicate` class can capture criteria like this for a `ComponentHarness` subclass. While the test author is able to construct `HarnessPredicate` instances manually, it's easier when the `ComponentHarness` subclass provides a helper method to construct predicates for common filters.
+
+You should create a static `with()` method on each `ComponentHarness` subclass that returns a `HarnessPredicate` for that class. This allows test authors to write easily understandable code, e.g. `loader.getHarness(MyMenuHarness.with({selector: '#menu1'}))`. In addition to the standard selector and ancestor options, the `with` method should add any other options that make sense for the particular subclass.
+
+Harnesses that need to add additional options should extend the `BaseHarnessFilters` interface and additional optional properties as needed. `HarnessPredicate` provides several convenience methods for adding options: `stringMatches()`, `addOption()`, and `add()`. See the [HarnessPredicate API page](/api/cdk/testing/HarnessPredicate) for the full description.
+
+For example, when working with a menu it is useful to filter based on trigger text and to filter menu items based on their text:
+
+```typescript
+interface MyMenuHarnessFilters extends BaseHarnessFilters {
+  /** Filters based on the trigger text for the menu. */
+  triggerText?: string | RegExp;
+}
+
+interface MyMenuItemHarnessFilters extends BaseHarnessFilters {
+  /** Filters based on the text of the menu item. */
+  text?: string | RegExp;
+}
+
+class MyMenuHarness extends ComponentHarness {
+  static hostSelector = 'my-menu';
+
+  /** Creates a `HarnessPredicate` used to locate a particular `MyMenuHarness`. */
+  static with(options: MyMenuHarnessFilters): HarnessPredicate<MyMenuHarness> {
+    return new HarnessPredicate(MyMenuHarness, options)
+      .addOption('trigger text', options.triggerText,
+        (harness, text) => HarnessPredicate.stringMatches(harness.getTriggerText(), text));
+  }
+
+  protected getPopupHarness = this.locatorFor(MyPopupHarness);
+
+  /** Gets the text of the menu trigger. */
+  async getTriggerText(): Promise<string> {
+    const popupHarness = await this.getPopupHarness();
+    return popupHarness.getTriggerText();
+  }
+  ...
+}
+
+class MyMenuItemHarness extends ComponentHarness {
+  static hostSelector = 'my-menu-item';
+
+  /** Creates a `HarnessPredicate` used to locate a particular `MyMenuItemHarness`. */
+  static with(options: MyMenuItemHarnessFilters): HarnessPredicate<MyMenuItemHarness> {
+    return new HarnessPredicate(MyMenuItemHarness, options)
+      .addOption('text', options.text,
+        (harness, text) => HarnessPredicate.stringMatches(harness.getText(), text));
+  }
+
+  /** Gets the text of the menu item. */
+  async getText(): Promise<string> {
+    const host = await this.host();
+    return host.text();
+  }
+}
+```
+You can pass a `HarnessPredicate` instead of a `ComponentHarness` class to any of the APIs on `HarnessLoader`, `LocatorFactory`, or `ComponentHarness`. This allows test authors to easily target a particular component instance when creating a harness instance. It also allows the harness author to leverage the same `HarnessPredicate` to enable more powerful APIs on their harness class. For example, consider the `getItems` method on the `MyMenuHarness` shown above. Adding a filtering API allows users of the harness to search for particular menu items:
+
+```typescript
+class MyMenuHarness extends ComponentHarness {
+  static hostSelector = 'my-menu';
+
+  /** Gets a list of items in the menu, optionally filtered based on the given criteria. */
+  async getItems(filters: MyMenuItemHarnessFilters = {}): Promise<MyMenuItemHarness[]> {
+    const getFilteredItems = this.locatorForAll(MyMenuItemHarness.with(filters));
+    return getFilteredItems();
+  }
+  ...
+}
+```
+## Creating `HarnessLoader` for elements that use content projection
+
+Some components project additional content into the component's template. See the [content projection guide](guide/components/content-projection) for more information.
+
+Add a `HarnessLoader` instance scoped to the element containing the `<ng-content>` when you create a harness for a component that uses content projection. This allows the user of the harness to load additional harnesses for whatever components were passed in as content. `ComponentHarness` has several methods that can be used to create HarnessLoader instances for cases like this: `harnessLoaderFor()`, `harnessLoaderForOptional()`, `harnessLoaderForAll()`. See the [HarnessLoader interface API reference page](/api/cdk/testing/HarnessLoader) for more details.
+
+For example, the `MyPopupHarness` example from above can extend `ContentContainerComponentHarness` to add support to load harnesses within the `<ng-content>` of the component.
+
+```typescript
+class MyPopupHarness extends ContentContainerComponentHarness<string> {
+  static hostSelector = 'my-popup';
+}
+```
+## Accessing elements outside of the component's host element
+
+There are times when a component harness might need to access elements outside of its corresponding component's host element. For example, code that displays a floating element or pop-up often attaches DOM elements directly to the document body, such as the `Overlay` service in Angular CDK.
+
+In this case, `ComponentHarness` provides a method that can be used to get a `LocatorFactory` for the root element of the document. The `LocatorFactory` supports most of the same APIs as the `ComponentHarness` base class, and can then be used to query relative to the document's root element.
+
+Consider if the `MyPopup` component above used the CDK overlay for the popup content, rather than an element in its own template. In this case, `MyPopupHarness` would have to access the content element via `documentRootLocatorFactory()` method that gets a locator factory rooted at the document root.
+
+```typescript
+class MyPopupHarness extends ComponentHarness {
+  static hostSelector = 'my-popup';
+
+  /** Gets a `HarnessLoader` whose root element is the popup's content element. */
+  async getHarnessLoaderForContent(): Promise<HarnessLoader> {
+    const rootLocator = this.documentRootLocatorFactory();
+    return rootLocator.harnessLoaderFor('my-popup-content');
+  }
+}
+```
+## Waiting for asynchronous tasks
+
+The methods on `TestElement` automatically trigger Angular's change detection and wait for tasks inside the `NgZone`. In most cases no special effort is required for harness authors to wait on asynchronous tasks. However, there are some edge cases where this may not be sufficient.
+
+Under some circumstances, Angular animations may require a second cycle of change detection and subsequent `NgZone` stabilization before animation events are fully flushed. In cases where this is needed, the `ComponentHarness` offers a `forceStabilize()` method that can be called to do the second round.
+
+You can use `NgZone.runOutsideAngular()` to schedule tasks outside of NgZone. Call the `waitForTasksOutsideAngular()` method on the corresponding harness if you need to explicitly wait for tasks outside `NgZone` since this does not happen automatically.
+# Animating your Application with CSS
+
+CSS offers a robust set of tools for you to create beautiful and engaging animations within your application.
+
+## How to write animations in native CSS
+
+If you've never written any native CSS animations, there are a number of excellent guides to get you started. Here's a few of them:
+[MDN's CSS Animations guide](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_animations/Using_CSS_animations)
+[W3Schools CSS3 Animations guide](https://www.w3schools.com/css/css3_animations.asp)
+[The Complete CSS Animations Tutorial](https://www.lambdatest.com/blog/css-animations-tutorial/)
+[CSS Animation for Beginners](https://thoughtbot.com/blog/css-animation-for-beginners)
+
+and a couple of videos:
+[Learn CSS Animation in 9 Minutes](https://www.youtube.com/watch?v=z2LQYsZhsFw)
+[Net Ninja CSS Animation Tutorial Playlist](https://www.youtube.com/watch?v=jgw82b5Y2MU&list=PL4cUxeGkcC9iGYgmEd2dm3zAKzyCGDtM5)
+
+Check some of these various guides and tutorials out, and then come back to this guide.
+
+## Creating Reusable Animations
+
+You can create reusable animations that can be shared across your application using `@keyframes`. Define keyframe animations in a shared CSS file, and you'll be able to re-use those keyframe animations wherever you want within your application.
+
+<docs-code header="src/app/animations.css" path="adev/src/content/examples/animations/src/app/animations.css" visibleRegion="animation-shared"/>
+
+Adding the class `animated-class` to an element would trigger the animation on that element.
+
+## Animating a Transition
+
+### Animating State and Styles
+
+You may want to animate between two different states, for example when an element is opened or closed. You can accomplish this by using CSS classes either using a keyframe animation or transition styling.
+
+<docs-code header="src/app/animations.css" path="adev/src/content/examples/animations/src/app/animations.css" visibleRegion="animation-states"/>
+
+Triggering the `open` or `closed` state is done by toggling classes on the element in your component. You can find examples of how to do this in our [template guide](guide/templates/binding#css-class-and-style-property-bindings).
+
+You can see similar examples in the template guide for [animating styles directly](guide/templates/binding#css-style-properties).
+
+### Transitions, Timing, and Easing
+
+Animating often requires adjusting timing, delays and easeing behaviors. This can be done using several css properties or shorthand properties.
+
+Specify `animation-duration`, `animation-delay`, and `animation-timing-function` for a keyframe animation in CSS, or alternatively use the `animation` shorthand property.
+
+<docs-code header="src/app/animations.css" path="adev/src/content/examples/animations/src/app/animations.css" visibleRegion="animation-timing"/>
+
+Similarly, you can use `transition-duration`, `transition-delay`, and `transition-timing-function` and the `transition` shorthand for animations that are not using `@keyframes`.
+
+<docs-code header="src/app/animations.css" path="adev/src/content/examples/animations/src/app/animations.css" visibleRegion="transition-timing"/>
+
+### Triggering an Animation
+
+Animations can be triggered by toggling CSS styles or classes. Once a class is present on an element, the animation will occur. Removing the class will revert the element back to whatever CSS is defined for that element. Here's an example:
+
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/open-close.component.ts">
+    <docs-code header="src/app/open-close.component.ts" path="adev/src/content/examples/animations/src/app/native-css/open-close.component.ts" />
+    <docs-code header="src/app/open-close.component.html" path="adev/src/content/examples/animations/src/app/native-css/open-close.component.html" />
+    <docs-code header="src/app/open-close.component.css" path="adev/src/content/examples/animations/src/app/native-css/open-close.component.css"/>
+</docs-code-multifile>
+
+## Transition and Triggers
+
+### Animating Auto Height
+
+You can use css-grid to animate to auto height.
+
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/auto-height.component.ts">
+    <docs-code header="src/app/auto-height.component.ts" path="adev/src/content/examples/animations/src/app/native-css/auto-height.component.ts" />
+    <docs-code header="src/app/auto-height.component.html" path="adev/src/content/examples/animations/src/app/native-css/auto-height.component.html" />
+    <docs-code header="src/app/auto-height.component.css" path="adev/src/content/examples/animations/src/app/native-css/auto-height.component.css"  />
+</docs-code-multifile>
+
+If you don't have to worry about supporting all browsers, you can also check out `calc-size()`, which is the true solution to animating auto height. See [MDN's docs](https://developer.mozilla.org/en-US/docs/Web/CSS/calc-size) and (this tutorial)[https://frontendmasters.com/blog/one-of-the-boss-battles-of-css-is-almost-won-transitioning-to-auto/] for more information.
+
+### Animate entering and leaving a view
+
+You can create animations for when an item enters a view or leaves a view. Let's start by looking at how to animate an element leaving a view.
+
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/insert.component.ts">
+    <docs-code header="src/app/insert.component.ts" path="adev/src/content/examples/animations/src/app/native-css/insert.component.ts" />
+    <docs-code header="src/app/insert.component.html" path="adev/src/content/examples/animations/src/app/native-css/insert.component.html" />
+    <docs-code header="src/app/insert.component.css" path="adev/src/content/examples/animations/src/app/native-css/insert.component.css"  />
+</docs-code-multifile>
+
+Leaving a view is slightly more complex. The element removal needs to be delayed until the exit animation is complete. This requires a bit of extra code in your component class to accomplish.
+
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/remove.component.ts">
+    <docs-code header="src/app/remove.component.ts" path="adev/src/content/examples/animations/src/app/native-css/remove.component.ts" />
+    <docs-code header="src/app/remove.component.html" path="adev/src/content/examples/animations/src/app/native-css/remove.component.html" />
+    <docs-code header="src/app/remove.component.css" path="adev/src/content/examples/animations/src/app/native-css/remove.component.css"  />
+</docs-code-multifile>
+
+### Animating increment and decrement
+
+Animating on increment and decrement is a common pattern in applications. Here's an example of how you can accomplish that behavior.
+
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/increment-decrement.component.ts">
+    <docs-code header="src/app/increment-decrement.component.ts" path="adev/src/content/examples/animations/src/app/native-css/increment-decrement.component.ts" />
+    <docs-code header="src/app/increment-decrement.component.html" path="adev/src/content/examples/animations/src/app/native-css/increment-decrement.component.html" />
+    <docs-code header="src/app/increment-decrement.component.css" path="adev/src/content/examples/animations/src/app/native-css/increment-decrement.component.css" />
+</docs-code-multifile>
+
+### Disabling an animation or all animations
+
+If you'd like to disable the animations that you've specified, you have multiple options.
+
+1. Create a custom class that forces animation and transition to `none`.
+
+```css
+.no-animation {
+  animation: none !important;
+  transition: none !important;
+}
+```
+
+Applying this class to an element prevents any animation from firing on that element. You could alternatively scope this to your entire DOM or section of your DOM to enforce this behavior. However, this prevents animation events from firing. If you are awaiting animation events for element removal, this solution won't work. A workaround is to set durations to 1 millisecond instead.
+
+2. Use the [`prefers-reduced-motion`](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion) media query to ensure no animations play for users that prefer less animation.
+
+3. Prevent adding animation classes programatically
+
+### Animation Callbacks
+
+If you have actions you would like to execute at certain points during animations, there are a number of available events you can listen to. Here's a few of them.
+
+[`OnAnimationStart`](https://developer.mozilla.org/en-US/docs/Web/API/Element/animationstart_event)
+[`OnAnimationEnd`](https://developer.mozilla.org/en-US/docs/Web/API/Element/animationend_event)
+[`OnAnimationIteration`](https://developer.mozilla.org/en-US/docs/Web/API/Element/animationitration_event)
+[`OnAnimationCancel`](https://developer.mozilla.org/en-US/docs/Web/API/Element/animationcancel_event)
+
+[`OnTransitionStart`](https://developer.mozilla.org/en-US/docs/Web/API/Element/transitionstart_event)
+[`OnTransitionRun`](https://developer.mozilla.org/en-US/docs/Web/API/Element/transitionrun_event)
+[`OnTransitionEnd`](https://developer.mozilla.org/en-US/docs/Web/API/Element/transitionend_event)
+[`OnTransitionCancel`](https://developer.mozilla.org/en-US/docs/Web/API/Element/transitioncancel_event)
+
+The Web Animations API has a lot of additional functionality. [Take a look at the documentation](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API) to see all the available animation APIs.
+
+NOTE: Be aware of bubbling issues with these callbacks. If you are animating children and parents, the events bubble up from children to parents. Consider stopping propagation or looking at more details within the event to determine if you're responding to the desired event target rather than an event bubbling up from a child node. You can examine the `animationname` property or the properties being transitioned to verify you have the right nodes.
+
+## Complex Sequences
+
+Animations are often more complicated than just a simple fade in or fade out. You may have lots of complicated sequences of animations you may want to run. Let's take a look at some of those possible scenarios.
+
+### Staggering animations in a list
+
+One common effect is to stagger the animations of each item in a list to create a cascade effect. This can be accomplished by utilizing `animation-delay` or `transition-delay`. Here is an example of what that CSS might look like.
+
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/stagger.component.ts">
+    <docs-code header="src/app/stagger.component.ts" path="adev/src/content/examples/animations/src/app/native-css/stagger.component.ts" />
+    <docs-code header="src/app/stagger.component.html" path="adev/src/content/examples/animations/src/app/native-css/stagger.component.html" />
+    <docs-code header="src/app/stagger.component.css" path="adev/src/content/examples/animations/src/app/native-css/stagger.component.css" />
+</docs-code-multifile>
+
+### Parallel Animations
+
+You can apply multiple animations to an element at once using the `animation` shorthand property. Each can have their own durations and delays. This allows you to compose animations together and create complicated effects.
+
+```css
+.target-element {
+  animation: rotate 3s, fade-in 2s;
+}
+```
+
+In this example, the `rotate` and `fade-in` animations fire at the same time, but have different durations.
+
+### Animating the items of a reordering list
+
+Items in a `@for` loop will be removed and re-added, which will fire off animations using `@starting-styles` for entry animations. Removal animations will require additional code to add the event listener, as seen in the example above.
+
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/reorder.component.ts">
+    <docs-code header="src/app/reorder.component.ts" path="adev/src/content/examples/animations/src/app/native-css/reorder.component.ts" />
+    <docs-code header="src/app/reorder.component.html" path="adev/src/content/examples/animations/src/app/native-css/reorder.component.html" />
+    <docs-code header="src/app/reorder.component.css" path="adev/src/content/examples/animations/src/app/native-css/reorder.component.css" />
+</docs-code-multifile>
+
+## Programmatic control of animations
+
+You can retrieve animations off an element directly using [`Element.getAnimations()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/getAnimations). This returns an array of every [`Animation`](https://developer.mozilla.org/en-US/docs/Web/API/Animation) on that element. You can use the `Animation` API to do much more than you could with what the `AnimationPlayer` from the animations package offered. From here you can `cancel()`, `play()`, `pause()`, `reverse()` and much more. This native API should provide everything you need to control your animations.
+# Route transition animations
+
+When a user navigates from one route to another, the Angular Router maps the URL path to the relevant component and displays its view. Animating this route transition can greatly enhance the user experience. The Router has support for the View Transitions API when navigating between routes in Chrome/Chromium browsers.
+
+HELPFUL: The Router's native View Transitions integration is currently in [developer preview](/reference/releases#developer-preview). Native View Transitions are also a relatively new feature so there may be limited support in some browsers.
+
+## How View Transitions work
+
+The native browser method that’s used for view transitions is `document.startViewTransition`. When `startViewTransition()` is called, the browser captures the current state of the page which includes taking a screenshot. The method takes a callback that updates the DOM and this function can be asynchronous. The new state is captured and the transition begins in the next animation frame when the promise returned by the callback resolves.
+
+Here’s an example of the startViewTransition api:
+
+```ts
+document.startViewTransition(async () => {
+  await updateTheDOMSomehow();
+});
+```
+
+If you’re curious to read more about the details of the browser API, the [Chrome Explainer](https://developer.chrome.com/docs/web-platform/view-transitions) is an invaluable resource.
+
+## How the Router uses view transitions
+
+Several things happen after navigation starts in the router: route matching, loading lazy routes and components, executing guards and resolvers to name a few. Once these have completed successfully, the new routes are ready to be activated. This route activation is the DOM update that we want to perform as part of the view transition.
+
+When the view transition feature is enabled, navigation “pauses” and a call is made to the browser’s `startViewTransition` method. Once the `startViewTransition` callback executes (this happens asynchronously, as outlined in the spec here), navigation “resumes”. The remaining steps for the router navigation include updating the browser URL and activating or deactivating the matched routes (the DOM update).
+
+Finally, the callback passed to `startViewTransition` returns a Promise that resolves once Angular has finished rendering. As described above, this indicates to the browser that the new DOM state should be captured and the transition should begin.
+
+View transitions are a [progressive enhancement](https://developer.mozilla.org/en-US/docs/Glossary/Progressive_Enhancement). If the browser does not support the API, the Router will perform the DOM updates without calling `startViewTransition` and the navigation will not be animated.
+
+## Enabling View Transitions in the Router
+
+To enable this feature, simply add `withViewTransitions` to the `provideRouter` or set `enableViewTransitions: true` in `RouterModule.forRoot`:
+
+```ts
+// Standalone bootstrap
+bootstrapApplication(MyApp, {providers: [
+  provideRouter(ROUTES, withViewTransitions()),
+]});
+
+// NgModule bootstrap
+@NgModule({
+  imports: [RouterModule.forRoot(routes, {enableViewTransitions: true})]
+})
+export class AppRouting {}
+```
+
+[Try the “count” example on StackBlitz](https://stackblitz.com/edit/stackblitz-starters-2dnvtm?file=src%2Fmain.ts)
+
+This example uses the counter application from the Chrome explainer and replaces the direct call to startViewTransition when the counter increments with a router navigation.
+
+## Using CSS to customize transitions
+
+View transitions can be customized with CSS. We can also instruct the browser to create separate elements for the transition by setting a view-transition-name. We can expand the first example by adding view-transition-name: count to the .count style in the Counter component. Then, in the global styles, we can define a custom animation for this view transition:
+
+```css
+/* Custom transition */
+@keyframes rotate-out {
+ to {
+   transform: rotate(90deg);
+ }
+}
+@keyframes rotate-in {
+ from {
+   transform: rotate(-90deg);
+ }
+}
+::view-transition-old(count),
+::view-transition-new(count) {
+ animation-duration: 200ms;
+ animation-name: -ua-view-transition-fade-in, rotate-in;
+}
+::view-transition-old(count) {
+ animation-name: -ua-view-transition-fade-out, rotate-out;
+}
+```
+
+It is important that the view transition animations are defined in a global style file. They cannot be defined in the component styles because the default view encapsulation will scope the styles to the component.
+
+[Try the updated “count” example on StackBlitz](https://stackblitz.com/edit/stackblitz-starters-fwn4i7?file=src%2Fmain.ts)
+
+## Controlling transitions with onViewTransitionCreated
+
+The `withViewTransitions` router feature can also be called with an options object that includes an `onViewTransitionCreated` callback. This callback is run in an [injection context](/guide/di/dependency-injection-context#run-within-an-injection-context) and receives a [ViewTransitionInfo](/api/router/ViewTransitionInfo) object that includes the `ViewTransition` returned from `startViewTransition`, as well as the `ActivatedRouteSnapshot` that the navigation is transitioning from and the new one that it is transitioning to.
+
+This callback can be used for any number of customizations. For example, you might want to skip transitions under certain conditions. We use this on the new angular.dev docs site:
+
+```ts
+withViewTransitions({
+ onViewTransitionCreated: ({transition}) => {
+   const router = inject(Router);
+   const targetUrl = router.getCurrentNavigation()!.finalUrl!;
+   // Skip the transition if the only thing
+   // changing is the fragment and queryParams
+   const config = {
+     paths: 'exact',
+     matrixParams: 'exact',
+     fragment: 'ignored',
+     queryParams: 'ignored',
+   };
+
+   if (router.isActive(targetUrl, config)) {
+     transition.skipTransition();
+   }
+ },
+}),
+```
+
+In this code snippet, we create a `UrlTree` from the `ActivatedRouteSnapshot` the navigation is going to. We then check with the Router to see if this `UrlTree` is already active, ignoring any differences in the fragment or query parameters. If it is already active, we call skipTransition which will skip the animation portion of the view transition. This is the case when clicking on an anchor link that will only scroll to another location in the same document.
+
+## Examples from the Chrome explainer adapted to Angular
+
+We’ve recreated some of the great examples from the Chrome Team in Angular for you to explore.
+
+### Transitioning elements don’t need to be the same DOM element
+
+* [Chrome Explainer](https://developer.chrome.com/docs/web-platform/view-transitions/same-document#transitioning_elements_dont_need_to_be_the_same_dom_element)
+* [Angular Example on StackBlitz](https://stackblitz.com/edit/stackblitz-starters-dh8npr?file=src%2Fmain.ts)
+
+### Custom entry and exit animations
+
+* [Chrome Explainer](https://developer.chrome.com/docs/web-platform/view-transitions/same-document#custom_entry_and_exit_transitions)
+* [Angular Example on StackBlitz](https://stackblitz.com/edit/stackblitz-starters-8kly3o)
+
+### Async DOM updates and waiting for content
+
+* [Chrome Explainer](https://developer.chrome.com/docs/web-platform/view-transitions/same-document#async_dom_updates_and_waiting_for_content)
+
+> During this time, the page is frozen, so delays here should be kept to a minimum…in some cases it’s better to avoid the delay altogether, and use the content you already have.
+
+The view transition feature in the Angular router does not provide a way to delay the animation. For the moment, our stance is that it’s always better to use the content you have rather than making the page non-interactive for any additional amount of time.
+
+### Handle multiple view transition styles with view transition types
+
+* [Chrome Explainer](https://developer.chrome.com/docs/web-platform/view-transitions/same-document#view-transition-types)
+* [Angular Example on StackBlitz](https://stackblitz.com/edit/stackblitz-starters-vxzcam)
+
+### Handle multiple view transition styles with a class name on the view transition root (deprecated)
+
+* [Chrome Explainer](https://developer.chrome.com/docs/web-platform/view-transitions/same-document#changing-on-navigation-type)
+* [Angular Example on StackBlitz](https://stackblitz.com/edit/stackblitz-starters-nmnzzg?file=src%2Fmain.ts)
+
+### Transitioning without freezing other animations
+
+* [Chrome Explainer](https://developer.chrome.com/docs/web-platform/view-transitions/same-document#transitioning-without-freezing)
+* [Angular Example on StackBlitz](https://stackblitz.com/edit/stackblitz-starters-76kgww)
+
+### Animating with Javascript
+
+* [Chrome Explainer](https://developer.chrome.com/docs/web-platform/view-transitions/same-document#animating-with-javascript)
+* [Angular Example on StackBlitz](https://stackblitz.com/edit/stackblitz-starters-cklnkm)
+
+## Native View Transitions Alternative
+
+Animating the transition between routes can also be done with the `@angular/animations` package.
+The animation [triggers and transitions](/guide/animations/transition-and-triggers)
+can be derived from the router state, such as the current URL or `ActivatedRoute`.
+# Migrating away from Angular's Animations package
+
+Almost all the features supported by `@angular/animations` have simpler alternatives with native CSS. Consider removing the Angular Animations package from your application, as the package can contribute around 60 kilobytes to your JavaScript bundle. Native CSS animations offer superior performance, as they can benefit from hardware acceleration. Animations defined in the animations package lack that ability. This guide walks through the process of refactoring your code from `@angular/animations` to native CSS animations.
+
+## How to write animations in native CSS
+
+If you've never written any native CSS animations, there are a number of excellent guides to get you started. Here's a few of them:
+[MDN's CSS Animations guide](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_animations/Using_CSS_animations)
+[W3Schools CSS3 Animations guide](https://www.w3schools.com/css/css3_animations.asp)
+[The Complete CSS Animations Tutorial](https://www.lambdatest.com/blog/css-animations-tutorial/)
+[CSS Animation for Beginners](https://thoughtbot.com/blog/css-animation-for-beginners)
+
+and a couple of videos:
+[Learn CSS Animation in 9 Minutes](https://www.youtube.com/watch?v=z2LQYsZhsFw)
+[Net Ninja CSS Animation Tutorial Playlist](https://www.youtube.com/watch?v=jgw82b5Y2MU&list=PL4cUxeGkcC9iGYgmEd2dm3zAKzyCGDtM5)
+
+Check some of these various guides and tutorials out, and then come back to this guide.
+
+## Creating Reusable Animations
+
+Just like with the animations package, you can create reusable animations that can be shared across your application. The animations package version of this had you using the `animation()` function in a shared typescript file. The native CSS version of this is similar, but lives in a shared CSS file.
+
+#### With Animations Package
+<docs-code header="src/app/animations.ts" path="adev/src/content/examples/animations/src/app/animations.1.ts" visibleRegion="animation-example"/>
+
+#### With Native CSS
+<docs-code header="src/app/animations.css" path="adev/src/content/examples/animations/src/app/animations.css" visibleRegion="animation-shared"/>
+
+Adding the class `animated-class` to an element would trigger the animation on that element.
+
+## Animating a Transition
+
+### Animating State and Styles
+
+The animations package allowed you to define various states using the [`state()`](api/animations/state) function within a component. Examples might be an `open` or `closed` state containing the styles for each respective state within the definition. For example:
+
+#### With Animations Package
+<docs-code header="src/app/open-close.component.ts" path="adev/src/content/examples/animations/src/app/open-close.component.ts" visibleRegion="state1"/>
+
+This same behavior can be accomplished natively by using CSS classes either using a keyframe animation or transition styling.
+
+#### With Native CSS
+<docs-code header="src/app/animations.css" path="adev/src/content/examples/animations/src/app/animations.css" visibleRegion="animation-states"/>
+
+Triggering the `open` or `closed` state is done by toggling classes on the element in your component. You can find examples of how to do this in our [template guide](guide/templates/binding#css-class-and-style-property-bindings).
+
+You can see similar examples in the template guide for [animating styles directly](guide/templates/binding#css-style-properties).
+
+### Transitions, Timing, and Easing
+
+The animations package `animate()` function allows for providing timing, like duration, delays and easing. This can be done natively with CSS using several css properties or shorthand properties.
+
+Specify `animation-duration`, `animation-delay`, and `animation-timing-function` for a keyframe animation in CSS, or alternatively use the `animation` shorthand property.
+
+<docs-code header="src/app/animations.css" path="adev/src/content/examples/animations/src/app/animations.css" visibleRegion="animation-timing"/>
+
+Similarly, you can use `transition-duration`, `transition-delay`, and `transition-timing-function` and the `transition` shorthand for animations that are not using `@keyframes`.
+
+<docs-code header="src/app/animations.css" path="adev/src/content/examples/animations/src/app/animations.css" visibleRegion="transition-timing"/>
+
+### Triggering an Animation
+
+The animations package required specifying triggers using the `trigger()` function and nesting all of your states within it. With native CSS, this is unnecessary. Animations can be triggered by toggling CSS styles or classes. Once a class is present on an element, the animation will occur. Removing the class will revert the element back to whatever CSS is defined for that element. This results in significantly less code to do the same animation. Here's an example:
+
+#### With Animations Package
+#### With Native CSS
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/open-close.component.ts">
+    <docs-code header="src/app/open-close.component.ts" path="adev/src/content/examples/animations/src/app/native-css/open-close.component.ts" />
+    <docs-code header="src/app/open-close.component.html" path="adev/src/content/examples/animations/src/app/native-css/open-close.component.html" />
+    <docs-code header="src/app/open-close.component.css" path="adev/src/content/examples/animations/src/app/native-css/open-close.component.css"/>
+</docs-code-multifile>
+
+## Transition and Triggers
+
+### Predefined State and wildcard matching
+
+The animations package offers the ability to match your defined states to a transition via strings. For example, animating from open to closed would be `open => closed`. You can use wildcards to match any state to a target state, like `* => closed` and the `void` keyword can be used for entering and exiting states. For example: `* => void` for when an element leaves a view or `void => *` for when the element enters a view.
+
+These state matching patterns are not needed at all when animating with CSS directly. You can manage what transitions and `@keyframes` animations apply based on whatever classes you set and / or styles you set on the elements. You can also add `@starting-style` to control how the element looks upon immediately entering the DOM.
+
+### Automatic Property Calculation with Wildcards
+
+The animations package offers the ability to animate things that have been historically difficult to animate, like animating a set height to `height: auto`. You can now do this with pure CSS as well.
+
+#### With Animations Package
+You can use css-grid to animate to auto height.
+
+#### With Native CSS
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/auto-height.component.ts">
+    <docs-code header="src/app/auto-height.component.ts" path="adev/src/content/examples/animations/src/app/native-css/auto-height.component.ts" />
+    <docs-code header="src/app/auto-height.component.html" path="adev/src/content/examples/animations/src/app/native-css/auto-height.component.html" />
+    <docs-code header="src/app/auto-height.component.css" path="adev/src/content/examples/animations/src/app/native-css/auto-height.component.css"  />
+</docs-code-multifile>
+
+If you don't have to worry about supporting all browsers, you can also check out `calc-size()`, which is the true solution to animating auto height. See [MDN's docs](https://developer.mozilla.org/en-US/docs/Web/CSS/calc-size) and (this tutorial)[https://frontendmasters.com/blog/one-of-the-boss-battles-of-css-is-almost-won-transitioning-to-auto/] for more information.
+
+### Animate entering and leaving a view
+
+The animations package offered the previously mentioned pattern matching for entering and leaving but also included the shorthand aliases of `:enter` and `:leave`.
+
+#### With Animations Package
+Here's how the same thing can be accomplished without the animations package.
+
+#### With Native CSS
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/insert.component.ts">
+    <docs-code header="src/app/insert.component.ts" path="adev/src/content/examples/animations/src/app/native-css/insert.component.ts" />
+    <docs-code header="src/app/insert.component.html" path="adev/src/content/examples/animations/src/app/native-css/insert.component.html" />
+    <docs-code header="src/app/insert.component.css" path="adev/src/content/examples/animations/src/app/native-css/insert.component.css"  />
+</docs-code-multifile>
+
+Leaving a view is slightly more complex. The element removal needs to be delayed until the exit animation is complete. This requires a bit of extra code in your component class to accomplish.
+
+#### With Native CSS
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/remove.component.ts">
+    <docs-code header="src/app/remove.component.ts" path="adev/src/content/examples/animations/src/app/native-css/remove.component.ts" />
+    <docs-code header="src/app/remove.component.html" path="adev/src/content/examples/animations/src/app/native-css/remove.component.html" />
+    <docs-code header="src/app/remove.component.css" path="adev/src/content/examples/animations/src/app/native-css/remove.component.css"  />
+</docs-code-multifile>
+
+### Animating increment and decrement
+
+Along with the aforementioned `:enter` and `:leave`, there's also `:increment` and `:decrement`. You can animate these also by adding and removing classes. Unlike the animation package built-in aliases, there is no automatic application of classes when the values go up or down. You can apply the appropriate classes programmatically. Here's an example:
+
+#### With Animations Package
+#### With Native CSS
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/increment-decrement.component.ts">
+    <docs-code header="src/app/increment-decrement.component.ts" path="adev/src/content/examples/animations/src/app/native-css/increment-decrement.component.ts" />
+    <docs-code header="src/app/increment-decrement.component.html" path="adev/src/content/examples/animations/src/app/native-css/increment-decrement.component.html" />
+    <docs-code header="src/app/increment-decrement.component.css" path="adev/src/content/examples/animations/src/app/native-css/increment-decrement.component.css" />
+</docs-code-multifile>
+
+### Parent / Child Animations
+
+Unlike the animations package, when multiple animations are specified within a given component, no animation has priority over another and nothing blocks any animation from firing. Any sequencing of animations would have to be handled by your definition of your CSS animation, using animation / transition delay, and / or using `animationend` or `transitionend` to handle adding the next css to be animated.
+
+### Disabling an animation or all animations
+
+With native CSS animations, if you'd like to disable the animations that you've specified, you have multiple options.
+
+1. Create a custom class that forces animation and transition to `none`.
+
+```css
+.no-animation {
+  animation: none !important;
+  transition: none !important;
+}
+```
+
+Applying this class to an element prevents any animation from firing on that element. You could alternatively scope this to your entire DOM or section of your DOM to enforce this behavior. However, this prevents animation events from firing. If you are awaiting animation events for element removal, this solution won't work. A workaround is to set durations to 1 millisecond instead.
+
+2. Use the [`prefers-reduced-motion`](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion) media query to ensure no animations play for users that prefer less animation.
+
+3. Prevent adding animation classes programatically
+
+### Animation Callbacks
+
+The animations package exposed callbacks for you to use in the case that you want to do something when the animation has finished. Native CSS animations also have these callbacks.
+
+[`OnAnimationStart`](https://developer.mozilla.org/en-US/docs/Web/API/Element/animationstart_event)
+[`OnAnimationEnd`](https://developer.mozilla.org/en-US/docs/Web/API/Element/animationend_event)
+[`OnAnimationIteration`](https://developer.mozilla.org/en-US/docs/Web/API/Element/animationitration_event)
+[`OnAnimationCancel`](https://developer.mozilla.org/en-US/docs/Web/API/Element/animationcancel_event)
+
+[`OnTransitionStart`](https://developer.mozilla.org/en-US/docs/Web/API/Element/transitionstart_event)
+[`OnTransitionRun`](https://developer.mozilla.org/en-US/docs/Web/API/Element/transitionrun_event)
+[`OnTransitionEnd`](https://developer.mozilla.org/en-US/docs/Web/API/Element/transitionend_event)
+[`OnTransitionCancel`](https://developer.mozilla.org/en-US/docs/Web/API/Element/transitioncancel_event)
+
+The Web Animations API has a lot of additional functionality. [Take a look at the documentation](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API) to see all the available animation APIs.
+
+NOTE: Be aware of bubbling issues with these callbacks. If you are animating children and parents, the events bubble up from children to parents. Consider stopping propagation or looking at more details within the event to determine if you're responding to the desired event target rather than an event bubbling up from a child node. You can examine the `animationname` property or the properties being transitioned to verify you have the right nodes.
+
+## Complex Sequences
+
+The animations package has built-in functionality for creating complex sequences. These sequences are all entirely possible without the animations package.
+
+### Targeting specific elements
+
+In the animations package, you could target specific elements by using the `query()` function to find specific elements by a CSS class name, similar to [`document.querySelector()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/querySelector). This is unnecessary in a native CSS animation world. Instead, you can use your CSS selectors to target sub-classes and apply any desired `transform` or `animation`.
+
+To toggle classes for child nodes within a template, you can use class and style bindings to add the animations at the right points.
+
+### Stagger()
+
+The `stagger()` function allowed you to delay the animation of each item in a list of items by a specified time to create a cascade effect. You can replicate this behavior in native CSS by utilizing `animation-delay` or `transition-delay`. Here is an example of what that CSS might look like.
+
+#### With Animations Package
+#### With Native CSS
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/stagger.component.ts">
+    <docs-code header="src/app/stagger.component.ts" path="adev/src/content/examples/animations/src/app/native-css/stagger.component.ts" />
+    <docs-code header="src/app/stagger.component.html" path="adev/src/content/examples/animations/src/app/native-css/stagger.component.html" />
+    <docs-code header="src/app/stagger.component.css" path="adev/src/content/examples/animations/src/app/native-css/stagger.component.css" />
+</docs-code-multifile>
+
+### Parallel Animations
+
+The animations package has a `group()` function to play multiple animations at the same time. In CSS, you have full control over animation timing. If you have multiple animations defined, you can apply all of them at once.
+
+```css
+.target-element {
+  animation: rotate 3s, fade-in 2s;
+}
+```
+
+In this example, the `rotate` and `fade-in` animations fire at the same time.
+
+### Animating the items of a reordering list
+
+Items reordering in a list works out of the box using the previously described techniques. No additional special work is required. Items in a `@for` loop will be removed and re-added properly, which will fire off animations using `@starting-styles` for entry animations. Removal animations will require additional code to add the event listener, as seen in the example above.
+
+#### With Animations Package<
+#### With Native CSS
+<docs-code-multifile preview path="adev/src/content/examples/animations/src/app/native-css/reorder.component.ts">
+    <docs-code header="src/app/reorder.component.ts" path="adev/src/content/examples/animations/src/app/native-css/reorder.component.ts" />
+    <docs-code header="src/app/reorder.component.html" path="adev/src/content/examples/animations/src/app/native-css/reorder.component.html" />
+    <docs-code header="src/app/reorder.component.css" path="adev/src/content/examples/animations/src/app/native-css/reorder.component.css" />
+</docs-code-multifile>
+## Migrating usages of AnimationPlayer
+
+The `AnimationPlayer` class allows access to an animation to do more advanced things like pause, play, restart, and finish an animation through code. All of these things can be handled natively as well.
+
+You can retrieve animations off an element directly using [`Element.getAnimations()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/getAnimations). This returns an array of every [`Animation`](https://developer.mozilla.org/en-US/docs/Web/API/Animation) on that element. You can use the `Animation` API to do much more than you could with what the `AnimationPlayer` from the animations package offered. From here you can `cancel()`, `play()`, `pause()`, `reverse()` and much more. This native API should provide everything you need to control your animations.
+
+## Route Transitions
+
+You can use view transitions to animate between routes. See the [Route Transition Animations Guide](guide/animations/route-animations) to get started.# Angular without ZoneJS (Zoneless)
+
+## Why use Zoneless?
+
+The main advantages to removing ZoneJS as a dependency are:
+
+- **Improved performance**: ZoneJS uses DOM events and async tasks as indicators of when application state _might_ have updated and subsequently triggers application synchronization to run change detection on the application's views. ZoneJS does not have any insight into whether application state actually changed and so this synchronization is triggered more frequently than necessary.
+- **Improved Core Web Vitals**: ZoneJS brings a fair amount of overhead, both in payload size and in startup time cost.
+- **Improved debugging experience**: ZoneJS makes debugging code more difficult. Stack traces are harder to understand with ZoneJS. It's also difficult to understand when code breaks as a result of being outside the Angular Zone.
+- **Better ecosystem compatibility**: ZoneJS works by patching browser APIs but does not automatically have patches for every new browser API. Some APIs cannot be patched effectively, such as `async`/`await`, and have to be downleveled to work with ZoneJS. Sometimes libraries in the ecosystem are also incompatible with the way ZoneJS patches the native APIs. Removing ZoneJS as a dependency ensures better long-term compatibility by removing a source of complexity, monkey patching, and ongoing maintenance.
+
+## Enabling Zoneless in an application
+
+The API for enabling Zoneless is currently in developer preview. The shape of the API and underlying behavior can change in patch versions.
+
+```typescript
+// standalone bootstrap
+bootstrapApplication(MyApp, {providers: [
+  provideZonelessChangeDetection(),
+]});
+
+// NgModule bootstrap
+platformBrowser().bootstrapModule(AppModule);
+@NgModule({
+  providers: [provideZonelessChangeDetection()]
+})
+export class AppModule {}
+```
+
+## Removing ZoneJS
+
+Zoneless applications should remove ZoneJS entirely from the build to reduce bundle size. ZoneJS is typically
+loaded via the `polyfills` option in `angular.json`, both in the `build` and `test` targets. Remove `zone.js`
+and `zone.js/testing` from both to remove it from the build. Projects which use an explicit `polyfills.ts` file
+should remove `import 'zone.js';` and `import 'zone.js/testing';` from the file.
+
+After removing ZoneJS from the build, there is no longer a need for a `zone.js` dependency either and the
+package can be removed entirely:
+
+```shell
+npm uninstall zone.js
+```
+
+## Requirements for Zoneless compatibility
+
+Angular relies on notifications from core APIs in order to determine when to run change detection and on which views.
+These notifications include:
+
+- `ChangeDetectorRef.markForCheck` (called automatically by `AsyncPipe`)
+- `ComponentRef.setInput`
+- Updating a signal that's read in a template
+- Bound host or template listeners callbacks
+- Attaching a view that was marked dirty by one of the above
+
+### `OnPush`-compatible components
+
+One way to ensure that a component is using the correct notification mechanisms from above is to
+use [ChangeDetectionStrategy.OnPush](/best-practices/skipping-subtrees#using-onpush).
+
+The `OnPush` change detection strategy is not required, but it is a recommended step towards zoneless compatibility for application components. It is not always possible for library components to use `ChangeDetectionStrategy.OnPush`.
+When a library component is a host for user-components which might use `ChangeDetectionStrategy.Default`, it cannot use `OnPush` because that would prevent the child component from being refreshed if it is not `OnPush` compatible and relies on ZoneJS to trigger change detection. Components can use the `Default` strategy as long as they notify Angular when change detection needs to run (calling `markForCheck`, using signals, `AsyncPipe`, etc.).
+Being a host for a user component means using an API such as `ViewContainerRef.createComponent` and not just hosting a portion of a template from a user component (i.e. content projection or a using a template ref input).
+
+### Remove `NgZone.onMicrotaskEmpty`, `NgZone.onUnstable`, `NgZone.isStable`, or `NgZone.onStable`
+
+Applications and libraries need to remove uses of `NgZone.onMicrotaskEmpty`, `NgZone.onUnstable` and `NgZone.onStable`.
+These observables will never emit when an Application enables zoneless change detection.
+Similarly, `NgZone.isStable` will always be `true` and should not be used as a condition for code execution.
+
+The `NgZone.onMicrotaskEmpty` and `NgZone.onStable` observables are most often used to wait for Angular to
+complete change detection before performing a task. Instead, these can be replaced by `afterNextRender`
+if they need to wait for a single change detection or `afterEveryRender` if there is some condition that might span
+several change detection rounds. In other cases, these observables were used because they happened to be
+familiar and have similar timing to what was needed. More straightforward or direct DOM APIs can be used instead,
+such as `MutationObserver` when code needs to wait for certain DOM state (rather than waiting for it indirectly
+through Angular's render hooks).
+`NgZone.run` and `NgZone.runOutsideAngular` do not need to be removed in order for code to be compatible with
+Zoneless applications. In fact, removing these calls can lead to performance regressions for libraries that
+are used in applications that still rely on ZoneJS.
+### `PendingTasks` for Server Side Rendering (SSR)
+
+If you are using SSR with Angular, you may know that it relies on ZoneJS to help determine when the application
+is "stable" and can be serialized. If there are asynchronous tasks that should prevent serialization, an application
+not using ZoneJS must make Angular aware of these with the [PendingTasks](/api/core/PendingTasks) service. Serialization
+will wait for the first moment that all pending tasks have been removed.
+The two most straightforward uses of pending tasks are the `run` method:
+
+```typescript
+const taskService = inject(PendingTasks);
+taskService.run(async () => {
+  const someResult = await doSomeWorkThatNeedsToBeRendered();
+  this.someState.set(someResult);
+});
+```
+
+For more complicated use-cases, you can manuall add and remove a pending tasks:
+
+```typescript
+const taskService = inject(PendingTasks);
+const taskCleanup = taskService.add();
+try {
+  await doSomeWorkThatNeedsToBeRendered();
+} catch {
+  // handle error
+} finally {
+  taskCleanup();
+}
+```
+
+In addition, the [pendingUntilEvent](/api/core/rxjs-interop/pendingUntilEvent#) helper in `rxjs-interop` ensures
+the application remains unstable until the observable emits, complets, errors, or is unsubscribed.
+
+```typescript
+readonly myObservableState = someObservable.pipe(pendingUntilEvent());
+```
+
+The framework uses this service internally as well to prevent serialization until asynchronous tasks are complete. These include, but are not limited to,
+an ongoing Router navigation and an incomplete `HttpClient` request.
+
+## Testing and Debugging
+
+### Using Zoneless in `TestBed`
+
+The zoneless provider function can also be used with `TestBed` to help
+ensure the components under test are compatible with a Zoneless
+Angular application.
+
+```typescript
+TestBed.configureTestingModule({
+  providers: [provideZonelessChangeDetection()]
+});
+
+const fixture = TestBed.createComponent(MyComponent);
+await fixture.whenStable();
+```
+
+To ensure tests have the most similar behavior to production code,
+avoid using `fixture.detectChanges()` when possible. This forces
+change detection to run when Angular might otherwise have not
+scheduled change detection. Tests should ensure these notifications
+are happening and allow Angular to handle when to synchronize
+state rather than manually forcing it to happen in the test.
+
+For existing test suites, using `fixture.detectChanges()` is a common pattern
+and it is likely not worth the effort of converting these to
+`await fixture.whenStable()`. `TestBed` will still enforce that the
+fixture's component is `OnPush` compatible and throws `ExpressionChangedAfterItHasBeenCheckedError`
+if it finds that template values were updated without a
+change notification (i.e. `fixture.componentInstance.someValue = 'newValue';`).
+If the component is used in production, this issue should be addressed by updating
+the component to use signals for state or call `ChangeDetectorRef.markForCheck()`.
+If the component is only used as a test wrapper and never used in an application,
+it is acceptable to use `fixture.changeDetectorRef.markForCheck()`.
+
+### Debug-mode check to ensure updates are detected
+
+Angular also provides an additional tool to help verify that an application is making
+updates to state in a zoneless-compatible way. `provideCheckNoChangesConfig({exhaustive: true, interval: <milliseconds>})`
+can be used to periodically check to ensure that no bindings have been updated
+without a notification. Angular throws `ExpressionChangedAfterItHasBeenCheckedError`
+if there is an updated binding that would not have refreshed by the zoneless change
+detection.
+As an open source project, Angular’s daily commits, PRs and momentum is all trackable on GitHub. To increase transparency into how this daily work connects to the framework’s future, our roadmap brings together the team’s current and future planned vision.
+
+The following projects are not associated with a particular Angular version. We will release them on completion, and they will be part of a specific version based on our release schedule, following semantic versioning. For example, we release features in the next minor after completion or the next major if they include breaking changes.
+
+Currently, Angular has two goals for the framework:
+
+1. Improve the [Angular developer experience](#improving-the-angular-developer-experience) and
+2. Improve the [framework’s performance](#fast-by-default).
+
+Continue reading to learn how we plan to deliver these objectives with specific project work.
+
+## Explore modern Angular
+
+Start developing with the latest Angular features from our roadmap. This list represents the current status of new features from our roadmap:
+
+### Available to experiment with
+
+* [Zoneless change detection](/guide/zoneless)
+* [Resource API](/guide/signals/resource)
+* [httpResource](/api/common/http/httpResource)
+
+### Production ready
+
+* [Linked Signal API](/guide/signals/linked-signal)
+* [Incremental hydration](/guide/incremental-hydration)
+* [Effect API](/api/core/effect)
+* [Event replay with SSR](/api/platform-browser/withEventReplay)
+* [Route-level render mode](/guide/ssr)
+
+## Improving the Angular developer experience
+
+### Developer velocity
+### Improve Angular Material and the CDK
+### Improve tooling
+## Future work, explorations, and prototyping
+
+This section represents explorations and prototyping of potential future projects. A reasonable outcome is to decide that our current solutions are the best options. Other projects may result in RFCs, graduating to in-progress projects, or being deprioritized as the web continues to innovate along with our framework.
+## Completed projects
+# Keeping your Angular projects up-to-date
+
+Just like Web and the entire web ecosystem, Angular is continuously improving.
+Angular balances continuous improvement with a strong focus on stability and making updates straightforward.
+Keeping your Angular application up-to-date enables you to take advantage of leading-edge new features, as well as optimizations and bug fixes.
+
+This document contains information and resources to help you keep your Angular applications and libraries up-to-date.
+
+For information about our versioning policy and practices —including support and deprecation practices, as well as the release schedule— see [Angular versioning and releases](reference/releases "Angular versioning and releases").
+
+HELPFUL: If you are currently using AngularJS, see [Upgrading from AngularJS](https://angular.io/guide/upgrade "Upgrading from Angular JS").
+*AngularJS* is the name for all v1.x versions of Angular.
+
+## Getting notified of new releases
+
+To be notified when new releases are available, follow [@angular](https://x.com/angular "@angular on X") on X (formerly Twitter) or subscribe to the [Angular blog](https://blog.angular.dev "Angular blog").
+
+## Learning about new features
+
+What's new? What's changed? We share the most important things you need to know on the Angular blog in [release announcements]( https://blog.angular.dev/ "Angular blog - release announcements").
+
+To review a complete list of changes, organized by version, see the [Angular change log](https://github.com/angular/angular/blob/main/CHANGELOG.md "Angular change log").
+
+## Checking your version of Angular
+
+To check your application's version of Angular use the `ng version` command from within your project directory.
+
+## Finding the current version of Angular
+
+The most recent stable released version of Angular appears [on npm](https://www.npmjs.com/package/@angular/core "Angular on npm") under "Version." For example, `16.2.4`.
+
+You can also find the most current version of Angular by using the CLI command [`ng update`](cli/update).
+By default, [`ng update`](cli/update)(without additional arguments) lists the updates that are available to you.
+
+## Updating your environment and apps
+
+To make updating uncomplicated, we provide complete instructions in the interactive [Angular Update Guide](update-guide).
+
+The Angular Update Guide provides customized update instructions, based on the current and target versions that you specify.
+It includes basic and advanced update paths, to match the complexity of your applications.
+It also includes troubleshooting information and any recommended manual changes to help you get the most out of the new release.
+
+For simple updates, the CLI command [`ng update`](cli/update) is all you need.
+Without additional arguments, [`ng update`](cli/update) lists the updates that are available to you and provides recommended steps to update your application to the most current version.
+
+[Angular Versioning and Releases](reference/releases#versioning "Angular Release Practices, Versioning") describes the level of change that you can expect based on a release's version number.
+It also describes supported update paths.
+
+## Resource summary
+
+* Release announcements:
+    [Angular blog - release announcements](https://blog.angular.dev/ "Angular blog announcements about recent releases")
+
+* Release details:
+    [Angular change log](https://github.com/angular/angular/blob/main/CHANGELOG.md "Angular change log")
+
+* Update instructions:
+    [Angular Update Guide](update-guide)
+
+* Update command reference:
+    [Angular CLI `ng update` command reference](cli/update)
+
+* Versioning, release, support, and deprecation practices:
+    [Angular versioning and releases](reference/releases "Angular versioning and releases")
+# `HttpClient` security
+
+`HttpClient` includes built-in support for two common HTTP security mechanisms: XSSI protection and XSRF/CSRF protection.
+
+TIP: Also consider adopting a [Content Security Policy](https://developer.mozilla.org/docs/Web/HTTP/Headers/Content-Security-Policy) for your APIs.
+
+## XSSI protection
+
+Cross-Site Script Inclusion (XSSI) is a form of [Cross-Site Scripting](https://en.wikipedia.org/wiki/Cross-site_scripting) attack where an attacker loads JSON data from your API endpoints as `<script>`s on a page they control. Different JavaScript techniques can then be used to access this data.
+
+A common technique to prevent XSSI is to serve JSON responses with a "non-executable prefix", commonly `)]}',\n`. This prefix prevents the JSON response from being interpreted as valid executable JavaScript. When the API is loaded as data, the prefix can be stripped before JSON parsing.
+
+`HttpClient` automatically strips this XSSI prefix (if present) when parsing JSON from a response.
+
+## XSRF/CSRF protection
+
+[Cross-Site Request Forgery (XSRF or CSRF)](https://en.wikipedia.org/wiki/Cross-site_request_forgery) is an attack technique by which the attacker can trick an authenticated user into unknowingly executing actions on your website.
+
+`HttpClient` supports a [common mechanism](https://en.wikipedia.org/wiki/Cross-site_request_forgery#Cookie-to-header_token) used to prevent XSRF attacks. When performing HTTP requests, an interceptor reads a token from a cookie, by default `XSRF-TOKEN`, and sets it as an HTTP header, `X-XSRF-TOKEN`. Because only code that runs on your domain could read the cookie, the backend can be certain that the HTTP request came from your client application and not an attacker.
+
+By default, an interceptor sends this header on all mutating requests (such as `POST`) to relative URLs, but not on GET/HEAD requests or on requests with an absolute URL.
+CSRF protection is only needed for requests that can change state on the backend. By their nature, CSRF attacks cross domain boundaries, and the web's [same-origin policy](https://developer.mozilla.org/docs/Web/Security/Same-origin_policy) will prevent an attacking page from retrieving the results of authenticated GET requests.
+To take advantage of this, your server needs to set a token in a JavaScript readable session cookie called `XSRF-TOKEN` on either the page load or the first GET request. On subsequent requests the server can verify that the cookie matches the `X-XSRF-TOKEN` HTTP header, and therefore be sure that only code running on your domain could have sent the request. The token must be unique for each user and must be verifiable by the server; this prevents the client from making up its own tokens. Set the token to a digest of your site's authentication cookie with a salt for added security.
+
+To prevent collisions in environments where multiple Angular apps share the same domain or subdomain, give each application a unique cookie name.
+  Your backend service must be configured to set the cookie for your page, and to verify that the header is present on all eligible requests. Failing to do so renders Angular's default protection ineffective.
+### Configure custom cookie/header names
+
+If your backend service uses different names for the XSRF token cookie or header, use `withXsrfConfiguration` to override the defaults.
+
+Add it to the `provideHttpClient` call as follows:
+
+```ts
+export const appConfig: ApplicationConfig = {
+  providers: [
+    provideHttpClient(
+      withXsrfConfiguration({
+        cookieName: 'CUSTOM_XSRF_TOKEN',
+        headerName: 'X-Custom-Xsrf-Header',
+      }),
+    ),
+  ]
+};
+```
+### Disabling XSRF protection
+
+If the built-in XSRF protection mechanism doesn't work for your application, you can disable it using the `withNoXsrfProtection` feature:
+
+```ts
+export const appConfig: ApplicationConfig = {
+  providers: [
+    provideHttpClient(
+      withNoXsrfProtection(),
+    ),
+  ]
+};
+```
+
+# Angular Internationalization
+
+*Internationalization*, sometimes referenced as i18n, is the process of designing and preparing your project for use in different locales around the world.
+*Localization* is the process of building versions of your project for different locales.
+The localization process includes the following actions.
+
+* Extract text for translation into different languages
+* Format data for a specific locale
+
+A *locale* identifies a region in which people speak a particular language or language variant.
+Possible regions include countries and geographical regions.
+A locale determines the formatting and parsing of the following details.
+
+* Measurement units including date and time, numbers, and currencies
+* Translated names including time zones, languages, and countries
+
+For a quick introduction to localization and internationalization watch this video:
+
+<docs-video src="https://www.youtube.com/embed/KNTN-nsbV7M"/>
+
+## Learn about Angular internationalization
diff --git a/llms/public/prompt-copilot-refactor.txt b/llms/public/prompt-copilot-refactor.txt
new file mode 100644
index 0000000..929988c
--- /dev/null
+++ b/llms/public/prompt-copilot-refactor.txt
@@ -0,0 +1,116 @@
+## Prompt for Copilot — angular.fun refactor (Angular 20+)
+
+You are refactoring an **existing** Angular workspace to the target architecture. Work in **English**. Produce diffs, commands, file scaffolds, and ask concise questions when assumptions affect output quality.
+
+### 0) Primary inputs (authority order)
+1. **architecture.txt** — canonical architecture (folder types, isolation, one‑way graph, lazy features, providers, ESLint boundaries). Treat this as the top source of truth. fileciteturn5file3turn5file6turn5file12turn5file15
+2. **app-llm.txt** — system brief: projects (`apps/blog-ssg`, `apps/admin-spa`, `apps/code-samples-mfe`), hosting (Cloud Run/Firebase), SSR/SSG plan, SignalStore, Supabase via PostgREST for prerender, CI gates (Lighthouse 100/100/100/100, Playwright + axe). fileciteturn5file0turn5file10turn5file18
+3. **guidelines-copilot.md** — mandatory coding rules and **NgRx SignalStore** usage with examples (`withState`, `withComputed`, `withMethods`, `withHooks`, `patchState`, `withEntities`, `rxMethod`). fileciteturn5file2turn5file4turn5file5turn5file11turn5file16turn5file19
+4. **llm-full.txt** — excerpts from official Angular docs (signals, hydration, `@defer`, inputs/outputs). Conform to it when ambiguous. fileciteturn5file3
+
+Also follow official docs for hybrid rendering & **route‑level render mode**, hydration / `ngSkipHydration`, `@defer`, `NgOptimizedImage`, **SignalStore**, **Native Federation**, **Supabase PostgREST & SSR cookies**, **Cloud Run deploy from source**, **Node 20.19+ for Angular 20**, and **Lighthouse CI**. citeturn0search0turn0search8turn0search1turn0search2turn0search3turn0search11turn0search4turn0search12turn0search5turn0search13turn0search6turn0search7turn0search14turn0search15turn0search16turn0search5turn0search10
+
+---
+
+### 1) Target system
+
+- **Monorepo (Angular CLI, no Nx)** with projects:
+  - `apps/blog-ssg` — public app. **Home (`/`) = SSR**, **articles (`/posts/:slug`) = SSG**, other routes CSR/SSR case‑by‑case via **route‑level render mode**. Hybrid rendering is the official pattern. fileciteturn5file0 citeturn0search0turn0search8
+  - Hydration enabled by default; opt out only where needed using `host: { ngSkipHydration: 'true' }`. This skips hydration for the component subtree. citeturn0search1turn0search24
+  - Use **`@defer`** to defer heavy, non‑critical UI to improve CWV (LCP/TTFB/INP). citeturn0search2turn0search10turn0search17turn0search25
+  - Use **`NgOptimizedImage`** to prioritize the LCP image, lazy‑load others, add `fetchpriority`, enforce width/height to avoid CLS. citeturn0search3turn0search11turn0search18
+  - `apps/admin-spa` — pure CSR; Quill/editor only here, lazy‑loaded. fileciteturn5file0
+  - `apps/code-samples-mfe` — **Native Federation** remote with heavy examples; lazy‑loaded from blog; share Angular/RxJS as singletons. Native Federation integrates with the CLI’s **esbuild Application Builder**. fileciteturn5file0 citeturn0search5turn0search13
+  - `libs/shared/ui`, `libs/shared/pattern`, `libs/shared/data-access` — enforce **one‑way dependency flow**; no feature→feature imports; reuse via `ui`/`pattern` or routing. Enforce with **eslint‑plugin‑boundaries**. fileciteturn5file3turn5file12
+
+- **State management**:
+  - Local: **signals** (`signal`, `computed`, `linkedSignal`).
+  - Domain/shared: **NgRx SignalStore** with `withState`, `withComputed`, `withMethods`, `withHooks`; immutable updates via **`patchState`**; entities via **`withEntities`** updaters; reactive workflows with **`rxMethod`**; Angular interop via `toSignal`/`toObservable`. **Never mutate.** fileciteturn5file2turn5file4turn5file5turn5file11 citeturn0search4turn0search12turn0search19turn0search5
+
+- **Data / Supabase**:
+  - Public reading (SSG/SSR): use **PostgREST REST** with **anon** role under **RLS**; avoid `supabase-js` during prerender. If SSR needs session, use `@supabase/ssr` with **cookies**. Storage via **Supabase Storage CDN**; use versioned filenames or signed URLs for cache busting. fileciteturn5file0 citeturn0search6turn0search21turn0search14turn0search7turn0search15
+
+- **Hosting / CI**:
+  - `blog-ssg` → **Google Cloud Run**, deploy **from source** using buildpacks. Ensure `npm start` launches the SSR server. Use Workload Identity Federation when feasible. fileciteturn5file0 citeturn0search16
+  - `admin-spa`, `code-samples-mfe` → **Firebase Hosting** (separate targets). fileciteturn5file0
+  - **Angular 20 requires Node ≥ 20.19** — update GitHub Actions runners accordingly. fileciteturn5file0 citeturn0search16
+  - Quality gates: **Lighthouse CI** on `https://angular.fun/` with **100/100/100/100** thresholds; **Playwright + axe** a11y scan. fileciteturn5file0 citeturn0search2
+
+---
+
+### 2) Workflow you must follow
+
+#### Phase A — Inventory & gap analysis
+1. Print the current `angular.json` projects, builders, budgets.
+   Print folder trees for `/apps` and `/libs`, and highlight deviations from `architecture.txt`. fileciteturn5file3turn5file12
+2. Locate usage of SSR/SSG, `ServerRoute[]`, hydration opt‑outs, `@defer`, Quill, Supabase clients.
+3. Detect **feature→feature imports** and any boundaries violations. Produce a **gap report** mapping current → target, with **actionable diffs**.
+
+#### Phase B — Workspace reshape (non‑breaking)
+4. Create missing projects/libs if absent: `apps/blog-ssg`, `apps/admin-spa`, `apps/code-samples-mfe`, `libs/shared/{ui,pattern,data-access}`. Minimal standalone bootstraps with `provideCore({ routes })`. fileciteturn5file3turn5file15
+5. Add **eslint‑plugin‑boundaries** config that encodes allowed imports; fail CI on violations. fileciteturn5file12turn5file13turn5file14
+6. Set **Node 20.19+** in Actions; consider `pnpm` with cache.
+
+#### Phase C — Rendering & routing
+7. Implement **route‑level render mode** with `ServerRoute[]`: `/` → SSR, `/posts/:slug` → SSG, others CSR/SSR as needed. Commit the table and server bootstrap. fileciteturn5file0 citeturn0search0turn0search8
+8. Introduce `@defer` around heavy widgets (charts, embeds, viewers). Provide concrete templates with placeholders/triggers. citeturn0search2turn0search17
+9. Use `host: { ngSkipHydration: 'true' }` only where conflicts are proven; list evidence. citeturn0search1
+10. Replace `<img>` with **`NgOptimizedImage`** and add a simple **Supabase CDN loader** (width/format). Ensure LCP image gets `priority` and `fetchpriority`. citeturn0search3turn0search11
+
+#### Phase D — Data access & state
+11. Implement typed REST clients in `libs/shared/data-access` for PostgREST (DTOs, query builder, error mapping).
+    Add **SignalStore** stores for posts/search/admin flows; strictly use `patchState`. Add **`withEntities`** where lists are managed. fileciteturn5file2 citeturn0search4turn0search12
+12. Add **`scripts/generate-routes.mjs`** to fetch published slugs and write `apps/blog-ssg/routes.txt`; wire it in CI before prerender. Use anon key and RLS‑safe policies. fileciteturn5file0 citeturn0search6turn0search21
+13. Prepare a **server utility** for `createServerClient` with cookies for future SSR user context. citeturn0search7turn0search15
+
+#### Phase E — Micro‑frontend
+14. Configure **Native Federation**: blog = shell, samples = remote exposing `./routes`. Lazy‑load via `loadRemoteModule('samples','./routes')`. Share Angular/RxJS singletons. Provide dev/prod URLs. fileciteturn5file0 citeturn0search5turn0search13
+
+#### Phase F — CI/CD & quality gates
+15. Split CI jobs per app. Blog: `build` → `server` → `prerender` → **Cloud Run deploy from source**. Admin & Samples: build → **Firebase Hosting** deploy. Include **Lighthouse CI** on the **home page** and **Playwright + axe** scan. fileciteturn5file0 citeturn0search16
+
+#### Phase G — i18n scaffold
+16. Prepare i18n for `pl` next: `$localize` extraction, localized builds, serve one locale at a time; generate **per‑locale** route lists for SSG. fileciteturn5file0
+
+---
+
+### 3) Acceptance criteria
+
+- **Architecture**: no feature→feature imports; boundaries lint passes; all features lazy. fileciteturn5file3
+- **Rendering**: server route table in place; home SSR, articles SSG; heavy parts deferred; targeted `ngSkipHydration` only where necessary. fileciteturn5file0 citeturn0search0turn0search2turn0search1
+- **State**: all domain/shared state via **SignalStore** with `patchState`; entity stores where needed; unit tests for store methods. fileciteturn5file2 citeturn0search4
+- **Data**: SSG/SSR use PostgREST; `routes.txt` generated from published slugs; secrets via env/CI. fileciteturn5file0 citeturn0search6
+- **CI**: Node **20.19+**; Cloud Run deploy succeeds; Firebase deploys for admin/samples; LHCI passes with 1.00 thresholds; Playwright + axe finds **no critical violations**. fileciteturn5file0 citeturn0search16
+
+---
+
+### 4) Ask when uncertain — first question block
+
+1) **angular.json**: current projects, builders, budgets? esbuild enabled?
+2) **Secrets**: confirm env names `SUPABASE_REST_URL`, `SUPABASE_ANON_KEY`, `GCP_SA_KEY` (or WIF), Firebase `projectId` and targets for `admin` / `samples`.
+3) **Posts schema**: table name and columns (`id`, `slug`, `published`, `updated_at`)? RLS policy text for `anon` reads?
+4) **Cloud Run runtime**: what command should `npm start` run? Any runtime env vars?
+5) **Quill**: exact packages/plugins and rough bundle size; can we fully defer?
+6) **MFE**: remote name (`samples`) and final public URL; which deps forced as singletons?
+7) **Design tokens & budgets**: initial Tailwind/DaisyUI tokens; CSS/JS budget numbers for `angular.json`?
+8) **Analytics & SEO**: provider? need OG/Twitter tags and `og:image` generation (static vs on‑demand)?
+9) **Testing**: only Playwright, or add unit coverage thresholds? any extra critical E2E flows beyond home?
+10) **i18n**: path strategy (`/en/...`, `/pl/...`); will slugs be localized?
+
+### 5) Deliverables
+    A migration plan (markdown) with a task list and effort estimate.
+    Concrete diffs (files added/modified), including:
+    Route‑level server config and blog routes.
+    scripts/generate-routes.mjs.
+    SignalStore examples for posts and search.
+    Native Federation config for shell/remote.
+    ESLint boundaries config.
+    CI workflow YAML (Cloud Run + Firebase + LHCI + axe).
+    Readme snippets describing local dev, prerender, and deploy commands.
+    A risk log (hydration conflicts, CDN caching, auth on SSR) with mitigations and links to sources.
+    Cite official documentation when proposing non‑obvious choices.
+
+Final instruction
+Begin with Phase A: print the inventory, report deviations vs. architecture.txt, and ask the outstanding questions in one block. Then proceed phase by phase, committing small, reviewable changes.
+
+
diff --git a/package-lock.json b/package-lock.json
index 9b33a53..06639a3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,24 +8,24 @@
       "name": "angular-blog-app",
       "version": "0.0.0",
       "dependencies": {
-        "@angular/animations": "^19.2.1",
-        "@angular/common": "^19.2.1",
-        "@angular/compiler": "^19.2.1",
-        "@angular/core": "^19.2.1",
-        "@angular/forms": "^19.2.1",
-        "@angular/platform-browser": "^19.2.1",
-        "@angular/platform-browser-dynamic": "^19.2.1",
-        "@angular/platform-server": "^19.2.1",
-        "@angular/router": "^19.2.1",
-        "@angular/ssr": "^19.2.1",
-        "@ngrx/operators": "^19.1.0",
-        "@ngrx/signals": "^19.1.0",
+        "@angular/animations": "^20.1.7",
+        "@angular/common": "^20.1.7",
+        "@angular/compiler": "^20.1.7",
+        "@angular/core": "^20.1.7",
+        "@angular/forms": "^20.1.7",
+        "@angular/platform-browser": "^20.1.7",
+        "@angular/platform-browser-dynamic": "^20.1.7",
+        "@angular/platform-server": "^20.1.7",
+        "@angular/router": "^20.1.7",
+        "@angular/ssr": "^20.1.6",
+        "@ngrx/operators": "^20.0.0",
+        "@ngrx/signals": "^20.0.0",
         "@supabase/supabase-js": "^2.49.4",
         "@tailwindcss/line-clamp": "^0.4.4",
-        "express": "^4.18.2",
+        "express": "^5.1.0",
         "i": "^0.3.7",
         "ngx-highlightjs": "^12.0.0",
-        "ngx-quill": "^27.0.0",
+        "ngx-quill": "^28.0.1",
         "node-fetch": "^3.3.2",
         "npm": "^10.8.2",
         "quill": "^2.0.2",
@@ -34,313 +34,283 @@
         "zone.js": "~0.15.0"
       },
       "devDependencies": {
-        "@angular-devkit/build-angular": "^19.2.1",
-        "@angular/cli": "^19.2.1",
-        "@angular/compiler-cli": "^19.2.1",
+        "@angular/build": "^20.1.6",
+        "@angular/cli": "^20.1.6",
+        "@angular/compiler-cli": "^20.1.7",
         "@playwright/test": "^1.53.0",
         "@snaplet/copycat": "^6.0.0",
         "@snaplet/seed": "^0.98.0",
         "@types/compression": "^1.7.5",
-        "@types/express": "^4.17.17",
+        "@types/express": "^5.0.1",
         "@types/jasmine": "~5.1.0",
-        "@types/node": "^18.19.111",
+        "@types/node": "^20.17.19",
         "@types/pg": "^8.15.2",
+        "angular-eslint": "20.1.1",
         "autoprefixer": "^10.4.19",
         "daisyui": "^4.12.10",
+        "esbuild-visualizer": "^0.7.0",
+        "eslint": "^9.29.0",
+        "eslint-import-resolver-typescript": "^4.4.4",
+        "eslint-plugin-boundaries": "^5.0.1",
+        "eslint-plugin-import": "^2.32.0",
+        "http-server": "^14.1.1",
         "jasmine-core": "~5.1.0",
         "karma": "~6.4.0",
         "karma-chrome-launcher": "~3.2.0",
         "karma-coverage": "~2.2.0",
         "karma-jasmine": "~5.1.0",
         "karma-jasmine-html-reporter": "~2.1.0",
+        "ng-packagr": "^20.1.0",
         "pg": "^8.16.0",
         "playwright-ng-schematics": "^2.0.3",
         "postcss": "^8.4.38",
         "prettier": "3.4.2",
+        "source-map-explorer": "^2.5.3",
         "tailwindcss": "^3.4.4",
         "ts-node": "^10.9.2",
         "tsx": "^4.19.4",
-        "typescript": "~5.7.3",
+        "typescript": "~5.8.3",
+        "typescript-eslint": "8.34.1",
         "webpack-bundle-analyzer": "^4.10.2",
         "webpack-cli": "^5.1.4"
       }
     },
-    "node_modules/@alloc/quick-lru": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz",
-      "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==",
+    "node_modules/@algolia/client-abtesting": {
+      "version": "5.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/client-abtesting/-/client-abtesting-5.32.0.tgz",
+      "integrity": "sha512-HG/6Eib6DnJYm/B2ijWFXr4txca/YOuA4K7AsEU0JBrOZSB+RU7oeDyNBPi3c0v0UDDqlkBqM3vBU/auwZlglA==",
+      "dev": true,
       "license": "MIT",
-      "engines": {
-        "node": ">=10"
+      "dependencies": {
+        "@algolia/client-common": "5.32.0",
+        "@algolia/requester-browser-xhr": "5.32.0",
+        "@algolia/requester-fetch": "5.32.0",
+        "@algolia/requester-node-http": "5.32.0"
       },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+      "engines": {
+        "node": ">= 14.0.0"
       }
     },
-    "node_modules/@ampproject/remapping": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
-      "integrity": "sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==",
+    "node_modules/@algolia/client-analytics": {
+      "version": "5.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/client-analytics/-/client-analytics-5.32.0.tgz",
+      "integrity": "sha512-8Y9MLU72WFQOW3HArYv16+Wvm6eGmsqbxxM1qxtm0hvSASJbxCm+zQAZe5stqysTlcWo4BJ82KEH1PfgHbJAmQ==",
       "dev": true,
-      "license": "Apache-2.0",
+      "license": "MIT",
       "dependencies": {
-        "@jridgewell/gen-mapping": "^0.3.5",
-        "@jridgewell/trace-mapping": "^0.3.24"
+        "@algolia/client-common": "5.32.0",
+        "@algolia/requester-browser-xhr": "5.32.0",
+        "@algolia/requester-fetch": "5.32.0",
+        "@algolia/requester-node-http": "5.32.0"
       },
       "engines": {
-        "node": ">=6.0.0"
+        "node": ">= 14.0.0"
       }
     },
-    "node_modules/@angular-devkit/architect": {
-      "version": "0.1902.1",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1902.1.tgz",
-      "integrity": "sha512-iCm6F4HYO5aIgjzhjOUPKnyFHcn6yVE8gCpjWFQL8JVqrVzFG27vMZ0wK8b8rMDIDt6/hr2FOSSwChVg/cv9GQ==",
+    "node_modules/@algolia/client-common": {
+      "version": "5.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/client-common/-/client-common-5.32.0.tgz",
+      "integrity": "sha512-w8L+rgyXMCPBKmEdOT+RfgMrF0mT6HK60vPYWLz8DBs/P7yFdGo7urn99XCJvVLMSKXrIbZ2FMZ/i50nZTXnuQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/client-insights": {
+      "version": "5.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/client-insights/-/client-insights-5.32.0.tgz",
+      "integrity": "sha512-AdWfynhUeX7jz/LTiFU3wwzJembTbdLkQIOLs4n7PyBuxZ3jz4azV1CWbIP8AjUOFmul6uXbmYza+KqyS5CzOA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@angular-devkit/core": "19.2.1",
-        "rxjs": "7.8.1"
+        "@algolia/client-common": "5.32.0",
+        "@algolia/requester-browser-xhr": "5.32.0",
+        "@algolia/requester-fetch": "5.32.0",
+        "@algolia/requester-node-http": "5.32.0"
       },
       "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0",
-        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
-        "yarn": ">= 1.13.0"
+        "node": ">= 14.0.0"
       }
     },
-    "node_modules/@angular-devkit/architect/node_modules/rxjs": {
-      "version": "7.8.1",
-      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz",
-      "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==",
+    "node_modules/@algolia/client-personalization": {
+      "version": "5.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/client-personalization/-/client-personalization-5.32.0.tgz",
+      "integrity": "sha512-bTupJY4xzGZYI4cEQcPlSjjIEzMvv80h7zXGrXY1Y0KC/n/SLiMv84v7Uy+B6AG1Kiy9FQm2ADChBLo1uEhGtQ==",
       "dev": true,
-      "license": "Apache-2.0",
+      "license": "MIT",
       "dependencies": {
-        "tslib": "^2.1.0"
+        "@algolia/client-common": "5.32.0",
+        "@algolia/requester-browser-xhr": "5.32.0",
+        "@algolia/requester-fetch": "5.32.0",
+        "@algolia/requester-node-http": "5.32.0"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
       }
     },
-    "node_modules/@angular-devkit/build-angular": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/build-angular/-/build-angular-19.2.1.tgz",
-      "integrity": "sha512-YJdHON1005lBzXFFfTJBrcFvbgWMEhvkziQw1IuQpbl+aa2XbkPnBFbT/d5FWjQpIWVpPYRMMMCSVSqeICYUcg==",
+    "node_modules/@algolia/client-query-suggestions": {
+      "version": "5.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/client-query-suggestions/-/client-query-suggestions-5.32.0.tgz",
+      "integrity": "sha512-if+YTJw1G3nDKL2omSBjQltCHUQzbaHADkcPQrGFnIGhVyHU3Dzq4g46uEv8mrL5sxL8FjiS9LvekeUlL2NRqw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@ampproject/remapping": "2.3.0",
-        "@angular-devkit/architect": "0.1902.1",
-        "@angular-devkit/build-webpack": "0.1902.1",
-        "@angular-devkit/core": "19.2.1",
-        "@angular/build": "19.2.1",
-        "@babel/core": "7.26.9",
-        "@babel/generator": "7.26.9",
-        "@babel/helper-annotate-as-pure": "7.25.9",
-        "@babel/helper-split-export-declaration": "7.24.7",
-        "@babel/plugin-transform-async-generator-functions": "7.26.8",
-        "@babel/plugin-transform-async-to-generator": "7.25.9",
-        "@babel/plugin-transform-runtime": "7.26.9",
-        "@babel/preset-env": "7.26.9",
-        "@babel/runtime": "7.26.9",
-        "@discoveryjs/json-ext": "0.6.3",
-        "@ngtools/webpack": "19.2.1",
-        "@vitejs/plugin-basic-ssl": "1.2.0",
-        "ansi-colors": "4.1.3",
-        "autoprefixer": "10.4.20",
-        "babel-loader": "9.2.1",
-        "browserslist": "^4.21.5",
-        "copy-webpack-plugin": "12.0.2",
-        "css-loader": "7.1.2",
-        "esbuild-wasm": "0.25.0",
-        "fast-glob": "3.3.3",
-        "http-proxy-middleware": "3.0.3",
-        "istanbul-lib-instrument": "6.0.3",
-        "jsonc-parser": "3.3.1",
-        "karma-source-map-support": "1.4.0",
-        "less": "4.2.2",
-        "less-loader": "12.2.0",
-        "license-webpack-plugin": "4.0.2",
-        "loader-utils": "3.3.1",
-        "mini-css-extract-plugin": "2.9.2",
-        "open": "10.1.0",
-        "ora": "5.4.1",
-        "picomatch": "4.0.2",
-        "piscina": "4.8.0",
-        "postcss": "8.5.2",
-        "postcss-loader": "8.1.1",
-        "resolve-url-loader": "5.0.0",
-        "rxjs": "7.8.1",
-        "sass": "1.85.0",
-        "sass-loader": "16.0.5",
-        "semver": "7.7.1",
-        "source-map-loader": "5.0.0",
-        "source-map-support": "0.5.21",
-        "terser": "5.39.0",
-        "tree-kill": "1.2.2",
-        "tslib": "2.8.1",
-        "webpack": "5.98.0",
-        "webpack-dev-middleware": "7.4.2",
-        "webpack-dev-server": "5.2.0",
-        "webpack-merge": "6.0.1",
-        "webpack-subresource-integrity": "5.1.0"
+        "@algolia/client-common": "5.32.0",
+        "@algolia/requester-browser-xhr": "5.32.0",
+        "@algolia/requester-fetch": "5.32.0",
+        "@algolia/requester-node-http": "5.32.0"
       },
       "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0",
-        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
-        "yarn": ">= 1.13.0"
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/client-search": {
+      "version": "5.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/client-search/-/client-search-5.32.0.tgz",
+      "integrity": "sha512-kmK5nVkKb4DSUgwbveMKe4X3xHdMsPsOVJeEzBvFJ+oS7CkBPmpfHAEq+CcmiPJs20YMv6yVtUT9yPWL5WgAhg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.32.0",
+        "@algolia/requester-browser-xhr": "5.32.0",
+        "@algolia/requester-fetch": "5.32.0",
+        "@algolia/requester-node-http": "5.32.0"
       },
-      "optionalDependencies": {
-        "esbuild": "0.25.0"
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/ingestion": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/ingestion/-/ingestion-1.32.0.tgz",
+      "integrity": "sha512-PZTqjJbx+fmPuT2ud1n4vYDSF1yrT//vOGI9HNYKNA0PM0xGUBWigf5gRivHsXa3oBnUlTyHV9j7Kqx5BHbVHQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.32.0",
+        "@algolia/requester-browser-xhr": "5.32.0",
+        "@algolia/requester-fetch": "5.32.0",
+        "@algolia/requester-node-http": "5.32.0"
       },
-      "peerDependencies": {
-        "@angular/compiler-cli": "^19.0.0 || ^19.2.0-next.0",
-        "@angular/localize": "^19.0.0 || ^19.2.0-next.0",
-        "@angular/platform-server": "^19.0.0 || ^19.2.0-next.0",
-        "@angular/service-worker": "^19.0.0 || ^19.2.0-next.0",
-        "@angular/ssr": "^19.2.1",
-        "@web/test-runner": "^0.20.0",
-        "browser-sync": "^3.0.2",
-        "jest": "^29.5.0",
-        "jest-environment-jsdom": "^29.5.0",
-        "karma": "^6.3.0",
-        "ng-packagr": "^19.0.0 || ^19.2.0-next.0",
-        "protractor": "^7.0.0",
-        "tailwindcss": "^2.0.0 || ^3.0.0 || ^4.0.0",
-        "typescript": ">=5.5 <5.9"
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/monitoring": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/monitoring/-/monitoring-1.32.0.tgz",
+      "integrity": "sha512-kYYoOGjvNQAmHDS1v5sBj+0uEL9RzYqH/TAdq8wmcV+/22weKt/fjh+6LfiqkS1SCZFYYrwGnirrUhUM36lBIQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.32.0",
+        "@algolia/requester-browser-xhr": "5.32.0",
+        "@algolia/requester-fetch": "5.32.0",
+        "@algolia/requester-node-http": "5.32.0"
       },
-      "peerDependenciesMeta": {
-        "@angular/localize": {
-          "optional": true
-        },
-        "@angular/platform-server": {
-          "optional": true
-        },
-        "@angular/service-worker": {
-          "optional": true
-        },
-        "@angular/ssr": {
-          "optional": true
-        },
-        "@web/test-runner": {
-          "optional": true
-        },
-        "browser-sync": {
-          "optional": true
-        },
-        "jest": {
-          "optional": true
-        },
-        "jest-environment-jsdom": {
-          "optional": true
-        },
-        "karma": {
-          "optional": true
-        },
-        "ng-packagr": {
-          "optional": true
-        },
-        "protractor": {
-          "optional": true
-        },
-        "tailwindcss": {
-          "optional": true
-        }
+      "engines": {
+        "node": ">= 14.0.0"
       }
     },
-    "node_modules/@angular-devkit/build-angular/node_modules/autoprefixer": {
-      "version": "10.4.20",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.20.tgz",
-      "integrity": "sha512-XY25y5xSv/wEoqzDyXXME4AFfkZI0P23z6Fs3YgymDnKJkCGOnkL0iTxCa85UTqaSgfcqyf3UA6+c7wUvx/16g==",
+    "node_modules/@algolia/recommend": {
+      "version": "5.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/recommend/-/recommend-5.32.0.tgz",
+      "integrity": "sha512-jyIBLdskjPAL7T1g57UMfUNx+PzvYbxKslwRUKBrBA6sNEsYCFdxJAtZSLUMmw6MC98RDt4ksmEl5zVMT5bsuw==",
       "dev": true,
-      "funding": [
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/postcss/"
-        },
-        {
-          "type": "tidelift",
-          "url": "https://tidelift.com/funding/github/npm/autoprefixer"
-        },
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/ai"
-        }
-      ],
       "license": "MIT",
       "dependencies": {
-        "browserslist": "^4.23.3",
-        "caniuse-lite": "^1.0.30001646",
-        "fraction.js": "^4.3.7",
-        "normalize-range": "^0.1.2",
-        "picocolors": "^1.0.1",
-        "postcss-value-parser": "^4.2.0"
+        "@algolia/client-common": "5.32.0",
+        "@algolia/requester-browser-xhr": "5.32.0",
+        "@algolia/requester-fetch": "5.32.0",
+        "@algolia/requester-node-http": "5.32.0"
       },
-      "bin": {
-        "autoprefixer": "bin/autoprefixer"
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/requester-browser-xhr": {
+      "version": "5.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/requester-browser-xhr/-/requester-browser-xhr-5.32.0.tgz",
+      "integrity": "sha512-eDp14z92Gt6JlFgiexImcWWH+Lk07s/FtxcoDaGrE4UVBgpwqOO6AfQM6dXh1pvHxlDFbMJihHc/vj3gBhPjqQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.32.0"
       },
       "engines": {
-        "node": "^10 || ^12 || >=14"
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/requester-fetch": {
+      "version": "5.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/requester-fetch/-/requester-fetch-5.32.0.tgz",
+      "integrity": "sha512-rnWVglh/K75hnaLbwSc2t7gCkbq1ldbPgeIKDUiEJxZ4mlguFgcltWjzpDQ/t1LQgxk9HdIFcQfM17Hid3aQ6Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.32.0"
       },
-      "peerDependencies": {
-        "postcss": "^8.1.0"
+      "engines": {
+        "node": ">= 14.0.0"
       }
     },
-    "node_modules/@angular-devkit/build-angular/node_modules/postcss": {
-      "version": "8.5.2",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.2.tgz",
-      "integrity": "sha512-MjOadfU3Ys9KYoX0AdkBlFEF1Vx37uCCeN4ZHnmwm9FfpbsGWMZeBLMmmpY+6Ocqod7mkdZ0DT31OlbsFrLlkA==",
+    "node_modules/@algolia/requester-node-http": {
+      "version": "5.32.0",
+      "resolved": "https://registry.npmjs.org/@algolia/requester-node-http/-/requester-node-http-5.32.0.tgz",
+      "integrity": "sha512-LbzQ04+VLkzXY4LuOzgyjqEv/46Gwrk55PldaglMJ4i4eDXSRXGKkwJpXFwsoU+c1HMQlHIyjJBhrfsfdyRmyQ==",
       "dev": true,
-      "funding": [
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/postcss/"
-        },
-        {
-          "type": "tidelift",
-          "url": "https://tidelift.com/funding/github/npm/postcss"
-        },
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/ai"
-        }
-      ],
       "license": "MIT",
       "dependencies": {
-        "nanoid": "^3.3.8",
-        "picocolors": "^1.1.1",
-        "source-map-js": "^1.2.1"
+        "@algolia/client-common": "5.32.0"
       },
       "engines": {
-        "node": "^10 || ^12 || >=14"
+        "node": ">= 14.0.0"
       }
     },
-    "node_modules/@angular-devkit/build-angular/node_modules/rxjs": {
-      "version": "7.8.1",
-      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz",
-      "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==",
+    "node_modules/@alloc/quick-lru": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz",
+      "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@ampproject/remapping": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
+      "integrity": "sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
-        "tslib": "^2.1.0"
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      },
+      "engines": {
+        "node": ">=6.0.0"
       }
     },
-    "node_modules/@angular-devkit/build-webpack": {
+    "node_modules/@angular-devkit/architect": {
       "version": "0.1902.1",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/build-webpack/-/build-webpack-0.1902.1.tgz",
-      "integrity": "sha512-KXvYkxvdun90GxAzaHIXkIKaYeJY9kQ89xaFXOaaJi6a9a+EkovnkHSPwPQ6uNqJo/zbwU5jKkT/rI/g+5D5Bg==",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1902.1.tgz",
+      "integrity": "sha512-iCm6F4HYO5aIgjzhjOUPKnyFHcn6yVE8gCpjWFQL8JVqrVzFG27vMZ0wK8b8rMDIDt6/hr2FOSSwChVg/cv9GQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@angular-devkit/architect": "0.1902.1",
+        "@angular-devkit/core": "19.2.1",
         "rxjs": "7.8.1"
       },
       "engines": {
         "node": "^18.19.1 || ^20.11.1 || >=22.0.0",
         "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
         "yarn": ">= 1.13.0"
-      },
-      "peerDependencies": {
-        "webpack": "^5.30.0",
-        "webpack-dev-server": "^5.0.2"
       }
     },
-    "node_modules/@angular-devkit/build-webpack/node_modules/rxjs": {
+    "node_modules/@angular-devkit/architect/node_modules/rxjs": {
       "version": "7.8.1",
       "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz",
       "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==",
@@ -417,590 +387,513 @@
         "tslib": "^2.1.0"
       }
     },
-    "node_modules/@angular/animations": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-19.2.1.tgz",
-      "integrity": "sha512-I67XYXBic9bM+yfce6Dqa950TsrEWB6uwSB2l6eIg3Byp48yJxQYbyjvjDbMXPieU2Bzo8FYVSD+lc8cF4+L6A==",
+    "node_modules/@angular-eslint/builder": {
+      "version": "20.1.1",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/builder/-/builder-20.1.1.tgz",
+      "integrity": "sha512-pfCYfocX79CZ5nokZF4gVScUGyLWRKQHZsUkQ5V/1hsaGsahvzDRjxsYz0J9rO0ligSa2pwgUCXEwSY8hhHQBw==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "tslib": "^2.3.0"
-      },
-      "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
+        "@angular-devkit/architect": ">= 0.2000.0 < 0.2100.0",
+        "@angular-devkit/core": ">= 20.0.0 < 21.0.0"
       },
       "peerDependencies": {
-        "@angular/core": "19.2.1"
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": "*"
       }
     },
-    "node_modules/@angular/build": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/build/-/build-19.2.1.tgz",
-      "integrity": "sha512-+gRcH2F+qGSN/JRT5J650FzXW2kPrhjoSwOMYW06zhSpyX+oDZenFygUxORNhb5CnXJyZf/L5UEj6ypUojx4KQ==",
+    "node_modules/@angular-eslint/builder/node_modules/@angular-devkit/architect": {
+      "version": "0.2001.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.2001.6.tgz",
+      "integrity": "sha512-CGFDfqPvKw1Ekuk7eSYMdhBv26LiwBrnZEUnrloC8fnuT8G+s46WMj/uH3tTcQ9MHYbhOSAHynNwpnwX71wghg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@ampproject/remapping": "2.3.0",
-        "@angular-devkit/architect": "0.1902.1",
-        "@babel/core": "7.26.9",
-        "@babel/helper-annotate-as-pure": "7.25.9",
-        "@babel/helper-split-export-declaration": "7.24.7",
-        "@babel/plugin-syntax-import-attributes": "7.26.0",
-        "@inquirer/confirm": "5.1.6",
-        "@vitejs/plugin-basic-ssl": "1.2.0",
-        "beasties": "0.2.0",
-        "browserslist": "^4.23.0",
-        "esbuild": "0.25.0",
-        "fast-glob": "3.3.3",
-        "https-proxy-agent": "7.0.6",
-        "istanbul-lib-instrument": "6.0.3",
-        "listr2": "8.2.5",
-        "magic-string": "0.30.17",
-        "mrmime": "2.0.1",
-        "parse5-html-rewriting-stream": "7.0.0",
-        "picomatch": "4.0.2",
-        "piscina": "4.8.0",
-        "rollup": "4.34.8",
-        "sass": "1.85.0",
-        "semver": "7.7.1",
-        "source-map-support": "0.5.21",
-        "vite": "6.2.0",
-        "watchpack": "2.4.2"
+        "@angular-devkit/core": "20.1.6",
+        "rxjs": "7.8.2"
       },
       "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0",
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
         "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
         "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/@angular-eslint/builder/node_modules/@angular-devkit/core": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-20.1.6.tgz",
+      "integrity": "sha512-Wooe+nTmHOLvveBQWDmSsdKg39re5BUMGVkwKlPHTQ/YU9aYshvPEBu1K0l4gSqe3qtqVVAx0HlPb53bEFFa8w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ajv": "8.17.1",
+        "ajv-formats": "3.0.1",
+        "jsonc-parser": "3.3.1",
+        "picomatch": "4.0.2",
+        "rxjs": "7.8.2",
+        "source-map": "0.7.4"
       },
-      "optionalDependencies": {
-        "lmdb": "3.2.6"
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
       },
       "peerDependencies": {
-        "@angular/compiler": "^19.0.0 || ^19.2.0-next.0",
-        "@angular/compiler-cli": "^19.0.0 || ^19.2.0-next.0",
-        "@angular/localize": "^19.0.0 || ^19.2.0-next.0",
-        "@angular/platform-server": "^19.0.0 || ^19.2.0-next.0",
-        "@angular/service-worker": "^19.0.0 || ^19.2.0-next.0",
-        "@angular/ssr": "^19.2.1",
-        "karma": "^6.4.0",
-        "less": "^4.2.0",
-        "ng-packagr": "^19.0.0 || ^19.2.0-next.0",
-        "postcss": "^8.4.0",
-        "tailwindcss": "^2.0.0 || ^3.0.0 || ^4.0.0",
-        "typescript": ">=5.5 <5.9"
+        "chokidar": "^4.0.0"
       },
       "peerDependenciesMeta": {
-        "@angular/localize": {
-          "optional": true
-        },
-        "@angular/platform-server": {
-          "optional": true
-        },
-        "@angular/service-worker": {
-          "optional": true
-        },
-        "@angular/ssr": {
-          "optional": true
-        },
-        "karma": {
-          "optional": true
-        },
-        "less": {
-          "optional": true
-        },
-        "ng-packagr": {
-          "optional": true
-        },
-        "postcss": {
-          "optional": true
-        },
-        "tailwindcss": {
+        "chokidar": {
           "optional": true
         }
       }
     },
-    "node_modules/@angular/build/node_modules/vite": {
-      "version": "6.2.0",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-6.2.0.tgz",
-      "integrity": "sha512-7dPxoo+WsT/64rDcwoOjk76XHj+TqNTIvHKcuMQ1k4/SeHDaQt5GFAeLYzrimZrMpn/O6DtdI03WUjdxuPM0oQ==",
+    "node_modules/@angular-eslint/bundled-angular-compiler": {
+      "version": "20.1.1",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/bundled-angular-compiler/-/bundled-angular-compiler-20.1.1.tgz",
+      "integrity": "sha512-hEWh/upyTj2bhyRmbNnGtlOXhBSEHwLg8/9YYhwmiNApQwKcvcg7lkstZMEVrKievNHZT6Wh4dWZvjRjMqLNSg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@angular-eslint/eslint-plugin": {
+      "version": "20.1.1",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/eslint-plugin/-/eslint-plugin-20.1.1.tgz",
+      "integrity": "sha512-h+D6T35UGIuG0keYPH7dc6OTdfTVJ8GoIhCIpoAmVGhdIdfXIISvDvvX/QPiZtTcefik3vEZEGRiI/Nzc5xImw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "esbuild": "^0.25.0",
-        "postcss": "^8.5.3",
-        "rollup": "^4.30.1"
-      },
-      "bin": {
-        "vite": "bin/vite.js"
-      },
-      "engines": {
-        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
-      },
-      "funding": {
-        "url": "https://github.com/vitejs/vite?sponsor=1"
-      },
-      "optionalDependencies": {
-        "fsevents": "~2.3.3"
+        "@angular-eslint/bundled-angular-compiler": "20.1.1",
+        "@angular-eslint/utils": "20.1.1",
+        "ts-api-utils": "^2.1.0"
       },
       "peerDependencies": {
-        "@types/node": "^18.0.0 || ^20.0.0 || >=22.0.0",
-        "jiti": ">=1.21.0",
-        "less": "*",
-        "lightningcss": "^1.21.0",
-        "sass": "*",
-        "sass-embedded": "*",
-        "stylus": "*",
-        "sugarss": "*",
-        "terser": "^5.16.0",
-        "tsx": "^4.8.1",
-        "yaml": "^2.4.2"
-      },
-      "peerDependenciesMeta": {
-        "@types/node": {
-          "optional": true
-        },
-        "jiti": {
-          "optional": true
-        },
-        "less": {
-          "optional": true
-        },
-        "lightningcss": {
-          "optional": true
-        },
-        "sass": {
-          "optional": true
-        },
-        "sass-embedded": {
-          "optional": true
-        },
-        "stylus": {
-          "optional": true
-        },
-        "sugarss": {
-          "optional": true
-        },
-        "terser": {
-          "optional": true
-        },
-        "tsx": {
-          "optional": true
-        },
-        "yaml": {
-          "optional": true
-        }
+        "@typescript-eslint/utils": "^7.11.0 || ^8.0.0",
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": "*"
       }
     },
-    "node_modules/@angular/cli": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-19.2.1.tgz",
-      "integrity": "sha512-0ioZmuaapsbndXhpoUAew1uA4RFhNEa16kKgYPw5XlouaS2SLLrzC4nLW9DPJv6XrkOsOebf+OpyyHazzdFoSw==",
+    "node_modules/@angular-eslint/eslint-plugin-template": {
+      "version": "20.1.1",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/eslint-plugin-template/-/eslint-plugin-template-20.1.1.tgz",
+      "integrity": "sha512-dRqfxYvgOC4DZqvRTmxoIUMeIqTzcIkRcMVEuP8qvR10KHAWDkV7xT4f7BAee9deI/lzoAk3tk5wkQg6POQo7Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@angular-devkit/architect": "0.1902.1",
-        "@angular-devkit/core": "19.2.1",
-        "@angular-devkit/schematics": "19.2.1",
-        "@inquirer/prompts": "7.3.2",
-        "@listr2/prompt-adapter-inquirer": "2.0.18",
-        "@schematics/angular": "19.2.1",
-        "@yarnpkg/lockfile": "1.1.0",
-        "ini": "5.0.0",
-        "jsonc-parser": "3.3.1",
-        "listr2": "8.2.5",
-        "npm-package-arg": "12.0.2",
-        "npm-pick-manifest": "10.0.0",
-        "pacote": "20.0.0",
-        "resolve": "1.22.10",
-        "semver": "7.7.1",
-        "symbol-observable": "4.0.0",
-        "yargs": "17.7.2"
-      },
-      "bin": {
-        "ng": "bin/ng.js"
+        "@angular-eslint/bundled-angular-compiler": "20.1.1",
+        "@angular-eslint/utils": "20.1.1",
+        "aria-query": "5.3.2",
+        "axobject-query": "4.1.0"
       },
-      "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0",
-        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
-        "yarn": ">= 1.13.0"
+      "peerDependencies": {
+        "@angular-eslint/template-parser": "20.1.1",
+        "@typescript-eslint/types": "^7.11.0 || ^8.0.0",
+        "@typescript-eslint/utils": "^7.11.0 || ^8.0.0",
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": "*"
       }
     },
-    "node_modules/@angular/common": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/common/-/common-19.2.1.tgz",
-      "integrity": "sha512-k+ikxn6SlWXxXEtwRmsYZeknf3a6n3Oicde6zTLBrD/Rie/u0+okuoQcuYjntQWGgH//QBQxH4UQpvRw51AR8w==",
+    "node_modules/@angular-eslint/schematics": {
+      "version": "20.1.1",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/schematics/-/schematics-20.1.1.tgz",
+      "integrity": "sha512-4sXU0Gr/RhdW3xSBFRzjhTO9mk6ugXUhUIPc1FRta1pmNnbmkvx22ewnKZE8IeRl8PMyk6xJuxZHq19CW1oWOA==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "tslib": "^2.3.0"
-      },
-      "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
-      },
-      "peerDependencies": {
-        "@angular/core": "19.2.1",
-        "rxjs": "^6.5.3 || ^7.4.0"
+        "@angular-devkit/core": ">= 20.0.0 < 21.0.0",
+        "@angular-devkit/schematics": ">= 20.0.0 < 21.0.0",
+        "@angular-eslint/eslint-plugin": "20.1.1",
+        "@angular-eslint/eslint-plugin-template": "20.1.1",
+        "ignore": "7.0.5",
+        "semver": "7.7.2",
+        "strip-json-comments": "3.1.1"
       }
     },
-    "node_modules/@angular/compiler": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-19.2.1.tgz",
-      "integrity": "sha512-yCN/lgXMvMsPtEmTChd621zV17RLn+flhcJ6mNZjyGA7zx16m5zity4/00G6phbGfG8WXOtH5vQ/k7nnO7wS4A==",
+    "node_modules/@angular-eslint/schematics/node_modules/@angular-devkit/core": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-20.1.6.tgz",
+      "integrity": "sha512-Wooe+nTmHOLvveBQWDmSsdKg39re5BUMGVkwKlPHTQ/YU9aYshvPEBu1K0l4gSqe3qtqVVAx0HlPb53bEFFa8w==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "tslib": "^2.3.0"
+        "ajv": "8.17.1",
+        "ajv-formats": "3.0.1",
+        "jsonc-parser": "3.3.1",
+        "picomatch": "4.0.2",
+        "rxjs": "7.8.2",
+        "source-map": "0.7.4"
       },
       "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
       },
       "peerDependencies": {
-        "@angular/core": "19.2.1"
+        "chokidar": "^4.0.0"
       },
       "peerDependenciesMeta": {
-        "@angular/core": {
+        "chokidar": {
           "optional": true
         }
       }
     },
-    "node_modules/@angular/compiler-cli": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-19.2.1.tgz",
-      "integrity": "sha512-5uuUx0ibX7cQP7eSBaJzfZlU0Hbe0kLwc85uCnH47hfzCsd3u2VU623IZIN7ctaInoOFBjl9fUUqKnFuYibC/w==",
+    "node_modules/@angular-eslint/schematics/node_modules/@angular-devkit/schematics": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-20.1.6.tgz",
+      "integrity": "sha512-Maj/yCkn3Qjum2kCYUOYMw8VYh/8725XN8/4cae9VllMwkN5D8jYDvX40qmfgQve2x0x6r3L8rmaIHn8227cHg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/core": "7.26.9",
-        "@jridgewell/sourcemap-codec": "^1.4.14",
-        "chokidar": "^4.0.0",
-        "convert-source-map": "^1.5.1",
-        "reflect-metadata": "^0.2.0",
-        "semver": "^7.0.0",
-        "tslib": "^2.3.0",
-        "yargs": "^17.2.1"
-      },
-      "bin": {
-        "ng-xi18n": "bundles/src/bin/ng_xi18n.js",
-        "ngc": "bundles/src/bin/ngc.js",
-        "ngcc": "bundles/ngcc/index.js"
+        "@angular-devkit/core": "20.1.6",
+        "jsonc-parser": "3.3.1",
+        "magic-string": "0.30.17",
+        "ora": "8.2.0",
+        "rxjs": "7.8.2"
       },
       "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
-      },
-      "peerDependencies": {
-        "@angular/compiler": "19.2.1",
-        "typescript": ">=5.5 <5.9"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
       }
     },
-    "node_modules/@angular/core": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/core/-/core-19.2.1.tgz",
-      "integrity": "sha512-gwdytbZSM9m5v9PhRsvh6Q13vI1Ydcx52QGs93bpWx5ACOGYGp/Y7zc2mcZb1aUM63zGBTpS9Qw9bEsPHeLZPA==",
+    "node_modules/@angular-eslint/schematics/node_modules/chalk": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.6.0.tgz",
+      "integrity": "sha512-46QrSQFyVSEyYAgQ22hQ+zDa60YHA4fBstHmtSApj1Y5vKtG27fWowW03jCk5KcbXEWPZUIR894aARCA/G1kfQ==",
+      "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "tslib": "^2.3.0"
-      },
       "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
       },
-      "peerDependencies": {
-        "rxjs": "^6.5.3 || ^7.4.0",
-        "zone.js": "~0.15.0"
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
-    "node_modules/@angular/forms": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-19.2.1.tgz",
-      "integrity": "sha512-a+ifgpX5ie2KgTNI9m8tJWS+ym51u3LZ8Kd67dXX7+CbYe9RzdIgVtuXcTklrP1fmmhfKnQVNmsUqpAYAjrByg==",
+    "node_modules/@angular-eslint/schematics/node_modules/is-interactive": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-2.0.0.tgz",
+      "integrity": "sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==",
+      "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "tslib": "^2.3.0"
-      },
       "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
+        "node": ">=12"
       },
-      "peerDependencies": {
-        "@angular/common": "19.2.1",
-        "@angular/core": "19.2.1",
-        "@angular/platform-browser": "19.2.1",
-        "rxjs": "^6.5.3 || ^7.4.0"
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/@angular/platform-browser": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-19.2.1.tgz",
-      "integrity": "sha512-omBNCMk0Gim+HntrofVQR8dOY2zLCFOW02+FX4y57QvuDBh/FpFfnQ14xxx1Y4qEgGculEcBe914uJlxr4ccIg==",
+    "node_modules/@angular-eslint/schematics/node_modules/is-unicode-supported": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-2.1.0.tgz",
+      "integrity": "sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==",
+      "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "tslib": "^2.3.0"
-      },
       "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
-      },
-      "peerDependencies": {
-        "@angular/animations": "19.2.1",
-        "@angular/common": "19.2.1",
-        "@angular/core": "19.2.1"
+        "node": ">=18"
       },
-      "peerDependenciesMeta": {
-        "@angular/animations": {
-          "optional": true
-        }
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/@angular/platform-browser-dynamic": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-19.2.1.tgz",
-      "integrity": "sha512-jYEXI2CymdK8R27YKy/q0O36dZwSdbIyJAjX9vPTgAsORGwX8hdhm5NJwkKlOWT+ccf2ySUatJD7RCElhsEBNA==",
+    "node_modules/@angular-eslint/schematics/node_modules/log-symbols": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-6.0.0.tgz",
+      "integrity": "sha512-i24m8rpwhmPIS4zscNzK6MSEhk0DUWa/8iYQWxhffV8jkI4Phvs3F+quL5xvS0gdQR0FyTCMMH33Y78dDTzzIw==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "tslib": "^2.3.0"
+        "chalk": "^5.3.0",
+        "is-unicode-supported": "^1.3.0"
       },
       "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
+        "node": ">=18"
       },
-      "peerDependencies": {
-        "@angular/common": "19.2.1",
-        "@angular/compiler": "19.2.1",
-        "@angular/core": "19.2.1",
-        "@angular/platform-browser": "19.2.1"
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/@angular/platform-server": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/platform-server/-/platform-server-19.2.1.tgz",
-      "integrity": "sha512-RESwl6oO/z/pl/0eErW/nbuXFzIFlTjHr1MjC+PGBSorgqehAy11BQQqT3xZJLZFrVys+idvnOkclWn66V++AA==",
+    "node_modules/@angular-eslint/schematics/node_modules/log-symbols/node_modules/is-unicode-supported": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-1.3.0.tgz",
+      "integrity": "sha512-43r2mRvz+8JRIKnWJ+3j8JtjRKZ6GmjzfaE/qiBJnikNnYv/6bagRJ1kUhNk8R5EX/GkobD+r+sfxCPJsiKBLQ==",
+      "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "tslib": "^2.3.0",
-        "xhr2": "^0.2.0"
-      },
       "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
+        "node": ">=12"
       },
-      "peerDependencies": {
-        "@angular/common": "19.2.1",
-        "@angular/compiler": "19.2.1",
-        "@angular/core": "19.2.1",
-        "@angular/platform-browser": "19.2.1"
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/@angular/router": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/router/-/router-19.2.1.tgz",
-      "integrity": "sha512-HZTewSLnHpNbnOnTp9X7r17/eb8h3ex/b8da6z2OPpC3diV7EZsrrjrLpdkzm3wpuapaVATzRgC4I4gN8XwTxA==",
+    "node_modules/@angular-eslint/schematics/node_modules/ora": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/ora/-/ora-8.2.0.tgz",
+      "integrity": "sha512-weP+BZ8MVNnlCm8c0Qdc1WSWq4Qn7I+9CJGm7Qali6g44e/PUzbjNqJX5NJ9ljlNMosfJvg1fKEGILklK9cwnw==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "tslib": "^2.3.0"
+        "chalk": "^5.3.0",
+        "cli-cursor": "^5.0.0",
+        "cli-spinners": "^2.9.2",
+        "is-interactive": "^2.0.0",
+        "is-unicode-supported": "^2.0.0",
+        "log-symbols": "^6.0.0",
+        "stdin-discarder": "^0.2.2",
+        "string-width": "^7.2.0",
+        "strip-ansi": "^7.1.0"
       },
       "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
+        "node": ">=18"
       },
-      "peerDependencies": {
-        "@angular/common": "19.2.1",
-        "@angular/core": "19.2.1",
-        "@angular/platform-browser": "19.2.1",
-        "rxjs": "^6.5.3 || ^7.4.0"
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/@angular/ssr": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@angular/ssr/-/ssr-19.2.1.tgz",
-      "integrity": "sha512-6vsaK9BSt6a3r7O4Gq5i8Le/FLiCuzppAv68x79Ke74uAB7CaTbHDNCwot7vt97FSBTjfrcDnpcHcld6dGH8LA==",
+    "node_modules/@angular-eslint/template-parser": {
+      "version": "20.1.1",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/template-parser/-/template-parser-20.1.1.tgz",
+      "integrity": "sha512-giIMYORf8P8MbBxh6EUfiR/7Y+omxJtK2C7a8lYTtLSOIGO0D8c8hXx9hTlPcdupVX+xZXDuZ85c9JDen+JSSA==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "tslib": "^2.3.0"
+        "@angular-eslint/bundled-angular-compiler": "20.1.1",
+        "eslint-scope": "^8.0.2"
       },
       "peerDependencies": {
-        "@angular/common": "^19.0.0 || ^19.2.0-next.0",
-        "@angular/core": "^19.0.0 || ^19.2.0-next.0",
-        "@angular/platform-server": "^19.0.0 || ^19.2.0-next.0",
-        "@angular/router": "^19.0.0 || ^19.2.0-next.0"
-      },
-      "peerDependenciesMeta": {
-        "@angular/platform-server": {
-          "optional": true
-        }
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": "*"
       }
     },
-    "node_modules/@babel/code-frame": {
-      "version": "7.26.2",
-      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.26.2.tgz",
-      "integrity": "sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ==",
+    "node_modules/@angular-eslint/template-parser/node_modules/eslint-scope": {
+      "version": "8.4.0",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-8.4.0.tgz",
+      "integrity": "sha512-sNXOfKCn74rt8RICKMvJS7XKV/Xk9kA7DyJr8mJik3S7Cwgy3qlkkmyS2uQB3jiJg6VNdZd/pDBJu0nvG2NlTg==",
       "dev": true,
-      "license": "MIT",
+      "license": "BSD-2-Clause",
       "dependencies": {
-        "@babel/helper-validator-identifier": "^7.25.9",
-        "js-tokens": "^4.0.0",
-        "picocolors": "^1.0.0"
+        "esrecurse": "^4.3.0",
+        "estraverse": "^5.2.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/@babel/compat-data": {
-      "version": "7.26.8",
-      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.26.8.tgz",
-      "integrity": "sha512-oH5UPLMWR3L2wEFLnFJ1TZXqHufiTKAiLfqw5zkhS4dKXLJ10yVztfil/twG8EDTA4F/tvVNw9nOl4ZMslB8rQ==",
+    "node_modules/@angular-eslint/template-parser/node_modules/estraverse": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
+      "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
       "dev": true,
-      "license": "MIT",
+      "license": "BSD-2-Clause",
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=4.0"
       }
     },
-    "node_modules/@babel/core": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.26.9.tgz",
-      "integrity": "sha512-lWBYIrF7qK5+GjY5Uy+/hEgp8OJWOD/rpy74GplYRhEauvbHDeFB8t5hPOZxCZ0Oxf4Cc36tK51/l3ymJysrKw==",
+    "node_modules/@angular-eslint/utils": {
+      "version": "20.1.1",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/utils/-/utils-20.1.1.tgz",
+      "integrity": "sha512-hqbzGqa/0Ua90r4TMn4oZVnLuwIF6dqEfH7SlstB224h/7+nKoi67aHkmUq7VItWXpDDe+f1opeR01GKS9fNog==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@ampproject/remapping": "^2.2.0",
-        "@babel/code-frame": "^7.26.2",
-        "@babel/generator": "^7.26.9",
-        "@babel/helper-compilation-targets": "^7.26.5",
-        "@babel/helper-module-transforms": "^7.26.0",
-        "@babel/helpers": "^7.26.9",
-        "@babel/parser": "^7.26.9",
-        "@babel/template": "^7.26.9",
-        "@babel/traverse": "^7.26.9",
-        "@babel/types": "^7.26.9",
-        "convert-source-map": "^2.0.0",
-        "debug": "^4.1.0",
-        "gensync": "^1.0.0-beta.2",
-        "json5": "^2.2.3",
-        "semver": "^6.3.1"
-      },
-      "engines": {
-        "node": ">=6.9.0"
+        "@angular-eslint/bundled-angular-compiler": "20.1.1"
       },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/babel"
+      "peerDependencies": {
+        "@typescript-eslint/utils": "^7.11.0 || ^8.0.0",
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": "*"
       }
     },
-    "node_modules/@babel/core/node_modules/convert-source-map": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
-      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/@babel/core/node_modules/semver": {
-      "version": "6.3.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
-      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-      "dev": true,
-      "license": "ISC",
-      "bin": {
-        "semver": "bin/semver.js"
-      }
-    },
-    "node_modules/@babel/generator": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.26.9.tgz",
-      "integrity": "sha512-kEWdzjOAUMW4hAyrzJ0ZaTOu9OmpyDIQicIh0zg0EEcEkYXZb2TjtBhnHi2ViX7PKwZqF4xwqfAm299/QMP3lg==",
-      "dev": true,
+    "node_modules/@angular/animations": {
+      "version": "20.1.7",
+      "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-20.1.7.tgz",
+      "integrity": "sha512-ykzx6cKqGkKbtE2CbHBukIgM2Wk8+BmYTEqwRZRVqskxbIGvEuLmLJrvmwpqqvo4MypgvbLEtJyviSCYQkZYvA==",
       "license": "MIT",
       "dependencies": {
-        "@babel/parser": "^7.26.9",
-        "@babel/types": "^7.26.9",
-        "@jridgewell/gen-mapping": "^0.3.5",
-        "@jridgewell/trace-mapping": "^0.3.25",
-        "jsesc": "^3.0.2"
+        "tslib": "^2.3.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "@angular/common": "20.1.7",
+        "@angular/core": "20.1.7"
       }
     },
-    "node_modules/@babel/helper-annotate-as-pure": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.25.9.tgz",
-      "integrity": "sha512-gv7320KBUFJz1RnylIg5WWYPRXKZ884AGkYpgpWW02TH66Dl+HaC1t1CKd0z3R4b6hdYEcmrNZHUmfCP+1u3/g==",
+    "node_modules/@angular/build": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular/build/-/build-20.1.6.tgz",
+      "integrity": "sha512-xAC9uGeRmvCKNLr7D0XUK+KWixlRl9nnfZbB9MIDe00ulmHy5duVWILUwBEOeq1/wRrrJc133NAPTTEBWImwnA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/types": "^7.25.9"
+        "@ampproject/remapping": "2.3.0",
+        "@angular-devkit/architect": "0.2001.6",
+        "@babel/core": "7.27.7",
+        "@babel/helper-annotate-as-pure": "7.27.3",
+        "@babel/helper-split-export-declaration": "7.24.7",
+        "@inquirer/confirm": "5.1.13",
+        "@vitejs/plugin-basic-ssl": "2.1.0",
+        "beasties": "0.3.4",
+        "browserslist": "^4.23.0",
+        "esbuild": "0.25.5",
+        "https-proxy-agent": "7.0.6",
+        "istanbul-lib-instrument": "6.0.3",
+        "jsonc-parser": "3.3.1",
+        "listr2": "8.3.3",
+        "magic-string": "0.30.17",
+        "mrmime": "2.0.1",
+        "parse5-html-rewriting-stream": "7.1.0",
+        "picomatch": "4.0.2",
+        "piscina": "5.1.2",
+        "rollup": "4.44.1",
+        "sass": "1.89.2",
+        "semver": "7.7.2",
+        "source-map-support": "0.5.21",
+        "tinyglobby": "0.2.14",
+        "vite": "7.0.6",
+        "watchpack": "2.4.4"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      },
+      "optionalDependencies": {
+        "lmdb": "3.4.1"
+      },
+      "peerDependencies": {
+        "@angular/compiler": "^20.0.0",
+        "@angular/compiler-cli": "^20.0.0",
+        "@angular/core": "^20.0.0",
+        "@angular/localize": "^20.0.0",
+        "@angular/platform-browser": "^20.0.0",
+        "@angular/platform-server": "^20.0.0",
+        "@angular/service-worker": "^20.0.0",
+        "@angular/ssr": "^20.1.6",
+        "karma": "^6.4.0",
+        "less": "^4.2.0",
+        "ng-packagr": "^20.0.0",
+        "postcss": "^8.4.0",
+        "tailwindcss": "^2.0.0 || ^3.0.0 || ^4.0.0",
+        "tslib": "^2.3.0",
+        "typescript": ">=5.8 <5.9",
+        "vitest": "^3.1.1"
+      },
+      "peerDependenciesMeta": {
+        "@angular/core": {
+          "optional": true
+        },
+        "@angular/localize": {
+          "optional": true
+        },
+        "@angular/platform-browser": {
+          "optional": true
+        },
+        "@angular/platform-server": {
+          "optional": true
+        },
+        "@angular/service-worker": {
+          "optional": true
+        },
+        "@angular/ssr": {
+          "optional": true
+        },
+        "karma": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "ng-packagr": {
+          "optional": true
+        },
+        "postcss": {
+          "optional": true
+        },
+        "tailwindcss": {
+          "optional": true
+        },
+        "vitest": {
+          "optional": true
+        }
       }
     },
-    "node_modules/@babel/helper-compilation-targets": {
-      "version": "7.26.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.26.5.tgz",
-      "integrity": "sha512-IXuyn5EkouFJscIDuFF5EsiSolseme1s0CZB+QxVugqJLYmKdxI1VfIBOst0SUu4rnk2Z7kqTwmoO1lp3HIfnA==",
+    "node_modules/@angular/build/node_modules/@angular-devkit/architect": {
+      "version": "0.2001.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.2001.6.tgz",
+      "integrity": "sha512-CGFDfqPvKw1Ekuk7eSYMdhBv26LiwBrnZEUnrloC8fnuT8G+s46WMj/uH3tTcQ9MHYbhOSAHynNwpnwX71wghg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/compat-data": "^7.26.5",
-        "@babel/helper-validator-option": "^7.25.9",
-        "browserslist": "^4.24.0",
-        "lru-cache": "^5.1.1",
-        "semver": "^6.3.1"
+        "@angular-devkit/core": "20.1.6",
+        "rxjs": "7.8.2"
       },
       "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@babel/helper-compilation-targets/node_modules/semver": {
-      "version": "6.3.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
-      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-      "dev": true,
-      "license": "ISC",
-      "bin": {
-        "semver": "bin/semver.js"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
       }
     },
-    "node_modules/@babel/helper-create-class-features-plugin": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.26.9.tgz",
-      "integrity": "sha512-ubbUqCofvxPRurw5L8WTsCLSkQiVpov4Qx0WMA+jUN+nXBK8ADPlJO1grkFw5CWKC5+sZSOfuGMdX1aI1iT9Sg==",
+    "node_modules/@angular/build/node_modules/@angular-devkit/core": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-20.1.6.tgz",
+      "integrity": "sha512-Wooe+nTmHOLvveBQWDmSsdKg39re5BUMGVkwKlPHTQ/YU9aYshvPEBu1K0l4gSqe3qtqVVAx0HlPb53bEFFa8w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.25.9",
-        "@babel/helper-member-expression-to-functions": "^7.25.9",
-        "@babel/helper-optimise-call-expression": "^7.25.9",
-        "@babel/helper-replace-supers": "^7.26.5",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.25.9",
-        "@babel/traverse": "^7.26.9",
-        "semver": "^6.3.1"
+        "ajv": "8.17.1",
+        "ajv-formats": "3.0.1",
+        "jsonc-parser": "3.3.1",
+        "picomatch": "4.0.2",
+        "rxjs": "7.8.2",
+        "source-map": "0.7.4"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
       },
       "peerDependencies": {
-        "@babel/core": "^7.0.0"
-      }
-    },
-    "node_modules/@babel/helper-create-class-features-plugin/node_modules/semver": {
-      "version": "6.3.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
-      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-      "dev": true,
-      "license": "ISC",
-      "bin": {
-        "semver": "bin/semver.js"
+        "chokidar": "^4.0.0"
+      },
+      "peerDependenciesMeta": {
+        "chokidar": {
+          "optional": true
+        }
       }
     },
-    "node_modules/@babel/helper-create-regexp-features-plugin": {
-      "version": "7.26.3",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.26.3.tgz",
-      "integrity": "sha512-G7ZRb40uUgdKOQqPLjfD12ZmGA54PzqDFUv2BKImnC9QIfGhIHKvVML0oN8IUiDq4iRqpq74ABpvOaerfWdong==",
+    "node_modules/@angular/build/node_modules/@babel/core": {
+      "version": "7.27.7",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.27.7.tgz",
+      "integrity": "sha512-BU2f9tlKQ5CAthiMIgpzAh4eDTLWo1mqi9jqE2OxMG0E/OM199VJt2q8BztTxpnSW0i1ymdwLXRJnYzvDM5r2w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.25.9",
-        "regexpu-core": "^6.2.0",
+        "@ampproject/remapping": "^2.2.0",
+        "@babel/code-frame": "^7.27.1",
+        "@babel/generator": "^7.27.5",
+        "@babel/helper-compilation-targets": "^7.27.2",
+        "@babel/helper-module-transforms": "^7.27.3",
+        "@babel/helpers": "^7.27.6",
+        "@babel/parser": "^7.27.7",
+        "@babel/template": "^7.27.2",
+        "@babel/traverse": "^7.27.7",
+        "@babel/types": "^7.27.7",
+        "convert-source-map": "^2.0.0",
+        "debug": "^4.1.0",
+        "gensync": "^1.0.0-beta.2",
+        "json5": "^2.2.3",
         "semver": "^6.3.1"
       },
       "engines": {
         "node": ">=6.9.0"
       },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/babel"
       }
     },
-    "node_modules/@babel/helper-create-regexp-features-plugin/node_modules/semver": {
+    "node_modules/@angular/build/node_modules/@babel/core/node_modules/semver": {
       "version": "6.3.1",
       "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
       "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
@@ -1010,1476 +903,1450 @@
         "semver": "bin/semver.js"
       }
     },
-    "node_modules/@babel/helper-define-polyfill-provider": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.6.3.tgz",
-      "integrity": "sha512-HK7Bi+Hj6H+VTHA3ZvBis7V/6hu9QuTrnMXNybfUf2iiuU/N97I8VjB+KbhFF8Rld/Lx5MzoCwPCpPjfK+n8Cg==",
+    "node_modules/@angular/build/node_modules/@types/node": {
+      "version": "24.3.0",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-24.3.0.tgz",
+      "integrity": "sha512-aPTXCrfwnDLj4VvXrm+UUCQjNEvJgNA8s5F1cvwQU+3KNltTOkBm1j30uNLyqqPNe7gE3KFzImYoZEfLhp4Yow==",
       "dev": true,
       "license": "MIT",
+      "optional": true,
+      "peer": true,
       "dependencies": {
-        "@babel/helper-compilation-targets": "^7.22.6",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "debug": "^4.1.1",
-        "lodash.debounce": "^4.0.8",
-        "resolve": "^1.14.2"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
+        "undici-types": "~7.10.0"
       }
     },
-    "node_modules/@babel/helper-member-expression-to-functions": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.25.9.tgz",
-      "integrity": "sha512-wbfdZ9w5vk0C0oyHqAJbc62+vet5prjj01jjJ8sKn3j9h3MQQlflEdXYvuqRWjHnM12coDEqiC1IRCi0U/EKwQ==",
+    "node_modules/@angular/build/node_modules/@vitejs/plugin-basic-ssl": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-basic-ssl/-/plugin-basic-ssl-2.1.0.tgz",
+      "integrity": "sha512-dOxxrhgyDIEUADhb/8OlV9JIqYLgos03YorAueTIeOUskLJSEsfwCByjbu98ctXitUN3znXKp0bYD/WHSudCeA==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/traverse": "^7.25.9",
-        "@babel/types": "^7.25.9"
-      },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
+      },
+      "peerDependencies": {
+        "vite": "^6.0.0 || ^7.0.0"
       }
     },
-    "node_modules/@babel/helper-module-imports": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.25.9.tgz",
-      "integrity": "sha512-tnUA4RsrmflIM6W6RFTLFSXITtl0wKjgpnLgXyowocVPrbYrLUXSBXDgTs8BlbmIzIdlBySRQjINYs2BAkiLtw==",
+    "node_modules/@angular/build/node_modules/convert-source-map": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
+      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@angular/build/node_modules/undici-types": {
+      "version": "7.10.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.10.0.tgz",
+      "integrity": "sha512-t5Fy/nfn+14LuOc2KNYg75vZqClpAiqscVvMygNnlsHBFpSXdJaYtXMcdNLpl/Qvc3P2cB3s6lOV51nqsFq4ag==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/traverse": "^7.25.9",
-        "@babel/types": "^7.25.9"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
+      "optional": true,
+      "peer": true
     },
-    "node_modules/@babel/helper-module-transforms": {
-      "version": "7.26.0",
-      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.26.0.tgz",
-      "integrity": "sha512-xO+xu6B5K2czEnQye6BHA7DolFFmS3LB7stHZFaOLb1pAwO1HWLS8fXA+eh0A2yIvltPVmx3eNNDBJA2SLHXFw==",
+    "node_modules/@angular/build/node_modules/vite": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-7.0.6.tgz",
+      "integrity": "sha512-MHFiOENNBd+Bd9uvc8GEsIzdkn1JxMmEeYX35tI3fv0sJBUTfW5tQsoaOwuY4KhBI09A3dUJ/DXf2yxPVPUceg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-module-imports": "^7.25.9",
-        "@babel/helper-validator-identifier": "^7.25.9",
-        "@babel/traverse": "^7.25.9"
+        "esbuild": "^0.25.0",
+        "fdir": "^6.4.6",
+        "picomatch": "^4.0.3",
+        "postcss": "^8.5.6",
+        "rollup": "^4.40.0",
+        "tinyglobby": "^0.2.14"
+      },
+      "bin": {
+        "vite": "bin/vite.js"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "funding": {
+        "url": "https://github.com/vitejs/vite?sponsor=1"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
       },
       "peerDependencies": {
-        "@babel/core": "^7.0.0"
-      }
-    },
-    "node_modules/@babel/helper-optimise-call-expression": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.25.9.tgz",
-      "integrity": "sha512-FIpuNaz5ow8VyrYcnXQTDRGvV6tTjkNtCK/RYNDXGSLlUD6cBuQTSw43CShGxjvfBTfcUA/r6UhUCbtYqkhcuQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/types": "^7.25.9"
+        "@types/node": "^20.19.0 || >=22.12.0",
+        "jiti": ">=1.21.0",
+        "less": "^4.0.0",
+        "lightningcss": "^1.21.0",
+        "sass": "^1.70.0",
+        "sass-embedded": "^1.70.0",
+        "stylus": ">=0.54.8",
+        "sugarss": "^5.0.0",
+        "terser": "^5.16.0",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
       },
-      "engines": {
-        "node": ">=6.9.0"
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        },
+        "jiti": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "lightningcss": {
+          "optional": true
+        },
+        "sass": {
+          "optional": true
+        },
+        "sass-embedded": {
+          "optional": true
+        },
+        "stylus": {
+          "optional": true
+        },
+        "sugarss": {
+          "optional": true
+        },
+        "terser": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
+        }
       }
     },
-    "node_modules/@babel/helper-plugin-utils": {
-      "version": "7.26.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.26.5.tgz",
-      "integrity": "sha512-RS+jZcRdZdRFzMyr+wcsaqOmld1/EqTghfaBGQQd/WnRdzdlvSZ//kF7U8VQTxf1ynZ4cjUcYgjVGx13ewNPMg==",
+    "node_modules/@angular/build/node_modules/vite/node_modules/picomatch": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
+      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
-    "node_modules/@babel/helper-remap-async-to-generator": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.25.9.tgz",
-      "integrity": "sha512-IZtukuUeBbhgOcaW2s06OXTzVNJR0ybm4W5xC1opWFFJMZbwRj5LCk+ByYH7WdZPZTt8KnFwA8pvjN2yqcPlgw==",
+    "node_modules/@angular/cli": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-20.1.6.tgz",
+      "integrity": "sha512-kqncVmYtlDYLwt4l5lFBz4uEnoheMH+teSqAAD/zaDxn41KvpoRLHiEVurQhsNP/GDHxGu+8wg0s4gX3kaFOzg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.25.9",
-        "@babel/helper-wrap-function": "^7.25.9",
-        "@babel/traverse": "^7.25.9"
+        "@angular-devkit/architect": "0.2001.6",
+        "@angular-devkit/core": "20.1.6",
+        "@angular-devkit/schematics": "20.1.6",
+        "@inquirer/prompts": "7.6.0",
+        "@listr2/prompt-adapter-inquirer": "2.0.22",
+        "@modelcontextprotocol/sdk": "1.13.3",
+        "@schematics/angular": "20.1.6",
+        "@yarnpkg/lockfile": "1.1.0",
+        "algoliasearch": "5.32.0",
+        "ini": "5.0.0",
+        "jsonc-parser": "3.3.1",
+        "listr2": "8.3.3",
+        "npm-package-arg": "12.0.2",
+        "npm-pick-manifest": "10.0.0",
+        "pacote": "21.0.0",
+        "resolve": "1.22.10",
+        "semver": "7.7.2",
+        "yargs": "18.0.0",
+        "zod": "3.25.75"
       },
-      "engines": {
-        "node": ">=6.9.0"
+      "bin": {
+        "ng": "bin/ng.js"
       },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
       }
     },
-    "node_modules/@babel/helper-replace-supers": {
-      "version": "7.26.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.26.5.tgz",
-      "integrity": "sha512-bJ6iIVdYX1YooY2X7w1q6VITt+LnUILtNk7zT78ykuwStx8BauCzxvFqFaHjOpW1bVnSUM1PN1f0p5P21wHxvg==",
+    "node_modules/@angular/cli/node_modules/@angular-devkit/architect": {
+      "version": "0.2001.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.2001.6.tgz",
+      "integrity": "sha512-CGFDfqPvKw1Ekuk7eSYMdhBv26LiwBrnZEUnrloC8fnuT8G+s46WMj/uH3tTcQ9MHYbhOSAHynNwpnwX71wghg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-member-expression-to-functions": "^7.25.9",
-        "@babel/helper-optimise-call-expression": "^7.25.9",
-        "@babel/traverse": "^7.26.5"
+        "@angular-devkit/core": "20.1.6",
+        "rxjs": "7.8.2"
       },
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
       }
     },
-    "node_modules/@babel/helper-skip-transparent-expression-wrappers": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.25.9.tgz",
-      "integrity": "sha512-K4Du3BFa3gvyhzgPcntrkDgZzQaq6uozzcpGbOO1OEJaI+EJdqWIMTLgFgQf6lrfiDFo5FU+BxKepI9RmZqahA==",
+    "node_modules/@angular/cli/node_modules/@angular-devkit/core": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-20.1.6.tgz",
+      "integrity": "sha512-Wooe+nTmHOLvveBQWDmSsdKg39re5BUMGVkwKlPHTQ/YU9aYshvPEBu1K0l4gSqe3qtqVVAx0HlPb53bEFFa8w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/traverse": "^7.25.9",
-        "@babel/types": "^7.25.9"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@babel/helper-split-export-declaration": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.24.7.tgz",
-      "integrity": "sha512-oy5V7pD+UvfkEATUKvIjvIAH/xCzfsFVw7ygW2SI6NClZzquT+mwdTfgfdbUiceh6iQO0CHtCPsyze/MZ2YbAA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/types": "^7.24.7"
+        "ajv": "8.17.1",
+        "ajv-formats": "3.0.1",
+        "jsonc-parser": "3.3.1",
+        "picomatch": "4.0.2",
+        "rxjs": "7.8.2",
+        "source-map": "0.7.4"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      },
+      "peerDependencies": {
+        "chokidar": "^4.0.0"
+      },
+      "peerDependenciesMeta": {
+        "chokidar": {
+          "optional": true
+        }
       }
     },
-    "node_modules/@babel/helper-string-parser": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.25.9.tgz",
-      "integrity": "sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==",
+    "node_modules/@angular/cli/node_modules/@angular-devkit/schematics": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-20.1.6.tgz",
+      "integrity": "sha512-Maj/yCkn3Qjum2kCYUOYMw8VYh/8725XN8/4cae9VllMwkN5D8jYDvX40qmfgQve2x0x6r3L8rmaIHn8227cHg==",
       "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/core": "20.1.6",
+        "jsonc-parser": "3.3.1",
+        "magic-string": "0.30.17",
+        "ora": "8.2.0",
+        "rxjs": "7.8.2"
+      },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
       }
     },
-    "node_modules/@babel/helper-validator-identifier": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.25.9.tgz",
-      "integrity": "sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==",
+    "node_modules/@angular/cli/node_modules/ansi-styles": {
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
+      "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
       }
     },
-    "node_modules/@babel/helper-validator-option": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.25.9.tgz",
-      "integrity": "sha512-e/zv1co8pp55dNdEcCynfj9X7nyUKUXoUEwfXqaZt0omVOmDe9oOTdKStH4GmAw6zxMFs50ZayuMfHDKlO7Tfw==",
+    "node_modules/@angular/cli/node_modules/chalk": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.6.0.tgz",
+      "integrity": "sha512-46QrSQFyVSEyYAgQ22hQ+zDa60YHA4fBstHmtSApj1Y5vKtG27fWowW03jCk5KcbXEWPZUIR894aARCA/G1kfQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
-    "node_modules/@babel/helper-wrap-function": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-wrap-function/-/helper-wrap-function-7.25.9.tgz",
-      "integrity": "sha512-ETzz9UTjQSTmw39GboatdymDq4XIQbR8ySgVrylRhPOFpsd+JrKHIuF0de7GCWmem+T4uC5z7EZguod7Wj4A4g==",
+    "node_modules/@angular/cli/node_modules/cliui": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-9.0.1.tgz",
+      "integrity": "sha512-k7ndgKhwoQveBL+/1tqGJYNz097I7WOvwbmmU2AR5+magtbjPWQTS1C5vzGkBC8Ym8UWRzfKUzUUqFLypY4Q+w==",
       "dev": true,
-      "license": "MIT",
+      "license": "ISC",
       "dependencies": {
-        "@babel/template": "^7.25.9",
-        "@babel/traverse": "^7.25.9",
-        "@babel/types": "^7.25.9"
+        "string-width": "^7.2.0",
+        "strip-ansi": "^7.1.0",
+        "wrap-ansi": "^9.0.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=20"
       }
     },
-    "node_modules/@babel/helpers": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.26.9.tgz",
-      "integrity": "sha512-Mz/4+y8udxBKdmzt/UjPACs4G3j5SshJJEFFKxlCGPydG4JAHXxjWjAwjd09tf6oINvl1VfMJo+nB7H2YKQ0dA==",
+    "node_modules/@angular/cli/node_modules/is-interactive": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-2.0.0.tgz",
+      "integrity": "sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/template": "^7.26.9",
-        "@babel/types": "^7.26.9"
-      },
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/@babel/parser": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.9.tgz",
-      "integrity": "sha512-81NWa1njQblgZbQHxWHpxxCzNsa3ZwvFqpUg7P+NNUU6f3UU2jBEg4OlF/J6rl8+PQGh1q6/zWScd001YwcA5A==",
+    "node_modules/@angular/cli/node_modules/is-unicode-supported": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-2.1.0.tgz",
+      "integrity": "sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/types": "^7.26.9"
-      },
-      "bin": {
-        "parser": "bin/babel-parser.js"
-      },
       "engines": {
-        "node": ">=6.0.0"
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/@babel/plugin-bugfix-firefox-class-in-computed-class-key": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-firefox-class-in-computed-class-key/-/plugin-bugfix-firefox-class-in-computed-class-key-7.25.9.tgz",
-      "integrity": "sha512-ZkRyVkThtxQ/J6nv3JFYv1RYY+JT5BvU0y3k5bWrmuG4woXypRa4PXmm9RhOwodRkYFWqC0C0cqcJ4OqR7kW+g==",
+    "node_modules/@angular/cli/node_modules/log-symbols": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-6.0.0.tgz",
+      "integrity": "sha512-i24m8rpwhmPIS4zscNzK6MSEhk0DUWa/8iYQWxhffV8jkI4Phvs3F+quL5xvS0gdQR0FyTCMMH33Y78dDTzzIw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "@babel/traverse": "^7.25.9"
+        "chalk": "^5.3.0",
+        "is-unicode-supported": "^1.3.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=18"
       },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/@babel/plugin-bugfix-safari-class-field-initializer-scope": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-class-field-initializer-scope/-/plugin-bugfix-safari-class-field-initializer-scope-7.25.9.tgz",
-      "integrity": "sha512-MrGRLZxLD/Zjj0gdU15dfs+HH/OXvnw/U4jJD8vpcP2CJQapPEv1IWwjc/qMg7ItBlPwSv1hRBbb7LeuANdcnw==",
+    "node_modules/@angular/cli/node_modules/log-symbols/node_modules/is-unicode-supported": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-1.3.0.tgz",
+      "integrity": "sha512-43r2mRvz+8JRIKnWJ+3j8JtjRKZ6GmjzfaE/qiBJnikNnYv/6bagRJ1kUhNk8R5EX/GkobD+r+sfxCPJsiKBLQ==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=12"
       },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.25.9.tgz",
-      "integrity": "sha512-2qUwwfAFpJLZqxd02YW9btUCZHl+RFvdDkNfZwaIJrvB8Tesjsk8pEQkTvGwZXLqXUx/2oyY3ySRhm6HOXuCug==",
+    "node_modules/@angular/cli/node_modules/ora": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/ora/-/ora-8.2.0.tgz",
+      "integrity": "sha512-weP+BZ8MVNnlCm8c0Qdc1WSWq4Qn7I+9CJGm7Qali6g44e/PUzbjNqJX5NJ9ljlNMosfJvg1fKEGILklK9cwnw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "chalk": "^5.3.0",
+        "cli-cursor": "^5.0.0",
+        "cli-spinners": "^2.9.2",
+        "is-interactive": "^2.0.0",
+        "is-unicode-supported": "^2.0.0",
+        "log-symbols": "^6.0.0",
+        "stdin-discarder": "^0.2.2",
+        "string-width": "^7.2.0",
+        "strip-ansi": "^7.1.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=18"
       },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.25.9.tgz",
-      "integrity": "sha512-6xWgLZTJXwilVjlnV7ospI3xi+sl8lN8rXXbBD6vYn3UYDlGsag8wrZkKcSI8G6KgqKP7vNFaDgeDnfAABq61g==",
+    "node_modules/@angular/cli/node_modules/wrap-ansi": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-9.0.0.tgz",
+      "integrity": "sha512-G8ura3S+3Z2G+mkgNRq8dqaFZAuxfsxpBB8OCTGRTCtp+l/v9nbFNmCUP1BZMts3G1142MsZfn6eeUKrr4PD1Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.25.9",
-        "@babel/plugin-transform-optional-chaining": "^7.25.9"
+        "ansi-styles": "^6.2.1",
+        "string-width": "^7.0.0",
+        "strip-ansi": "^7.1.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=18"
       },
-      "peerDependencies": {
-        "@babel/core": "^7.13.0"
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
       }
     },
-    "node_modules/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly/-/plugin-bugfix-v8-static-class-fields-redefine-readonly-7.25.9.tgz",
-      "integrity": "sha512-aLnMXYPnzwwqhYSCyXfKkIkYgJ8zv9RK+roo9DkTXz38ynIhd9XCbN08s3MGvqL2MYGVUGdRQLL/JqBIeJhJBg==",
+    "node_modules/@angular/cli/node_modules/yargs": {
+      "version": "18.0.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-18.0.0.tgz",
+      "integrity": "sha512-4UEqdc2RYGHZc7Doyqkrqiln3p9X2DZVxaGbwhn2pi7MrRagKaOcIKe8L3OxYcbhXLgLFUS3zAYuQjKBQgmuNg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "@babel/traverse": "^7.25.9"
+        "cliui": "^9.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "string-width": "^7.2.0",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^22.0.0"
       },
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
+        "node": "^20.19.0 || ^22.12.0 || >=23"
       }
     },
-    "node_modules/@babel/plugin-proposal-private-property-in-object": {
-      "version": "7.21.0-placeholder-for-preset-env.2",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.21.0-placeholder-for-preset-env.2.tgz",
-      "integrity": "sha512-SOSkfJDddaM7mak6cPEpswyTRnuRltl429hMraQEglW+OkovnCzsiszTmsrlY//qLFjCpQDFRvjdm2wA5pPm9w==",
+    "node_modules/@angular/cli/node_modules/yargs-parser": {
+      "version": "22.0.0",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-22.0.0.tgz",
+      "integrity": "sha512-rwu/ClNdSMpkSrUb+d6BRsSkLUq1fmfsY6TOpYzTwvwkg1/NRG85KBy3kq++A8LKQwX6lsu+aWad+2khvuXrqw==",
       "dev": true,
-      "license": "MIT",
+      "license": "ISC",
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": "^20.19.0 || ^22.12.0 || >=23"
       }
     },
-    "node_modules/@babel/plugin-syntax-import-assertions": {
-      "version": "7.26.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.26.0.tgz",
-      "integrity": "sha512-QCWT5Hh830hK5EQa7XzuqIkQU9tT/whqbDz7kuaZMHFl1inRRg7JnuAEOQ0Ur0QUl0NufCk1msK2BeY79Aj/eg==",
-      "dev": true,
+    "node_modules/@angular/common": {
+      "version": "20.1.7",
+      "resolved": "https://registry.npmjs.org/@angular/common/-/common-20.1.7.tgz",
+      "integrity": "sha512-3eFxQ18613JpBQw53wMUZfqc2RvratWx6GqKs5A1JJpMs0qq26yc2PhJWer99u3mugpKavmKoKpXFBkuWg50Qw==",
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "tslib": "^2.3.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       },
       "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "@angular/core": "20.1.7",
+        "rxjs": "^6.5.3 || ^7.4.0"
       }
     },
-    "node_modules/@babel/plugin-syntax-import-attributes": {
-      "version": "7.26.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-attributes/-/plugin-syntax-import-attributes-7.26.0.tgz",
-      "integrity": "sha512-e2dttdsJ1ZTpi3B9UYGLw41hifAubg19AtCu/2I/F1QNVclOBr1dYpTdmdyZ84Xiz43BS/tCUkMAZNLv12Pi+A==",
-      "dev": true,
+    "node_modules/@angular/compiler": {
+      "version": "20.1.7",
+      "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-20.1.7.tgz",
+      "integrity": "sha512-IZPkFxXoJZy7aVBgcsYLKyfr1CreCqpqhlbiSVXgtleyTcReaMoQBHeEqyFxD7PeB4Lfmf1N6ncHCILg+wxTfw==",
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "tslib": "^2.3.0"
       },
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       }
     },
-    "node_modules/@babel/plugin-syntax-unicode-sets-regex": {
-      "version": "7.18.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-unicode-sets-regex/-/plugin-syntax-unicode-sets-regex-7.18.6.tgz",
-      "integrity": "sha512-727YkEAPwSIQTv5im8QHz3upqp92JTWhidIC81Tdx4VJYIte/VndKf1qKrfnnhPLiPghStWfvC/iFaMCQu7Nqg==",
+    "node_modules/@angular/compiler-cli": {
+      "version": "20.1.7",
+      "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-20.1.7.tgz",
+      "integrity": "sha512-YnSn/956+On0KaJqzikZ6Ot7lcYJRU06bhXAjGI7UdRoyYYbtnpG3jPspXDunycvuVxKFHMzjKlIoMohk6bPGA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.18.6",
-        "@babel/helper-plugin-utils": "^7.18.6"
+        "@babel/core": "7.28.0",
+        "@jridgewell/sourcemap-codec": "^1.4.14",
+        "chokidar": "^4.0.0",
+        "convert-source-map": "^1.5.1",
+        "reflect-metadata": "^0.2.0",
+        "semver": "^7.0.0",
+        "tslib": "^2.3.0",
+        "yargs": "^18.0.0"
+      },
+      "bin": {
+        "ng-xi18n": "bundles/src/bin/ng_xi18n.js",
+        "ngc": "bundles/src/bin/ngc.js"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       },
       "peerDependencies": {
-        "@babel/core": "^7.0.0"
+        "@angular/compiler": "20.1.7",
+        "typescript": ">=5.8 <5.9"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
       }
     },
-    "node_modules/@babel/plugin-transform-arrow-functions": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.25.9.tgz",
-      "integrity": "sha512-6jmooXYIwn9ca5/RylZADJ+EnSxVUS5sjeJ9UPk6RWRzXCmOJCy6dqItPJFpw2cuCangPK4OYr5uhGKcmrm5Qg==",
+    "node_modules/@angular/compiler-cli/node_modules/ansi-styles": {
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
+      "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=12"
       },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
       }
     },
-    "node_modules/@babel/plugin-transform-async-generator-functions": {
-      "version": "7.26.8",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.26.8.tgz",
-      "integrity": "sha512-He9Ej2X7tNf2zdKMAGOsmg2MrFc+hfoAhd3po4cWfo/NWjzEAKa0oQruj1ROVUdl0e6fb6/kE/G3SSxE0lRJOg==",
+    "node_modules/@angular/compiler-cli/node_modules/cliui": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-9.0.1.tgz",
+      "integrity": "sha512-k7ndgKhwoQveBL+/1tqGJYNz097I7WOvwbmmU2AR5+magtbjPWQTS1C5vzGkBC8Ym8UWRzfKUzUUqFLypY4Q+w==",
       "dev": true,
-      "license": "MIT",
+      "license": "ISC",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.26.5",
-        "@babel/helper-remap-async-to-generator": "^7.25.9",
-        "@babel/traverse": "^7.26.8"
+        "string-width": "^7.2.0",
+        "strip-ansi": "^7.1.0",
+        "wrap-ansi": "^9.0.0"
       },
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=20"
       }
     },
-    "node_modules/@babel/plugin-transform-async-to-generator": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.25.9.tgz",
-      "integrity": "sha512-NT7Ejn7Z/LjUH0Gv5KsBCxh7BH3fbLTV0ptHvpeMvrt3cPThHfJfst9Wrb7S8EvJ7vRTFI7z+VAvFVEQn/m5zQ==",
+    "node_modules/@angular/compiler-cli/node_modules/wrap-ansi": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-9.0.0.tgz",
+      "integrity": "sha512-G8ura3S+3Z2G+mkgNRq8dqaFZAuxfsxpBB8OCTGRTCtp+l/v9nbFNmCUP1BZMts3G1142MsZfn6eeUKrr4PD1Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-module-imports": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "@babel/helper-remap-async-to-generator": "^7.25.9"
+        "ansi-styles": "^6.2.1",
+        "string-width": "^7.0.0",
+        "strip-ansi": "^7.1.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=18"
       },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
       }
     },
-    "node_modules/@babel/plugin-transform-block-scoped-functions": {
-      "version": "7.26.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.26.5.tgz",
-      "integrity": "sha512-chuTSY+hq09+/f5lMj8ZSYgCFpppV2CbYrhNFJ1BFoXpiWPnnAb7R0MqrafCpN8E1+YRrtM1MXZHJdIx8B6rMQ==",
+    "node_modules/@angular/compiler-cli/node_modules/yargs": {
+      "version": "18.0.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-18.0.0.tgz",
+      "integrity": "sha512-4UEqdc2RYGHZc7Doyqkrqiln3p9X2DZVxaGbwhn2pi7MrRagKaOcIKe8L3OxYcbhXLgLFUS3zAYuQjKBQgmuNg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.26.5"
+        "cliui": "^9.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "string-width": "^7.2.0",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^22.0.0"
       },
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": "^20.19.0 || ^22.12.0 || >=23"
       }
     },
-    "node_modules/@babel/plugin-transform-block-scoping": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.25.9.tgz",
-      "integrity": "sha512-1F05O7AYjymAtqbsFETboN1NvBdcnzMerO+zlMyJBEz6WkMdejvGWw9p05iTSjC85RLlBseHHQpYaM4gzJkBGg==",
+    "node_modules/@angular/compiler-cli/node_modules/yargs-parser": {
+      "version": "22.0.0",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-22.0.0.tgz",
+      "integrity": "sha512-rwu/ClNdSMpkSrUb+d6BRsSkLUq1fmfsY6TOpYzTwvwkg1/NRG85KBy3kq++A8LKQwX6lsu+aWad+2khvuXrqw==",
       "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=23"
+      }
+    },
+    "node_modules/@angular/core": {
+      "version": "20.1.7",
+      "resolved": "https://registry.npmjs.org/@angular/core/-/core-20.1.7.tgz",
+      "integrity": "sha512-LL5nyCQ9yrMLQMfAPgambGCPEQmpuHrg3cTRI0P9EMySgFoyyPUsIfWYYz5w1VWxmkfcXSkpNtyaNB5P60p0rg==",
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "tslib": "^2.3.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       },
       "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "@angular/compiler": "20.1.7",
+        "rxjs": "^6.5.3 || ^7.4.0",
+        "zone.js": "~0.15.0"
+      },
+      "peerDependenciesMeta": {
+        "@angular/compiler": {
+          "optional": true
+        },
+        "zone.js": {
+          "optional": true
+        }
       }
     },
-    "node_modules/@babel/plugin-transform-class-properties": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-properties/-/plugin-transform-class-properties-7.25.9.tgz",
-      "integrity": "sha512-bbMAII8GRSkcd0h0b4X+36GksxuheLFjP65ul9w6C3KgAamI3JqErNgSrosX6ZPj+Mpim5VvEbawXxJCyEUV3Q==",
-      "dev": true,
+    "node_modules/@angular/forms": {
+      "version": "20.1.7",
+      "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-20.1.7.tgz",
+      "integrity": "sha512-gHfCeW7gp7GLjHfNOF+es8gAYph4+ZhgfvP9cdj9RmRy7ckQTuJ2OwrWmruqRcrB3J46uqENQyrNhJz0ubozYA==",
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "tslib": "^2.3.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       },
       "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "@angular/common": "20.1.7",
+        "@angular/core": "20.1.7",
+        "@angular/platform-browser": "20.1.7",
+        "rxjs": "^6.5.3 || ^7.4.0"
       }
     },
-    "node_modules/@babel/plugin-transform-class-static-block": {
-      "version": "7.26.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-static-block/-/plugin-transform-class-static-block-7.26.0.tgz",
-      "integrity": "sha512-6J2APTs7BDDm+UMqP1useWqhcRAXo0WIoVj26N7kPFB6S73Lgvyka4KTZYIxtgYXiN5HTyRObA72N2iu628iTQ==",
-      "dev": true,
+    "node_modules/@angular/platform-browser": {
+      "version": "20.1.7",
+      "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-20.1.7.tgz",
+      "integrity": "sha512-z2dlsrar4XmDAIgin1O3zDztVWHUpdZzR65mqyvbaNKtQHcnL33wVBBNVnksBkpPq+Lou2Cih1AdsICKyRyRbQ==",
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "tslib": "^2.3.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       },
       "peerDependencies": {
-        "@babel/core": "^7.12.0"
+        "@angular/animations": "20.1.7",
+        "@angular/common": "20.1.7",
+        "@angular/core": "20.1.7"
+      },
+      "peerDependenciesMeta": {
+        "@angular/animations": {
+          "optional": true
+        }
       }
     },
-    "node_modules/@babel/plugin-transform-classes": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.25.9.tgz",
-      "integrity": "sha512-mD8APIXmseE7oZvZgGABDyM34GUmK45Um2TXiBUt7PnuAxrgoSVf123qUzPxEr/+/BHrRn5NMZCdE2m/1F8DGg==",
-      "dev": true,
+    "node_modules/@angular/platform-browser-dynamic": {
+      "version": "20.1.7",
+      "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-20.1.7.tgz",
+      "integrity": "sha512-Fl/AhG54DS1NRrTE8SLJ2vy8Dd1yYjfos+h4bdghP/HY5gRFtnzb662VeKfx6sL+KlG0jV4hMYhuczTF8BvhTg==",
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.25.9",
-        "@babel/helper-compilation-targets": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "@babel/helper-replace-supers": "^7.25.9",
-        "@babel/traverse": "^7.25.9",
-        "globals": "^11.1.0"
+        "tslib": "^2.3.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       },
       "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "@angular/common": "20.1.7",
+        "@angular/compiler": "20.1.7",
+        "@angular/core": "20.1.7",
+        "@angular/platform-browser": "20.1.7"
       }
     },
-    "node_modules/@babel/plugin-transform-computed-properties": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.25.9.tgz",
-      "integrity": "sha512-HnBegGqXZR12xbcTHlJ9HGxw1OniltT26J5YpfruGqtUHlz/xKf/G2ak9e+t0rVqrjXa9WOhvYPz1ERfMj23AA==",
-      "dev": true,
+    "node_modules/@angular/platform-server": {
+      "version": "20.1.7",
+      "resolved": "https://registry.npmjs.org/@angular/platform-server/-/platform-server-20.1.7.tgz",
+      "integrity": "sha512-2Tm8n6fz7dZkZrBgNZAP8c69sctL6acyxNYt41U3Kr9cls//0KWBNiqLAp4jjFBaU1wsKVB+nHPs7A2EbcecOQ==",
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "@babel/template": "^7.25.9"
+        "tslib": "^2.3.0",
+        "xhr2": "^0.2.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       },
       "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "@angular/common": "20.1.7",
+        "@angular/compiler": "20.1.7",
+        "@angular/core": "20.1.7",
+        "@angular/platform-browser": "20.1.7",
+        "rxjs": "^6.5.3 || ^7.4.0"
       }
     },
-    "node_modules/@babel/plugin-transform-destructuring": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.25.9.tgz",
-      "integrity": "sha512-WkCGb/3ZxXepmMiX101nnGiU+1CAdut8oHyEOHxkKuS1qKpU2SMXE2uSvfz8PBuLd49V6LEsbtyPhWC7fnkgvQ==",
-      "dev": true,
+    "node_modules/@angular/router": {
+      "version": "20.1.7",
+      "resolved": "https://registry.npmjs.org/@angular/router/-/router-20.1.7.tgz",
+      "integrity": "sha512-Pcd5zmQxq2szGQwG9Gmmt92icBrAocEowOI9OBYeuwyhcR+pVrcc67mbrVFB+bspkbTDBxxtPV+SV21vDKROSQ==",
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "tslib": "^2.3.0"
       },
       "engines": {
-        "node": ">=6.9.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       },
       "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "@angular/common": "20.1.7",
+        "@angular/core": "20.1.7",
+        "@angular/platform-browser": "20.1.7",
+        "rxjs": "^6.5.3 || ^7.4.0"
       }
     },
-    "node_modules/@babel/plugin-transform-dotall-regex": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.25.9.tgz",
-      "integrity": "sha512-t7ZQ7g5trIgSRYhI9pIJtRl64KHotutUJsh4Eze5l7olJv+mRSg4/MmbZ0tv1eeqRbdvo/+trvJD/Oc5DmW2cA==",
-      "dev": true,
+    "node_modules/@angular/ssr": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular/ssr/-/ssr-20.1.6.tgz",
+      "integrity": "sha512-kVuoRP4sANv9Nky2GtUGj19MTPILz6A+NyWyYlgUIKo4aOzlQIBJnsW79iomZx0JlkO9IgH/83jzyBfoPQhYJw==",
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
-      "engines": {
-        "node": ">=6.9.0"
+        "tslib": "^2.3.0"
       },
       "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "@angular/common": "^20.0.0",
+        "@angular/core": "^20.0.0",
+        "@angular/platform-server": "^20.0.0",
+        "@angular/router": "^20.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@angular/platform-server": {
+          "optional": true
+        }
       }
     },
-    "node_modules/@babel/plugin-transform-duplicate-keys": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.25.9.tgz",
-      "integrity": "sha512-LZxhJ6dvBb/f3x8xwWIuyiAHy56nrRG3PeYTpBkkzkYRRQ6tJLu68lEF5VIqMUZiAV7a8+Tb78nEoMCMcqjXBw==",
+    "node_modules/@babel/code-frame": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.27.1.tgz",
+      "integrity": "sha512-cjQ7ZlQ0Mv3b47hABuTevyTuYN4i+loJKGeV9flcCgIK37cCXRh+L1bd3iBHlynerhQ7BhCkn2BPbQUL+rGqFg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "@babel/helper-validator-identifier": "^7.27.1",
+        "js-tokens": "^4.0.0",
+        "picocolors": "^1.1.1"
       },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-duplicate-named-capturing-groups-regex": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-named-capturing-groups-regex/-/plugin-transform-duplicate-named-capturing-groups-regex-7.25.9.tgz",
-      "integrity": "sha512-0UfuJS0EsXbRvKnwcLjFtJy/Sxc5J5jhLHnFhy7u4zih97Hz6tJkLU+O+FMMrNZrosUPxDi6sYxJ/EA8jDiAog==",
+    "node_modules/@babel/compat-data": {
+      "version": "7.28.0",
+      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.28.0.tgz",
+      "integrity": "sha512-60X7qkglvrap8mn1lh2ebxXdZYtUcpd7gsmy9kLaBJ4i/WdY8PqTSdxyA8qraikqKQK5C1KRBKXqznrVapyNaw==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
       }
     },
-    "node_modules/@babel/plugin-transform-dynamic-import": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dynamic-import/-/plugin-transform-dynamic-import-7.25.9.tgz",
-      "integrity": "sha512-GCggjexbmSLaFhqsojeugBpeaRIgWNTcgKVq/0qIteFEqY2A+b9QidYadrWlnbWQUrW5fn+mCvf3tr7OeBFTyg==",
+    "node_modules/@babel/core": {
+      "version": "7.28.0",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.28.0.tgz",
+      "integrity": "sha512-UlLAnTPrFdNGoFtbSXwcGFQBtQZJCNjaN6hQNP3UPvuNXT1i82N26KL3dZeIpNalWywr9IuQuncaAfUaS1g6sQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "@ampproject/remapping": "^2.2.0",
+        "@babel/code-frame": "^7.27.1",
+        "@babel/generator": "^7.28.0",
+        "@babel/helper-compilation-targets": "^7.27.2",
+        "@babel/helper-module-transforms": "^7.27.3",
+        "@babel/helpers": "^7.27.6",
+        "@babel/parser": "^7.28.0",
+        "@babel/template": "^7.27.2",
+        "@babel/traverse": "^7.28.0",
+        "@babel/types": "^7.28.0",
+        "convert-source-map": "^2.0.0",
+        "debug": "^4.1.0",
+        "gensync": "^1.0.0-beta.2",
+        "json5": "^2.2.3",
+        "semver": "^6.3.1"
       },
       "engines": {
         "node": ">=6.9.0"
       },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/babel"
       }
     },
-    "node_modules/@babel/plugin-transform-exponentiation-operator": {
-      "version": "7.26.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.26.3.tgz",
-      "integrity": "sha512-7CAHcQ58z2chuXPWblnn1K6rLDnDWieghSOEmqQsrBenH0P9InCUtOJYD89pvngljmZlJcz3fcmgYsXFNGa1ZQ==",
+    "node_modules/@babel/core/node_modules/@babel/generator": {
+      "version": "7.28.3",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.28.3.tgz",
+      "integrity": "sha512-3lSpxGgvnmZznmBkCRnVREPUFJv2wrv9iAoFDvADJc0ypmdOxdUtcLeBgBJ6zE0PMeTKnxeQzyk0xTBq4Ep7zw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "@babel/parser": "^7.28.3",
+        "@babel/types": "^7.28.2",
+        "@jridgewell/gen-mapping": "^0.3.12",
+        "@jridgewell/trace-mapping": "^0.3.28",
+        "jsesc": "^3.0.2"
       },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-export-namespace-from": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-export-namespace-from/-/plugin-transform-export-namespace-from-7.25.9.tgz",
-      "integrity": "sha512-2NsEz+CxzJIVOPx2o9UsW1rXLqtChtLoVnwYHHiB04wS5sgn7mrV45fWMBX0Kk+ub9uXytVYfNP2HjbVbCB3Ww==",
+    "node_modules/@babel/core/node_modules/convert-source-map": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
+      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
       "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
+      "license": "MIT"
     },
-    "node_modules/@babel/plugin-transform-for-of": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.26.9.tgz",
-      "integrity": "sha512-Hry8AusVm8LW5BVFgiyUReuoGzPUpdHQQqJY5bZnbbf+ngOHWuCuYFKw/BqaaWlvEUrF91HMhDtEaI1hZzNbLg==",
+    "node_modules/@babel/core/node_modules/semver": {
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.26.5",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.25.9"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
       }
     },
-    "node_modules/@babel/plugin-transform-function-name": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.25.9.tgz",
-      "integrity": "sha512-8lP+Yxjv14Vc5MuWBpJsoUCd3hD6V9DgBon2FVYL4jJgbnVQ9fTgYmonchzZJOVNgzEgbxp4OwAf6xz6M/14XA==",
+    "node_modules/@babel/generator": {
+      "version": "7.27.5",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.27.5.tgz",
+      "integrity": "sha512-ZGhA37l0e/g2s1Cnzdix0O3aLYm66eF8aufiVteOgnwxgnRP8GoyMj7VWsgWnQbVKXyge7hqrFh2K2TQM6t1Hw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-compilation-targets": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "@babel/traverse": "^7.25.9"
+        "@babel/parser": "^7.27.5",
+        "@babel/types": "^7.27.3",
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.25",
+        "jsesc": "^3.0.2"
       },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-json-strings": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-json-strings/-/plugin-transform-json-strings-7.25.9.tgz",
-      "integrity": "sha512-xoTMk0WXceiiIvsaquQQUaLLXSW1KJ159KP87VilruQm0LNNGxWzahxSS6T6i4Zg3ezp4vA4zuwiNUR53qmQAw==",
+    "node_modules/@babel/helper-annotate-as-pure": {
+      "version": "7.27.3",
+      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.27.3.tgz",
+      "integrity": "sha512-fXSwMQqitTGeHLBC08Eq5yXz2m37E4pJX1qAU1+2cNedz/ifv/bVXft90VeSav5nFO61EcNgwr0aJxbyPaWBPg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "@babel/types": "^7.27.3"
       },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-literals": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-literals/-/plugin-transform-literals-7.25.9.tgz",
-      "integrity": "sha512-9N7+2lFziW8W9pBl2TzaNht3+pgMIRP74zizeCSrtnSKVdUl8mAjjOP2OOVQAfZ881P2cNjDj1uAMEdeD50nuQ==",
+    "node_modules/@babel/helper-compilation-targets": {
+      "version": "7.27.2",
+      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.27.2.tgz",
+      "integrity": "sha512-2+1thGUUWWjLTYTHZWK1n8Yga0ijBz1XAhUXcKy81rd5g6yh7hGqMp45v7cadSbEHc9G3OTv45SyneRN3ps4DQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "@babel/compat-data": "^7.27.2",
+        "@babel/helper-validator-option": "^7.27.1",
+        "browserslist": "^4.24.0",
+        "lru-cache": "^5.1.1",
+        "semver": "^6.3.1"
       },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-logical-assignment-operators": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-logical-assignment-operators/-/plugin-transform-logical-assignment-operators-7.25.9.tgz",
-      "integrity": "sha512-wI4wRAzGko551Y8eVf6iOY9EouIDTtPb0ByZx+ktDGHwv6bHFimrgJM/2T021txPZ2s4c7bqvHbd+vXG6K948Q==",
+    "node_modules/@babel/helper-compilation-targets/node_modules/semver": {
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
       }
     },
-    "node_modules/@babel/plugin-transform-member-expression-literals": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.25.9.tgz",
-      "integrity": "sha512-PYazBVfofCQkkMzh2P6IdIUaCEWni3iYEerAsRWuVd8+jlM1S9S9cz1dF9hIzyoZ8IA3+OwVYIp9v9e+GbgZhA==",
+    "node_modules/@babel/helper-globals": {
+      "version": "7.28.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-globals/-/helper-globals-7.28.0.tgz",
+      "integrity": "sha512-+W6cISkXFa1jXsDEdYA8HeevQT/FULhxzR99pxphltZcVaugps53THCeiWA8SguxxpSp3gKPiuYfSWopkLQ4hw==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-modules-amd": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.25.9.tgz",
-      "integrity": "sha512-g5T11tnI36jVClQlMlt4qKDLlWnG5pP9CSM4GhdRciTNMRgkfpo5cR6b4rGIOYPgRRuFAvwjPQ/Yk+ql4dyhbw==",
+    "node_modules/@babel/helper-module-imports": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.27.1.tgz",
+      "integrity": "sha512-0gSFWUPNXNopqtIPQvlD5WgXYI5GY2kP2cCvoT8kczjbfcfuIljTbcWrulD1CIPIX2gt1wghbDy08yE1p+/r3w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-module-transforms": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "@babel/traverse": "^7.27.1",
+        "@babel/types": "^7.27.1"
       },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-modules-commonjs": {
-      "version": "7.26.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.26.3.tgz",
-      "integrity": "sha512-MgR55l4q9KddUDITEzEFYn5ZsGDXMSsU9E+kh7fjRXTIC3RHqfCo8RPRbyReYJh44HQ/yomFkqbOFohXvDCiIQ==",
+    "node_modules/@babel/helper-module-transforms": {
+      "version": "7.28.3",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.28.3.tgz",
+      "integrity": "sha512-gytXUbs8k2sXS9PnQptz5o0QnpLL51SwASIORY6XaBKF88nsOT0Zw9szLqlSGQDP/4TljBAD5y98p2U1fqkdsw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-module-transforms": "^7.26.0",
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "@babel/helper-module-imports": "^7.27.1",
+        "@babel/helper-validator-identifier": "^7.27.1",
+        "@babel/traverse": "^7.28.3"
       },
       "engines": {
         "node": ">=6.9.0"
       },
       "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "@babel/core": "^7.0.0"
       }
     },
-    "node_modules/@babel/plugin-transform-modules-systemjs": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.25.9.tgz",
-      "integrity": "sha512-hyss7iIlH/zLHaehT+xwiymtPOpsiwIIRlCAOwBB04ta5Tt+lNItADdlXw3jAWZ96VJ2jlhl/c+PNIQPKNfvcA==",
+    "node_modules/@babel/helper-split-export-declaration": {
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.24.7.tgz",
+      "integrity": "sha512-oy5V7pD+UvfkEATUKvIjvIAH/xCzfsFVw7ygW2SI6NClZzquT+mwdTfgfdbUiceh6iQO0CHtCPsyze/MZ2YbAA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-module-transforms": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "@babel/helper-validator-identifier": "^7.25.9",
-        "@babel/traverse": "^7.25.9"
+        "@babel/types": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-modules-umd": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.25.9.tgz",
-      "integrity": "sha512-bS9MVObUgE7ww36HEfwe6g9WakQ0KF07mQF74uuXdkoziUPfKyu/nIm663kz//e5O1nPInPFx36z7WJmJ4yNEw==",
+    "node_modules/@babel/helper-string-parser": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.27.1.tgz",
+      "integrity": "sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-module-transforms": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-named-capturing-groups-regex": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.25.9.tgz",
-      "integrity": "sha512-oqB6WHdKTGl3q/ItQhpLSnWWOpjUJLsOCLVyeFgeTktkBSCiurvPOsyt93gibI9CmuKvTUEtWmG5VhZD+5T/KA==",
+    "node_modules/@babel/helper-validator-identifier": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.27.1.tgz",
+      "integrity": "sha512-D2hP9eA+Sqx1kBZgzxZh0y1trbuU+JoDkiEwqhQ36nodYqJwyEIhPSdMNd7lOm/4io72luTPWH20Yda0xOuUow==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
       }
     },
-    "node_modules/@babel/plugin-transform-new-target": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.25.9.tgz",
-      "integrity": "sha512-U/3p8X1yCSoKyUj2eOBIx3FOn6pElFOKvAAGf8HTtItuPyB+ZeOqfn+mvTtg9ZlOAjsPdK3ayQEjqHjU/yLeVQ==",
+    "node_modules/@babel/helper-validator-option": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.27.1.tgz",
+      "integrity": "sha512-YvjJow9FxbhFFKDSuFnVCe2WxXk1zWc22fFePVNEaWJEu8IrZVlda6N0uHwzZrUM1il7NC9Mlp4MaJYbYd9JSg==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-nullish-coalescing-operator": {
-      "version": "7.26.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-nullish-coalescing-operator/-/plugin-transform-nullish-coalescing-operator-7.26.6.tgz",
-      "integrity": "sha512-CKW8Vu+uUZneQCPtXmSBUC6NCAUdya26hWCElAWh5mVSlSRsmiCPUUDKb3Z0szng1hiAJa098Hkhg9o4SE35Qw==",
+    "node_modules/@babel/helpers": {
+      "version": "7.28.3",
+      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.28.3.tgz",
+      "integrity": "sha512-PTNtvUQihsAsDHMOP5pfobP8C6CM4JWXmP8DrEIt46c3r2bf87Ua1zoqevsMo9g+tWDwgWrFP5EIxuBx5RudAw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.26.5"
+        "@babel/template": "^7.27.2",
+        "@babel/types": "^7.28.2"
       },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-numeric-separator": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-numeric-separator/-/plugin-transform-numeric-separator-7.25.9.tgz",
-      "integrity": "sha512-TlprrJ1GBZ3r6s96Yq8gEQv82s8/5HnCVHtEJScUj90thHQbwe+E5MLhi2bbNHBEJuzrvltXSru+BUxHDoog7Q==",
+    "node_modules/@babel/parser": {
+      "version": "7.28.3",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.28.3.tgz",
+      "integrity": "sha512-7+Ey1mAgYqFAx2h0RuoxcQT5+MlG3GTV0TQrgr7/ZliKsm/MNDxVVutlWaziMq7wJNAz8MTqz55XLpWvva6StA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "@babel/types": "^7.28.2"
       },
-      "engines": {
-        "node": ">=6.9.0"
+      "bin": {
+        "parser": "bin/babel-parser.js"
       },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+      "engines": {
+        "node": ">=6.0.0"
       }
     },
-    "node_modules/@babel/plugin-transform-object-rest-spread": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.25.9.tgz",
-      "integrity": "sha512-fSaXafEE9CVHPweLYw4J0emp1t8zYTXyzN3UuG+lylqkvYd7RMrsOQ8TYx5RF231be0vqtFC6jnx3UmpJmKBYg==",
+    "node_modules/@babel/template": {
+      "version": "7.27.2",
+      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.2.tgz",
+      "integrity": "sha512-LPDZ85aEJyYSd18/DkjNh4/y1ntkE5KwUHWTiqgRxruuZL2F1yuHligVHLvcHY2vMHXttKFpJn6LwfI7cw7ODw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-compilation-targets": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "@babel/plugin-transform-parameters": "^7.25.9"
+        "@babel/code-frame": "^7.27.1",
+        "@babel/parser": "^7.27.2",
+        "@babel/types": "^7.27.1"
       },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-object-super": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.25.9.tgz",
-      "integrity": "sha512-Kj/Gh+Rw2RNLbCK1VAWj2U48yxxqL2x0k10nPtSdRa0O2xnHXalD0s+o1A6a0W43gJ00ANo38jxkQreckOzv5A==",
+    "node_modules/@babel/traverse": {
+      "version": "7.28.3",
+      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.28.3.tgz",
+      "integrity": "sha512-7w4kZYHneL3A6NP2nxzHvT3HCZ7puDZZjFMqDpBPECub79sTtSO5CGXDkKrTQq8ksAwfD/XI2MRFX23njdDaIQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "@babel/helper-replace-supers": "^7.25.9"
+        "@babel/code-frame": "^7.27.1",
+        "@babel/generator": "^7.28.3",
+        "@babel/helper-globals": "^7.28.0",
+        "@babel/parser": "^7.28.3",
+        "@babel/template": "^7.27.2",
+        "@babel/types": "^7.28.2",
+        "debug": "^4.3.1"
       },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-optional-catch-binding": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-catch-binding/-/plugin-transform-optional-catch-binding-7.25.9.tgz",
-      "integrity": "sha512-qM/6m6hQZzDcZF3onzIhZeDHDO43bkNNlOX0i8n3lR6zLbu0GN2d8qfM/IERJZYauhAHSLHy39NF0Ctdvcid7g==",
+    "node_modules/@babel/traverse/node_modules/@babel/generator": {
+      "version": "7.28.3",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.28.3.tgz",
+      "integrity": "sha512-3lSpxGgvnmZznmBkCRnVREPUFJv2wrv9iAoFDvADJc0ypmdOxdUtcLeBgBJ6zE0PMeTKnxeQzyk0xTBq4Ep7zw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "@babel/parser": "^7.28.3",
+        "@babel/types": "^7.28.2",
+        "@jridgewell/gen-mapping": "^0.3.12",
+        "@jridgewell/trace-mapping": "^0.3.28",
+        "jsesc": "^3.0.2"
       },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-optional-chaining": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.25.9.tgz",
-      "integrity": "sha512-6AvV0FsLULbpnXeBjrY4dmWF8F7gf8QnvTEoO/wX/5xm/xE1Xo8oPuD3MPS+KS9f9XBEAWN7X1aWr4z9HdOr7A==",
+    "node_modules/@babel/types": {
+      "version": "7.28.2",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.28.2.tgz",
+      "integrity": "sha512-ruv7Ae4J5dUYULmeXw1gmb7rYRz57OWCPM57pHojnLq/3Z1CK2lNSLTCVjxVk1F/TZHwOZZrOWi0ur95BbLxNQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.25.9"
+        "@babel/helper-string-parser": "^7.27.1",
+        "@babel/helper-validator-identifier": "^7.27.1"
       },
       "engines": {
         "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-parameters": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.25.9.tgz",
-      "integrity": "sha512-wzz6MKwpnshBAiRmn4jR8LYz/g8Ksg0o80XmwZDlordjwEk9SxBzTWC7F5ef1jhbrbOW2DJ5J6ayRukrJmnr0g==",
+    "node_modules/@colors/colors": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/@colors/colors/-/colors-1.5.0.tgz",
+      "integrity": "sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=0.1.90"
       }
     },
-    "node_modules/@babel/plugin-transform-private-methods": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-methods/-/plugin-transform-private-methods-7.25.9.tgz",
-      "integrity": "sha512-D/JUozNpQLAPUVusvqMxyvjzllRaF8/nSrP1s2YGQT/W4LHK4xxsMcHjhOGTS01mp9Hda8nswb+FblLdJornQw==",
-      "dev": true,
+    "node_modules/@cspotcode/source-map-support": {
+      "version": "0.8.1",
+      "resolved": "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz",
+      "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==",
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
+        "@jridgewell/trace-mapping": "0.3.9"
       },
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=12"
       }
     },
-    "node_modules/@babel/plugin-transform-private-property-in-object": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-property-in-object/-/plugin-transform-private-property-in-object-7.25.9.tgz",
-      "integrity": "sha512-Evf3kcMqzXA3xfYJmZ9Pg1OvKdtqsDMSWBDzZOPLvHiTt36E75jLDQo5w1gtRU95Q4E5PDttrTf25Fw8d/uWLw==",
-      "dev": true,
+    "node_modules/@cspotcode/source-map-support/node_modules/@jridgewell/trace-mapping": {
+      "version": "0.3.9",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz",
+      "integrity": "sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==",
+      "devOptional": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.25.9",
-        "@babel/helper-create-class-features-plugin": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "@jridgewell/resolve-uri": "^3.0.3",
+        "@jridgewell/sourcemap-codec": "^1.4.10"
       }
     },
-    "node_modules/@babel/plugin-transform-property-literals": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.25.9.tgz",
-      "integrity": "sha512-IvIUeV5KrS/VPavfSM/Iu+RE6llrHrYIKY1yfCzyO/lMXHQ+p7uGhonmGVisv6tSBSVgWzMBohTcvkC9vQcQFA==",
+    "node_modules/@emnapi/core": {
+      "version": "1.4.5",
+      "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.4.5.tgz",
+      "integrity": "sha512-XsLw1dEOpkSX/WucdqUhPWP7hDxSvZiY+fsUC14h+FtQ2Ifni4znbBt8punRX+Uj2JG/uDb8nEHVKvrVlvdZ5Q==",
       "dev": true,
       "license": "MIT",
+      "optional": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "@emnapi/wasi-threads": "1.0.4",
+        "tslib": "^2.4.0"
       }
     },
-    "node_modules/@babel/plugin-transform-regenerator": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.25.9.tgz",
-      "integrity": "sha512-vwDcDNsgMPDGP0nMqzahDWE5/MLcX8sv96+wfX7as7LoF/kr97Bo/7fI00lXY4wUXYfVmwIIyG80fGZ1uvt2qg==",
+    "node_modules/@emnapi/runtime": {
+      "version": "1.4.5",
+      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.4.5.tgz",
+      "integrity": "sha512-++LApOtY0pEEz1zrd9vy1/zXVaVJJ/EbAF3u0fXIzPJEDtnITsBGbbK0EkM72amhl/R5b+5xx0Y/QhcVOpuulg==",
       "dev": true,
       "license": "MIT",
+      "optional": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "regenerator-transform": "^0.15.2"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "tslib": "^2.4.0"
       }
     },
-    "node_modules/@babel/plugin-transform-regexp-modifiers": {
-      "version": "7.26.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regexp-modifiers/-/plugin-transform-regexp-modifiers-7.26.0.tgz",
-      "integrity": "sha512-vN6saax7lrA2yA/Pak3sCxuD6F5InBjn9IcrIKQPjpsLvuHYLVroTxjdlVRHjjBWxKOqIwpTXDkOssYT4BFdRw==",
+    "node_modules/@emnapi/wasi-threads": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.0.4.tgz",
+      "integrity": "sha512-PJR+bOmMOPH8AtcTGAyYNiuJ3/Fcoj2XN/gBEWzDIKh254XO+mM9XoXHk5GNEhodxeMznbg7BlRojVbKN+gC6g==",
       "dev": true,
       "license": "MIT",
+      "optional": true,
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
+        "tslib": "^2.4.0"
       }
     },
-    "node_modules/@babel/plugin-transform-reserved-words": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.25.9.tgz",
-      "integrity": "sha512-7DL7DKYjn5Su++4RXu8puKZm2XBPHyjWLUidaPEkCUBbE7IPcsrkRHggAOOKydH1dASWdcUBxrkOGNxUv5P3Jg==",
+    "node_modules/@esbuild/aix-ppc64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.25.5.tgz",
+      "integrity": "sha512-9o3TMmpmftaCMepOdA5k/yDw8SfInyzWWTjYTFCX3kPSDJMROQTb8jg+h9Cnwnmm1vOzvxN7gIfB5V2ewpjtGA==",
+      "cpu": [
+        "ppc64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
+      "optional": true,
+      "os": [
+        "aix"
+      ],
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/plugin-transform-runtime": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.26.9.tgz",
-      "integrity": "sha512-Jf+8y9wXQbbxvVYTM8gO5oEF2POdNji0NMltEkG7FtmzD9PVz7/lxpqSdTvwsjTMU5HIHuDVNf2SOxLkWi+wPQ==",
+    "node_modules/@esbuild/android-arm": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.25.5.tgz",
+      "integrity": "sha512-AdJKSPeEHgi7/ZhuIPtcQKr5RQdo6OO2IL87JkianiMYMPbCtot9fxPbrMiBADOWWm3T2si9stAiVsGbTQFkbA==",
+      "cpu": [
+        "arm"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-module-imports": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.26.5",
-        "babel-plugin-polyfill-corejs2": "^0.4.10",
-        "babel-plugin-polyfill-corejs3": "^0.10.6",
-        "babel-plugin-polyfill-regenerator": "^0.6.1",
-        "semver": "^6.3.1"
-      },
+      "optional": true,
+      "os": [
+        "android"
+      ],
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "node_modules/@babel/plugin-transform-runtime/node_modules/semver": {
-      "version": "6.3.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
-      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-      "dev": true,
-      "license": "ISC",
-      "bin": {
-        "semver": "bin/semver.js"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/plugin-transform-shorthand-properties": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.25.9.tgz",
-      "integrity": "sha512-MUv6t0FhO5qHnS/W8XCbHmiRWOphNufpE1IVxhK5kuN3Td9FT1x4rx4K42s3RYdMXCXpfWkGSbCSd0Z64xA7Ng==",
+    "node_modules/@esbuild/android-arm64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.25.5.tgz",
+      "integrity": "sha512-VGzGhj4lJO+TVGV1v8ntCZWJktV7SGCs3Pn1GRWI1SBFtRALoomm8k5E9Pmwg3HOAal2VDc2F9+PM/rEY6oIDg==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
+      "optional": true,
+      "os": [
+        "android"
+      ],
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/plugin-transform-spread": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.25.9.tgz",
-      "integrity": "sha512-oNknIB0TbURU5pqJFVbOOFspVlrpVwo2H1+HUIsVDvp5VauGGDP1ZEvO8Nn5xyMEs3dakajOxlmkNW7kNgSm6A==",
+    "node_modules/@esbuild/android-x64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.25.5.tgz",
+      "integrity": "sha512-D2GyJT1kjvO//drbRT3Hib9XPwQeWd9vZoBJn+bu/lVsOZ13cqNdDeqIF/xQ5/VmWvMduP6AmXvylO/PIc2isw==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.25.9"
-      },
+      "optional": true,
+      "os": [
+        "android"
+      ],
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/plugin-transform-sticky-regex": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.25.9.tgz",
-      "integrity": "sha512-WqBUSgeVwucYDP9U/xNRQam7xV8W5Zf+6Eo7T2SRVUFlhRiMNFdFz58u0KZmCVVqs2i7SHgpRnAhzRNmKfi2uA==",
-      "dev": true,
+    "node_modules/@esbuild/darwin-arm64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.25.5.tgz",
+      "integrity": "sha512-GtaBgammVvdF7aPIgH2jxMDdivezgFu6iKpmT+48+F8Hhg5J/sfnDieg0aeG/jfSvkYQU2/pceFPDKlqZzwnfQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/plugin-transform-template-literals": {
-      "version": "7.26.8",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.26.8.tgz",
-      "integrity": "sha512-OmGDL5/J0CJPJZTHZbi2XpO0tyT2Ia7fzpW5GURwdtp2X3fMmN8au/ej6peC/T33/+CRiIpA8Krse8hFGVmT5Q==",
+    "node_modules/@esbuild/darwin-x64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.25.5.tgz",
+      "integrity": "sha512-1iT4FVL0dJ76/q1wd7XDsXrSW+oLoquptvh4CLR4kITDtqi2e/xwXwdCVH8hVHU43wgJdsq7Gxuzcs6Iq/7bxQ==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.26.5"
-      },
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/plugin-transform-typeof-symbol": {
-      "version": "7.26.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.26.7.tgz",
-      "integrity": "sha512-jfoTXXZTgGg36BmhqT3cAYK5qkmqvJpvNrPhaK/52Vgjhw4Rq29s9UqpWWV0D6yuRmgiFH/BUVlkl96zJWqnaw==",
+    "node_modules/@esbuild/freebsd-arm64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.25.5.tgz",
+      "integrity": "sha512-nk4tGP3JThz4La38Uy/gzyXtpkPW8zSAmoUhK9xKKXdBCzKODMc2adkB2+8om9BDYugz+uGV7sLmpTYzvmz6Sw==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.26.5"
-      },
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/plugin-transform-unicode-escapes": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.25.9.tgz",
-      "integrity": "sha512-s5EDrE6bW97LtxOcGj1Khcx5AaXwiMmi4toFWRDP9/y0Woo6pXC+iyPu/KuhKtfSrNFd7jJB+/fkOtZy6aIC6Q==",
+    "node_modules/@esbuild/freebsd-x64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.25.5.tgz",
+      "integrity": "sha512-PrikaNjiXdR2laW6OIjlbeuCPrPaAl0IwPIaRv+SMV8CiM8i2LqVUHFC1+8eORgWyY7yhQY+2U2fA55mBzReaw==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/plugin-transform-unicode-property-regex": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-property-regex/-/plugin-transform-unicode-property-regex-7.25.9.tgz",
-      "integrity": "sha512-Jt2d8Ga+QwRluxRQ307Vlxa6dMrYEMZCgGxoPR8V52rxPyldHu3hdlHspxaqYmE7oID5+kB+UKUB/eWS+DkkWg==",
+    "node_modules/@esbuild/linux-arm": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.25.5.tgz",
+      "integrity": "sha512-cPzojwW2okgh7ZlRpcBEtsX7WBuqbLrNXqLU89GxWbNt6uIg78ET82qifUy3W6OVww6ZWobWub5oqZOVtwolfw==",
+      "cpu": [
+        "arm"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
+      "optional": true,
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/plugin-transform-unicode-regex": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.25.9.tgz",
-      "integrity": "sha512-yoxstj7Rg9dlNn9UQxzk4fcNivwv4nUYz7fYXBaKxvw/lnmPuOm/ikoELygbYq68Bls3D/D+NBPHiLwZdZZ4HA==",
+    "node_modules/@esbuild/linux-arm64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.25.5.tgz",
+      "integrity": "sha512-Z9kfb1v6ZlGbWj8EJk9T6czVEjjq2ntSYLY2cw6pAZl4oKtfgQuS4HOq41M/BcoLPzrUbNd+R4BXFyH//nHxVg==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
+      "optional": true,
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/plugin-transform-unicode-sets-regex": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-sets-regex/-/plugin-transform-unicode-sets-regex-7.25.9.tgz",
-      "integrity": "sha512-8BYqO3GeVNHtx69fdPshN3fnzUNLrWdHhk/icSwigksJGczKSizZ+Z6SBCxTs723Fr5VSNorTIK7a+R2tISvwQ==",
+    "node_modules/@esbuild/linux-ia32": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.25.5.tgz",
+      "integrity": "sha512-sQ7l00M8bSv36GLV95BVAdhJ2QsIbCuCjh/uYrWiMQSUuV+LpXwIqhgJDcvMTj+VsQmqAHL2yYaasENvJ7CDKA==",
+      "cpu": [
+        "ia32"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
-        "@babel/helper-plugin-utils": "^7.25.9"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0"
-      }
-    },
-    "node_modules/@babel/preset-env": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.26.9.tgz",
-      "integrity": "sha512-vX3qPGE8sEKEAZCWk05k3cpTAE3/nOYca++JA+Rd0z2NCNzabmYvEiSShKzm10zdquOIAVXsy2Ei/DTW34KlKQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/compat-data": "^7.26.8",
-        "@babel/helper-compilation-targets": "^7.26.5",
-        "@babel/helper-plugin-utils": "^7.26.5",
-        "@babel/helper-validator-option": "^7.25.9",
-        "@babel/plugin-bugfix-firefox-class-in-computed-class-key": "^7.25.9",
-        "@babel/plugin-bugfix-safari-class-field-initializer-scope": "^7.25.9",
-        "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": "^7.25.9",
-        "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": "^7.25.9",
-        "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": "^7.25.9",
-        "@babel/plugin-proposal-private-property-in-object": "7.21.0-placeholder-for-preset-env.2",
-        "@babel/plugin-syntax-import-assertions": "^7.26.0",
-        "@babel/plugin-syntax-import-attributes": "^7.26.0",
-        "@babel/plugin-syntax-unicode-sets-regex": "^7.18.6",
-        "@babel/plugin-transform-arrow-functions": "^7.25.9",
-        "@babel/plugin-transform-async-generator-functions": "^7.26.8",
-        "@babel/plugin-transform-async-to-generator": "^7.25.9",
-        "@babel/plugin-transform-block-scoped-functions": "^7.26.5",
-        "@babel/plugin-transform-block-scoping": "^7.25.9",
-        "@babel/plugin-transform-class-properties": "^7.25.9",
-        "@babel/plugin-transform-class-static-block": "^7.26.0",
-        "@babel/plugin-transform-classes": "^7.25.9",
-        "@babel/plugin-transform-computed-properties": "^7.25.9",
-        "@babel/plugin-transform-destructuring": "^7.25.9",
-        "@babel/plugin-transform-dotall-regex": "^7.25.9",
-        "@babel/plugin-transform-duplicate-keys": "^7.25.9",
-        "@babel/plugin-transform-duplicate-named-capturing-groups-regex": "^7.25.9",
-        "@babel/plugin-transform-dynamic-import": "^7.25.9",
-        "@babel/plugin-transform-exponentiation-operator": "^7.26.3",
-        "@babel/plugin-transform-export-namespace-from": "^7.25.9",
-        "@babel/plugin-transform-for-of": "^7.26.9",
-        "@babel/plugin-transform-function-name": "^7.25.9",
-        "@babel/plugin-transform-json-strings": "^7.25.9",
-        "@babel/plugin-transform-literals": "^7.25.9",
-        "@babel/plugin-transform-logical-assignment-operators": "^7.25.9",
-        "@babel/plugin-transform-member-expression-literals": "^7.25.9",
-        "@babel/plugin-transform-modules-amd": "^7.25.9",
-        "@babel/plugin-transform-modules-commonjs": "^7.26.3",
-        "@babel/plugin-transform-modules-systemjs": "^7.25.9",
-        "@babel/plugin-transform-modules-umd": "^7.25.9",
-        "@babel/plugin-transform-named-capturing-groups-regex": "^7.25.9",
-        "@babel/plugin-transform-new-target": "^7.25.9",
-        "@babel/plugin-transform-nullish-coalescing-operator": "^7.26.6",
-        "@babel/plugin-transform-numeric-separator": "^7.25.9",
-        "@babel/plugin-transform-object-rest-spread": "^7.25.9",
-        "@babel/plugin-transform-object-super": "^7.25.9",
-        "@babel/plugin-transform-optional-catch-binding": "^7.25.9",
-        "@babel/plugin-transform-optional-chaining": "^7.25.9",
-        "@babel/plugin-transform-parameters": "^7.25.9",
-        "@babel/plugin-transform-private-methods": "^7.25.9",
-        "@babel/plugin-transform-private-property-in-object": "^7.25.9",
-        "@babel/plugin-transform-property-literals": "^7.25.9",
-        "@babel/plugin-transform-regenerator": "^7.25.9",
-        "@babel/plugin-transform-regexp-modifiers": "^7.26.0",
-        "@babel/plugin-transform-reserved-words": "^7.25.9",
-        "@babel/plugin-transform-shorthand-properties": "^7.25.9",
-        "@babel/plugin-transform-spread": "^7.25.9",
-        "@babel/plugin-transform-sticky-regex": "^7.25.9",
-        "@babel/plugin-transform-template-literals": "^7.26.8",
-        "@babel/plugin-transform-typeof-symbol": "^7.26.7",
-        "@babel/plugin-transform-unicode-escapes": "^7.25.9",
-        "@babel/plugin-transform-unicode-property-regex": "^7.25.9",
-        "@babel/plugin-transform-unicode-regex": "^7.25.9",
-        "@babel/plugin-transform-unicode-sets-regex": "^7.25.9",
-        "@babel/preset-modules": "0.1.6-no-external-plugins",
-        "babel-plugin-polyfill-corejs2": "^0.4.10",
-        "babel-plugin-polyfill-corejs3": "^0.11.0",
-        "babel-plugin-polyfill-regenerator": "^0.6.1",
-        "core-js-compat": "^3.40.0",
-        "semver": "^6.3.1"
-      },
+      "optional": true,
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/preset-env/node_modules/babel-plugin-polyfill-corejs3": {
-      "version": "0.11.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.11.1.tgz",
-      "integrity": "sha512-yGCqvBT4rwMczo28xkH/noxJ6MZ4nJfkVYdoDaC/utLtWrXxv27HVrzAeSbqR8SxDsp46n0YF47EbHoixy6rXQ==",
+    "node_modules/@esbuild/linux-loong64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.25.5.tgz",
+      "integrity": "sha512-0ur7ae16hDUC4OL5iEnDb0tZHDxYmuQyhKhsPBV8f99f6Z9KQM02g33f93rNH5A30agMS46u2HP6qTdEt6Q1kg==",
+      "cpu": [
+        "loong64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-define-polyfill-provider": "^0.6.3",
-        "core-js-compat": "^3.40.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/preset-env/node_modules/semver": {
-      "version": "6.3.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
-      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
+    "node_modules/@esbuild/linux-mips64el": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.25.5.tgz",
+      "integrity": "sha512-kB/66P1OsHO5zLz0i6X0RxlQ+3cu0mkxS3TKFvkb5lin6uwZ/ttOkP3Z8lfR9mJOBk14ZwZ9182SIIWFGNmqmg==",
+      "cpu": [
+        "mips64el"
+      ],
       "dev": true,
-      "license": "ISC",
-      "bin": {
-        "semver": "bin/semver.js"
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/preset-modules": {
-      "version": "0.1.6-no-external-plugins",
-      "resolved": "https://registry.npmjs.org/@babel/preset-modules/-/preset-modules-0.1.6-no-external-plugins.tgz",
-      "integrity": "sha512-HrcgcIESLm9aIR842yhJ5RWan/gebQUJ6E/E5+rf0y9o6oj7w0Br+sWuL6kEQ/o/AdfvR1Je9jG18/gnpwjEyA==",
+    "node_modules/@esbuild/linux-ppc64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.25.5.tgz",
+      "integrity": "sha512-UZCmJ7r9X2fe2D6jBmkLBMQetXPXIsZjQJCjgwpVDz+YMcS6oFR27alkgGv3Oqkv07bxdvw7fyB71/olceJhkQ==",
+      "cpu": [
+        "ppc64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.0.0",
-        "@babel/types": "^7.4.4",
-        "esutils": "^2.0.2"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0 || ^8.0.0-0 <8.0.0"
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/runtime": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.26.9.tgz",
-      "integrity": "sha512-aA63XwOkcl4xxQa3HjPMqOP6LiK0ZDv3mUPYEFXkpHbaFjtGggE1A61FjFzJnB+p7/oy2gA8E+rcBNl/zC1tMg==",
+    "node_modules/@esbuild/linux-riscv64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.25.5.tgz",
+      "integrity": "sha512-kTxwu4mLyeOlsVIFPfQo+fQJAV9mh24xL+y+Bm6ej067sYANjyEw1dNHmvoqxJUCMnkBdKpvOn0Ahql6+4VyeA==",
+      "cpu": [
+        "riscv64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "regenerator-runtime": "^0.14.0"
-      },
+      "optional": true,
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/template": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.26.9.tgz",
-      "integrity": "sha512-qyRplbeIpNZhmzOysF/wFMuP9sctmh2cFzRAZOn1YapxBsE1i9bJIY586R/WBLfLcmcBlM8ROBiQURnnNy+zfA==",
+    "node_modules/@esbuild/linux-s390x": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.25.5.tgz",
+      "integrity": "sha512-K2dSKTKfmdh78uJ3NcWFiqyRrimfdinS5ErLSn3vluHNeHVnBAFWC8a4X5N+7FgVE1EjXS1QDZbpqZBjfrqMTQ==",
+      "cpu": [
+        "s390x"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/code-frame": "^7.26.2",
-        "@babel/parser": "^7.26.9",
-        "@babel/types": "^7.26.9"
-      },
+      "optional": true,
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/traverse": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.26.9.tgz",
-      "integrity": "sha512-ZYW7L+pL8ahU5fXmNbPF+iZFHCv5scFak7MZ9bwaRPLUhHh7QQEMjZUg0HevihoqCM5iSYHN61EyCoZvqC+bxg==",
+    "node_modules/@esbuild/linux-x64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.25.5.tgz",
+      "integrity": "sha512-uhj8N2obKTE6pSZ+aMUbqq+1nXxNjZIIjCjGLfsWvVpy7gKCOL6rsY1MhRh9zLtUtAI7vpgLMK6DxjO8Qm9lJw==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/code-frame": "^7.26.2",
-        "@babel/generator": "^7.26.9",
-        "@babel/parser": "^7.26.9",
-        "@babel/template": "^7.26.9",
-        "@babel/types": "^7.26.9",
-        "debug": "^4.3.1",
-        "globals": "^11.1.0"
-      },
+      "optional": true,
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=18"
       }
     },
-    "node_modules/@babel/types": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.9.tgz",
-      "integrity": "sha512-Y3IR1cRnOxOCDvMmNiym7XpXQ93iGDDPHx+Zj+NM+rg0fBaShfQLkg+hKPaZCEvg5N/LeCo4+Rj/i3FuJsIQaw==",
+    "node_modules/@esbuild/netbsd-arm64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.25.5.tgz",
+      "integrity": "sha512-pwHtMP9viAy1oHPvgxtOv+OkduK5ugofNTVDilIzBLpoWAM16r7b/mxBvfpuQDpRQFMfuVr5aLcn4yveGvBZvw==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@babel/helper-string-parser": "^7.25.9",
-        "@babel/helper-validator-identifier": "^7.25.9"
-      },
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
       "engines": {
-        "node": ">=6.9.0"
+        "node": ">=18"
       }
     },
-    "node_modules/@colors/colors": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/@colors/colors/-/colors-1.5.0.tgz",
-      "integrity": "sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==",
+    "node_modules/@esbuild/netbsd-x64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.25.5.tgz",
+      "integrity": "sha512-WOb5fKrvVTRMfWFNCroYWWklbnXH0Q5rZppjq0vQIdlsQKuw6mdSihwSo4RV/YdQ5UCKKvBy7/0ZZYLBZKIbwQ==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
       "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
       "engines": {
-        "node": ">=0.1.90"
+        "node": ">=18"
       }
     },
-    "node_modules/@cspotcode/source-map-support": {
-      "version": "0.8.1",
-      "resolved": "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz",
-      "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==",
-      "devOptional": true,
+    "node_modules/@esbuild/openbsd-arm64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.25.5.tgz",
+      "integrity": "sha512-7A208+uQKgTxHd0G0uqZO8UjK2R0DDb4fDmERtARjSHWxqMTye4Erz4zZafx7Di9Cv+lNHYuncAkiGFySoD+Mw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@jridgewell/trace-mapping": "0.3.9"
-      },
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
-    "node_modules/@cspotcode/source-map-support/node_modules/@jridgewell/trace-mapping": {
-      "version": "0.3.9",
-      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz",
-      "integrity": "sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==",
-      "devOptional": true,
+    "node_modules/@esbuild/openbsd-x64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.25.5.tgz",
+      "integrity": "sha512-G4hE405ErTWraiZ8UiSoesH8DaCsMm0Cay4fsFWOOUcz8b8rC6uCvnagr+gnioEjWn0wC+o1/TAHt+It+MpIMg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@jridgewell/resolve-uri": "^3.0.3",
-        "@jridgewell/sourcemap-codec": "^1.4.10"
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=18"
       }
     },
-    "node_modules/@discoveryjs/json-ext": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/@discoveryjs/json-ext/-/json-ext-0.6.3.tgz",
-      "integrity": "sha512-4B4OijXeVNOPZlYA2oEwWOTkzyltLao+xbotHQeqN++Rv27Y6s818+n2Qkp8q+Fxhn0t/5lA5X1Mxktud8eayQ==",
+    "node_modules/@esbuild/sunos-x64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.25.5.tgz",
+      "integrity": "sha512-l+azKShMy7FxzY0Rj4RCt5VD/q8mG/e+mDivgspo+yL8zW7qEwctQ6YqKX34DTEleFAvCIUviCFX1SDZRSyMQA==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
       "license": "MIT",
+      "optional": true,
+      "os": [
+        "sunos"
+      ],
       "engines": {
-        "node": ">=14.17.0"
+        "node": ">=18"
       }
     },
-    "node_modules/@esbuild/darwin-arm64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.25.0.tgz",
-      "integrity": "sha512-mVwdUb5SRkPayVadIOI78K7aAnPamoeFR2bT5nszFUZ9P8UpK4ratOdYbZZXYSqPKMHfS1wdHCJk1P1EZpRdvw==",
+    "node_modules/@esbuild/win32-arm64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.25.5.tgz",
+      "integrity": "sha512-O2S7SNZzdcFG7eFKgvwUEZ2VG9D/sn/eIiz8XRZ1Q/DO5a3s76Xv0mdBzVM5j5R639lXQmPmSo0iRpHqUUrsxw==",
       "cpu": [
         "arm64"
       ],
@@ -2487,46 +2354,308 @@
       "license": "MIT",
       "optional": true,
       "os": [
-        "darwin"
+        "win32"
       ],
       "engines": {
         "node": ">=18"
       }
     },
-    "node_modules/@faker-js/faker": {
-      "version": "8.4.1",
-      "resolved": "https://registry.npmjs.org/@faker-js/faker/-/faker-8.4.1.tgz",
-      "integrity": "sha512-XQ3cU+Q8Uqmrbf2e0cIC/QN43sTBSC8KF12u29Mb47tWrt2hAgBXSgpZMj4Ao8Uk0iJcU99QsOCaIL8934obCg==",
-      "dev": true,
-      "funding": [
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/fakerjs"
-        }
+    "node_modules/@esbuild/win32-ia32": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.25.5.tgz",
+      "integrity": "sha512-onOJ02pqs9h1iMJ1PQphR+VZv8qBMQ77Klcsqv9CNW2w6yLqoURLcgERAIurY6QE63bbLuqgP9ATqajFLK5AMQ==",
+      "cpu": [
+        "ia32"
       ],
+      "dev": true,
       "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
       "engines": {
-        "node": "^14.17.0 || ^16.13.0 || >=18.0.0",
-        "npm": ">=6.14.13"
+        "node": ">=18"
       }
     },
-    "node_modules/@glideapps/ts-necessities": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/@glideapps/ts-necessities/-/ts-necessities-2.2.3.tgz",
-      "integrity": "sha512-gXi0awOZLHk3TbW55GZLCPP6O+y/b5X1pBXKBVckFONSwF1z1E5ND2BGJsghQFah+pW7pkkyFb2VhUQI2qhL5w==",
+    "node_modules/@esbuild/win32-x64": {
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.25.5.tgz",
+      "integrity": "sha512-TXv6YnJ8ZMVdX+SXWVBo/0p8LTcrUYngpWjvm91TMjjBQii7Oz11Lw5lbDV5Y0TzuhSJHwiH4hEtC1I42mMS0g==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
     },
-    "node_modules/@inquirer/checkbox": {
-      "version": "4.1.3",
-      "resolved": "https://registry.npmjs.org/@inquirer/checkbox/-/checkbox-4.1.3.tgz",
-      "integrity": "sha512-KU1MGwf24iABJjGESxhyj+/rlQYSRoCfcuHDEHXfZ1DENmbuSRfyrUb+LLjHoee5TNOFKwaFxDXc5/zRwJUPMQ==",
+    "node_modules/@eslint-community/eslint-utils": {
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.7.0.tgz",
+      "integrity": "sha512-dyybb3AcajC7uha6CvhdVRJqaKyn7w2YKqKyAN37NKYgZT36w+iRb0Dymmc5qEJ549c/S31cMMSFd75bteCpCw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^10.1.8",
-        "@inquirer/figures": "^1.0.11",
-        "@inquirer/type": "^3.0.5",
+        "eslint-visitor-keys": "^3.4.3"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^6.0.0 || ^7.0.0 || >=8.0.0"
+      }
+    },
+    "node_modules/@eslint-community/regexpp": {
+      "version": "4.12.1",
+      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.12.1.tgz",
+      "integrity": "sha512-CCZCDJuduB9OUkFkY2IgppNZMi2lBQgD2qzwXkEia16cge2pijY/aXi96CJMquDMn3nJdlPV1A5KrJEXwfLNzQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.0.0 || ^14.0.0 || >=16.0.0"
+      }
+    },
+    "node_modules/@eslint/config-array": {
+      "version": "0.21.0",
+      "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.21.0.tgz",
+      "integrity": "sha512-ENIdc4iLu0d93HeYirvKmrzshzofPw6VkZRKQGe9Nv46ZnWUzcF1xV01dcvEg/1wXUR61OmmlSfyeyO7EvjLxQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@eslint/object-schema": "^2.1.6",
+        "debug": "^4.3.1",
+        "minimatch": "^3.1.2"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/config-helpers": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.3.1.tgz",
+      "integrity": "sha512-xR93k9WhrDYpXHORXpxVL5oHj3Era7wo6k/Wd8/IsQNnZUTzkGS29lyn3nAT05v6ltUuTFVCCYDEGfy2Or/sPA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/core": {
+      "version": "0.15.2",
+      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.15.2.tgz",
+      "integrity": "sha512-78Md3/Rrxh83gCxoUc0EiciuOHsIITzLy53m3d9UyiW8y9Dj2D29FeETqyKA+BRK76tnTp6RXWb3pCay8Oyomg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@types/json-schema": "^7.0.15"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/eslintrc": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.3.1.tgz",
+      "integrity": "sha512-gtF186CXhIl1p4pJNGZw8Yc6RlshoePRvE0X91oPGb3vZ8pM3qOS9W9NGPat9LziaBV7XrJWGylNQXkGcnM3IQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ajv": "^6.12.4",
+        "debug": "^4.3.2",
+        "espree": "^10.0.1",
+        "globals": "^14.0.0",
+        "ignore": "^5.2.0",
+        "import-fresh": "^3.2.1",
+        "js-yaml": "^4.1.0",
+        "minimatch": "^3.1.2",
+        "strip-json-comments": "^3.1.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/@eslint/eslintrc/node_modules/ajv": {
+      "version": "6.12.6",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
+      "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.1",
+        "fast-json-stable-stringify": "^2.0.0",
+        "json-schema-traverse": "^0.4.1",
+        "uri-js": "^4.2.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
+    "node_modules/@eslint/eslintrc/node_modules/ignore": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
+      "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/@eslint/eslintrc/node_modules/json-schema-traverse": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@eslint/js": {
+      "version": "9.33.0",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.33.0.tgz",
+      "integrity": "sha512-5K1/mKhWaMfreBGJTwval43JJmkip0RmM+3+IuqupeSKNC/Th2Kc7ucaq5ovTSra/OOKB9c58CGSz3QMVbWt0A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://eslint.org/donate"
+      }
+    },
+    "node_modules/@eslint/object-schema": {
+      "version": "2.1.6",
+      "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-2.1.6.tgz",
+      "integrity": "sha512-RBMg5FRL0I0gs51M/guSAj5/e14VQ4tpZnQNWwuDT66P14I43ItmPfIZRhO9fUVIPOAQXU47atlywZ/czoqFPA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/plugin-kit": {
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.3.5.tgz",
+      "integrity": "sha512-Z5kJ+wU3oA7MMIqVR9tyZRtjYPr4OC004Q4Rw7pgOKUOKkJfZ3O24nz3WYfGRpMDNmcOi3TwQOmgm7B7Tpii0w==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@eslint/core": "^0.15.2",
+        "levn": "^0.4.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@faker-js/faker": {
+      "version": "8.4.1",
+      "resolved": "https://registry.npmjs.org/@faker-js/faker/-/faker-8.4.1.tgz",
+      "integrity": "sha512-XQ3cU+Q8Uqmrbf2e0cIC/QN43sTBSC8KF12u29Mb47tWrt2hAgBXSgpZMj4Ao8Uk0iJcU99QsOCaIL8934obCg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/fakerjs"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": "^14.17.0 || ^16.13.0 || >=18.0.0",
+        "npm": ">=6.14.13"
+      }
+    },
+    "node_modules/@glideapps/ts-necessities": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/@glideapps/ts-necessities/-/ts-necessities-2.2.3.tgz",
+      "integrity": "sha512-gXi0awOZLHk3TbW55GZLCPP6O+y/b5X1pBXKBVckFONSwF1z1E5ND2BGJsghQFah+pW7pkkyFb2VhUQI2qhL5w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@humanfs/core": {
+      "version": "0.19.1",
+      "resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.1.tgz",
+      "integrity": "sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18.18.0"
+      }
+    },
+    "node_modules/@humanfs/node": {
+      "version": "0.16.6",
+      "resolved": "https://registry.npmjs.org/@humanfs/node/-/node-0.16.6.tgz",
+      "integrity": "sha512-YuI2ZHQL78Q5HbhDiBA1X4LmYdXCKCMQIfw0pw7piHJwyREFebJUvrQN4cMssyES6x+vfUbx1CIpaQUKYdQZOw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@humanfs/core": "^0.19.1",
+        "@humanwhocodes/retry": "^0.3.0"
+      },
+      "engines": {
+        "node": ">=18.18.0"
+      }
+    },
+    "node_modules/@humanfs/node/node_modules/@humanwhocodes/retry": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.3.1.tgz",
+      "integrity": "sha512-JBxkERygn7Bv/GbN5Rv8Ul6LVknS+5Bp6RgDC/O8gEBU/yeH5Ui5C/OlWrTb6qct7LjjfT6Re2NxB0ln0yYybA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18.18"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/nzakas"
+      }
+    },
+    "node_modules/@humanwhocodes/module-importer": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz",
+      "integrity": "sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=12.22"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/nzakas"
+      }
+    },
+    "node_modules/@humanwhocodes/retry": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.4.3.tgz",
+      "integrity": "sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18.18"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/nzakas"
+      }
+    },
+    "node_modules/@inquirer/checkbox": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@inquirer/checkbox/-/checkbox-4.2.1.tgz",
+      "integrity": "sha512-bevKGO6kX1eM/N+pdh9leS5L7TBF4ICrzi9a+cbWkrxeAeIcwlo/7OfWGCDERdRCI2/Q6tjltX4bt07ALHDwFw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^10.1.15",
+        "@inquirer/figures": "^1.0.13",
+        "@inquirer/type": "^3.0.8",
         "ansi-escapes": "^4.3.2",
         "yoctocolors-cjs": "^2.1.2"
       },
@@ -2543,14 +2672,14 @@
       }
     },
     "node_modules/@inquirer/confirm": {
-      "version": "5.1.6",
-      "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-5.1.6.tgz",
-      "integrity": "sha512-6ZXYK3M1XmaVBZX6FCfChgtponnL0R6I7k8Nu+kaoNkT828FVZTcca1MqmWQipaW2oNREQl5AaPCUOOCVNdRMw==",
+      "version": "5.1.13",
+      "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-5.1.13.tgz",
+      "integrity": "sha512-EkCtvp67ICIVVzjsquUiVSd+V5HRGOGQfsqA4E4vMWhYnB7InUL0pa0TIWt1i+OfP16Gkds8CdIu6yGZwOM1Yw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^10.1.7",
-        "@inquirer/type": "^3.0.4"
+        "@inquirer/core": "^10.1.14",
+        "@inquirer/type": "^3.0.7"
       },
       "engines": {
         "node": ">=18"
@@ -2565,14 +2694,14 @@
       }
     },
     "node_modules/@inquirer/core": {
-      "version": "10.1.8",
-      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-10.1.8.tgz",
-      "integrity": "sha512-HpAqR8y715zPpM9e/9Q+N88bnGwqqL8ePgZ0SMv/s3673JLMv3bIkoivGmjPqXlEgisUksSXibweQccUwEx4qQ==",
+      "version": "10.1.15",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-10.1.15.tgz",
+      "integrity": "sha512-8xrp836RZvKkpNbVvgWUlxjT4CraKk2q+I3Ksy+seI2zkcE+y6wNs1BVhgcv8VyImFecUhdQrYLdW32pAjwBdA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/figures": "^1.0.11",
-        "@inquirer/type": "^3.0.5",
+        "@inquirer/figures": "^1.0.13",
+        "@inquirer/type": "^3.0.8",
         "ansi-escapes": "^4.3.2",
         "cli-width": "^4.1.0",
         "mute-stream": "^2.0.0",
@@ -2593,15 +2722,15 @@
       }
     },
     "node_modules/@inquirer/editor": {
-      "version": "4.2.8",
-      "resolved": "https://registry.npmjs.org/@inquirer/editor/-/editor-4.2.8.tgz",
-      "integrity": "sha512-UkGKbMFlQw5k4ZLjDwEi5z8NIVlP/3DAlLHta0o0pSsdpPThNmPtUL8mvGCHUaQtR+QrxR9yRYNWgKMsHkfIUA==",
+      "version": "4.2.17",
+      "resolved": "https://registry.npmjs.org/@inquirer/editor/-/editor-4.2.17.tgz",
+      "integrity": "sha512-r6bQLsyPSzbWrZZ9ufoWL+CztkSatnJ6uSxqd6N+o41EZC51sQeWOzI6s5jLb+xxTWxl7PlUppqm8/sow241gg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^10.1.8",
-        "@inquirer/type": "^3.0.5",
-        "external-editor": "^3.1.0"
+        "@inquirer/core": "^10.1.15",
+        "@inquirer/external-editor": "^1.0.1",
+        "@inquirer/type": "^3.0.8"
       },
       "engines": {
         "node": ">=18"
@@ -2616,14 +2745,14 @@
       }
     },
     "node_modules/@inquirer/expand": {
-      "version": "4.0.10",
-      "resolved": "https://registry.npmjs.org/@inquirer/expand/-/expand-4.0.10.tgz",
-      "integrity": "sha512-leyBouGJ77ggv51Jb/OJmLGGnU2HYc13MZ2iiPNLwe2VgFgZPVqsrRWSa1RAHKyazjOyvSNKLD1B2K7A/iWi1g==",
+      "version": "4.0.17",
+      "resolved": "https://registry.npmjs.org/@inquirer/expand/-/expand-4.0.17.tgz",
+      "integrity": "sha512-PSqy9VmJx/VbE3CT453yOfNa+PykpKg/0SYP7odez1/NWBGuDXgPhp4AeGYYKjhLn5lUUavVS/JbeYMPdH50Mw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^10.1.8",
-        "@inquirer/type": "^3.0.5",
+        "@inquirer/core": "^10.1.15",
+        "@inquirer/type": "^3.0.8",
         "yoctocolors-cjs": "^2.1.2"
       },
       "engines": {
@@ -2638,10 +2767,52 @@
         }
       }
     },
+    "node_modules/@inquirer/external-editor": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@inquirer/external-editor/-/external-editor-1.0.1.tgz",
+      "integrity": "sha512-Oau4yL24d2B5IL4ma4UpbQigkVhzPDXLoqy1ggK4gnHg/stmkffJE4oOXHXF3uz0UEpywG68KcyXsyYpA1Re/Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chardet": "^2.1.0",
+        "iconv-lite": "^0.6.3"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/external-editor/node_modules/chardet": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/chardet/-/chardet-2.1.0.tgz",
+      "integrity": "sha512-bNFETTG/pM5ryzQ9Ad0lJOTa6HWD/YsScAR3EnCPZRPlQh77JocYktSHOUHelyhm8IARL+o4c4F1bP5KVOjiRA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@inquirer/external-editor/node_modules/iconv-lite": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
+      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/@inquirer/figures": {
-      "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/@inquirer/figures/-/figures-1.0.11.tgz",
-      "integrity": "sha512-eOg92lvrn/aRUqbxRyvpEWnrvRuTYRifixHkYVpJiygTgVSBIHDqLh0SrMQXkafvULg3ck11V7xvR+zcgvpHFw==",
+      "version": "1.0.13",
+      "resolved": "https://registry.npmjs.org/@inquirer/figures/-/figures-1.0.13.tgz",
+      "integrity": "sha512-lGPVU3yO9ZNqA7vTYz26jny41lE7yoQansmqdMLBEfqaGsmdg7V3W9mK9Pvb5IL4EVZ9GnSDGMO/cJXud5dMaw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2649,14 +2820,14 @@
       }
     },
     "node_modules/@inquirer/input": {
-      "version": "4.1.7",
-      "resolved": "https://registry.npmjs.org/@inquirer/input/-/input-4.1.7.tgz",
-      "integrity": "sha512-rCQAipJNA14UTH84df/z4jDJ9LZ54H6zzuCAi7WZ0qVqx3CSqLjfXAMd5cpISIxbiHVJCPRB81gZksq6CZsqDg==",
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@inquirer/input/-/input-4.2.1.tgz",
+      "integrity": "sha512-tVC+O1rBl0lJpoUZv4xY+WGWY8V5b0zxU1XDsMsIHYregdh7bN5X5QnIONNBAl0K765FYlAfNHS2Bhn7SSOVow==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^10.1.8",
-        "@inquirer/type": "^3.0.5"
+        "@inquirer/core": "^10.1.15",
+        "@inquirer/type": "^3.0.8"
       },
       "engines": {
         "node": ">=18"
@@ -2671,14 +2842,14 @@
       }
     },
     "node_modules/@inquirer/number": {
-      "version": "3.0.10",
-      "resolved": "https://registry.npmjs.org/@inquirer/number/-/number-3.0.10.tgz",
-      "integrity": "sha512-GLsdnxzNefjCJUmWyjaAuNklHgDpCTL4RMllAVhVvAzBwRW9g38eZ5tWgzo1lirtSDTpsh593hqXVhxvdrjfwA==",
+      "version": "3.0.17",
+      "resolved": "https://registry.npmjs.org/@inquirer/number/-/number-3.0.17.tgz",
+      "integrity": "sha512-GcvGHkyIgfZgVnnimURdOueMk0CztycfC8NZTiIY9arIAkeOgt6zG57G+7vC59Jns3UX27LMkPKnKWAOF5xEYg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^10.1.8",
-        "@inquirer/type": "^3.0.5"
+        "@inquirer/core": "^10.1.15",
+        "@inquirer/type": "^3.0.8"
       },
       "engines": {
         "node": ">=18"
@@ -2693,14 +2864,14 @@
       }
     },
     "node_modules/@inquirer/password": {
-      "version": "4.0.10",
-      "resolved": "https://registry.npmjs.org/@inquirer/password/-/password-4.0.10.tgz",
-      "integrity": "sha512-JC538ujqeYKkFqLoWZ0ILBteIUO2yajBMVEUZSxjl9x6fiEQtM+I5Rca7M2D8edMDbyHLnXifGH1hJZdh8V5rA==",
+      "version": "4.0.17",
+      "resolved": "https://registry.npmjs.org/@inquirer/password/-/password-4.0.17.tgz",
+      "integrity": "sha512-DJolTnNeZ00E1+1TW+8614F7rOJJCM4y4BAGQ3Gq6kQIG+OJ4zr3GLjIjVVJCbKsk2jmkmv6v2kQuN/vriHdZA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^10.1.8",
-        "@inquirer/type": "^3.0.5",
+        "@inquirer/core": "^10.1.15",
+        "@inquirer/type": "^3.0.8",
         "ansi-escapes": "^4.3.2"
       },
       "engines": {
@@ -2716,22 +2887,22 @@
       }
     },
     "node_modules/@inquirer/prompts": {
-      "version": "7.3.2",
-      "resolved": "https://registry.npmjs.org/@inquirer/prompts/-/prompts-7.3.2.tgz",
-      "integrity": "sha512-G1ytyOoHh5BphmEBxSwALin3n1KGNYB6yImbICcRQdzXfOGbuJ9Jske/Of5Sebk339NSGGNfUshnzK8YWkTPsQ==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/prompts/-/prompts-7.6.0.tgz",
+      "integrity": "sha512-jAhL7tyMxB3Gfwn4HIJ0yuJ5pvcB5maYUcouGcgd/ub79f9MqZ+aVnBtuFf+VC2GTkCBF+R+eo7Vi63w5VZlzw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/checkbox": "^4.1.2",
-        "@inquirer/confirm": "^5.1.6",
-        "@inquirer/editor": "^4.2.7",
-        "@inquirer/expand": "^4.0.9",
-        "@inquirer/input": "^4.1.6",
-        "@inquirer/number": "^3.0.9",
-        "@inquirer/password": "^4.0.9",
-        "@inquirer/rawlist": "^4.0.9",
-        "@inquirer/search": "^3.0.9",
-        "@inquirer/select": "^4.0.9"
+        "@inquirer/checkbox": "^4.1.9",
+        "@inquirer/confirm": "^5.1.13",
+        "@inquirer/editor": "^4.2.14",
+        "@inquirer/expand": "^4.0.16",
+        "@inquirer/input": "^4.2.0",
+        "@inquirer/number": "^3.0.16",
+        "@inquirer/password": "^4.0.16",
+        "@inquirer/rawlist": "^4.1.4",
+        "@inquirer/search": "^3.0.16",
+        "@inquirer/select": "^4.2.4"
       },
       "engines": {
         "node": ">=18"
@@ -2746,14 +2917,14 @@
       }
     },
     "node_modules/@inquirer/rawlist": {
-      "version": "4.0.10",
-      "resolved": "https://registry.npmjs.org/@inquirer/rawlist/-/rawlist-4.0.10.tgz",
-      "integrity": "sha512-vOQbQkmhaCsF2bUmjoyRSZJBz77UnIF/F3ZS2LMgwbgyaG2WgwKHh0WKNj0APDB72WDbZijhW5nObQbk+TnbcA==",
+      "version": "4.1.5",
+      "resolved": "https://registry.npmjs.org/@inquirer/rawlist/-/rawlist-4.1.5.tgz",
+      "integrity": "sha512-R5qMyGJqtDdi4Ht521iAkNqyB6p2UPuZUbMifakg1sWtu24gc2Z8CJuw8rP081OckNDMgtDCuLe42Q2Kr3BolA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^10.1.8",
-        "@inquirer/type": "^3.0.5",
+        "@inquirer/core": "^10.1.15",
+        "@inquirer/type": "^3.0.8",
         "yoctocolors-cjs": "^2.1.2"
       },
       "engines": {
@@ -2769,15 +2940,15 @@
       }
     },
     "node_modules/@inquirer/search": {
-      "version": "3.0.10",
-      "resolved": "https://registry.npmjs.org/@inquirer/search/-/search-3.0.10.tgz",
-      "integrity": "sha512-EAVKAz6P1LajZOdoL+R+XC3HJYSU261fbJzO4fCkJJ7UPFcm+nP+gzC+DDZWsb2WK9PQvKsnaKiNKsY8B6dBWQ==",
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/search/-/search-3.1.0.tgz",
+      "integrity": "sha512-PMk1+O/WBcYJDq2H7foV0aAZSmDdkzZB9Mw2v/DmONRJopwA/128cS9M/TXWLKKdEQKZnKwBzqu2G4x/2Nqx8Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^10.1.8",
-        "@inquirer/figures": "^1.0.11",
-        "@inquirer/type": "^3.0.5",
+        "@inquirer/core": "^10.1.15",
+        "@inquirer/figures": "^1.0.13",
+        "@inquirer/type": "^3.0.8",
         "yoctocolors-cjs": "^2.1.2"
       },
       "engines": {
@@ -2793,15 +2964,15 @@
       }
     },
     "node_modules/@inquirer/select": {
-      "version": "4.0.10",
-      "resolved": "https://registry.npmjs.org/@inquirer/select/-/select-4.0.10.tgz",
-      "integrity": "sha512-Tg8S9nESnCfISu5tCZSuXpXq0wHuDVimj7xyHstABgR34zcJnLdq/VbjB2mdZvNAMAehYBnNzSjxB06UE8LLAA==",
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/@inquirer/select/-/select-4.3.1.tgz",
+      "integrity": "sha512-Gfl/5sqOF5vS/LIrSndFgOh7jgoe0UXEizDqahFRkq5aJBLegZ6WjuMh/hVEJwlFQjyLq1z9fRtvUMkb7jM1LA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^10.1.8",
-        "@inquirer/figures": "^1.0.11",
-        "@inquirer/type": "^3.0.5",
+        "@inquirer/core": "^10.1.15",
+        "@inquirer/figures": "^1.0.13",
+        "@inquirer/type": "^3.0.8",
         "ansi-escapes": "^4.3.2",
         "yoctocolors-cjs": "^2.1.2"
       },
@@ -2818,9 +2989,9 @@
       }
     },
     "node_modules/@inquirer/type": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-3.0.5.tgz",
-      "integrity": "sha512-ZJpeIYYueOz/i/ONzrfof8g89kNdO2hjGuvULROo3O8rlB2CRtSseE5KeirnyE4t/thAn/EwvS/vuQeJCn+NZg==",
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-3.0.8.tgz",
+      "integrity": "sha512-lg9Whz8onIHRthWaN1Q9EGLa/0LFJjyM8mEUbL1eTi6yMGvBf8gvyDLtxSXztQsxMvhxxNpJYrwa1YHdq+w4Jw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2835,6 +3006,29 @@
         }
       }
     },
+    "node_modules/@isaacs/balanced-match": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/@isaacs/balanced-match/-/balanced-match-4.0.1.tgz",
+      "integrity": "sha512-yzMTt9lEb8Gv7zRioUilSglI0c0smZ9k5D65677DLWLtWJaXIS3CqcGyUFByYKlnUj6TkjLVs54fBl6+TiGQDQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/@isaacs/brace-expansion": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/@isaacs/brace-expansion/-/brace-expansion-5.0.0.tgz",
+      "integrity": "sha512-ZT55BDLV0yv0RBm2czMiZ+SqCGO7AvmOM3G/w2xhVPH+te0aKgFjmBvGlL1dH+ql2tgGO3MVrbb3jCKyvpgnxA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@isaacs/balanced-match": "^4.0.1"
+      },
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
     "node_modules/@isaacs/cliui": {
       "version": "8.0.2",
       "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
@@ -2928,17 +3122,13 @@
       }
     },
     "node_modules/@jridgewell/gen-mapping": {
-      "version": "0.3.8",
-      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz",
-      "integrity": "sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==",
+      "version": "0.3.13",
+      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",
+      "integrity": "sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==",
       "license": "MIT",
       "dependencies": {
-        "@jridgewell/set-array": "^1.2.1",
-        "@jridgewell/sourcemap-codec": "^1.4.10",
+        "@jridgewell/sourcemap-codec": "^1.5.0",
         "@jridgewell/trace-mapping": "^0.3.24"
-      },
-      "engines": {
-        "node": ">=6.0.0"
       }
     },
     "node_modules/@jridgewell/resolve-uri": {
@@ -2950,21 +3140,13 @@
         "node": ">=6.0.0"
       }
     },
-    "node_modules/@jridgewell/set-array": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
-      "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=6.0.0"
-      }
-    },
     "node_modules/@jridgewell/source-map": {
       "version": "0.3.6",
       "resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.6.tgz",
       "integrity": "sha512-1ZJTZebgqllO79ue2bm3rIGud/bOe0pP5BjSRCRxxYkEZS8STV7zN84UBbiYu7jy+eCKSnVIUgoWWE/tt+shMQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@jridgewell/gen-mapping": "^0.3.5",
         "@jridgewell/trace-mapping": "^0.3.25"
@@ -2977,72 +3159,15 @@
       "license": "MIT"
     },
     "node_modules/@jridgewell/trace-mapping": {
-      "version": "0.3.25",
-      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
-      "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
+      "version": "0.3.30",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.30.tgz",
+      "integrity": "sha512-GQ7Nw5G2lTu/BtHTKfXhKHok2WGetd4XYcVKGx00SjAk8GMwgJM3zr6zORiPGuOE+/vkc90KtTosSSvaCjKb2Q==",
       "license": "MIT",
       "dependencies": {
         "@jridgewell/resolve-uri": "^3.1.0",
         "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
-    "node_modules/@jsonjoy.com/base64": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/base64/-/base64-1.1.2.tgz",
-      "integrity": "sha512-q6XAnWQDIMA3+FTiOYajoYqySkO+JSat0ytXGSuRdq9uXE7o92gzuQwQM14xaCRlBLGq3v5miDGC4vkVTn54xA==",
-      "dev": true,
-      "license": "Apache-2.0",
-      "engines": {
-        "node": ">=10.0"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/streamich"
-      },
-      "peerDependencies": {
-        "tslib": "2"
-      }
-    },
-    "node_modules/@jsonjoy.com/json-pack": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/json-pack/-/json-pack-1.2.0.tgz",
-      "integrity": "sha512-io1zEbbYcElht3tdlqEOFxZ0dMTYrHz9iMf0gqn1pPjZFTCgM5R4R5IMA20Chb2UPYYsxjzs8CgZ7Nb5n2K2rA==",
-      "dev": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@jsonjoy.com/base64": "^1.1.1",
-        "@jsonjoy.com/util": "^1.1.2",
-        "hyperdyperid": "^1.2.0",
-        "thingies": "^1.20.0"
-      },
-      "engines": {
-        "node": ">=10.0"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/streamich"
-      },
-      "peerDependencies": {
-        "tslib": "2"
-      }
-    },
-    "node_modules/@jsonjoy.com/util": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/util/-/util-1.5.0.tgz",
-      "integrity": "sha512-ojoNsrIuPI9g6o8UxhraZQSyF2ByJanAY4cTFbc8Mf2AXEF4aQRGY1dJxyJpuyav8r9FGflEt/Ff3u5Nt6YMPA==",
-      "dev": true,
-      "license": "Apache-2.0",
-      "engines": {
-        "node": ">=10.0"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/streamich"
-      },
-      "peerDependencies": {
-        "tslib": "2"
-      }
-    },
     "node_modules/@langchain/core": {
       "version": "0.2.36",
       "resolved": "https://registry.npmjs.org/@langchain/core/-/core-0.2.36.tgz",
@@ -3181,8 +3306,18 @@
         "node": ">=18"
       }
     },
-    "node_modules/@langchain/openai/node_modules/node-fetch": {
-      "version": "2.7.0",
+    "node_modules/@langchain/openai/node_modules/@types/node": {
+      "version": "18.19.123",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-18.19.123.tgz",
+      "integrity": "sha512-K7DIaHnh0mzVxreCR9qwgNxp3MH9dltPNIEddW9MYUlcKAzm+3grKNSTe2vCJHI1FaLpvpL5JGJrz1UZDKYvDg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": "~5.26.4"
+      }
+    },
+    "node_modules/@langchain/openai/node_modules/node-fetch": {
+      "version": "2.7.0",
       "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.7.0.tgz",
       "integrity": "sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==",
       "dev": true,
@@ -3233,6 +3368,13 @@
         }
       }
     },
+    "node_modules/@langchain/openai/node_modules/undici-types": {
+      "version": "5.26.5",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
+      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@langchain/openai/node_modules/ws": {
       "version": "8.18.2",
       "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.2.tgz",
@@ -3257,17 +3399,10 @@
         }
       }
     },
-    "node_modules/@leichtgewicht/ip-codec": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.5.tgz",
-      "integrity": "sha512-Vo+PSpZG2/fmgmiNzYK9qWRh8h/CHrwD0mo1h1DzL4yzHNSfWYujGTYsWGreD000gcgmZ7K4Ys6Tx9TxtsKdDw==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/@listr2/prompt-adapter-inquirer": {
-      "version": "2.0.18",
-      "resolved": "https://registry.npmjs.org/@listr2/prompt-adapter-inquirer/-/prompt-adapter-inquirer-2.0.18.tgz",
-      "integrity": "sha512-0hz44rAcrphyXcA8IS7EJ2SCoaBZD2u5goE8S/e+q/DL+dOGpqpcLidVOFeLG3VgML62SXmfRLAhWt0zL1oW4Q==",
+      "version": "2.0.22",
+      "resolved": "https://registry.npmjs.org/@listr2/prompt-adapter-inquirer/-/prompt-adapter-inquirer-2.0.22.tgz",
+      "integrity": "sha512-hV36ZoY+xKL6pYOt1nPNnkciFkn89KZwqLhAFzJvYysAvL5uBQdiADZx/8bIDXIukzzwG0QlPYolgMzQUtKgpQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3304,9 +3439,9 @@
       }
     },
     "node_modules/@lmdb/lmdb-darwin-arm64": {
-      "version": "3.2.6",
-      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-darwin-arm64/-/lmdb-darwin-arm64-3.2.6.tgz",
-      "integrity": "sha512-yF/ih9EJJZc72psFQbwnn8mExIWfTnzWJg+N02hnpXtDPETYLmQswIMBn7+V88lfCaFrMozJsUvcEQIkEPU0Gg==",
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-darwin-arm64/-/lmdb-darwin-arm64-3.4.1.tgz",
+      "integrity": "sha512-kKeP5PaY3bFrrF6GY5aDd96iuh1eoS+5CHJ+7hIP629KIEwzGNwbIzBmEX9TAhRJOivSRDTHCIsbu//+NsYKkg==",
       "cpu": [
         "arm64"
       ],
@@ -3317,12 +3452,12 @@
         "darwin"
       ]
     },
-    "node_modules/@msgpackr-extract/msgpackr-extract-darwin-arm64": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-darwin-arm64/-/msgpackr-extract-darwin-arm64-3.0.3.tgz",
-      "integrity": "sha512-QZHtlVgbAdy2zAqNA9Gu1UpIuI8Xvsd1v8ic6B2pZmeFnFcMWiPLfWXh7TVw4eGEZ/C9TH281KwhVoeQUKbyjw==",
+    "node_modules/@lmdb/lmdb-darwin-x64": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-darwin-x64/-/lmdb-darwin-x64-3.4.1.tgz",
+      "integrity": "sha512-9CMB3seTyHs3EOVWdKiB8IIEDBJ3Gq00Tqyi0V7DS3HL90BjM/AkbZGuhzXwPrfeFazR24SKaRrUQF74f+CmWw==",
       "cpu": [
-        "arm64"
+        "x64"
       ],
       "dev": true,
       "license": "MIT",
@@ -3331,43 +3466,24 @@
         "darwin"
       ]
     },
-    "node_modules/@napi-rs/nice": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/@napi-rs/nice/-/nice-1.0.1.tgz",
-      "integrity": "sha512-zM0mVWSXE0a0h9aKACLwKmD6nHcRiKrPpCfvaKqG1CqDEyjEawId0ocXxVzPMCAm6kkWr2P025msfxXEnt8UGQ==",
+    "node_modules/@lmdb/lmdb-linux-arm": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-linux-arm/-/lmdb-linux-arm-3.4.1.tgz",
+      "integrity": "sha512-1Mi69vU0akHgCI7tF6YbimPaNEKJiBm/p5A+aM8egr0joj27cQmCCOm2mZQ+Ht2BqmCfZaIgQnMg4gFYNMlpCA==",
+      "cpu": [
+        "arm"
+      ],
       "dev": true,
       "license": "MIT",
       "optional": true,
-      "engines": {
-        "node": ">= 10"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/Brooooooklyn"
-      },
-      "optionalDependencies": {
-        "@napi-rs/nice-android-arm-eabi": "1.0.1",
-        "@napi-rs/nice-android-arm64": "1.0.1",
-        "@napi-rs/nice-darwin-arm64": "1.0.1",
-        "@napi-rs/nice-darwin-x64": "1.0.1",
-        "@napi-rs/nice-freebsd-x64": "1.0.1",
-        "@napi-rs/nice-linux-arm-gnueabihf": "1.0.1",
-        "@napi-rs/nice-linux-arm64-gnu": "1.0.1",
-        "@napi-rs/nice-linux-arm64-musl": "1.0.1",
-        "@napi-rs/nice-linux-ppc64-gnu": "1.0.1",
-        "@napi-rs/nice-linux-riscv64-gnu": "1.0.1",
-        "@napi-rs/nice-linux-s390x-gnu": "1.0.1",
-        "@napi-rs/nice-linux-x64-gnu": "1.0.1",
-        "@napi-rs/nice-linux-x64-musl": "1.0.1",
-        "@napi-rs/nice-win32-arm64-msvc": "1.0.1",
-        "@napi-rs/nice-win32-ia32-msvc": "1.0.1",
-        "@napi-rs/nice-win32-x64-msvc": "1.0.1"
-      }
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@napi-rs/nice-darwin-arm64": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/@napi-rs/nice-darwin-arm64/-/nice-darwin-arm64-1.0.1.tgz",
-      "integrity": "sha512-91k3HEqUl2fsrz/sKkuEkscj6EAj3/eZNCLqzD2AA0TtVbkQi8nqxZCZDMkfklULmxLkMxuUdKe7RvG/T6s2AA==",
+    "node_modules/@lmdb/lmdb-linux-arm64": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-linux-arm64/-/lmdb-linux-arm64-3.4.1.tgz",
+      "integrity": "sha512-d0vuXOdoKjHHJYZ/CRWopnkOiUpev+bgBBW+1tXtWsYWUj8uxl9ZmTBEmsL5mjUlpQDrlYiJSrhOU1hg5QWBSw==",
       "cpu": [
         "arm64"
       ],
@@ -3375,1885 +3491,3847 @@
       "license": "MIT",
       "optional": true,
       "os": [
-        "darwin"
-      ],
-      "engines": {
-        "node": ">= 10"
-      }
+        "linux"
+      ]
     },
-    "node_modules/@ngrx/operators": {
-      "version": "19.1.0",
-      "resolved": "https://registry.npmjs.org/@ngrx/operators/-/operators-19.1.0.tgz",
-      "integrity": "sha512-gpo69FnoAF69X68pk9eWFHB630xqerBYkF68wOFMciLOV2im3b/fAf+0sRvnQJmVtG/8jO0IPVdvLqa1TbWmPA==",
+    "node_modules/@lmdb/lmdb-linux-x64": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-linux-x64/-/lmdb-linux-x64-3.4.1.tgz",
+      "integrity": "sha512-00RbEpvfnyPodlICiGFuiOmyvWaL9nzCRSqZz82BVFsGTiSQnnF0gpD1C8tO6OvtptELbtRuM7BS9f97LcowZw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "tslib": "^2.3.0"
-      },
-      "peerDependencies": {
-        "rxjs": "^6.5.3 || ^7.4.0"
-      }
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@ngrx/signals": {
-      "version": "19.1.0",
-      "resolved": "https://registry.npmjs.org/@ngrx/signals/-/signals-19.1.0.tgz",
-      "integrity": "sha512-v8sbb+Iox9kdIaKbFgt4Z1W+NxzIU4+g+6qQU6/c27UmtQXv0s1zUKKofPRK0qwkaZzNWkxNToxyoE285ukqcQ==",
+    "node_modules/@lmdb/lmdb-win32-arm64": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-win32-arm64/-/lmdb-win32-arm64-3.4.1.tgz",
+      "integrity": "sha512-4h8tm3i1ODf+28UyqQZLP7c2jmRM26AyEEyYp994B4GiBdGvGAsYUu3oiHANYK9xFpvLuFzyGeqFm1kdNC0D1A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "tslib": "^2.3.0"
-      },
-      "peerDependencies": {
-        "@angular/core": "^19.0.0",
-        "rxjs": "^6.5.3 || ^7.4.0"
-      },
-      "peerDependenciesMeta": {
-        "rxjs": {
-          "optional": true
-        }
-      }
+      "optional": true,
+      "os": [
+        "win32"
+      ]
     },
-    "node_modules/@ngtools/webpack": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-19.2.1.tgz",
-      "integrity": "sha512-K8b3+eCG+Iz0EXTE/UDuXabr6yOL9NP6sW1CLk9AUdUUnL4AhoQy/vjfaOtxZx1T8qEErAWizJ51dHD25ysXHw==",
+    "node_modules/@lmdb/lmdb-win32-x64": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-win32-x64/-/lmdb-win32-x64-3.4.1.tgz",
+      "integrity": "sha512-HqqKIhTbq6piJhkJpTTf3w1m/CgrmwXRAL9R9j7Ru5xdZSeO7Mg4AWiBC9B00uXR+LvVZKtUyRMVZfhmIZztmQ==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
       "license": "MIT",
-      "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0",
-        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
-        "yarn": ">= 1.13.0"
-      },
-      "peerDependencies": {
-        "@angular/compiler-cli": "^19.0.0 || ^19.2.0-next.0",
-        "typescript": ">=5.5 <5.9",
-        "webpack": "^5.54.0"
-      }
+      "optional": true,
+      "os": [
+        "win32"
+      ]
     },
-    "node_modules/@nodelib/fs.scandir": {
-      "version": "2.1.5",
-      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
-      "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==",
+    "node_modules/@modelcontextprotocol/sdk": {
+      "version": "1.13.3",
+      "resolved": "https://registry.npmjs.org/@modelcontextprotocol/sdk/-/sdk-1.13.3.tgz",
+      "integrity": "sha512-bGwA78F/U5G2jrnsdRkPY3IwIwZeWUEfb5o764b79lb0rJmMT76TLwKhdNZOWakOQtedYefwIR4emisEMvInKA==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@nodelib/fs.stat": "2.0.5",
-        "run-parallel": "^1.1.9"
+        "ajv": "^6.12.6",
+        "content-type": "^1.0.5",
+        "cors": "^2.8.5",
+        "cross-spawn": "^7.0.5",
+        "eventsource": "^3.0.2",
+        "eventsource-parser": "^3.0.0",
+        "express": "^5.0.1",
+        "express-rate-limit": "^7.5.0",
+        "pkce-challenge": "^5.0.0",
+        "raw-body": "^3.0.0",
+        "zod": "^3.23.8",
+        "zod-to-json-schema": "^3.24.1"
       },
       "engines": {
-        "node": ">= 8"
-      }
-    },
-    "node_modules/@nodelib/fs.stat": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz",
-      "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 8"
+        "node": ">=18"
       }
     },
-    "node_modules/@nodelib/fs.walk": {
-      "version": "1.2.8",
-      "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz",
-      "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==",
+    "node_modules/@modelcontextprotocol/sdk/node_modules/ajv": {
+      "version": "6.12.6",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
+      "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@nodelib/fs.scandir": "2.1.5",
-        "fastq": "^1.6.0"
+        "fast-deep-equal": "^3.1.1",
+        "fast-json-stable-stringify": "^2.0.0",
+        "json-schema-traverse": "^0.4.1",
+        "uri-js": "^4.2.2"
       },
-      "engines": {
-        "node": ">= 8"
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
       }
     },
-    "node_modules/@npmcli/agent": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/@npmcli/agent/-/agent-3.0.0.tgz",
-      "integrity": "sha512-S79NdEgDQd/NGCay6TCoVzXSj74skRZIKJcpJjC5lOq34SZzyI6MqtiiWoiVWoVrTcGjNeC4ipbh1VIHlpfF5Q==",
+    "node_modules/@modelcontextprotocol/sdk/node_modules/iconv-lite": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
+      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
       "dev": true,
-      "license": "ISC",
+      "license": "MIT",
       "dependencies": {
-        "agent-base": "^7.1.0",
-        "http-proxy-agent": "^7.0.0",
-        "https-proxy-agent": "^7.0.1",
-        "lru-cache": "^10.0.1",
-        "socks-proxy-agent": "^8.0.3"
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
       },
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": ">=0.10.0"
       }
     },
-    "node_modules/@npmcli/agent/node_modules/lru-cache": {
-      "version": "10.4.3",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
-      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
+    "node_modules/@modelcontextprotocol/sdk/node_modules/json-schema-traverse": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
       "dev": true,
-      "license": "ISC"
+      "license": "MIT"
     },
-    "node_modules/@npmcli/fs": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/@npmcli/fs/-/fs-4.0.0.tgz",
-      "integrity": "sha512-/xGlezI6xfGO9NwuJlnwz/K14qD1kCSAGtacBHnGzeAIuJGazcp45KP5NuyARXoKb7cwulAGWVsbeSxdG/cb0Q==",
+    "node_modules/@modelcontextprotocol/sdk/node_modules/raw-body": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-3.0.0.tgz",
+      "integrity": "sha512-RmkhL8CAyCRPXCE28MMH0z2PNWQBNk2Q09ZdxM9IOOXwxwZbN+qbWaatPkdkWIKL2ZVDImrN/pK5HTRz2PcS4g==",
       "dev": true,
-      "license": "ISC",
+      "license": "MIT",
       "dependencies": {
-        "semver": "^7.3.5"
+        "bytes": "3.1.2",
+        "http-errors": "2.0.0",
+        "iconv-lite": "0.6.3",
+        "unpipe": "1.0.0"
       },
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": ">= 0.8"
       }
     },
-    "node_modules/@npmcli/git": {
-      "version": "6.0.3",
-      "resolved": "https://registry.npmjs.org/@npmcli/git/-/git-6.0.3.tgz",
-      "integrity": "sha512-GUYESQlxZRAdhs3UhbB6pVRNUELQOHXwK9ruDkwmCv2aZ5y0SApQzUJCg02p3A7Ue2J5hxvlk1YI53c00NmRyQ==",
+    "node_modules/@msgpackr-extract/msgpackr-extract-darwin-arm64": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-darwin-arm64/-/msgpackr-extract-darwin-arm64-3.0.3.tgz",
+      "integrity": "sha512-QZHtlVgbAdy2zAqNA9Gu1UpIuI8Xvsd1v8ic6B2pZmeFnFcMWiPLfWXh7TVw4eGEZ/C9TH281KwhVoeQUKbyjw==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "@npmcli/promise-spawn": "^8.0.0",
-        "ini": "^5.0.0",
-        "lru-cache": "^10.0.1",
-        "npm-pick-manifest": "^10.0.0",
-        "proc-log": "^5.0.0",
-        "promise-retry": "^2.0.1",
-        "semver": "^7.3.5",
-        "which": "^5.0.0"
-      },
-      "engines": {
-        "node": "^18.17.0 || >=20.5.0"
-      }
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
     },
-    "node_modules/@npmcli/git/node_modules/isexe": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-3.1.1.tgz",
-      "integrity": "sha512-LpB/54B+/2J5hqQ7imZHfdU31OlgQqx7ZicVlkm9kzg9/w8GKLEcFfJl/t7DCEDueOyBAD6zCCwTO6Fzs0NoEQ==",
+    "node_modules/@msgpackr-extract/msgpackr-extract-darwin-x64": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-darwin-x64/-/msgpackr-extract-darwin-x64-3.0.3.tgz",
+      "integrity": "sha512-mdzd3AVzYKuUmiWOQ8GNhl64/IoFGol569zNRdkLReh6LRLHOXxU4U8eq0JwaD8iFHdVGqSy4IjFL4reoWCDFw==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
-      "license": "ISC",
-      "engines": {
-        "node": ">=16"
-      }
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
     },
-    "node_modules/@npmcli/git/node_modules/lru-cache": {
-      "version": "10.4.3",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
-      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
+    "node_modules/@msgpackr-extract/msgpackr-extract-linux-arm": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-linux-arm/-/msgpackr-extract-linux-arm-3.0.3.tgz",
+      "integrity": "sha512-fg0uy/dG/nZEXfYilKoRe7yALaNmHoYeIoJuJ7KJ+YyU2bvY8vPv27f7UKhGRpY6euFYqEVhxCFZgAUNQBM3nw==",
+      "cpu": [
+        "arm"
+      ],
       "dev": true,
-      "license": "ISC"
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@npmcli/git/node_modules/which": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/which/-/which-5.0.0.tgz",
-      "integrity": "sha512-JEdGzHwwkrbWoGOlIHqQ5gtprKGOenpDHpxE9zVR1bWbOtYRyPPHMe9FaP6x61CmNaTThSkb0DAJte5jD+DmzQ==",
+    "node_modules/@msgpackr-extract/msgpackr-extract-linux-arm64": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-linux-arm64/-/msgpackr-extract-linux-arm64-3.0.3.tgz",
+      "integrity": "sha512-YxQL+ax0XqBJDZiKimS2XQaf+2wDGVa1enVRGzEvLLVFeqa5kx2bWbtcSXgsxjQB7nRqqIGFIcLteF/sHeVtQg==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "isexe": "^3.1.1"
-      },
-      "bin": {
-        "node-which": "bin/which.js"
-      },
-      "engines": {
-        "node": "^18.17.0 || >=20.5.0"
-      }
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@npmcli/installed-package-contents": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/@npmcli/installed-package-contents/-/installed-package-contents-3.0.0.tgz",
-      "integrity": "sha512-fkxoPuFGvxyrH+OQzyTkX2LUEamrF4jZSmxjAtPPHHGO0dqsQ8tTKjnIS8SAnPHdk2I03BDtSMR5K/4loKg79Q==",
+    "node_modules/@msgpackr-extract/msgpackr-extract-linux-x64": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-linux-x64/-/msgpackr-extract-linux-x64-3.0.3.tgz",
+      "integrity": "sha512-cvwNfbP07pKUfq1uH+S6KJ7dT9K8WOE4ZiAcsrSes+UY55E/0jLYc+vq+DO7jlmqRb5zAggExKm0H7O/CBaesg==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "npm-bundled": "^4.0.0",
-        "npm-normalize-package-bin": "^4.0.0"
-      },
-      "bin": {
-        "installed-package-contents": "bin/index.js"
-      },
-      "engines": {
-        "node": "^18.17.0 || >=20.5.0"
-      }
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@npmcli/node-gyp": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/@npmcli/node-gyp/-/node-gyp-4.0.0.tgz",
-      "integrity": "sha512-+t5DZ6mO/QFh78PByMq1fGSAub/agLJZDRfJRMeOSNCt8s9YVlTjmGpIPwPhvXTGUIJk+WszlT0rQa1W33yzNA==",
+    "node_modules/@msgpackr-extract/msgpackr-extract-win32-x64": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-win32-x64/-/msgpackr-extract-win32-x64-3.0.3.tgz",
+      "integrity": "sha512-x0fWaQtYp4E6sktbsdAqnehxDgEc/VwM7uLsRCYWaiGu0ykYdZPiS8zCWdnjHwyiumousxfBm4SO31eXqwEZhQ==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
-      "license": "ISC",
-      "engines": {
-        "node": "^18.17.0 || >=20.5.0"
-      }
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
     },
-    "node_modules/@npmcli/package-json": {
-      "version": "6.1.1",
-      "resolved": "https://registry.npmjs.org/@npmcli/package-json/-/package-json-6.1.1.tgz",
-      "integrity": "sha512-d5qimadRAUCO4A/Txw71VM7UrRZzV+NPclxz/dc+M6B2oYwjWTjqh8HA/sGQgs9VZuJ6I/P7XIAlJvgrl27ZOw==",
+    "node_modules/@napi-rs/nice": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice/-/nice-1.1.1.tgz",
+      "integrity": "sha512-xJIPs+bYuc9ASBl+cvGsKbGrJmS6fAKaSZCnT0lhahT5rhA2VVy9/EcIgd2JhtEuFOJNx7UHNn/qiTPTY4nrQw==",
       "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "@npmcli/git": "^6.0.0",
-        "glob": "^10.2.2",
-        "hosted-git-info": "^8.0.0",
-        "json-parse-even-better-errors": "^4.0.0",
-        "proc-log": "^5.0.0",
-        "semver": "^7.5.3",
-        "validate-npm-package-license": "^3.0.4"
+      "license": "MIT",
+      "optional": true,
+      "engines": {
+        "node": ">= 10"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/Brooooooklyn"
       },
+      "optionalDependencies": {
+        "@napi-rs/nice-android-arm-eabi": "1.1.1",
+        "@napi-rs/nice-android-arm64": "1.1.1",
+        "@napi-rs/nice-darwin-arm64": "1.1.1",
+        "@napi-rs/nice-darwin-x64": "1.1.1",
+        "@napi-rs/nice-freebsd-x64": "1.1.1",
+        "@napi-rs/nice-linux-arm-gnueabihf": "1.1.1",
+        "@napi-rs/nice-linux-arm64-gnu": "1.1.1",
+        "@napi-rs/nice-linux-arm64-musl": "1.1.1",
+        "@napi-rs/nice-linux-ppc64-gnu": "1.1.1",
+        "@napi-rs/nice-linux-riscv64-gnu": "1.1.1",
+        "@napi-rs/nice-linux-s390x-gnu": "1.1.1",
+        "@napi-rs/nice-linux-x64-gnu": "1.1.1",
+        "@napi-rs/nice-linux-x64-musl": "1.1.1",
+        "@napi-rs/nice-openharmony-arm64": "1.1.1",
+        "@napi-rs/nice-win32-arm64-msvc": "1.1.1",
+        "@napi-rs/nice-win32-ia32-msvc": "1.1.1",
+        "@napi-rs/nice-win32-x64-msvc": "1.1.1"
+      }
+    },
+    "node_modules/@napi-rs/nice-android-arm-eabi": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-android-arm-eabi/-/nice-android-arm-eabi-1.1.1.tgz",
+      "integrity": "sha512-kjirL3N6TnRPv5iuHw36wnucNqXAO46dzK9oPb0wj076R5Xm8PfUVA9nAFB5ZNMmfJQJVKACAPd/Z2KYMppthw==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": ">= 10"
       }
     },
-    "node_modules/@npmcli/package-json/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+    "node_modules/@napi-rs/nice-android-arm64": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-android-arm64/-/nice-android-arm64-1.1.1.tgz",
+      "integrity": "sha512-blG0i7dXgbInN5urONoUCNf+DUEAavRffrO7fZSeoRMJc5qD+BJeNcpr54msPF6qfDD6kzs9AQJogZvT2KD5nw==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0"
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 10"
       }
     },
-    "node_modules/@npmcli/package-json/node_modules/glob": {
-      "version": "10.4.5",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
-      "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==",
+    "node_modules/@napi-rs/nice-darwin-arm64": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-darwin-arm64/-/nice-darwin-arm64-1.1.1.tgz",
+      "integrity": "sha512-s/E7w45NaLqTGuOjC2p96pct4jRfo61xb9bU1unM/MJ/RFkKlJyJDx7OJI/O0ll/hrfpqKopuAFDV8yo0hfT7A==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "foreground-child": "^3.1.0",
-        "jackspeak": "^3.1.2",
-        "minimatch": "^9.0.4",
-        "minipass": "^7.1.2",
-        "package-json-from-dist": "^1.0.0",
-        "path-scurry": "^1.11.1"
-      },
-      "bin": {
-        "glob": "dist/esm/bin.mjs"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10"
       }
     },
-    "node_modules/@npmcli/package-json/node_modules/minimatch": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
-      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+    "node_modules/@napi-rs/nice-darwin-x64": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-darwin-x64/-/nice-darwin-x64-1.1.1.tgz",
+      "integrity": "sha512-dGoEBnVpsdcC+oHHmW1LRK5eiyzLwdgNQq3BmZIav+9/5WTZwBYX7r5ZkQC07Nxd3KHOCkgbHSh4wPkH1N1LiQ==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "brace-expansion": "^2.0.1"
-      },
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
       "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
+        "node": ">= 10"
       }
     },
-    "node_modules/@npmcli/promise-spawn": {
-      "version": "8.0.2",
-      "resolved": "https://registry.npmjs.org/@npmcli/promise-spawn/-/promise-spawn-8.0.2.tgz",
-      "integrity": "sha512-/bNJhjc+o6qL+Dwz/bqfTQClkEO5nTQ1ZEcdCkAQjhkZMHIh22LPG7fNh1enJP1NKWDqYiiABnjFCY7E0zHYtQ==",
+    "node_modules/@napi-rs/nice-freebsd-x64": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-freebsd-x64/-/nice-freebsd-x64-1.1.1.tgz",
+      "integrity": "sha512-kHv4kEHAylMYmlNwcQcDtXjklYp4FCf0b05E+0h6nDHsZ+F0bDe04U/tXNOqrx5CmIAth4vwfkjjUmp4c4JktQ==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "which": "^5.0.0"
-      },
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": ">= 10"
       }
     },
-    "node_modules/@npmcli/promise-spawn/node_modules/isexe": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-3.1.1.tgz",
-      "integrity": "sha512-LpB/54B+/2J5hqQ7imZHfdU31OlgQqx7ZicVlkm9kzg9/w8GKLEcFfJl/t7DCEDueOyBAD6zCCwTO6Fzs0NoEQ==",
+    "node_modules/@napi-rs/nice-linux-arm-gnueabihf": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-arm-gnueabihf/-/nice-linux-arm-gnueabihf-1.1.1.tgz",
+      "integrity": "sha512-E1t7K0efyKXZDoZg1LzCOLxgolxV58HCkaEkEvIYQx12ht2pa8hoBo+4OB3qh7e+QiBlp1SRf+voWUZFxyhyqg==",
+      "cpu": [
+        "arm"
+      ],
       "dev": true,
-      "license": "ISC",
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": ">=16"
+        "node": ">= 10"
       }
     },
-    "node_modules/@npmcli/promise-spawn/node_modules/which": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/which/-/which-5.0.0.tgz",
-      "integrity": "sha512-JEdGzHwwkrbWoGOlIHqQ5gtprKGOenpDHpxE9zVR1bWbOtYRyPPHMe9FaP6x61CmNaTThSkb0DAJte5jD+DmzQ==",
+    "node_modules/@napi-rs/nice-linux-arm64-gnu": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-arm64-gnu/-/nice-linux-arm64-gnu-1.1.1.tgz",
+      "integrity": "sha512-CIKLA12DTIZlmTaaKhQP88R3Xao+gyJxNWEn04wZwC2wmRapNnxCUZkVwggInMJvtVElA+D4ZzOU5sX4jV+SmQ==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "isexe": "^3.1.1"
-      },
-      "bin": {
-        "node-which": "bin/which.js"
-      },
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": ">= 10"
       }
     },
-    "node_modules/@npmcli/redact": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/@npmcli/redact/-/redact-3.1.1.tgz",
-      "integrity": "sha512-3Hc2KGIkrvJWJqTbvueXzBeZlmvoOxc2jyX00yzr3+sNFquJg0N8hH4SAPLPVrkWIRQICVpVgjrss971awXVnA==",
+    "node_modules/@napi-rs/nice-linux-arm64-musl": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-arm64-musl/-/nice-linux-arm64-musl-1.1.1.tgz",
+      "integrity": "sha512-+2Rzdb3nTIYZ0YJF43qf2twhqOCkiSrHx2Pg6DJaCPYhhaxbLcdlV8hCRMHghQ+EtZQWGNcS2xF4KxBhSGeutg==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
-      "license": "ISC",
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": ">= 10"
       }
     },
-    "node_modules/@npmcli/run-script": {
-      "version": "9.1.0",
-      "resolved": "https://registry.npmjs.org/@npmcli/run-script/-/run-script-9.1.0.tgz",
-      "integrity": "sha512-aoNSbxtkePXUlbZB+anS1LqsJdctG5n3UVhfU47+CDdwMi6uNTBMF9gPcQRnqghQd2FGzcwwIFBruFMxjhBewg==",
+    "node_modules/@napi-rs/nice-linux-ppc64-gnu": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-ppc64-gnu/-/nice-linux-ppc64-gnu-1.1.1.tgz",
+      "integrity": "sha512-4FS8oc0GeHpwvv4tKciKkw3Y4jKsL7FRhaOeiPei0X9T4Jd619wHNe4xCLmN2EMgZoeGg+Q7GY7BsvwKpL22Tg==",
+      "cpu": [
+        "ppc64"
+      ],
       "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "@npmcli/node-gyp": "^4.0.0",
-        "@npmcli/package-json": "^6.0.0",
-        "@npmcli/promise-spawn": "^8.0.0",
-        "node-gyp": "^11.0.0",
-        "proc-log": "^5.0.0",
-        "which": "^5.0.0"
-      },
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": ">= 10"
       }
     },
-    "node_modules/@npmcli/run-script/node_modules/isexe": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-3.1.1.tgz",
-      "integrity": "sha512-LpB/54B+/2J5hqQ7imZHfdU31OlgQqx7ZicVlkm9kzg9/w8GKLEcFfJl/t7DCEDueOyBAD6zCCwTO6Fzs0NoEQ==",
+    "node_modules/@napi-rs/nice-linux-riscv64-gnu": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-riscv64-gnu/-/nice-linux-riscv64-gnu-1.1.1.tgz",
+      "integrity": "sha512-HU0nw9uD4FO/oGCCk409tCi5IzIZpH2agE6nN4fqpwVlCn5BOq0MS1dXGjXaG17JaAvrlpV5ZeyZwSon10XOXw==",
+      "cpu": [
+        "riscv64"
+      ],
       "dev": true,
-      "license": "ISC",
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": ">=16"
+        "node": ">= 10"
       }
     },
-    "node_modules/@npmcli/run-script/node_modules/which": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/which/-/which-5.0.0.tgz",
-      "integrity": "sha512-JEdGzHwwkrbWoGOlIHqQ5gtprKGOenpDHpxE9zVR1bWbOtYRyPPHMe9FaP6x61CmNaTThSkb0DAJte5jD+DmzQ==",
+    "node_modules/@napi-rs/nice-linux-s390x-gnu": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-s390x-gnu/-/nice-linux-s390x-gnu-1.1.1.tgz",
+      "integrity": "sha512-2YqKJWWl24EwrX0DzCQgPLKQBxYDdBxOHot1KWEq7aY2uYeX+Uvtv4I8xFVVygJDgf6/92h9N3Y43WPx8+PAgQ==",
+      "cpu": [
+        "s390x"
+      ],
       "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "isexe": "^3.1.1"
-      },
-      "bin": {
-        "node-which": "bin/which.js"
-      },
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": ">= 10"
       }
     },
-    "node_modules/@parcel/watcher": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.5.1.tgz",
-      "integrity": "sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg==",
+    "node_modules/@napi-rs/nice-linux-x64-gnu": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-x64-gnu/-/nice-linux-x64-gnu-1.1.1.tgz",
+      "integrity": "sha512-/gaNz3R92t+dcrfCw/96pDopcmec7oCcAQ3l/M+Zxr82KT4DljD37CpgrnXV+pJC263JkW572pdbP3hP+KjcIg==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
-      "hasInstallScript": true,
       "license": "MIT",
       "optional": true,
-      "dependencies": {
-        "detect-libc": "^1.0.3",
-        "is-glob": "^4.0.3",
-        "micromatch": "^4.0.5",
-        "node-addon-api": "^7.0.0"
-      },
+      "os": [
+        "linux"
+      ],
       "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      },
-      "optionalDependencies": {
-        "@parcel/watcher-android-arm64": "2.5.1",
-        "@parcel/watcher-darwin-arm64": "2.5.1",
-        "@parcel/watcher-darwin-x64": "2.5.1",
-        "@parcel/watcher-freebsd-x64": "2.5.1",
-        "@parcel/watcher-linux-arm-glibc": "2.5.1",
-        "@parcel/watcher-linux-arm-musl": "2.5.1",
-        "@parcel/watcher-linux-arm64-glibc": "2.5.1",
-        "@parcel/watcher-linux-arm64-musl": "2.5.1",
-        "@parcel/watcher-linux-x64-glibc": "2.5.1",
-        "@parcel/watcher-linux-x64-musl": "2.5.1",
-        "@parcel/watcher-win32-arm64": "2.5.1",
-        "@parcel/watcher-win32-ia32": "2.5.1",
-        "@parcel/watcher-win32-x64": "2.5.1"
+        "node": ">= 10"
       }
     },
-    "node_modules/@parcel/watcher-darwin-arm64": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.5.1.tgz",
-      "integrity": "sha512-eAzPv5osDmZyBhou8PoF4i6RQXAfeKL9tjb3QzYuccXFMQU0ruIc/POh30ePnaOyD1UXdlKguHBmsTs53tVoPw==",
+    "node_modules/@napi-rs/nice-linux-x64-musl": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-x64-musl/-/nice-linux-x64-musl-1.1.1.tgz",
+      "integrity": "sha512-xScCGnyj/oppsNPMnevsBe3pvNaoK7FGvMjT35riz9YdhB2WtTG47ZlbxtOLpjeO9SqqQ2J2igCmz6IJOD5JYw==",
       "cpu": [
-        "arm64"
+        "x64"
       ],
       "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
-        "darwin"
+        "linux"
       ],
       "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
+        "node": ">= 10"
       }
     },
-    "node_modules/@parcel/watcher/node_modules/detect-libc": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
-      "integrity": "sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==",
+    "node_modules/@napi-rs/nice-openharmony-arm64": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-openharmony-arm64/-/nice-openharmony-arm64-1.1.1.tgz",
+      "integrity": "sha512-6uJPRVwVCLDeoOaNyeiW0gp2kFIM4r7PL2MczdZQHkFi9gVlgm+Vn+V6nTWRcu856mJ2WjYJiumEajfSm7arPQ==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
-      "license": "Apache-2.0",
+      "license": "MIT",
       "optional": true,
-      "bin": {
-        "detect-libc": "bin/detect-libc.js"
-      },
+      "os": [
+        "openharmony"
+      ],
       "engines": {
-        "node": ">=0.10"
+        "node": ">= 10"
       }
     },
-    "node_modules/@parcel/watcher/node_modules/node-addon-api": {
-      "version": "7.1.1",
-      "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-7.1.1.tgz",
-      "integrity": "sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==",
+    "node_modules/@napi-rs/nice-win32-arm64-msvc": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-win32-arm64-msvc/-/nice-win32-arm64-msvc-1.1.1.tgz",
+      "integrity": "sha512-uoTb4eAvM5B2aj/z8j+Nv8OttPf2m+HVx3UjA5jcFxASvNhQriyCQF1OB1lHL43ZhW+VwZlgvjmP5qF3+59atA==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
       "license": "MIT",
-      "optional": true
-    },
-    "node_modules/@pkgjs/parseargs": {
-      "version": "0.11.0",
-      "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
-      "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
-      "license": "MIT",
       "optional": true,
+      "os": [
+        "win32"
+      ],
       "engines": {
-        "node": ">=14"
+        "node": ">= 10"
       }
     },
-    "node_modules/@playwright/test": {
-      "version": "1.53.0",
-      "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.53.0.tgz",
-      "integrity": "sha512-15hjKreZDcp7t6TL/7jkAo6Df5STZN09jGiv5dbP9A6vMVncXRqE7/B2SncsyOwrkZRBH2i6/TPOL8BVmm3c7w==",
+    "node_modules/@napi-rs/nice-win32-ia32-msvc": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-win32-ia32-msvc/-/nice-win32-ia32-msvc-1.1.1.tgz",
+      "integrity": "sha512-CNQqlQT9MwuCsg1Vd/oKXiuH+TcsSPJmlAFc5frFyX/KkOh0UpBLEj7aoY656d5UKZQMQFP7vJNa1DNUNORvug==",
+      "cpu": [
+        "ia32"
+      ],
       "dev": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "playwright": "1.53.0"
-      },
-      "bin": {
-        "playwright": "cli.js"
-      },
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
       "engines": {
-        "node": ">=18"
+        "node": ">= 10"
       }
     },
-    "node_modules/@polka/url": {
-      "version": "1.0.0-next.28",
-      "resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.28.tgz",
-      "integrity": "sha512-8LduaNlMZGwdZ6qWrKlfa+2M4gahzFkprZiAt2TF8uS0qQgBizKXpXURqvTJ4WtmupWxaLqjRb2UCTe72mu+Aw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/@prisma/debug": {
-      "version": "5.14.0-dev.34",
-      "resolved": "https://registry.npmjs.org/@prisma/debug/-/debug-5.14.0-dev.34.tgz",
-      "integrity": "sha512-mc4Ue07QjYcb4yV0ZXap2AJBLlBAk0owO3fHKWovQA9Ig2XXlxlAUesk9RxPYKj9zIpDZXYMPUC3iKIdUi5SUA==",
-      "dev": true,
-      "license": "Apache-2.0"
-    },
-    "node_modules/@prisma/engines": {
-      "version": "5.14.0-dev.34",
-      "resolved": "https://registry.npmjs.org/@prisma/engines/-/engines-5.14.0-dev.34.tgz",
-      "integrity": "sha512-RWkQHOPxSfy0ANoE0hhrDTf7SuNACILx/LTM1LINlWSYG+Ev/do+5RFbrCv6liCxi1fRZuuhtTux9sH56o01cQ==",
+    "node_modules/@napi-rs/nice-win32-x64-msvc": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-win32-x64-msvc/-/nice-win32-x64-msvc-1.1.1.tgz",
+      "integrity": "sha512-vB+4G/jBQCAh0jelMTY3+kgFy00Hlx2f2/1zjMoH821IbplbWZOkLiTYXQkygNTzQJTq5cvwBDgn2ppHD+bglQ==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
-      "hasInstallScript": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@prisma/debug": "5.14.0-dev.34",
-        "@prisma/engines-version": "5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361",
-        "@prisma/fetch-engine": "5.14.0-dev.34",
-        "@prisma/get-platform": "5.14.0-dev.34"
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10"
       }
     },
-    "node_modules/@prisma/engines-version": {
-      "version": "5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361",
-      "resolved": "https://registry.npmjs.org/@prisma/engines-version/-/engines-version-5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361.tgz",
-      "integrity": "sha512-XkTJYtdOIrJkJv/tzXzsaUsfyvp82IWSPx4DlR52G0cyKoqT6lC55daIdsnuEoKPM2jPcL6P7dJENYBMGHQLEg==",
-      "dev": true,
-      "license": "Apache-2.0"
-    },
-    "node_modules/@prisma/fetch-engine": {
-      "version": "5.14.0-dev.34",
-      "resolved": "https://registry.npmjs.org/@prisma/fetch-engine/-/fetch-engine-5.14.0-dev.34.tgz",
-      "integrity": "sha512-Ieqp/Zfq7KaZWndJAq2K0Z5r77DBPyvXlKXbztXnyvoQhce+9QTkjwJ8U3dOHUwSwNqIb6TY7j1dal3epSUZkg==",
+    "node_modules/@napi-rs/wasm-runtime": {
+      "version": "0.2.12",
+      "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-0.2.12.tgz",
+      "integrity": "sha512-ZVWUcfwY4E/yPitQJl481FjFo3K22D6qF0DuFH6Y/nbnE11GY5uguDxZMGXPQ8WQ0128MXQD7TnfHyK4oWoIJQ==",
       "dev": true,
-      "license": "Apache-2.0",
+      "license": "MIT",
+      "optional": true,
       "dependencies": {
-        "@prisma/debug": "5.14.0-dev.34",
-        "@prisma/engines-version": "5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361",
-        "@prisma/get-platform": "5.14.0-dev.34"
+        "@emnapi/core": "^1.4.3",
+        "@emnapi/runtime": "^1.4.3",
+        "@tybys/wasm-util": "^0.10.0"
       }
     },
-    "node_modules/@prisma/generator-helper": {
-      "version": "5.14.0-dev.34",
-      "resolved": "https://registry.npmjs.org/@prisma/generator-helper/-/generator-helper-5.14.0-dev.34.tgz",
-      "integrity": "sha512-AsY7piYVHtaGf/TjSoK2j7pZmG+xX/Mqv/VQMNJmfJDEGAnt1fXg6e6veSGLm/SqxA3JJhVCaX3XUHYDeXnsOg==",
-      "dev": true,
-      "license": "Apache-2.0",
+    "node_modules/@ngrx/operators": {
+      "version": "20.0.0",
+      "resolved": "https://registry.npmjs.org/@ngrx/operators/-/operators-20.0.0.tgz",
+      "integrity": "sha512-Dp6HweO6wOJkUgcfuv6s8OrYIJf3TAYfvCFCoM1cQtLc70P9vhvqKggCR8BsrckF7XZa95zcm7Pab6OHFnOPWg==",
+      "license": "MIT",
       "dependencies": {
-        "@prisma/debug": "5.14.0-dev.34"
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "rxjs": "^6.5.3 || ^7.4.0"
       }
     },
-    "node_modules/@prisma/get-platform": {
-      "version": "5.14.0-dev.34",
-      "resolved": "https://registry.npmjs.org/@prisma/get-platform/-/get-platform-5.14.0-dev.34.tgz",
-      "integrity": "sha512-JlzzUMQKsj1cFMXiGMkqrdP7dl3OZtZQapEeCAoH42J6GCrEuV+qNhTOlkywyNuFDj+j1VjfE7p9HRFO1+kiiw==",
-      "dev": true,
-      "license": "Apache-2.0",
+    "node_modules/@ngrx/signals": {
+      "version": "20.0.0",
+      "resolved": "https://registry.npmjs.org/@ngrx/signals/-/signals-20.0.0.tgz",
+      "integrity": "sha512-ALz9dzu4tkL3QtgtkyHqvO14Od3tY/febpsqS6LaUgIxF8jFtmAneo0VgaGB2O7KamMwrwF005lpZjl/zeZghA==",
+      "license": "MIT",
       "dependencies": {
-        "@prisma/debug": "5.14.0-dev.34"
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/core": "^20.0.0",
+        "rxjs": "^6.5.3 || ^7.4.0"
+      },
+      "peerDependenciesMeta": {
+        "rxjs": {
+          "optional": true
+        }
       }
     },
-    "node_modules/@prisma/internals": {
-      "version": "5.14.0-dev.34",
-      "resolved": "https://registry.npmjs.org/@prisma/internals/-/internals-5.14.0-dev.34.tgz",
-      "integrity": "sha512-FKToi0h7DFkSZ+eAo737RisLAlRrHq2VPRnm53aVe7LH1J4qwVhl7U+Gy9CsifUgi5VDX311M2W5hyaRcBs46A==",
-      "dev": true,
-      "license": "Apache-2.0",
+    "node_modules/@nodelib/fs.scandir": {
+      "version": "2.1.5",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
+      "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==",
+      "license": "MIT",
       "dependencies": {
-        "@prisma/debug": "5.14.0-dev.34",
-        "@prisma/engines": "5.14.0-dev.34",
-        "@prisma/fetch-engine": "5.14.0-dev.34",
-        "@prisma/generator-helper": "5.14.0-dev.34",
-        "@prisma/get-platform": "5.14.0-dev.34",
-        "@prisma/prisma-schema-wasm": "5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361",
-        "@prisma/schema-files-loader": "5.14.0-dev.34",
-        "arg": "5.0.2",
-        "prompts": "2.4.2"
+        "@nodelib/fs.stat": "2.0.5",
+        "run-parallel": "^1.1.9"
+      },
+      "engines": {
+        "node": ">= 8"
       }
     },
-    "node_modules/@prisma/prisma-schema-wasm": {
-      "version": "5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361",
-      "resolved": "https://registry.npmjs.org/@prisma/prisma-schema-wasm/-/prisma-schema-wasm-5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361.tgz",
-      "integrity": "sha512-lMNW0WEI+eP5gPn+blBj2yK2znvQlWQbbcOdbqR6PmOOMZRPXbfoC1LgxFn0QrZalJ1csJSFPjmQiYcrv9/39w==",
-      "dev": true,
-      "license": "Apache-2.0"
-    },
-    "node_modules/@prisma/schema-files-loader": {
-      "version": "5.14.0-dev.34",
-      "resolved": "https://registry.npmjs.org/@prisma/schema-files-loader/-/schema-files-loader-5.14.0-dev.34.tgz",
-      "integrity": "sha512-oO0dMzBJbNN3OwcNpRpKO6iq/rqWg02OKBeUI+Qy3Cwrqo5SlKO+DeolkUnx2PPWiHitDX/8UkGRBkMRG0HI9g==",
-      "dev": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "fs-extra": "11.1.1"
+    "node_modules/@nodelib/fs.stat": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz",
+      "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 8"
       }
     },
-    "node_modules/@prisma/schema-files-loader/node_modules/fs-extra": {
-      "version": "11.1.1",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.1.1.tgz",
-      "integrity": "sha512-MGIE4HOvQCeUCzmlHs0vXpih4ysz4wg9qiSAu6cd42lVwPbTM1TjV7RusoyQqMmk/95gdQZX72u+YW+c3eEpFQ==",
-      "dev": true,
+    "node_modules/@nodelib/fs.walk": {
+      "version": "1.2.8",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz",
+      "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==",
       "license": "MIT",
       "dependencies": {
-        "graceful-fs": "^4.2.0",
-        "jsonfile": "^6.0.1",
-        "universalify": "^2.0.0"
+        "@nodelib/fs.scandir": "2.1.5",
+        "fastq": "^1.6.0"
       },
       "engines": {
-        "node": ">=14.14"
+        "node": ">= 8"
       }
     },
-    "node_modules/@prisma/schema-files-loader/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+    "node_modules/@npmcli/agent": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@npmcli/agent/-/agent-3.0.0.tgz",
+      "integrity": "sha512-S79NdEgDQd/NGCay6TCoVzXSj74skRZIKJcpJjC5lOq34SZzyI6MqtiiWoiVWoVrTcGjNeC4ipbh1VIHlpfF5Q==",
       "dev": true,
-      "license": "MIT",
+      "license": "ISC",
       "dependencies": {
-        "universalify": "^2.0.0"
+        "agent-base": "^7.1.0",
+        "http-proxy-agent": "^7.0.0",
+        "https-proxy-agent": "^7.0.1",
+        "lru-cache": "^10.0.1",
+        "socks-proxy-agent": "^8.0.3"
       },
-      "optionalDependencies": {
-        "graceful-fs": "^4.1.6"
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
       }
     },
-    "node_modules/@prisma/schema-files-loader/node_modules/universalify": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz",
-      "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==",
+    "node_modules/@npmcli/agent/node_modules/lru-cache": {
+      "version": "10.4.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
+      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
       "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 10.0.0"
-      }
+      "license": "ISC"
     },
-    "node_modules/@rollup/rollup-darwin-arm64": {
-      "version": "4.34.8",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.34.8.tgz",
-      "integrity": "sha512-02rVdZ5tgdUNRxIUrFdcMBZQoaPMrxtwSb+/hOfBdqkatYHR3lZ2A2EGyHq2sGOd0Owk80oV3snlDASC24He3Q==",
-      "cpu": [
-        "arm64"
-      ],
+    "node_modules/@npmcli/fs": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@npmcli/fs/-/fs-4.0.0.tgz",
+      "integrity": "sha512-/xGlezI6xfGO9NwuJlnwz/K14qD1kCSAGtacBHnGzeAIuJGazcp45KP5NuyARXoKb7cwulAGWVsbeSxdG/cb0Q==",
       "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "darwin"
-      ]
+      "license": "ISC",
+      "dependencies": {
+        "semver": "^7.3.5"
+      },
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
     },
-    "node_modules/@sagold/json-pointer": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/@sagold/json-pointer/-/json-pointer-5.1.2.tgz",
-      "integrity": "sha512-+wAhJZBXa6MNxRScg6tkqEbChEHMgVZAhTHVJ60Y7sbtXtu9XA49KfUkdWlS2x78D6H9nryiKePiYozumauPfA==",
+    "node_modules/@npmcli/git": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/@npmcli/git/-/git-6.0.3.tgz",
+      "integrity": "sha512-GUYESQlxZRAdhs3UhbB6pVRNUELQOHXwK9ruDkwmCv2aZ5y0SApQzUJCg02p3A7Ue2J5hxvlk1YI53c00NmRyQ==",
       "dev": true,
-      "license": "MIT"
+      "license": "ISC",
+      "dependencies": {
+        "@npmcli/promise-spawn": "^8.0.0",
+        "ini": "^5.0.0",
+        "lru-cache": "^10.0.1",
+        "npm-pick-manifest": "^10.0.0",
+        "proc-log": "^5.0.0",
+        "promise-retry": "^2.0.1",
+        "semver": "^7.3.5",
+        "which": "^5.0.0"
+      },
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
     },
-    "node_modules/@sagold/json-query": {
-      "version": "6.2.0",
-      "resolved": "https://registry.npmjs.org/@sagold/json-query/-/json-query-6.2.0.tgz",
-      "integrity": "sha512-7bOIdUE6eHeoWtFm8TvHQHfTVSZuCs+3RpOKmZCDBIOrxpvF/rNFTeuvIyjHva/RR0yVS3kQtr+9TW72LQEZjA==",
+    "node_modules/@npmcli/git/node_modules/isexe": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-3.1.1.tgz",
+      "integrity": "sha512-LpB/54B+/2J5hqQ7imZHfdU31OlgQqx7ZicVlkm9kzg9/w8GKLEcFfJl/t7DCEDueOyBAD6zCCwTO6Fzs0NoEQ==",
       "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@sagold/json-pointer": "^5.1.2",
-        "ebnf": "^1.9.1"
+      "license": "ISC",
+      "engines": {
+        "node": ">=16"
       }
     },
-    "node_modules/@scaleleap/pg-format": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@scaleleap/pg-format/-/pg-format-1.0.0.tgz",
-      "integrity": "sha512-gFkcYMnpeylF2OJ30FsDBjwICB9JTiZ5i3guPwdiBDrJFwIKr+Zk6jwI8Mg22a4FwXn5ezd5cHEFMKqBqBz4RQ==",
+    "node_modules/@npmcli/git/node_modules/lru-cache": {
+      "version": "10.4.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
+      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
       "dev": true,
-      "license": "MIT"
+      "license": "ISC"
     },
-    "node_modules/@schematics/angular": {
-      "version": "19.2.1",
-      "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-19.2.1.tgz",
-      "integrity": "sha512-QYYGVR2n+YtLzqo0IsQq7OUnBMeP6OjyuVlGdjsAnSDCKQ9kUcqZDwjxxh5NUj25R4vvu+5aVaa6W6iTxfHadQ==",
+    "node_modules/@npmcli/git/node_modules/which": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/which/-/which-5.0.0.tgz",
+      "integrity": "sha512-JEdGzHwwkrbWoGOlIHqQ5gtprKGOenpDHpxE9zVR1bWbOtYRyPPHMe9FaP6x61CmNaTThSkb0DAJte5jD+DmzQ==",
       "dev": true,
-      "license": "MIT",
+      "license": "ISC",
       "dependencies": {
-        "@angular-devkit/core": "19.2.1",
-        "@angular-devkit/schematics": "19.2.1",
-        "jsonc-parser": "3.3.1"
+        "isexe": "^3.1.1"
+      },
+      "bin": {
+        "node-which": "bin/which.js"
       },
       "engines": {
-        "node": "^18.19.1 || ^20.11.1 || >=22.0.0",
-        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
-        "yarn": ">= 1.13.0"
+        "node": "^18.17.0 || >=20.5.0"
       }
     },
-    "node_modules/@sigstore/bundle": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/@sigstore/bundle/-/bundle-3.1.0.tgz",
-      "integrity": "sha512-Mm1E3/CmDDCz3nDhFKTuYdB47EdRFRQMOE/EAbiG1MJW77/w1b3P7Qx7JSrVJs8PfwOLOVcKQCHErIwCTyPbag==",
+    "node_modules/@npmcli/installed-package-contents": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@npmcli/installed-package-contents/-/installed-package-contents-3.0.0.tgz",
+      "integrity": "sha512-fkxoPuFGvxyrH+OQzyTkX2LUEamrF4jZSmxjAtPPHHGO0dqsQ8tTKjnIS8SAnPHdk2I03BDtSMR5K/4loKg79Q==",
       "dev": true,
-      "license": "Apache-2.0",
+      "license": "ISC",
       "dependencies": {
-        "@sigstore/protobuf-specs": "^0.4.0"
+        "npm-bundled": "^4.0.0",
+        "npm-normalize-package-bin": "^4.0.0"
+      },
+      "bin": {
+        "installed-package-contents": "bin/index.js"
       },
       "engines": {
         "node": "^18.17.0 || >=20.5.0"
       }
     },
-    "node_modules/@sigstore/core": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/@sigstore/core/-/core-2.0.0.tgz",
-      "integrity": "sha512-nYxaSb/MtlSI+JWcwTHQxyNmWeWrUXJJ/G4liLrGG7+tS4vAz6LF3xRXqLH6wPIVUoZQel2Fs4ddLx4NCpiIYg==",
+    "node_modules/@npmcli/node-gyp": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@npmcli/node-gyp/-/node-gyp-4.0.0.tgz",
+      "integrity": "sha512-+t5DZ6mO/QFh78PByMq1fGSAub/agLJZDRfJRMeOSNCt8s9YVlTjmGpIPwPhvXTGUIJk+WszlT0rQa1W33yzNA==",
       "dev": true,
-      "license": "Apache-2.0",
+      "license": "ISC",
       "engines": {
         "node": "^18.17.0 || >=20.5.0"
       }
     },
-    "node_modules/@sigstore/protobuf-specs": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/@sigstore/protobuf-specs/-/protobuf-specs-0.4.0.tgz",
-      "integrity": "sha512-o09cLSIq9EKyRXwryWDOJagkml9XgQCoCSRjHOnHLnvsivaW7Qznzz6yjfV7PHJHhIvyp8OH7OX8w0Dc5bQK7A==",
+    "node_modules/@npmcli/package-json": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/@npmcli/package-json/-/package-json-6.2.0.tgz",
+      "integrity": "sha512-rCNLSB/JzNvot0SEyXqWZ7tX2B5dD2a1br2Dp0vSYVo5jh8Z0EZ7lS9TsZ1UtziddB1UfNUaMCc538/HztnJGA==",
       "dev": true,
-      "license": "Apache-2.0",
+      "license": "ISC",
+      "dependencies": {
+        "@npmcli/git": "^6.0.0",
+        "glob": "^10.2.2",
+        "hosted-git-info": "^8.0.0",
+        "json-parse-even-better-errors": "^4.0.0",
+        "proc-log": "^5.0.0",
+        "semver": "^7.5.3",
+        "validate-npm-package-license": "^3.0.4"
+      },
       "engines": {
         "node": "^18.17.0 || >=20.5.0"
       }
     },
-    "node_modules/@sigstore/sign": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/@sigstore/sign/-/sign-3.1.0.tgz",
-      "integrity": "sha512-knzjmaOHOov1Ur7N/z4B1oPqZ0QX5geUfhrVaqVlu+hl0EAoL4o+l0MSULINcD5GCWe3Z0+YJO8ues6vFlW0Yw==",
+    "node_modules/@npmcli/package-json/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
       "dev": true,
-      "license": "Apache-2.0",
+      "license": "MIT",
       "dependencies": {
-        "@sigstore/bundle": "^3.1.0",
-        "@sigstore/core": "^2.0.0",
-        "@sigstore/protobuf-specs": "^0.4.0",
-        "make-fetch-happen": "^14.0.2",
-        "proc-log": "^5.0.0",
-        "promise-retry": "^2.0.1"
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/@npmcli/package-json/node_modules/glob": {
+      "version": "10.4.5",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
+      "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "foreground-child": "^3.1.0",
+        "jackspeak": "^3.1.2",
+        "minimatch": "^9.0.4",
+        "minipass": "^7.1.2",
+        "package-json-from-dist": "^1.0.0",
+        "path-scurry": "^1.11.1"
       },
-      "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+      "bin": {
+        "glob": "dist/esm/bin.mjs"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/@sigstore/tuf": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/@sigstore/tuf/-/tuf-3.1.0.tgz",
-      "integrity": "sha512-suVMQEA+sKdOz5hwP9qNcEjX6B45R+hFFr4LAWzbRc5O+U2IInwvay/bpG5a4s+qR35P/JK/PiKiRGjfuLy1IA==",
+    "node_modules/@npmcli/package-json/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dev": true,
-      "license": "Apache-2.0",
+      "license": "ISC",
       "dependencies": {
-        "@sigstore/protobuf-specs": "^0.4.0",
-        "tuf-js": "^3.0.1"
+        "brace-expansion": "^2.0.1"
       },
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/@sigstore/verify": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@sigstore/verify/-/verify-2.1.0.tgz",
-      "integrity": "sha512-kAAM06ca4CzhvjIZdONAL9+MLppW3K48wOFy1TbuaWFW/OMfl8JuTgW0Bm02JB1WJGT/ET2eqav0KTEKmxqkIA==",
+    "node_modules/@npmcli/promise-spawn": {
+      "version": "8.0.2",
+      "resolved": "https://registry.npmjs.org/@npmcli/promise-spawn/-/promise-spawn-8.0.2.tgz",
+      "integrity": "sha512-/bNJhjc+o6qL+Dwz/bqfTQClkEO5nTQ1ZEcdCkAQjhkZMHIh22LPG7fNh1enJP1NKWDqYiiABnjFCY7E0zHYtQ==",
       "dev": true,
-      "license": "Apache-2.0",
+      "license": "ISC",
       "dependencies": {
-        "@sigstore/bundle": "^3.1.0",
-        "@sigstore/core": "^2.0.0",
-        "@sigstore/protobuf-specs": "^0.4.0"
+        "which": "^5.0.0"
       },
       "engines": {
         "node": "^18.17.0 || >=20.5.0"
       }
     },
-    "node_modules/@sindresorhus/merge-streams": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/@sindresorhus/merge-streams/-/merge-streams-2.3.0.tgz",
-      "integrity": "sha512-LtoMMhxAlorcGhmFYI+LhPgbPZCkgP6ra1YL604EeF6U98pLlQ3iWIGMdWSC+vWmPBWBNgmDBAhnAobLROJmwg==",
+    "node_modules/@npmcli/promise-spawn/node_modules/isexe": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-3.1.1.tgz",
+      "integrity": "sha512-LpB/54B+/2J5hqQ7imZHfdU31OlgQqx7ZicVlkm9kzg9/w8GKLEcFfJl/t7DCEDueOyBAD6zCCwTO6Fzs0NoEQ==",
       "dev": true,
-      "license": "MIT",
+      "license": "ISC",
       "engines": {
-        "node": ">=18"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "node": ">=16"
       }
     },
-    "node_modules/@snaplet/copycat": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/@snaplet/copycat/-/copycat-6.0.0.tgz",
-      "integrity": "sha512-ZBxlsWfhd+fxubKHrZglUQmSxHe70sGxHqTPiIBqoqX/41jABG8VCbgB8KrMm8to6V6Y/tBMqQUGzuWFFNHimg==",
+    "node_modules/@npmcli/promise-spawn/node_modules/which": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/which/-/which-5.0.0.tgz",
+      "integrity": "sha512-JEdGzHwwkrbWoGOlIHqQ5gtprKGOenpDHpxE9zVR1bWbOtYRyPPHMe9FaP6x61CmNaTThSkb0DAJte5jD+DmzQ==",
       "dev": true,
-      "license": "MIT",
+      "license": "ISC",
       "dependencies": {
-        "@faker-js/faker": "^8.4.1",
-        "fictional": "^3.0.1",
-        "string-argv": "^0.3.2",
-        "uuid": "^9.0.1"
+        "isexe": "^3.1.1"
+      },
+      "bin": {
+        "node-which": "bin/which.js"
+      },
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
       }
     },
-    "node_modules/@snaplet/seed": {
-      "version": "0.98.0",
-      "resolved": "https://registry.npmjs.org/@snaplet/seed/-/seed-0.98.0.tgz",
-      "integrity": "sha512-qLh7e596mKbY3DZW1CryhYyZdFJ/irAU760t00ac1VHsx/1Brfu3jpc6Bq69XBRZ6I3/nqPDlRckVP//bpFUMQ==",
+    "node_modules/@npmcli/redact": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/@npmcli/redact/-/redact-3.2.2.tgz",
+      "integrity": "sha512-7VmYAmk4csGv08QzrDKScdzn11jHPFGyqJW39FyPgPuAp3zIaUmuCo1yxw9aGs+NEJuTGQ9Gwqpt93vtJubucg==",
       "dev": true,
-      "hasInstallScript": true,
-      "license": "FSL-1.1-MIT",
+      "license": "ISC",
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
+    "node_modules/@npmcli/run-script": {
+      "version": "9.1.0",
+      "resolved": "https://registry.npmjs.org/@npmcli/run-script/-/run-script-9.1.0.tgz",
+      "integrity": "sha512-aoNSbxtkePXUlbZB+anS1LqsJdctG5n3UVhfU47+CDdwMi6uNTBMF9gPcQRnqghQd2FGzcwwIFBruFMxjhBewg==",
+      "dev": true,
+      "license": "ISC",
       "dependencies": {
-        "@inquirer/prompts": "^5.0.2",
-        "@langchain/core": "^0.2.18",
-        "@langchain/groq": "^0.0.15",
-        "@langchain/openai": "^0.2.4",
-        "@prisma/generator-helper": "5.14.0-dev.34",
-        "@prisma/internals": "5.14.0-dev.34",
-        "@scaleleap/pg-format": "^1.0.0",
-        "@total-typescript/ts-reset": "^0.5.1",
-        "ansi-escapes": "^6.2.1",
-        "c12": "^1.10.0",
-        "change-case": "^5.4.4",
-        "debug": "^4.3.4",
-        "dedent": "^1.5.3",
-        "execa": "^8.0.1",
-        "exit-hook": "^4.0.0",
-        "find-up": "^7.0.0",
-        "fs-extra": "^11.2.0",
-        "inflection": "^3.0.0",
-        "javascript-stringify": "^2.1.0",
-        "json-schema-library": "^9.3.4",
-        "kleur": "^4.1.5",
-        "multimatch": "^7.0.0",
-        "ora": "^8.0.1",
-        "quicktype-core": "23.0.149",
-        "remeda": "^1.61.0",
-        "sqlstring": "^2.3.3",
-        "terminal-link": "^3.0.0",
-        "uuid": "^9.0.1",
-        "yargs": "^17.7.2",
-        "zod": "^3.23.5"
+        "@npmcli/node-gyp": "^4.0.0",
+        "@npmcli/package-json": "^6.0.0",
+        "@npmcli/promise-spawn": "^8.0.0",
+        "node-gyp": "^11.0.0",
+        "proc-log": "^5.0.0",
+        "which": "^5.0.0"
+      },
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
+    "node_modules/@npmcli/run-script/node_modules/isexe": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-3.1.1.tgz",
+      "integrity": "sha512-LpB/54B+/2J5hqQ7imZHfdU31OlgQqx7ZicVlkm9kzg9/w8GKLEcFfJl/t7DCEDueOyBAD6zCCwTO6Fzs0NoEQ==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/@npmcli/run-script/node_modules/which": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/which/-/which-5.0.0.tgz",
+      "integrity": "sha512-JEdGzHwwkrbWoGOlIHqQ5gtprKGOenpDHpxE9zVR1bWbOtYRyPPHMe9FaP6x61CmNaTThSkb0DAJte5jD+DmzQ==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "isexe": "^3.1.1"
       },
       "bin": {
-        "snaplet-seed": "bin/cli.js"
+        "node-which": "bin/which.js"
+      },
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
+    "node_modules/@parcel/watcher": {
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.5.1.tgz",
+      "integrity": "sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "detect-libc": "^1.0.3",
+        "is-glob": "^4.0.3",
+        "micromatch": "^4.0.5",
+        "node-addon-api": "^7.0.0"
+      },
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "optionalDependencies": {
+        "@parcel/watcher-android-arm64": "2.5.1",
+        "@parcel/watcher-darwin-arm64": "2.5.1",
+        "@parcel/watcher-darwin-x64": "2.5.1",
+        "@parcel/watcher-freebsd-x64": "2.5.1",
+        "@parcel/watcher-linux-arm-glibc": "2.5.1",
+        "@parcel/watcher-linux-arm-musl": "2.5.1",
+        "@parcel/watcher-linux-arm64-glibc": "2.5.1",
+        "@parcel/watcher-linux-arm64-musl": "2.5.1",
+        "@parcel/watcher-linux-x64-glibc": "2.5.1",
+        "@parcel/watcher-linux-x64-musl": "2.5.1",
+        "@parcel/watcher-win32-arm64": "2.5.1",
+        "@parcel/watcher-win32-ia32": "2.5.1",
+        "@parcel/watcher-win32-x64": "2.5.1"
+      }
+    },
+    "node_modules/@parcel/watcher-darwin-arm64": {
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.5.1.tgz",
+      "integrity": "sha512-eAzPv5osDmZyBhou8PoF4i6RQXAfeKL9tjb3QzYuccXFMQU0ruIc/POh30ePnaOyD1UXdlKguHBmsTs53tVoPw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher/node_modules/detect-libc": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
+      "integrity": "sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "bin": {
+        "detect-libc": "bin/detect-libc.js"
+      },
+      "engines": {
+        "node": ">=0.10"
+      }
+    },
+    "node_modules/@parcel/watcher/node_modules/node-addon-api": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-7.1.1.tgz",
+      "integrity": "sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true
+    },
+    "node_modules/@pkgjs/parseargs": {
+      "version": "0.11.0",
+      "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
+      "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
+      "license": "MIT",
+      "optional": true,
+      "engines": {
+        "node": ">=14"
+      }
+    },
+    "node_modules/@playwright/test": {
+      "version": "1.53.0",
+      "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.53.0.tgz",
+      "integrity": "sha512-15hjKreZDcp7t6TL/7jkAo6Df5STZN09jGiv5dbP9A6vMVncXRqE7/B2SncsyOwrkZRBH2i6/TPOL8BVmm3c7w==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "playwright": "1.53.0"
+      },
+      "bin": {
+        "playwright": "cli.js"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@polka/url": {
+      "version": "1.0.0-next.28",
+      "resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.28.tgz",
+      "integrity": "sha512-8LduaNlMZGwdZ6qWrKlfa+2M4gahzFkprZiAt2TF8uS0qQgBizKXpXURqvTJ4WtmupWxaLqjRb2UCTe72mu+Aw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@prisma/debug": {
+      "version": "5.14.0-dev.34",
+      "resolved": "https://registry.npmjs.org/@prisma/debug/-/debug-5.14.0-dev.34.tgz",
+      "integrity": "sha512-mc4Ue07QjYcb4yV0ZXap2AJBLlBAk0owO3fHKWovQA9Ig2XXlxlAUesk9RxPYKj9zIpDZXYMPUC3iKIdUi5SUA==",
+      "dev": true,
+      "license": "Apache-2.0"
+    },
+    "node_modules/@prisma/engines": {
+      "version": "5.14.0-dev.34",
+      "resolved": "https://registry.npmjs.org/@prisma/engines/-/engines-5.14.0-dev.34.tgz",
+      "integrity": "sha512-RWkQHOPxSfy0ANoE0hhrDTf7SuNACILx/LTM1LINlWSYG+Ev/do+5RFbrCv6liCxi1fRZuuhtTux9sH56o01cQ==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@prisma/debug": "5.14.0-dev.34",
+        "@prisma/engines-version": "5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361",
+        "@prisma/fetch-engine": "5.14.0-dev.34",
+        "@prisma/get-platform": "5.14.0-dev.34"
+      }
+    },
+    "node_modules/@prisma/engines-version": {
+      "version": "5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361",
+      "resolved": "https://registry.npmjs.org/@prisma/engines-version/-/engines-version-5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361.tgz",
+      "integrity": "sha512-XkTJYtdOIrJkJv/tzXzsaUsfyvp82IWSPx4DlR52G0cyKoqT6lC55daIdsnuEoKPM2jPcL6P7dJENYBMGHQLEg==",
+      "dev": true,
+      "license": "Apache-2.0"
+    },
+    "node_modules/@prisma/fetch-engine": {
+      "version": "5.14.0-dev.34",
+      "resolved": "https://registry.npmjs.org/@prisma/fetch-engine/-/fetch-engine-5.14.0-dev.34.tgz",
+      "integrity": "sha512-Ieqp/Zfq7KaZWndJAq2K0Z5r77DBPyvXlKXbztXnyvoQhce+9QTkjwJ8U3dOHUwSwNqIb6TY7j1dal3epSUZkg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@prisma/debug": "5.14.0-dev.34",
+        "@prisma/engines-version": "5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361",
+        "@prisma/get-platform": "5.14.0-dev.34"
+      }
+    },
+    "node_modules/@prisma/generator-helper": {
+      "version": "5.14.0-dev.34",
+      "resolved": "https://registry.npmjs.org/@prisma/generator-helper/-/generator-helper-5.14.0-dev.34.tgz",
+      "integrity": "sha512-AsY7piYVHtaGf/TjSoK2j7pZmG+xX/Mqv/VQMNJmfJDEGAnt1fXg6e6veSGLm/SqxA3JJhVCaX3XUHYDeXnsOg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@prisma/debug": "5.14.0-dev.34"
+      }
+    },
+    "node_modules/@prisma/get-platform": {
+      "version": "5.14.0-dev.34",
+      "resolved": "https://registry.npmjs.org/@prisma/get-platform/-/get-platform-5.14.0-dev.34.tgz",
+      "integrity": "sha512-JlzzUMQKsj1cFMXiGMkqrdP7dl3OZtZQapEeCAoH42J6GCrEuV+qNhTOlkywyNuFDj+j1VjfE7p9HRFO1+kiiw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@prisma/debug": "5.14.0-dev.34"
+      }
+    },
+    "node_modules/@prisma/internals": {
+      "version": "5.14.0-dev.34",
+      "resolved": "https://registry.npmjs.org/@prisma/internals/-/internals-5.14.0-dev.34.tgz",
+      "integrity": "sha512-FKToi0h7DFkSZ+eAo737RisLAlRrHq2VPRnm53aVe7LH1J4qwVhl7U+Gy9CsifUgi5VDX311M2W5hyaRcBs46A==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@prisma/debug": "5.14.0-dev.34",
+        "@prisma/engines": "5.14.0-dev.34",
+        "@prisma/fetch-engine": "5.14.0-dev.34",
+        "@prisma/generator-helper": "5.14.0-dev.34",
+        "@prisma/get-platform": "5.14.0-dev.34",
+        "@prisma/prisma-schema-wasm": "5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361",
+        "@prisma/schema-files-loader": "5.14.0-dev.34",
+        "arg": "5.0.2",
+        "prompts": "2.4.2"
+      }
+    },
+    "node_modules/@prisma/prisma-schema-wasm": {
+      "version": "5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361",
+      "resolved": "https://registry.npmjs.org/@prisma/prisma-schema-wasm/-/prisma-schema-wasm-5.14.0-6.264f24ce0b2f544ff968ff76bfaa999de1161361.tgz",
+      "integrity": "sha512-lMNW0WEI+eP5gPn+blBj2yK2znvQlWQbbcOdbqR6PmOOMZRPXbfoC1LgxFn0QrZalJ1csJSFPjmQiYcrv9/39w==",
+      "dev": true,
+      "license": "Apache-2.0"
+    },
+    "node_modules/@prisma/schema-files-loader": {
+      "version": "5.14.0-dev.34",
+      "resolved": "https://registry.npmjs.org/@prisma/schema-files-loader/-/schema-files-loader-5.14.0-dev.34.tgz",
+      "integrity": "sha512-oO0dMzBJbNN3OwcNpRpKO6iq/rqWg02OKBeUI+Qy3Cwrqo5SlKO+DeolkUnx2PPWiHitDX/8UkGRBkMRG0HI9g==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "fs-extra": "11.1.1"
+      }
+    },
+    "node_modules/@prisma/schema-files-loader/node_modules/fs-extra": {
+      "version": "11.1.1",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.1.1.tgz",
+      "integrity": "sha512-MGIE4HOvQCeUCzmlHs0vXpih4ysz4wg9qiSAu6cd42lVwPbTM1TjV7RusoyQqMmk/95gdQZX72u+YW+c3eEpFQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.2.0",
+        "jsonfile": "^6.0.1",
+        "universalify": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=14.14"
+      }
+    },
+    "node_modules/@prisma/schema-files-loader/node_modules/jsonfile": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
+      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "universalify": "^2.0.0"
+      },
+      "optionalDependencies": {
+        "graceful-fs": "^4.1.6"
+      }
+    },
+    "node_modules/@prisma/schema-files-loader/node_modules/universalify": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz",
+      "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 10.0.0"
+      }
+    },
+    "node_modules/@rollup/plugin-json": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/@rollup/plugin-json/-/plugin-json-6.1.0.tgz",
+      "integrity": "sha512-EGI2te5ENk1coGeADSIwZ7G2Q8CJS2sF120T7jLw4xFw9n7wIOXHo+kIYRAoVpJAN+kmqZSoO3Fp4JtoNF4ReA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@rollup/pluginutils": "^5.1.0"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "rollup": "^1.20.0||^2.0.0||^3.0.0||^4.0.0"
+      },
+      "peerDependenciesMeta": {
+        "rollup": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@rollup/pluginutils": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.2.0.tgz",
+      "integrity": "sha512-qWJ2ZTbmumwiLFomfzTyt5Kng4hwPi9rwCYN4SHb6eaRU1KNO4ccxINHr/VhH4GgPlt1XfSTLX2LBTme8ne4Zw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "^1.0.0",
+        "estree-walker": "^2.0.2",
+        "picomatch": "^4.0.2"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "rollup": "^1.20.0||^2.0.0||^3.0.0||^4.0.0"
+      },
+      "peerDependenciesMeta": {
+        "rollup": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@rollup/rollup-android-arm-eabi": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.44.1.tgz",
+      "integrity": "sha512-JAcBr1+fgqx20m7Fwe1DxPUl/hPkee6jA6Pl7n1v2EFiktAHenTaXl5aIFjUIEsfn9w3HE4gK1lEgNGMzBDs1w==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-android-arm64": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.44.1.tgz",
+      "integrity": "sha512-RurZetXqTu4p+G0ChbnkwBuAtwAbIwJkycw1n6GvlGlBuS4u5qlr5opix8cBAYFJgaY05TWtM+LaoFggUmbZEQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-arm64": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.44.1.tgz",
+      "integrity": "sha512-fM/xPesi7g2M7chk37LOnmnSTHLG/v2ggWqKj3CCA1rMA4mm5KVBT1fNoswbo1JhPuNNZrVwpTvlCVggv8A2zg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-x64": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.44.1.tgz",
+      "integrity": "sha512-gDnWk57urJrkrHQ2WVx9TSVTH7lSlU7E3AFqiko+bgjlh78aJ88/3nycMax52VIVjIm3ObXnDL2H00e/xzoipw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-freebsd-arm64": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.44.1.tgz",
+      "integrity": "sha512-wnFQmJ/zPThM5zEGcnDcCJeYJgtSLjh1d//WuHzhf6zT3Md1BvvhJnWoy+HECKu2bMxaIcfWiu3bJgx6z4g2XA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-freebsd-x64": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.44.1.tgz",
+      "integrity": "sha512-uBmIxoJ4493YATvU2c0upGz87f99e3wop7TJgOA/bXMFd2SvKCI7xkxY/5k50bv7J6dw1SXT4MQBQSLn8Bb/Uw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.44.1.tgz",
+      "integrity": "sha512-n0edDmSHlXFhrlmTK7XBuwKlG5MbS7yleS1cQ9nn4kIeW+dJH+ExqNgQ0RrFRew8Y+0V/x6C5IjsHrJmiHtkxQ==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-musleabihf": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.44.1.tgz",
+      "integrity": "sha512-8WVUPy3FtAsKSpyk21kV52HCxB+me6YkbkFHATzC2Yd3yuqHwy2lbFL4alJOLXKljoRw08Zk8/xEj89cLQ/4Nw==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-gnu": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.44.1.tgz",
+      "integrity": "sha512-yuktAOaeOgorWDeFJggjuCkMGeITfqvPgkIXhDqsfKX8J3jGyxdDZgBV/2kj/2DyPaLiX6bPdjJDTu9RB8lUPQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-musl": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.44.1.tgz",
+      "integrity": "sha512-W+GBM4ifET1Plw8pdVaecwUgxmiH23CfAUj32u8knq0JPFyK4weRy6H7ooxYFD19YxBulL0Ktsflg5XS7+7u9g==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-loongarch64-gnu": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loongarch64-gnu/-/rollup-linux-loongarch64-gnu-4.44.1.tgz",
+      "integrity": "sha512-1zqnUEMWp9WrGVuVak6jWTl4fEtrVKfZY7CvcBmUUpxAJ7WcSowPSAWIKa/0o5mBL/Ij50SIf9tuirGx63Ovew==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.44.1.tgz",
+      "integrity": "sha512-Rl3JKaRu0LHIx7ExBAAnf0JcOQetQffaw34T8vLlg9b1IhzcBgaIdnvEbbsZq9uZp3uAH+JkHd20Nwn0h9zPjA==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-gnu": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.44.1.tgz",
+      "integrity": "sha512-j5akelU3snyL6K3N/iX7otLBIl347fGwmd95U5gS/7z6T4ftK288jKq3A5lcFKcx7wwzb5rgNvAg3ZbV4BqUSw==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-musl": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.44.1.tgz",
+      "integrity": "sha512-ppn5llVGgrZw7yxbIm8TTvtj1EoPgYUAbfw0uDjIOzzoqlZlZrLJ/KuiE7uf5EpTpCTrNt1EdtzF0naMm0wGYg==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-s390x-gnu": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.44.1.tgz",
+      "integrity": "sha512-Hu6hEdix0oxtUma99jSP7xbvjkUM/ycke/AQQ4EC5g7jNRLLIwjcNwaUy95ZKBJJwg1ZowsclNnjYqzN4zwkAw==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-gnu": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.44.1.tgz",
+      "integrity": "sha512-EtnsrmZGomz9WxK1bR5079zee3+7a+AdFlghyd6VbAjgRJDbTANJ9dcPIPAi76uG05micpEL+gPGmAKYTschQw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-musl": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.44.1.tgz",
+      "integrity": "sha512-iAS4p+J1az6Usn0f8xhgL4PaU878KEtutP4hqw52I4IO6AGoyOkHCxcc4bqufv1tQLdDWFx8lR9YlwxKuv3/3g==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-arm64-msvc": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.44.1.tgz",
+      "integrity": "sha512-NtSJVKcXwcqozOl+FwI41OH3OApDyLk3kqTJgx8+gp6On9ZEt5mYhIsKNPGuaZr3p9T6NWPKGU/03Vw4CNU9qg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-ia32-msvc": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.44.1.tgz",
+      "integrity": "sha512-JYA3qvCOLXSsnTR3oiyGws1Dm0YTuxAAeaYGVlGpUsHqloPcFjPg+X0Fj2qODGLNwQOAcCiQmHub/V007kiH5A==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-msvc": {
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.44.1.tgz",
+      "integrity": "sha512-J8o22LuF0kTe7m+8PvW9wk3/bRq5+mRo5Dqo6+vXb7otCm3TPhYOJqOaQtGU9YMWQSL3krMnoOxMr0+9E6F3Ug==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/wasm-node": {
+      "version": "4.46.3",
+      "resolved": "https://registry.npmjs.org/@rollup/wasm-node/-/wasm-node-4.46.3.tgz",
+      "integrity": "sha512-NGR+/BhdrQ+E+ikPFlXbDU9ZswRPn4esRjeWY64/HB8a4QUxKXt3X+rouUMK1xBwZPJ1rweHcCvvFBcWTyh4UA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "1.0.8"
+      },
+      "bin": {
+        "rollup": "dist/bin/rollup"
+      },
+      "engines": {
+        "node": ">=18.0.0",
+        "npm": ">=8.0.0"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.2"
+      }
+    },
+    "node_modules/@rtsao/scc": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@rtsao/scc/-/scc-1.1.0.tgz",
+      "integrity": "sha512-zt6OdqaDoOnJ1ZYsCYGt9YmWzDXl4vQdKTyJev62gFhRGKdx7mcT54V9KIjg+d2wi9EXsPvAPKe7i7WjfVWB8g==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@sagold/json-pointer": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/@sagold/json-pointer/-/json-pointer-5.1.2.tgz",
+      "integrity": "sha512-+wAhJZBXa6MNxRScg6tkqEbChEHMgVZAhTHVJ60Y7sbtXtu9XA49KfUkdWlS2x78D6H9nryiKePiYozumauPfA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@sagold/json-query": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/@sagold/json-query/-/json-query-6.2.0.tgz",
+      "integrity": "sha512-7bOIdUE6eHeoWtFm8TvHQHfTVSZuCs+3RpOKmZCDBIOrxpvF/rNFTeuvIyjHva/RR0yVS3kQtr+9TW72LQEZjA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@sagold/json-pointer": "^5.1.2",
+        "ebnf": "^1.9.1"
+      }
+    },
+    "node_modules/@scaleleap/pg-format": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/@scaleleap/pg-format/-/pg-format-1.0.0.tgz",
+      "integrity": "sha512-gFkcYMnpeylF2OJ30FsDBjwICB9JTiZ5i3guPwdiBDrJFwIKr+Zk6jwI8Mg22a4FwXn5ezd5cHEFMKqBqBz4RQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@schematics/angular": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-20.1.6.tgz",
+      "integrity": "sha512-1dE+GkpSZbsQxnir/S24g3+pA5sE0XOMxa4Wxhon0dxArP/gH72hsinoVaLDfcQkYOtbbTw/Q8VV41uWBI9eGg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/core": "20.1.6",
+        "@angular-devkit/schematics": "20.1.6",
+        "jsonc-parser": "3.3.1"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/@schematics/angular/node_modules/@angular-devkit/core": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-20.1.6.tgz",
+      "integrity": "sha512-Wooe+nTmHOLvveBQWDmSsdKg39re5BUMGVkwKlPHTQ/YU9aYshvPEBu1K0l4gSqe3qtqVVAx0HlPb53bEFFa8w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ajv": "8.17.1",
+        "ajv-formats": "3.0.1",
+        "jsonc-parser": "3.3.1",
+        "picomatch": "4.0.2",
+        "rxjs": "7.8.2",
+        "source-map": "0.7.4"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      },
+      "peerDependencies": {
+        "chokidar": "^4.0.0"
+      },
+      "peerDependenciesMeta": {
+        "chokidar": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@schematics/angular/node_modules/@angular-devkit/schematics": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-20.1.6.tgz",
+      "integrity": "sha512-Maj/yCkn3Qjum2kCYUOYMw8VYh/8725XN8/4cae9VllMwkN5D8jYDvX40qmfgQve2x0x6r3L8rmaIHn8227cHg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/core": "20.1.6",
+        "jsonc-parser": "3.3.1",
+        "magic-string": "0.30.17",
+        "ora": "8.2.0",
+        "rxjs": "7.8.2"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/@schematics/angular/node_modules/chalk": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.6.0.tgz",
+      "integrity": "sha512-46QrSQFyVSEyYAgQ22hQ+zDa60YHA4fBstHmtSApj1Y5vKtG27fWowW03jCk5KcbXEWPZUIR894aARCA/G1kfQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/@schematics/angular/node_modules/is-interactive": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-2.0.0.tgz",
+      "integrity": "sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@schematics/angular/node_modules/is-unicode-supported": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-2.1.0.tgz",
+      "integrity": "sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@schematics/angular/node_modules/log-symbols": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-6.0.0.tgz",
+      "integrity": "sha512-i24m8rpwhmPIS4zscNzK6MSEhk0DUWa/8iYQWxhffV8jkI4Phvs3F+quL5xvS0gdQR0FyTCMMH33Y78dDTzzIw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^5.3.0",
+        "is-unicode-supported": "^1.3.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@schematics/angular/node_modules/log-symbols/node_modules/is-unicode-supported": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-1.3.0.tgz",
+      "integrity": "sha512-43r2mRvz+8JRIKnWJ+3j8JtjRKZ6GmjzfaE/qiBJnikNnYv/6bagRJ1kUhNk8R5EX/GkobD+r+sfxCPJsiKBLQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@schematics/angular/node_modules/ora": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/ora/-/ora-8.2.0.tgz",
+      "integrity": "sha512-weP+BZ8MVNnlCm8c0Qdc1WSWq4Qn7I+9CJGm7Qali6g44e/PUzbjNqJX5NJ9ljlNMosfJvg1fKEGILklK9cwnw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^5.3.0",
+        "cli-cursor": "^5.0.0",
+        "cli-spinners": "^2.9.2",
+        "is-interactive": "^2.0.0",
+        "is-unicode-supported": "^2.0.0",
+        "log-symbols": "^6.0.0",
+        "stdin-discarder": "^0.2.2",
+        "string-width": "^7.2.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@sigstore/bundle": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@sigstore/bundle/-/bundle-3.1.0.tgz",
+      "integrity": "sha512-Mm1E3/CmDDCz3nDhFKTuYdB47EdRFRQMOE/EAbiG1MJW77/w1b3P7Qx7JSrVJs8PfwOLOVcKQCHErIwCTyPbag==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@sigstore/protobuf-specs": "^0.4.0"
+      },
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
+    "node_modules/@sigstore/core": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@sigstore/core/-/core-2.0.0.tgz",
+      "integrity": "sha512-nYxaSb/MtlSI+JWcwTHQxyNmWeWrUXJJ/G4liLrGG7+tS4vAz6LF3xRXqLH6wPIVUoZQel2Fs4ddLx4NCpiIYg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
+    "node_modules/@sigstore/protobuf-specs": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/@sigstore/protobuf-specs/-/protobuf-specs-0.4.3.tgz",
+      "integrity": "sha512-fk2zjD9117RL9BjqEwF7fwv7Q/P9yGsMV4MUJZ/DocaQJ6+3pKr+syBq1owU5Q5qGw5CUbXzm+4yJ2JVRDQeSA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
+    "node_modules/@sigstore/sign": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@sigstore/sign/-/sign-3.1.0.tgz",
+      "integrity": "sha512-knzjmaOHOov1Ur7N/z4B1oPqZ0QX5geUfhrVaqVlu+hl0EAoL4o+l0MSULINcD5GCWe3Z0+YJO8ues6vFlW0Yw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@sigstore/bundle": "^3.1.0",
+        "@sigstore/core": "^2.0.0",
+        "@sigstore/protobuf-specs": "^0.4.0",
+        "make-fetch-happen": "^14.0.2",
+        "proc-log": "^5.0.0",
+        "promise-retry": "^2.0.1"
+      },
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
+    "node_modules/@sigstore/tuf": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/@sigstore/tuf/-/tuf-3.1.1.tgz",
+      "integrity": "sha512-eFFvlcBIoGwVkkwmTi/vEQFSva3xs5Ot3WmBcjgjVdiaoelBLQaQ/ZBfhlG0MnG0cmTYScPpk7eDdGDWUcFUmg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@sigstore/protobuf-specs": "^0.4.1",
+        "tuf-js": "^3.0.1"
+      },
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
+    "node_modules/@sigstore/verify": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/@sigstore/verify/-/verify-2.1.1.tgz",
+      "integrity": "sha512-hVJD77oT67aowHxwT4+M6PGOp+E2LtLdTK3+FC0lBO9T7sYwItDMXZ7Z07IDCvR1M717a4axbIWckrW67KMP/w==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@sigstore/bundle": "^3.1.0",
+        "@sigstore/core": "^2.0.0",
+        "@sigstore/protobuf-specs": "^0.4.1"
+      },
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
+    "node_modules/@snaplet/copycat": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@snaplet/copycat/-/copycat-6.0.0.tgz",
+      "integrity": "sha512-ZBxlsWfhd+fxubKHrZglUQmSxHe70sGxHqTPiIBqoqX/41jABG8VCbgB8KrMm8to6V6Y/tBMqQUGzuWFFNHimg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@faker-js/faker": "^8.4.1",
+        "fictional": "^3.0.1",
+        "string-argv": "^0.3.2",
+        "uuid": "^9.0.1"
+      }
+    },
+    "node_modules/@snaplet/seed": {
+      "version": "0.98.0",
+      "resolved": "https://registry.npmjs.org/@snaplet/seed/-/seed-0.98.0.tgz",
+      "integrity": "sha512-qLh7e596mKbY3DZW1CryhYyZdFJ/irAU760t00ac1VHsx/1Brfu3jpc6Bq69XBRZ6I3/nqPDlRckVP//bpFUMQ==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "FSL-1.1-MIT",
+      "dependencies": {
+        "@inquirer/prompts": "^5.0.2",
+        "@langchain/core": "^0.2.18",
+        "@langchain/groq": "^0.0.15",
+        "@langchain/openai": "^0.2.4",
+        "@prisma/generator-helper": "5.14.0-dev.34",
+        "@prisma/internals": "5.14.0-dev.34",
+        "@scaleleap/pg-format": "^1.0.0",
+        "@total-typescript/ts-reset": "^0.5.1",
+        "ansi-escapes": "^6.2.1",
+        "c12": "^1.10.0",
+        "change-case": "^5.4.4",
+        "debug": "^4.3.4",
+        "dedent": "^1.5.3",
+        "execa": "^8.0.1",
+        "exit-hook": "^4.0.0",
+        "find-up": "^7.0.0",
+        "fs-extra": "^11.2.0",
+        "inflection": "^3.0.0",
+        "javascript-stringify": "^2.1.0",
+        "json-schema-library": "^9.3.4",
+        "kleur": "^4.1.5",
+        "multimatch": "^7.0.0",
+        "ora": "^8.0.1",
+        "quicktype-core": "23.0.149",
+        "remeda": "^1.61.0",
+        "sqlstring": "^2.3.3",
+        "terminal-link": "^3.0.0",
+        "uuid": "^9.0.1",
+        "yargs": "^17.7.2",
+        "zod": "^3.23.5"
+      },
+      "bin": {
+        "snaplet-seed": "bin/cli.js"
+      },
+      "engines": {
+        "node": ">=18.5.0"
+      },
+      "peerDependencies": {
+        "@prisma/client": ">=5",
+        "@snaplet/copycat": ">=2",
+        "@types/better-sqlite3": "*",
+        "@types/pg": "*",
+        "better-sqlite3": ">=9",
+        "mysql2": ">=3",
+        "pg": ">=8",
+        "postgres": ">=3"
+      },
+      "peerDependenciesMeta": {
+        "@prisma/client": {
+          "optional": true
+        },
+        "@types/better-sqlite3": {
+          "optional": true
+        },
+        "@types/pg": {
+          "optional": true
+        },
+        "better-sqlite3": {
+          "optional": true
+        },
+        "mysql2": {
+          "optional": true
+        },
+        "pg": {
+          "optional": true
+        },
+        "postgres": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/checkbox": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/checkbox/-/checkbox-2.5.0.tgz",
+      "integrity": "sha512-sMgdETOfi2dUHT8r7TT1BTKOwNvdDGFDXYWtQ2J69SvlYNntk9I/gJe7r5yvMwwsuKnYbuRs3pNhx4tgNck5aA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^9.1.0",
+        "@inquirer/figures": "^1.0.5",
+        "@inquirer/type": "^1.5.3",
+        "ansi-escapes": "^4.3.2",
+        "yoctocolors-cjs": "^2.1.2"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/checkbox/node_modules/ansi-escapes": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
+      "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "type-fest": "^0.21.3"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/confirm": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-3.2.0.tgz",
+      "integrity": "sha512-oOIwPs0Dvq5220Z8lGL/6LHRTEr9TgLHmiI99Rj1PJ1p1czTys+olrgBqZk4E2qC0YTzeHprxSQmoHioVdJ7Lw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^9.1.0",
+        "@inquirer/type": "^1.5.3"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/core": {
+      "version": "9.2.1",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-9.2.1.tgz",
+      "integrity": "sha512-F2VBt7W/mwqEU4bL0RnHNZmC/OxzNx9cOYxHqnXX3MP6ruYvZUZAW9imgN9+h/uBT/oP8Gh888J2OZSbjSeWcg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/figures": "^1.0.6",
+        "@inquirer/type": "^2.0.0",
+        "@types/mute-stream": "^0.0.4",
+        "@types/node": "^22.5.5",
+        "@types/wrap-ansi": "^3.0.0",
+        "ansi-escapes": "^4.3.2",
+        "cli-width": "^4.1.0",
+        "mute-stream": "^1.0.0",
+        "signal-exit": "^4.1.0",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^6.2.0",
+        "yoctocolors-cjs": "^2.1.2"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/core/node_modules/@inquirer/type": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-2.0.0.tgz",
+      "integrity": "sha512-XvJRx+2KR3YXyYtPUUy+qd9i7p+GO9Ko6VIIpWlBrpWwXDv8WLFeHTxz35CfQFUiBMLXlGHhGzys7lqit9gWag==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mute-stream": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/core/node_modules/ansi-escapes": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
+      "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "type-fest": "^0.21.3"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/core/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/editor": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/editor/-/editor-2.2.0.tgz",
+      "integrity": "sha512-9KHOpJ+dIL5SZli8lJ6xdaYLPPzB8xB9GZItg39MBybzhxA16vxmszmQFrRwbOA918WA2rvu8xhDEg/p6LXKbw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^9.1.0",
+        "@inquirer/type": "^1.5.3",
+        "external-editor": "^3.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/expand": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/expand/-/expand-2.3.0.tgz",
+      "integrity": "sha512-qnJsUcOGCSG1e5DTOErmv2BPQqrtT6uzqn1vI/aYGiPKq+FgslGZmtdnXbhuI7IlT7OByDoEEqdnhUnVR2hhLw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^9.1.0",
+        "@inquirer/type": "^1.5.3",
+        "yoctocolors-cjs": "^2.1.2"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/input": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/input/-/input-2.3.0.tgz",
+      "integrity": "sha512-XfnpCStx2xgh1LIRqPXrTNEEByqQWoxsWYzNRSEUxJ5c6EQlhMogJ3vHKu8aXuTacebtaZzMAHwEL0kAflKOBw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^9.1.0",
+        "@inquirer/type": "^1.5.3"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/number": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/number/-/number-1.1.0.tgz",
+      "integrity": "sha512-ilUnia/GZUtfSZy3YEErXLJ2Sljo/mf9fiKc08n18DdwdmDbOzRcTv65H1jjDvlsAuvdFXf4Sa/aL7iw/NanVA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^9.1.0",
+        "@inquirer/type": "^1.5.3"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/password": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/password/-/password-2.2.0.tgz",
+      "integrity": "sha512-5otqIpgsPYIshqhgtEwSspBQE40etouR8VIxzpJkv9i0dVHIpyhiivbkH9/dGiMLdyamT54YRdGJLfl8TFnLHg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^9.1.0",
+        "@inquirer/type": "^1.5.3",
+        "ansi-escapes": "^4.3.2"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/password/node_modules/ansi-escapes": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
+      "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "type-fest": "^0.21.3"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/prompts": {
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/prompts/-/prompts-5.5.0.tgz",
+      "integrity": "sha512-BHDeL0catgHdcHbSFFUddNzvx/imzJMft+tWDPwTm3hfu8/tApk1HrooNngB2Mb4qY+KaRWF+iZqoVUPeslEog==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/checkbox": "^2.5.0",
+        "@inquirer/confirm": "^3.2.0",
+        "@inquirer/editor": "^2.2.0",
+        "@inquirer/expand": "^2.3.0",
+        "@inquirer/input": "^2.3.0",
+        "@inquirer/number": "^1.1.0",
+        "@inquirer/password": "^2.2.0",
+        "@inquirer/rawlist": "^2.3.0",
+        "@inquirer/search": "^1.1.0",
+        "@inquirer/select": "^2.5.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/rawlist": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/rawlist/-/rawlist-2.3.0.tgz",
+      "integrity": "sha512-zzfNuINhFF7OLAtGHfhwOW2TlYJyli7lOUoJUXw/uyklcwalV6WRXBXtFIicN8rTRK1XTiPWB4UY+YuW8dsnLQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^9.1.0",
+        "@inquirer/type": "^1.5.3",
+        "yoctocolors-cjs": "^2.1.2"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/search": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/search/-/search-1.1.0.tgz",
+      "integrity": "sha512-h+/5LSj51dx7hp5xOn4QFnUaKeARwUCLs6mIhtkJ0JYPBLmEYjdHSYh7I6GrLg9LwpJ3xeX0FZgAG1q0QdCpVQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^9.1.0",
+        "@inquirer/figures": "^1.0.5",
+        "@inquirer/type": "^1.5.3",
+        "yoctocolors-cjs": "^2.1.2"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/select": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/select/-/select-2.5.0.tgz",
+      "integrity": "sha512-YmDobTItPP3WcEI86GvPo+T2sRHkxxOq/kXmsBjHS5BVXUgvgZ5AfJjkvQvZr03T81NnI3KrrRuMzeuYUQRFOA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^9.1.0",
+        "@inquirer/figures": "^1.0.5",
+        "@inquirer/type": "^1.5.3",
+        "ansi-escapes": "^4.3.2",
+        "yoctocolors-cjs": "^2.1.2"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/select/node_modules/ansi-escapes": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
+      "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "type-fest": "^0.21.3"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@inquirer/type": {
+      "version": "1.5.5",
+      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-1.5.5.tgz",
+      "integrity": "sha512-MzICLu4yS7V8AA61sANROZ9vT1H3ooca5dSmI1FjZkzq7o/koMsRfQSzRtFo+F3Ao4Sf1C0bpLKejpKB/+j6MA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mute-stream": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/@types/node": {
+      "version": "22.15.21",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-22.15.21.tgz",
+      "integrity": "sha512-EV/37Td6c+MgKAbkcLG6vqZ2zEYHD7bvSrzqqs2RIhbA6w3x+Dqz8MZM3sP6kGTeLrdoOgKZe+Xja7tUB2DNkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": "~6.21.0"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/ansi-escapes": {
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-6.2.1.tgz",
+      "integrity": "sha512-4nJ3yixlEthEJ9Rk4vPcdBRkZvQZlYyu8j4/Mqz5sgIkddmEnH2Yj2ZrnP9S3tQOvSNRUIgVNF/1yPpRAGNRig==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/chalk": {
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.4.1.tgz",
+      "integrity": "sha512-zgVZuo2WcZgfUEmsn6eO3kINexW8RAE4maiQ8QNs8CtpPCSyMiYsULR3HQYkm3w8FIA3SberyMJMSldGsW+U3w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/find-up": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-7.0.0.tgz",
+      "integrity": "sha512-YyZM99iHrqLKjmt4LJDj58KI+fYyufRLBSYcqycxf//KpBk9FoewoGX0450m9nB44qrZnovzC2oeP5hUibxc/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "locate-path": "^7.2.0",
+        "path-exists": "^5.0.0",
+        "unicorn-magic": "^0.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/fs-extra": {
+      "version": "11.3.0",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.0.tgz",
+      "integrity": "sha512-Z4XaCL6dUDHfP/jT25jJKMmtxvuwbkrD1vNSMFlo9lNLY2c5FHYSQgHPRZUjAB26TpDEoW9HCOgplrdbaPV/ew==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.2.0",
+        "jsonfile": "^6.0.1",
+        "universalify": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=14.14"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/is-interactive": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-2.0.0.tgz",
+      "integrity": "sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/is-unicode-supported": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-2.1.0.tgz",
+      "integrity": "sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/jsonfile": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
+      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "universalify": "^2.0.0"
+      },
+      "optionalDependencies": {
+        "graceful-fs": "^4.1.6"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/log-symbols": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-6.0.0.tgz",
+      "integrity": "sha512-i24m8rpwhmPIS4zscNzK6MSEhk0DUWa/8iYQWxhffV8jkI4Phvs3F+quL5xvS0gdQR0FyTCMMH33Y78dDTzzIw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^5.3.0",
+        "is-unicode-supported": "^1.3.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/log-symbols/node_modules/is-unicode-supported": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-1.3.0.tgz",
+      "integrity": "sha512-43r2mRvz+8JRIKnWJ+3j8JtjRKZ6GmjzfaE/qiBJnikNnYv/6bagRJ1kUhNk8R5EX/GkobD+r+sfxCPJsiKBLQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/mute-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-1.0.0.tgz",
+      "integrity": "sha512-avsJQhyd+680gKXyG/sQc0nXaC6rBkPOfyHYcFb9+hdkqQkR9bdnkJ0AMZhke0oesPqIO+mFFJ+IdBc7mst4IA==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^14.17.0 || ^16.13.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/ora": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/ora/-/ora-8.2.0.tgz",
+      "integrity": "sha512-weP+BZ8MVNnlCm8c0Qdc1WSWq4Qn7I+9CJGm7Qali6g44e/PUzbjNqJX5NJ9ljlNMosfJvg1fKEGILklK9cwnw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^5.3.0",
+        "cli-cursor": "^5.0.0",
+        "cli-spinners": "^2.9.2",
+        "is-interactive": "^2.0.0",
+        "is-unicode-supported": "^2.0.0",
+        "log-symbols": "^6.0.0",
+        "stdin-discarder": "^0.2.2",
+        "string-width": "^7.2.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/unicorn-magic": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.1.0.tgz",
+      "integrity": "sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@snaplet/seed/node_modules/universalify": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz",
+      "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 10.0.0"
+      }
+    },
+    "node_modules/@socket.io/component-emitter": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.2.tgz",
+      "integrity": "sha512-9BCxFwvbGg/RsZK9tjXd8s4UcwR0MWeFQ1XEKIQVVvAGJyINdrqKMcTRyLoK8Rse1GjzLV9cwjWV1olXRWEXVA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@supabase/auth-js": {
+      "version": "2.69.1",
+      "resolved": "https://registry.npmjs.org/@supabase/auth-js/-/auth-js-2.69.1.tgz",
+      "integrity": "sha512-FILtt5WjCNzmReeRLq5wRs3iShwmnWgBvxHfqapC/VoljJl+W8hDAyFmf1NVw3zH+ZjZ05AKxiKxVeb0HNWRMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@supabase/node-fetch": "^2.6.14"
+      }
+    },
+    "node_modules/@supabase/functions-js": {
+      "version": "2.4.4",
+      "resolved": "https://registry.npmjs.org/@supabase/functions-js/-/functions-js-2.4.4.tgz",
+      "integrity": "sha512-WL2p6r4AXNGwop7iwvul2BvOtuJ1YQy8EbOd0dhG1oN1q8el/BIRSFCFnWAMM/vJJlHWLi4ad22sKbKr9mvjoA==",
+      "license": "MIT",
+      "dependencies": {
+        "@supabase/node-fetch": "^2.6.14"
+      }
+    },
+    "node_modules/@supabase/node-fetch": {
+      "version": "2.6.15",
+      "resolved": "https://registry.npmjs.org/@supabase/node-fetch/-/node-fetch-2.6.15.tgz",
+      "integrity": "sha512-1ibVeYUacxWYi9i0cf5efil6adJ9WRyZBLivgjs+AUpewx1F3xPi7gLgaASI2SmIQxPoCEjAsLAzKPgMJVgOUQ==",
+      "license": "MIT",
+      "dependencies": {
+        "whatwg-url": "^5.0.0"
       },
       "engines": {
-        "node": ">=18.5.0"
+        "node": "4.x || >=6.0.0"
+      }
+    },
+    "node_modules/@supabase/postgrest-js": {
+      "version": "1.19.4",
+      "resolved": "https://registry.npmjs.org/@supabase/postgrest-js/-/postgrest-js-1.19.4.tgz",
+      "integrity": "sha512-O4soKqKtZIW3olqmbXXbKugUtByD2jPa8kL2m2c1oozAO11uCcGrRhkZL0kVxjBLrXHE0mdSkFsMj7jDSfyNpw==",
+      "license": "MIT",
+      "dependencies": {
+        "@supabase/node-fetch": "^2.6.14"
+      }
+    },
+    "node_modules/@supabase/realtime-js": {
+      "version": "2.11.2",
+      "resolved": "https://registry.npmjs.org/@supabase/realtime-js/-/realtime-js-2.11.2.tgz",
+      "integrity": "sha512-u/XeuL2Y0QEhXSoIPZZwR6wMXgB+RQbJzG9VErA3VghVt7uRfSVsjeqd7m5GhX3JR6dM/WRmLbVR8URpDWG4+w==",
+      "license": "MIT",
+      "dependencies": {
+        "@supabase/node-fetch": "^2.6.14",
+        "@types/phoenix": "^1.5.4",
+        "@types/ws": "^8.5.10",
+        "ws": "^8.18.0"
+      }
+    },
+    "node_modules/@supabase/realtime-js/node_modules/ws": {
+      "version": "8.18.1",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.1.tgz",
+      "integrity": "sha512-RKW2aJZMXeMxVpnZ6bck+RswznaxmzdULiBr6KY7XkTnW8uvt0iT9H5DkHUChXrc+uurzwa0rVI16n/Xzjdz1w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10.0.0"
       },
       "peerDependencies": {
-        "@prisma/client": ">=5",
-        "@snaplet/copycat": ">=2",
-        "@types/better-sqlite3": "*",
-        "@types/pg": "*",
-        "better-sqlite3": ">=9",
-        "mysql2": ">=3",
-        "pg": ">=8",
-        "postgres": ">=3"
+        "bufferutil": "^4.0.1",
+        "utf-8-validate": ">=5.0.2"
       },
       "peerDependenciesMeta": {
-        "@prisma/client": {
-          "optional": true
-        },
-        "@types/better-sqlite3": {
-          "optional": true
-        },
-        "@types/pg": {
-          "optional": true
-        },
-        "better-sqlite3": {
-          "optional": true
-        },
-        "mysql2": {
-          "optional": true
-        },
-        "pg": {
+        "bufferutil": {
           "optional": true
         },
-        "postgres": {
+        "utf-8-validate": {
           "optional": true
         }
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/checkbox": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/checkbox/-/checkbox-2.5.0.tgz",
-      "integrity": "sha512-sMgdETOfi2dUHT8r7TT1BTKOwNvdDGFDXYWtQ2J69SvlYNntk9I/gJe7r5yvMwwsuKnYbuRs3pNhx4tgNck5aA==",
+    "node_modules/@supabase/storage-js": {
+      "version": "2.7.1",
+      "resolved": "https://registry.npmjs.org/@supabase/storage-js/-/storage-js-2.7.1.tgz",
+      "integrity": "sha512-asYHcyDR1fKqrMpytAS1zjyEfvxuOIp1CIXX7ji4lHHcJKqyk+sLl/Vxgm4sN6u8zvuUtae9e4kDxQP2qrwWBA==",
+      "license": "MIT",
+      "dependencies": {
+        "@supabase/node-fetch": "^2.6.14"
+      }
+    },
+    "node_modules/@supabase/supabase-js": {
+      "version": "2.49.4",
+      "resolved": "https://registry.npmjs.org/@supabase/supabase-js/-/supabase-js-2.49.4.tgz",
+      "integrity": "sha512-jUF0uRUmS8BKt37t01qaZ88H9yV1mbGYnqLeuFWLcdV+x1P4fl0yP9DGtaEhFPZcwSom7u16GkLEH9QJZOqOkw==",
+      "license": "MIT",
+      "dependencies": {
+        "@supabase/auth-js": "2.69.1",
+        "@supabase/functions-js": "2.4.4",
+        "@supabase/node-fetch": "2.6.15",
+        "@supabase/postgrest-js": "1.19.4",
+        "@supabase/realtime-js": "2.11.2",
+        "@supabase/storage-js": "2.7.1"
+      }
+    },
+    "node_modules/@tailwindcss/line-clamp": {
+      "version": "0.4.4",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/line-clamp/-/line-clamp-0.4.4.tgz",
+      "integrity": "sha512-5U6SY5z8N42VtrCrKlsTAA35gy2VSyYtHWCsg1H87NU1SXnEfekTVlrga9fzUDrrHcGi2Lb5KenUWb4lRQT5/g==",
+      "license": "MIT",
+      "peerDependencies": {
+        "tailwindcss": ">=2.0.0 || >=3.0.0 || >=3.0.0-alpha.1"
+      }
+    },
+    "node_modules/@total-typescript/ts-reset": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/@total-typescript/ts-reset/-/ts-reset-0.5.1.tgz",
+      "integrity": "sha512-AqlrT8YA1o7Ff5wPfMOL0pvL+1X+sw60NN6CcOCqs658emD6RfiXhF7Gu9QcfKBH7ELY2nInLhKSCWVoNL70MQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@tsconfig/node10": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.11.tgz",
+      "integrity": "sha512-DcRjDCujK/kCk/cUe8Xz8ZSpm8mS3mNNpta+jGCA6USEDfktlNvm1+IuZ9eTcDbNk41BHwpHHeW+N1lKCz4zOw==",
+      "devOptional": true,
+      "license": "MIT"
+    },
+    "node_modules/@tsconfig/node12": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/@tsconfig/node12/-/node12-1.0.11.tgz",
+      "integrity": "sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==",
+      "devOptional": true,
+      "license": "MIT"
+    },
+    "node_modules/@tsconfig/node14": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@tsconfig/node14/-/node14-1.0.3.tgz",
+      "integrity": "sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==",
+      "devOptional": true,
+      "license": "MIT"
+    },
+    "node_modules/@tsconfig/node16": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@tsconfig/node16/-/node16-1.0.4.tgz",
+      "integrity": "sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==",
+      "devOptional": true,
+      "license": "MIT"
+    },
+    "node_modules/@tufjs/canonical-json": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@tufjs/canonical-json/-/canonical-json-2.0.0.tgz",
+      "integrity": "sha512-yVtV8zsdo8qFHe+/3kw81dSLyF7D576A5cCFCi4X7B39tWT7SekaEFUnvnWJHz+9qO7qJTah1JbrDjWKqFtdWA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^16.14.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@tufjs/models": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/@tufjs/models/-/models-3.0.1.tgz",
+      "integrity": "sha512-UUYHISyhCU3ZgN8yaear3cGATHb3SMuKHsQ/nVbHXcmnBf+LzQ/cQfhNG+rfaSHgqGKNEm2cOCLVLELStUQ1JA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^9.1.0",
-        "@inquirer/figures": "^1.0.5",
-        "@inquirer/type": "^1.5.3",
-        "ansi-escapes": "^4.3.2",
-        "yoctocolors-cjs": "^2.1.2"
+        "@tufjs/canonical-json": "2.0.0",
+        "minimatch": "^9.0.5"
       },
       "engines": {
-        "node": ">=18"
+        "node": "^18.17.0 || >=20.5.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/checkbox/node_modules/ansi-escapes": {
-      "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
-      "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==",
+    "node_modules/@tufjs/models/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "type-fest": "^0.21.3"
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/@tufjs/models/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
       },
       "engines": {
-        "node": ">=8"
+        "node": ">=16 || 14 >=14.17"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/confirm": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-3.2.0.tgz",
-      "integrity": "sha512-oOIwPs0Dvq5220Z8lGL/6LHRTEr9TgLHmiI99Rj1PJ1p1czTys+olrgBqZk4E2qC0YTzeHprxSQmoHioVdJ7Lw==",
+    "node_modules/@tybys/wasm-util": {
+      "version": "0.10.0",
+      "resolved": "https://registry.npmjs.org/@tybys/wasm-util/-/wasm-util-0.10.0.tgz",
+      "integrity": "sha512-VyyPYFlOMNylG45GoAe0xDoLwWuowvf92F9kySqzYh8vmYm7D2u4iUJKa1tOUpS70Ku13ASrOkS4ScXFsTaCNQ==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@types/body-parser": {
+      "version": "1.19.5",
+      "resolved": "https://registry.npmjs.org/@types/body-parser/-/body-parser-1.19.5.tgz",
+      "integrity": "sha512-fB3Zu92ucau0iQ0JMCFQE7b/dv8Ot07NI3KaZIkIUNXq82k4eBAqUaneXfleGY9JWskeS9y+u0nXMyspcuQrCg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/connect": "*",
+        "@types/node": "*"
+      }
+    },
+    "node_modules/@types/compression": {
+      "version": "1.7.5",
+      "resolved": "https://registry.npmjs.org/@types/compression/-/compression-1.7.5.tgz",
+      "integrity": "sha512-AAQvK5pxMpaT+nDvhHrsBhLSYG5yQdtkaJE1WYieSNY2mVFKAgmU4ks65rkZD5oqnGCFLyQpUr1CqI4DmUMyDg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/express": "*"
+      }
+    },
+    "node_modules/@types/connect": {
+      "version": "3.4.38",
+      "resolved": "https://registry.npmjs.org/@types/connect/-/connect-3.4.38.tgz",
+      "integrity": "sha512-K6uROf1LD88uDQqJCktA4yzL1YYAK6NgfsI0v/mTgyPKWsX1CnJ0XPSDhViejru1GcRkLWb8RlzFYJRqGUbaug==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^9.1.0",
-        "@inquirer/type": "^1.5.3"
-      },
-      "engines": {
-        "node": ">=18"
+        "@types/node": "*"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/core": {
-      "version": "9.2.1",
-      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-9.2.1.tgz",
-      "integrity": "sha512-F2VBt7W/mwqEU4bL0RnHNZmC/OxzNx9cOYxHqnXX3MP6ruYvZUZAW9imgN9+h/uBT/oP8Gh888J2OZSbjSeWcg==",
+    "node_modules/@types/cors": {
+      "version": "2.8.17",
+      "resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.17.tgz",
+      "integrity": "sha512-8CGDvrBj1zgo2qE+oS3pOCyYNqCPryMWY2bGfwA0dcfopWGgxs+78df0Rs3rc9THP4JkOhLsAa+15VdpAqkcUA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/figures": "^1.0.6",
-        "@inquirer/type": "^2.0.0",
-        "@types/mute-stream": "^0.0.4",
-        "@types/node": "^22.5.5",
-        "@types/wrap-ansi": "^3.0.0",
-        "ansi-escapes": "^4.3.2",
-        "cli-width": "^4.1.0",
-        "mute-stream": "^1.0.0",
-        "signal-exit": "^4.1.0",
-        "strip-ansi": "^6.0.1",
-        "wrap-ansi": "^6.2.0",
-        "yoctocolors-cjs": "^2.1.2"
-      },
-      "engines": {
-        "node": ">=18"
+        "@types/node": "*"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/core/node_modules/@inquirer/type": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-2.0.0.tgz",
-      "integrity": "sha512-XvJRx+2KR3YXyYtPUUy+qd9i7p+GO9Ko6VIIpWlBrpWwXDv8WLFeHTxz35CfQFUiBMLXlGHhGzys7lqit9gWag==",
+    "node_modules/@types/eslint": {
+      "version": "9.6.1",
+      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-9.6.1.tgz",
+      "integrity": "sha512-FXx2pKgId/WyYo2jXw63kk7/+TY7u7AziEJxJAnSFzHlqTAS3Ync6SvgYAN/k4/PQpnnVuzoMuVnByKK2qp0ag==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
-        "mute-stream": "^1.0.0"
-      },
-      "engines": {
-        "node": ">=18"
+        "@types/estree": "*",
+        "@types/json-schema": "*"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/core/node_modules/ansi-escapes": {
-      "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
-      "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==",
+    "node_modules/@types/eslint-scope": {
+      "version": "3.7.7",
+      "resolved": "https://registry.npmjs.org/@types/eslint-scope/-/eslint-scope-3.7.7.tgz",
+      "integrity": "sha512-MzMFlSLBqNF2gcHWO0G1vP/YQyfvrxZ0bF+u7mzUdZ1/xK4A4sru+nraZz5i3iEIk1l1uyicaDVTB4QbbEkAYg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
-        "type-fest": "^0.21.3"
-      },
-      "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "@types/eslint": "*",
+        "@types/estree": "*"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/core/node_modules/strip-ansi": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
-      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+    "node_modules/@types/estree": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz",
+      "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/express": {
+      "version": "5.0.3",
+      "resolved": "https://registry.npmjs.org/@types/express/-/express-5.0.3.tgz",
+      "integrity": "sha512-wGA0NX93b19/dZC1J18tKWVIYWyyF2ZjT9vin/NRu0qzzvfVzWjs04iq2rQ3H65vCTQYlRqs3YHfY7zjdV+9Kw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "ansi-regex": "^5.0.1"
-      },
-      "engines": {
-        "node": ">=8"
+        "@types/body-parser": "*",
+        "@types/express-serve-static-core": "^5.0.0",
+        "@types/serve-static": "*"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/editor": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/editor/-/editor-2.2.0.tgz",
-      "integrity": "sha512-9KHOpJ+dIL5SZli8lJ6xdaYLPPzB8xB9GZItg39MBybzhxA16vxmszmQFrRwbOA918WA2rvu8xhDEg/p6LXKbw==",
+    "node_modules/@types/express-serve-static-core": {
+      "version": "5.0.7",
+      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-5.0.7.tgz",
+      "integrity": "sha512-R+33OsgWw7rOhD1emjU7dzCDHucJrgJXMA5PYCzJxVil0dsyx5iBEPHqpPfiKNJQb7lZ1vxwoLR4Z87bBUpeGQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^9.1.0",
-        "@inquirer/type": "^1.5.3",
-        "external-editor": "^3.1.0"
-      },
-      "engines": {
-        "node": ">=18"
+        "@types/node": "*",
+        "@types/qs": "*",
+        "@types/range-parser": "*",
+        "@types/send": "*"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/expand": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/expand/-/expand-2.3.0.tgz",
-      "integrity": "sha512-qnJsUcOGCSG1e5DTOErmv2BPQqrtT6uzqn1vI/aYGiPKq+FgslGZmtdnXbhuI7IlT7OByDoEEqdnhUnVR2hhLw==",
+    "node_modules/@types/http-errors": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/@types/http-errors/-/http-errors-2.0.4.tgz",
+      "integrity": "sha512-D0CFMMtydbJAegzOyHjtiKPLlvnm3iTZyZRSZoLq2mRhDdmLfIWOCYPfQJ4cu2erKghU++QvjcUjp/5h7hESpA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/jasmine": {
+      "version": "5.1.7",
+      "resolved": "https://registry.npmjs.org/@types/jasmine/-/jasmine-5.1.7.tgz",
+      "integrity": "sha512-DVOfk9FaClQfNFpSfaML15jjB5cjffDMvjtph525sroR5BEAW2uKnTOYUTqTFuZFjNvH0T5XMIydvIctnUKufw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/json-schema": {
+      "version": "7.0.15",
+      "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
+      "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/json5": {
+      "version": "0.0.29",
+      "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz",
+      "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/mime": {
+      "version": "1.3.5",
+      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.5.tgz",
+      "integrity": "sha512-/pyBZWSLD2n0dcHE3hq8s8ZvcETHtEuF+3E7XVt0Ig2nvsVQXdghHVcEkIWjy9A0wKfTn97a/PSDYohKIlnP/w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/mute-stream": {
+      "version": "0.0.4",
+      "resolved": "https://registry.npmjs.org/@types/mute-stream/-/mute-stream-0.0.4.tgz",
+      "integrity": "sha512-CPM9nzrCPPJHQNA9keH9CVkVI+WR5kMa+7XEs5jcGQ0VoAGnLv242w8lIVgwAEfmE4oufJRaTc9PNLQl0ioAow==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^9.1.0",
-        "@inquirer/type": "^1.5.3",
-        "yoctocolors-cjs": "^2.1.2"
-      },
-      "engines": {
-        "node": ">=18"
+        "@types/node": "*"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/input": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/input/-/input-2.3.0.tgz",
-      "integrity": "sha512-XfnpCStx2xgh1LIRqPXrTNEEByqQWoxsWYzNRSEUxJ5c6EQlhMogJ3vHKu8aXuTacebtaZzMAHwEL0kAflKOBw==",
-      "dev": true,
+    "node_modules/@types/node": {
+      "version": "20.19.11",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.19.11.tgz",
+      "integrity": "sha512-uug3FEEGv0r+jrecvUUpbY8lLisvIjg6AAic6a2bSP5OEOLeJsDSnvhCDov7ipFFMXS3orMpzlmi0ZcuGkBbow==",
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^9.1.0",
-        "@inquirer/type": "^1.5.3"
-      },
-      "engines": {
-        "node": ">=18"
+        "undici-types": "~6.21.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/number": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/number/-/number-1.1.0.tgz",
-      "integrity": "sha512-ilUnia/GZUtfSZy3YEErXLJ2Sljo/mf9fiKc08n18DdwdmDbOzRcTv65H1jjDvlsAuvdFXf4Sa/aL7iw/NanVA==",
+    "node_modules/@types/node-fetch": {
+      "version": "2.6.12",
+      "resolved": "https://registry.npmjs.org/@types/node-fetch/-/node-fetch-2.6.12.tgz",
+      "integrity": "sha512-8nneRWKCg3rMtF69nLQJnOYUcbafYeFSjqkw3jCRLsqkWFlHaoQrr5mXmofFGOx3DKn7UfmBMyov8ySvLRVldA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^9.1.0",
-        "@inquirer/type": "^1.5.3"
-      },
-      "engines": {
-        "node": ">=18"
+        "@types/node": "*",
+        "form-data": "^4.0.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/password": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/password/-/password-2.2.0.tgz",
-      "integrity": "sha512-5otqIpgsPYIshqhgtEwSspBQE40etouR8VIxzpJkv9i0dVHIpyhiivbkH9/dGiMLdyamT54YRdGJLfl8TFnLHg==",
+    "node_modules/@types/pg": {
+      "version": "8.15.2",
+      "resolved": "https://registry.npmjs.org/@types/pg/-/pg-8.15.2.tgz",
+      "integrity": "sha512-+BKxo5mM6+/A1soSHBI7ufUglqYXntChLDyTbvcAn1Lawi9J7J9Ok3jt6w7I0+T/UDJ4CyhHk66+GZbwmkYxSg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^9.1.0",
-        "@inquirer/type": "^1.5.3",
-        "ansi-escapes": "^4.3.2"
-      },
-      "engines": {
-        "node": ">=18"
+        "@types/node": "*",
+        "pg-protocol": "*",
+        "pg-types": "^4.0.1"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/password/node_modules/ansi-escapes": {
-      "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
-      "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==",
+    "node_modules/@types/phoenix": {
+      "version": "1.6.6",
+      "resolved": "https://registry.npmjs.org/@types/phoenix/-/phoenix-1.6.6.tgz",
+      "integrity": "sha512-PIzZZlEppgrpoT2QgbnDU+MMzuR6BbCjllj0bM70lWoejMeNJAxCchxnv7J3XFkI8MpygtRpzXrIlmWUBclP5A==",
+      "license": "MIT"
+    },
+    "node_modules/@types/qs": {
+      "version": "6.14.0",
+      "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.14.0.tgz",
+      "integrity": "sha512-eOunJqu0K1923aExK6y8p6fsihYEn/BYuQ4g0CxAAgFc4b/ZLN4CrsRZ55srTdqoiLzU2B2evC+apEIxprEzkQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/range-parser": {
+      "version": "1.2.7",
+      "resolved": "https://registry.npmjs.org/@types/range-parser/-/range-parser-1.2.7.tgz",
+      "integrity": "sha512-hKormJbkJqzQGhziax5PItDUTMAM9uE2XXQmM37dyd4hVM+5aVl7oVxMVUiVQn2oCQFN/LKCZdvSM0pFRqbSmQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/send": {
+      "version": "0.17.4",
+      "resolved": "https://registry.npmjs.org/@types/send/-/send-0.17.4.tgz",
+      "integrity": "sha512-x2EM6TJOybec7c52BX0ZspPodMsQUd5L6PRwOunVyVUhXiBSKf3AezDL8Dgvgt5o0UfKNfuA0eMLr2wLT4AiBA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "type-fest": "^0.21.3"
-      },
-      "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "@types/mime": "^1",
+        "@types/node": "*"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/prompts": {
-      "version": "5.5.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/prompts/-/prompts-5.5.0.tgz",
-      "integrity": "sha512-BHDeL0catgHdcHbSFFUddNzvx/imzJMft+tWDPwTm3hfu8/tApk1HrooNngB2Mb4qY+KaRWF+iZqoVUPeslEog==",
+    "node_modules/@types/serve-static": {
+      "version": "1.15.7",
+      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.15.7.tgz",
+      "integrity": "sha512-W8Ym+h8nhuRwaKPaDw34QUkwsGi6Rc4yYqvKFo5rm2FUEhCFbzVWrxXUxuKK8TASjWsysJY0nsmNCGhCOIsrOw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/checkbox": "^2.5.0",
-        "@inquirer/confirm": "^3.2.0",
-        "@inquirer/editor": "^2.2.0",
-        "@inquirer/expand": "^2.3.0",
-        "@inquirer/input": "^2.3.0",
-        "@inquirer/number": "^1.1.0",
-        "@inquirer/password": "^2.2.0",
-        "@inquirer/rawlist": "^2.3.0",
-        "@inquirer/search": "^1.1.0",
-        "@inquirer/select": "^2.5.0"
-      },
-      "engines": {
-        "node": ">=18"
+        "@types/http-errors": "*",
+        "@types/node": "*",
+        "@types/send": "*"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/rawlist": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/rawlist/-/rawlist-2.3.0.tgz",
-      "integrity": "sha512-zzfNuINhFF7OLAtGHfhwOW2TlYJyli7lOUoJUXw/uyklcwalV6WRXBXtFIicN8rTRK1XTiPWB4UY+YuW8dsnLQ==",
+    "node_modules/@types/urijs": {
+      "version": "1.19.25",
+      "resolved": "https://registry.npmjs.org/@types/urijs/-/urijs-1.19.25.tgz",
+      "integrity": "sha512-XOfUup9r3Y06nFAZh3WvO0rBU4OtlfPB/vgxpjg+NRdGU6CN6djdc6OEiH+PcqHCY6eFLo9Ista73uarf4gnBg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/uuid": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-10.0.0.tgz",
+      "integrity": "sha512-7gqG38EyHgyP1S+7+xomFtL+ZNHcKv6DwNaCZmJmo1vgMugyF3TCnXVg4t1uk89mLNwnLtnY3TpOpCOyp1/xHQ==",
       "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@inquirer/core": "^9.1.0",
-        "@inquirer/type": "^1.5.3",
-        "yoctocolors-cjs": "^2.1.2"
-      },
-      "engines": {
-        "node": ">=18"
-      }
+      "license": "MIT"
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/search": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/search/-/search-1.1.0.tgz",
-      "integrity": "sha512-h+/5LSj51dx7hp5xOn4QFnUaKeARwUCLs6mIhtkJ0JYPBLmEYjdHSYh7I6GrLg9LwpJ3xeX0FZgAG1q0QdCpVQ==",
+    "node_modules/@types/wrap-ansi": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@types/wrap-ansi/-/wrap-ansi-3.0.0.tgz",
+      "integrity": "sha512-ltIpx+kM7g/MLRZfkbL7EsCEjfzCcScLpkg37eXEtx5kmrAKBkTJwd1GIAjDSL8wTpM6Hzn5YO4pSb91BEwu1g==",
       "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/ws": {
+      "version": "8.18.0",
+      "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.18.0.tgz",
+      "integrity": "sha512-8svvI3hMyvN0kKCJMvTJP/x6Y/EoQbepff882wL+Sn5QsXb3etnamgrJq4isrBxSJj5L2AuXcI0+bgkoAXGUJw==",
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^9.1.0",
-        "@inquirer/figures": "^1.0.5",
-        "@inquirer/type": "^1.5.3",
-        "yoctocolors-cjs": "^2.1.2"
-      },
-      "engines": {
-        "node": ">=18"
+        "@types/node": "*"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/select": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@inquirer/select/-/select-2.5.0.tgz",
-      "integrity": "sha512-YmDobTItPP3WcEI86GvPo+T2sRHkxxOq/kXmsBjHS5BVXUgvgZ5AfJjkvQvZr03T81NnI3KrrRuMzeuYUQRFOA==",
+    "node_modules/@typescript-eslint/eslint-plugin": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.34.1.tgz",
+      "integrity": "sha512-STXcN6ebF6li4PxwNeFnqF8/2BNDvBupf2OPx2yWNzr6mKNGF7q49VM00Pz5FaomJyqvbXpY6PhO+T9w139YEQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^9.1.0",
-        "@inquirer/figures": "^1.0.5",
-        "@inquirer/type": "^1.5.3",
-        "ansi-escapes": "^4.3.2",
-        "yoctocolors-cjs": "^2.1.2"
+        "@eslint-community/regexpp": "^4.10.0",
+        "@typescript-eslint/scope-manager": "8.34.1",
+        "@typescript-eslint/type-utils": "8.34.1",
+        "@typescript-eslint/utils": "8.34.1",
+        "@typescript-eslint/visitor-keys": "8.34.1",
+        "graphemer": "^1.4.0",
+        "ignore": "^7.0.0",
+        "natural-compare": "^1.4.0",
+        "ts-api-utils": "^2.1.0"
       },
       "engines": {
-        "node": ">=18"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "@typescript-eslint/parser": "^8.34.1",
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/select/node_modules/ansi-escapes": {
-      "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
-      "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==",
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/project-service": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.34.1.tgz",
+      "integrity": "sha512-nuHlOmFZfuRwLJKDGQOVc0xnQrAmuq1Mj/ISou5044y1ajGNp2BNliIqp7F2LPQ5sForz8lempMFCovfeS1XoA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "type-fest": "^0.21.3"
+        "@typescript-eslint/tsconfig-utils": "^8.34.1",
+        "@typescript-eslint/types": "^8.34.1",
+        "debug": "^4.3.4"
       },
       "engines": {
-        "node": ">=8"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@inquirer/type": {
-      "version": "1.5.5",
-      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-1.5.5.tgz",
-      "integrity": "sha512-MzICLu4yS7V8AA61sANROZ9vT1H3ooca5dSmI1FjZkzq7o/koMsRfQSzRtFo+F3Ao4Sf1C0bpLKejpKB/+j6MA==",
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.34.1.tgz",
+      "integrity": "sha512-beu6o6QY4hJAgL1E8RaXNC071G4Kso2MGmJskCFQhRhg8VOH/FDbC8soP8NHN7e/Hdphwp8G8cE6OBzC8o41ZA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "mute-stream": "^1.0.0"
+        "@typescript-eslint/types": "8.34.1",
+        "@typescript-eslint/visitor-keys": "8.34.1"
       },
       "engines": {
-        "node": ">=18"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/@types/node": {
-      "version": "22.15.21",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-22.15.21.tgz",
-      "integrity": "sha512-EV/37Td6c+MgKAbkcLG6vqZ2zEYHD7bvSrzqqs2RIhbA6w3x+Dqz8MZM3sP6kGTeLrdoOgKZe+Xja7tUB2DNkQ==",
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.34.1.tgz",
+      "integrity": "sha512-K4Sjdo4/xF9NEeA2khOb7Y5nY6NSXBnod87uniVYW9kHP+hNlDV8trUSFeynA2uxWam4gIWgWoygPrv9VMWrYg==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "undici-types": "~6.21.0"
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/ansi-escapes": {
-      "version": "6.2.1",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-6.2.1.tgz",
-      "integrity": "sha512-4nJ3yixlEthEJ9Rk4vPcdBRkZvQZlYyu8j4/Mqz5sgIkddmEnH2Yj2ZrnP9S3tQOvSNRUIgVNF/1yPpRAGNRig==",
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/types": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.34.1.tgz",
+      "integrity": "sha512-rjLVbmE7HR18kDsjNIZQHxmv9RZwlgzavryL5Lnj2ujIRTeXlKtILHgRNmQ3j4daw7zd+mQgy+uyt6Zo6I0IGA==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=14.16"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/ansi-regex": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
-      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.34.1.tgz",
+      "integrity": "sha512-rjCNqqYPuMUF5ODD+hWBNmOitjBWghkGKJg6hiCHzUvXRy6rK22Jd3rwbP2Xi+R7oYVvIKhokHVhH41BxPV5mA==",
       "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/project-service": "8.34.1",
+        "@typescript-eslint/tsconfig-utils": "8.34.1",
+        "@typescript-eslint/types": "8.34.1",
+        "@typescript-eslint/visitor-keys": "8.34.1",
+        "debug": "^4.3.4",
+        "fast-glob": "^3.3.2",
+        "is-glob": "^4.0.3",
+        "minimatch": "^9.0.4",
+        "semver": "^7.6.0",
+        "ts-api-utils": "^2.1.0"
+      },
       "engines": {
-        "node": ">=8"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/chalk": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.4.1.tgz",
-      "integrity": "sha512-zgVZuo2WcZgfUEmsn6eO3kINexW8RAE4maiQ8QNs8CtpPCSyMiYsULR3HQYkm3w8FIA3SberyMJMSldGsW+U3w==",
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/utils": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.34.1.tgz",
+      "integrity": "sha512-mqOwUdZ3KjtGk7xJJnLbHxTuWVn3GO2WZZuM+Slhkun4+qthLdXx32C8xIXbO1kfCECb3jIs3eoxK3eryk7aoQ==",
       "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.7.0",
+        "@typescript-eslint/scope-manager": "8.34.1",
+        "@typescript-eslint/types": "8.34.1",
+        "@typescript-eslint/typescript-estree": "8.34.1"
+      },
       "engines": {
-        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
-        "url": "https://github.com/chalk/chalk?sponsor=1"
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/find-up": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-7.0.0.tgz",
-      "integrity": "sha512-YyZM99iHrqLKjmt4LJDj58KI+fYyufRLBSYcqycxf//KpBk9FoewoGX0450m9nB44qrZnovzC2oeP5hUibxc/g==",
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.34.1.tgz",
+      "integrity": "sha512-xoh5rJ+tgsRKoXnkBPFRLZ7rjKM0AfVbC68UZ/ECXoDbfggb9RbEySN359acY1vS3qZ0jVTVWzbtfapwm5ztxw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "locate-path": "^7.2.0",
-        "path-exists": "^5.0.0",
-        "unicorn-magic": "^0.1.0"
+        "@typescript-eslint/types": "8.34.1",
+        "eslint-visitor-keys": "^4.2.1"
       },
       "engines": {
-        "node": ">=18"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/fs-extra": {
-      "version": "11.3.0",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.0.tgz",
-      "integrity": "sha512-Z4XaCL6dUDHfP/jT25jJKMmtxvuwbkrD1vNSMFlo9lNLY2c5FHYSQgHPRZUjAB26TpDEoW9HCOgplrdbaPV/ew==",
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "graceful-fs": "^4.2.0",
-        "jsonfile": "^6.0.1",
-        "universalify": "^2.0.0"
-      },
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/eslint-visitor-keys": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
+      "dev": true,
+      "license": "Apache-2.0",
       "engines": {
-        "node": ">=14.14"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/is-interactive": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-2.0.0.tgz",
-      "integrity": "sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==",
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dev": true,
-      "license": "MIT",
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
       "engines": {
-        "node": ">=12"
+        "node": ">=16 || 14 >=14.17"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/is-unicode-supported": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-2.1.0.tgz",
-      "integrity": "sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==",
+    "node_modules/@typescript-eslint/parser": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.34.1.tgz",
+      "integrity": "sha512-4O3idHxhyzjClSMJ0a29AcoK0+YwnEqzI6oz3vlRf3xw0zbzt15MzXwItOlnr5nIth6zlY2RENLsOPvhyrKAQA==",
       "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/scope-manager": "8.34.1",
+        "@typescript-eslint/types": "8.34.1",
+        "@typescript-eslint/typescript-estree": "8.34.1",
+        "@typescript-eslint/visitor-keys": "8.34.1",
+        "debug": "^4.3.4"
+      },
       "engines": {
-        "node": ">=18"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+    "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/project-service": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.34.1.tgz",
+      "integrity": "sha512-nuHlOmFZfuRwLJKDGQOVc0xnQrAmuq1Mj/ISou5044y1ajGNp2BNliIqp7F2LPQ5sForz8lempMFCovfeS1XoA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "universalify": "^2.0.0"
+        "@typescript-eslint/tsconfig-utils": "^8.34.1",
+        "@typescript-eslint/types": "^8.34.1",
+        "debug": "^4.3.4"
       },
-      "optionalDependencies": {
-        "graceful-fs": "^4.1.6"
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/log-symbols": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-6.0.0.tgz",
-      "integrity": "sha512-i24m8rpwhmPIS4zscNzK6MSEhk0DUWa/8iYQWxhffV8jkI4Phvs3F+quL5xvS0gdQR0FyTCMMH33Y78dDTzzIw==",
+    "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.34.1.tgz",
+      "integrity": "sha512-beu6o6QY4hJAgL1E8RaXNC071G4Kso2MGmJskCFQhRhg8VOH/FDbC8soP8NHN7e/Hdphwp8G8cE6OBzC8o41ZA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "chalk": "^5.3.0",
-        "is-unicode-supported": "^1.3.0"
+        "@typescript-eslint/types": "8.34.1",
+        "@typescript-eslint/visitor-keys": "8.34.1"
       },
       "engines": {
-        "node": ">=18"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/log-symbols/node_modules/is-unicode-supported": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-1.3.0.tgz",
-      "integrity": "sha512-43r2mRvz+8JRIKnWJ+3j8JtjRKZ6GmjzfaE/qiBJnikNnYv/6bagRJ1kUhNk8R5EX/GkobD+r+sfxCPJsiKBLQ==",
+    "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.34.1.tgz",
+      "integrity": "sha512-K4Sjdo4/xF9NEeA2khOb7Y5nY6NSXBnod87uniVYW9kHP+hNlDV8trUSFeynA2uxWam4gIWgWoygPrv9VMWrYg==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=12"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/mute-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-1.0.0.tgz",
-      "integrity": "sha512-avsJQhyd+680gKXyG/sQc0nXaC6rBkPOfyHYcFb9+hdkqQkR9bdnkJ0AMZhke0oesPqIO+mFFJ+IdBc7mst4IA==",
+    "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/types": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.34.1.tgz",
+      "integrity": "sha512-rjLVbmE7HR18kDsjNIZQHxmv9RZwlgzavryL5Lnj2ujIRTeXlKtILHgRNmQ3j4daw7zd+mQgy+uyt6Zo6I0IGA==",
       "dev": true,
-      "license": "ISC",
+      "license": "MIT",
       "engines": {
-        "node": "^14.17.0 || ^16.13.0 || >=18.0.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/ora": {
-      "version": "8.2.0",
-      "resolved": "https://registry.npmjs.org/ora/-/ora-8.2.0.tgz",
-      "integrity": "sha512-weP+BZ8MVNnlCm8c0Qdc1WSWq4Qn7I+9CJGm7Qali6g44e/PUzbjNqJX5NJ9ljlNMosfJvg1fKEGILklK9cwnw==",
+    "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.34.1.tgz",
+      "integrity": "sha512-rjCNqqYPuMUF5ODD+hWBNmOitjBWghkGKJg6hiCHzUvXRy6rK22Jd3rwbP2Xi+R7oYVvIKhokHVhH41BxPV5mA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "chalk": "^5.3.0",
-        "cli-cursor": "^5.0.0",
-        "cli-spinners": "^2.9.2",
-        "is-interactive": "^2.0.0",
-        "is-unicode-supported": "^2.0.0",
-        "log-symbols": "^6.0.0",
-        "stdin-discarder": "^0.2.2",
-        "string-width": "^7.2.0",
-        "strip-ansi": "^7.1.0"
+        "@typescript-eslint/project-service": "8.34.1",
+        "@typescript-eslint/tsconfig-utils": "8.34.1",
+        "@typescript-eslint/types": "8.34.1",
+        "@typescript-eslint/visitor-keys": "8.34.1",
+        "debug": "^4.3.4",
+        "fast-glob": "^3.3.2",
+        "is-glob": "^4.0.3",
+        "minimatch": "^9.0.4",
+        "semver": "^7.6.0",
+        "ts-api-utils": "^2.1.0"
       },
       "engines": {
-        "node": ">=18"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/undici-types": {
-      "version": "6.21.0",
-      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz",
-      "integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/@snaplet/seed/node_modules/unicorn-magic": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.1.0.tgz",
-      "integrity": "sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ==",
+    "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.34.1.tgz",
+      "integrity": "sha512-xoh5rJ+tgsRKoXnkBPFRLZ7rjKM0AfVbC68UZ/ECXoDbfggb9RbEySN359acY1vS3qZ0jVTVWzbtfapwm5ztxw==",
       "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.34.1",
+        "eslint-visitor-keys": "^4.2.1"
+      },
       "engines": {
-        "node": ">=18"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/parser/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
       }
     },
-    "node_modules/@snaplet/seed/node_modules/universalify": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz",
-      "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==",
+    "node_modules/@typescript-eslint/parser/node_modules/eslint-visitor-keys": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
       "dev": true,
-      "license": "MIT",
+      "license": "Apache-2.0",
       "engines": {
-        "node": ">= 10.0.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/@socket.io/component-emitter": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.2.tgz",
-      "integrity": "sha512-9BCxFwvbGg/RsZK9tjXd8s4UcwR0MWeFQ1XEKIQVVvAGJyINdrqKMcTRyLoK8Rse1GjzLV9cwjWV1olXRWEXVA==",
+    "node_modules/@typescript-eslint/parser/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/@supabase/auth-js": {
-      "version": "2.69.1",
-      "resolved": "https://registry.npmjs.org/@supabase/auth-js/-/auth-js-2.69.1.tgz",
-      "integrity": "sha512-FILtt5WjCNzmReeRLq5wRs3iShwmnWgBvxHfqapC/VoljJl+W8hDAyFmf1NVw3zH+ZjZ05AKxiKxVeb0HNWRMQ==",
-      "license": "MIT",
+      "license": "ISC",
       "dependencies": {
-        "@supabase/node-fetch": "^2.6.14"
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/@supabase/functions-js": {
-      "version": "2.4.4",
-      "resolved": "https://registry.npmjs.org/@supabase/functions-js/-/functions-js-2.4.4.tgz",
-      "integrity": "sha512-WL2p6r4AXNGwop7iwvul2BvOtuJ1YQy8EbOd0dhG1oN1q8el/BIRSFCFnWAMM/vJJlHWLi4ad22sKbKr9mvjoA==",
+    "node_modules/@typescript-eslint/project-service": {
+      "version": "8.39.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.39.1.tgz",
+      "integrity": "sha512-8fZxek3ONTwBu9ptw5nCKqZOSkXshZB7uAxuFF0J/wTMkKydjXCzqqga7MlFMpHi9DoG4BadhmTkITBcg8Aybw==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@supabase/node-fetch": "^2.6.14"
+        "@typescript-eslint/tsconfig-utils": "^8.39.1",
+        "@typescript-eslint/types": "^8.39.1",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.0.0"
       }
     },
-    "node_modules/@supabase/node-fetch": {
-      "version": "2.6.15",
-      "resolved": "https://registry.npmjs.org/@supabase/node-fetch/-/node-fetch-2.6.15.tgz",
-      "integrity": "sha512-1ibVeYUacxWYi9i0cf5efil6adJ9WRyZBLivgjs+AUpewx1F3xPi7gLgaASI2SmIQxPoCEjAsLAzKPgMJVgOUQ==",
+    "node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.39.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.39.1.tgz",
+      "integrity": "sha512-RkBKGBrjgskFGWuyUGz/EtD8AF/GW49S21J8dvMzpJitOF1slLEbbHnNEtAHtnDAnx8qDEdRrULRnWVx27wGBw==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "whatwg-url": "^5.0.0"
+        "@typescript-eslint/types": "8.39.1",
+        "@typescript-eslint/visitor-keys": "8.39.1"
       },
       "engines": {
-        "node": "4.x || >=6.0.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@supabase/postgrest-js": {
-      "version": "1.19.4",
-      "resolved": "https://registry.npmjs.org/@supabase/postgrest-js/-/postgrest-js-1.19.4.tgz",
-      "integrity": "sha512-O4soKqKtZIW3olqmbXXbKugUtByD2jPa8kL2m2c1oozAO11uCcGrRhkZL0kVxjBLrXHE0mdSkFsMj7jDSfyNpw==",
+    "node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.39.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.39.1.tgz",
+      "integrity": "sha512-ePUPGVtTMR8XMU2Hee8kD0Pu4NDE1CN9Q1sxGSGd/mbOtGZDM7pnhXNJnzW63zk/q+Z54zVzj44HtwXln5CvHA==",
+      "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@supabase/node-fetch": "^2.6.14"
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.0.0"
       }
     },
-    "node_modules/@supabase/realtime-js": {
-      "version": "2.11.2",
-      "resolved": "https://registry.npmjs.org/@supabase/realtime-js/-/realtime-js-2.11.2.tgz",
-      "integrity": "sha512-u/XeuL2Y0QEhXSoIPZZwR6wMXgB+RQbJzG9VErA3VghVt7uRfSVsjeqd7m5GhX3JR6dM/WRmLbVR8URpDWG4+w==",
+    "node_modules/@typescript-eslint/type-utils": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.34.1.tgz",
+      "integrity": "sha512-Tv7tCCr6e5m8hP4+xFugcrwTOucB8lshffJ6zf1mF1TbU67R+ntCc6DzLNKM+s/uzDyv8gLq7tufaAhIBYeV8g==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@supabase/node-fetch": "^2.6.14",
-        "@types/phoenix": "^1.5.4",
-        "@types/ws": "^8.5.10",
-        "ws": "^8.18.0"
-      }
-    },
-    "node_modules/@supabase/realtime-js/node_modules/ws": {
-      "version": "8.18.1",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.1.tgz",
-      "integrity": "sha512-RKW2aJZMXeMxVpnZ6bck+RswznaxmzdULiBr6KY7XkTnW8uvt0iT9H5DkHUChXrc+uurzwa0rVI16n/Xzjdz1w==",
-      "license": "MIT",
+        "@typescript-eslint/typescript-estree": "8.34.1",
+        "@typescript-eslint/utils": "8.34.1",
+        "debug": "^4.3.4",
+        "ts-api-utils": "^2.1.0"
+      },
       "engines": {
-        "node": ">=10.0.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
-      "peerDependencies": {
-        "bufferutil": "^4.0.1",
-        "utf-8-validate": ">=5.0.2"
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       },
-      "peerDependenciesMeta": {
-        "bufferutil": {
-          "optional": true
-        },
-        "utf-8-validate": {
-          "optional": true
-        }
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@supabase/storage-js": {
-      "version": "2.7.1",
-      "resolved": "https://registry.npmjs.org/@supabase/storage-js/-/storage-js-2.7.1.tgz",
-      "integrity": "sha512-asYHcyDR1fKqrMpytAS1zjyEfvxuOIp1CIXX7ji4lHHcJKqyk+sLl/Vxgm4sN6u8zvuUtae9e4kDxQP2qrwWBA==",
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/project-service": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.34.1.tgz",
+      "integrity": "sha512-nuHlOmFZfuRwLJKDGQOVc0xnQrAmuq1Mj/ISou5044y1ajGNp2BNliIqp7F2LPQ5sForz8lempMFCovfeS1XoA==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@supabase/node-fetch": "^2.6.14"
+        "@typescript-eslint/tsconfig-utils": "^8.34.1",
+        "@typescript-eslint/types": "^8.34.1",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@supabase/supabase-js": {
-      "version": "2.49.4",
-      "resolved": "https://registry.npmjs.org/@supabase/supabase-js/-/supabase-js-2.49.4.tgz",
-      "integrity": "sha512-jUF0uRUmS8BKt37t01qaZ88H9yV1mbGYnqLeuFWLcdV+x1P4fl0yP9DGtaEhFPZcwSom7u16GkLEH9QJZOqOkw==",
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.34.1.tgz",
+      "integrity": "sha512-beu6o6QY4hJAgL1E8RaXNC071G4Kso2MGmJskCFQhRhg8VOH/FDbC8soP8NHN7e/Hdphwp8G8cE6OBzC8o41ZA==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@supabase/auth-js": "2.69.1",
-        "@supabase/functions-js": "2.4.4",
-        "@supabase/node-fetch": "2.6.15",
-        "@supabase/postgrest-js": "1.19.4",
-        "@supabase/realtime-js": "2.11.2",
-        "@supabase/storage-js": "2.7.1"
+        "@typescript-eslint/types": "8.34.1",
+        "@typescript-eslint/visitor-keys": "8.34.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@tailwindcss/line-clamp": {
-      "version": "0.4.4",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/line-clamp/-/line-clamp-0.4.4.tgz",
-      "integrity": "sha512-5U6SY5z8N42VtrCrKlsTAA35gy2VSyYtHWCsg1H87NU1SXnEfekTVlrga9fzUDrrHcGi2Lb5KenUWb4lRQT5/g==",
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.34.1.tgz",
+      "integrity": "sha512-K4Sjdo4/xF9NEeA2khOb7Y5nY6NSXBnod87uniVYW9kHP+hNlDV8trUSFeynA2uxWam4gIWgWoygPrv9VMWrYg==",
+      "dev": true,
       "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
       "peerDependencies": {
-        "tailwindcss": ">=2.0.0 || >=3.0.0 || >=3.0.0-alpha.1"
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@total-typescript/ts-reset": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/@total-typescript/ts-reset/-/ts-reset-0.5.1.tgz",
-      "integrity": "sha512-AqlrT8YA1o7Ff5wPfMOL0pvL+1X+sw60NN6CcOCqs658emD6RfiXhF7Gu9QcfKBH7ELY2nInLhKSCWVoNL70MQ==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/@tsconfig/node10": {
-      "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.11.tgz",
-      "integrity": "sha512-DcRjDCujK/kCk/cUe8Xz8ZSpm8mS3mNNpta+jGCA6USEDfktlNvm1+IuZ9eTcDbNk41BHwpHHeW+N1lKCz4zOw==",
-      "devOptional": true,
-      "license": "MIT"
-    },
-    "node_modules/@tsconfig/node12": {
-      "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/@tsconfig/node12/-/node12-1.0.11.tgz",
-      "integrity": "sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==",
-      "devOptional": true,
-      "license": "MIT"
-    },
-    "node_modules/@tsconfig/node14": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/@tsconfig/node14/-/node14-1.0.3.tgz",
-      "integrity": "sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==",
-      "devOptional": true,
-      "license": "MIT"
-    },
-    "node_modules/@tsconfig/node16": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/@tsconfig/node16/-/node16-1.0.4.tgz",
-      "integrity": "sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==",
-      "devOptional": true,
-      "license": "MIT"
-    },
-    "node_modules/@tufjs/canonical-json": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/@tufjs/canonical-json/-/canonical-json-2.0.0.tgz",
-      "integrity": "sha512-yVtV8zsdo8qFHe+/3kw81dSLyF7D576A5cCFCi4X7B39tWT7SekaEFUnvnWJHz+9qO7qJTah1JbrDjWKqFtdWA==",
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/types": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.34.1.tgz",
+      "integrity": "sha512-rjLVbmE7HR18kDsjNIZQHxmv9RZwlgzavryL5Lnj2ujIRTeXlKtILHgRNmQ3j4daw7zd+mQgy+uyt6Zo6I0IGA==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": "^16.14.0 || >=18.0.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@tufjs/models": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/@tufjs/models/-/models-3.0.1.tgz",
-      "integrity": "sha512-UUYHISyhCU3ZgN8yaear3cGATHb3SMuKHsQ/nVbHXcmnBf+LzQ/cQfhNG+rfaSHgqGKNEm2cOCLVLELStUQ1JA==",
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.34.1.tgz",
+      "integrity": "sha512-rjCNqqYPuMUF5ODD+hWBNmOitjBWghkGKJg6hiCHzUvXRy6rK22Jd3rwbP2Xi+R7oYVvIKhokHVhH41BxPV5mA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@tufjs/canonical-json": "2.0.0",
-        "minimatch": "^9.0.5"
+        "@typescript-eslint/project-service": "8.34.1",
+        "@typescript-eslint/tsconfig-utils": "8.34.1",
+        "@typescript-eslint/types": "8.34.1",
+        "@typescript-eslint/visitor-keys": "8.34.1",
+        "debug": "^4.3.4",
+        "fast-glob": "^3.3.2",
+        "is-glob": "^4.0.3",
+        "minimatch": "^9.0.4",
+        "semver": "^7.6.0",
+        "ts-api-utils": "^2.1.0"
       },
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@tufjs/models/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/utils": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.34.1.tgz",
+      "integrity": "sha512-mqOwUdZ3KjtGk7xJJnLbHxTuWVn3GO2WZZuM+Slhkun4+qthLdXx32C8xIXbO1kfCECb3jIs3eoxK3eryk7aoQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "balanced-match": "^1.0.0"
-      }
-    },
-    "node_modules/@tufjs/models/node_modules/minimatch": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
-      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "brace-expansion": "^2.0.1"
+        "@eslint-community/eslint-utils": "^4.7.0",
+        "@typescript-eslint/scope-manager": "8.34.1",
+        "@typescript-eslint/types": "8.34.1",
+        "@typescript-eslint/typescript-estree": "8.34.1"
       },
       "engines": {
-        "node": ">=16 || 14 >=14.17"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
-        "url": "https://github.com/sponsors/isaacs"
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/@types/body-parser": {
-      "version": "1.19.5",
-      "resolved": "https://registry.npmjs.org/@types/body-parser/-/body-parser-1.19.5.tgz",
-      "integrity": "sha512-fB3Zu92ucau0iQ0JMCFQE7b/dv8Ot07NI3KaZIkIUNXq82k4eBAqUaneXfleGY9JWskeS9y+u0nXMyspcuQrCg==",
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.34.1.tgz",
+      "integrity": "sha512-xoh5rJ+tgsRKoXnkBPFRLZ7rjKM0AfVbC68UZ/ECXoDbfggb9RbEySN359acY1vS3qZ0jVTVWzbtfapwm5ztxw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@types/connect": "*",
-        "@types/node": "*"
+        "@typescript-eslint/types": "8.34.1",
+        "eslint-visitor-keys": "^4.2.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@types/bonjour": {
-      "version": "3.5.13",
-      "resolved": "https://registry.npmjs.org/@types/bonjour/-/bonjour-3.5.13.tgz",
-      "integrity": "sha512-z9fJ5Im06zvUL548KvYNecEVlA7cVDkGUi6kZusb04mpyEFKCIZJvloCcmpmLaIahDpOQGHaHmG6imtPMmPXGQ==",
+    "node_modules/@typescript-eslint/type-utils/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@types/node": "*"
+        "balanced-match": "^1.0.0"
       }
     },
-    "node_modules/@types/compression": {
-      "version": "1.7.5",
-      "resolved": "https://registry.npmjs.org/@types/compression/-/compression-1.7.5.tgz",
-      "integrity": "sha512-AAQvK5pxMpaT+nDvhHrsBhLSYG5yQdtkaJE1WYieSNY2mVFKAgmU4ks65rkZD5oqnGCFLyQpUr1CqI4DmUMyDg==",
+    "node_modules/@typescript-eslint/type-utils/node_modules/eslint-visitor-keys": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
       "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@types/express": "*"
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/@types/connect": {
-      "version": "3.4.38",
-      "resolved": "https://registry.npmjs.org/@types/connect/-/connect-3.4.38.tgz",
-      "integrity": "sha512-K6uROf1LD88uDQqJCktA4yzL1YYAK6NgfsI0v/mTgyPKWsX1CnJ0XPSDhViejru1GcRkLWb8RlzFYJRqGUbaug==",
+    "node_modules/@typescript-eslint/type-utils/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dev": true,
-      "license": "MIT",
+      "license": "ISC",
       "dependencies": {
-        "@types/node": "*"
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/@types/connect-history-api-fallback": {
-      "version": "1.5.4",
-      "resolved": "https://registry.npmjs.org/@types/connect-history-api-fallback/-/connect-history-api-fallback-1.5.4.tgz",
-      "integrity": "sha512-n6Cr2xS1h4uAulPRdlw6Jl6s1oG8KrVilPN2yUITEs+K48EzMJJ3W1xy8K5eWuFvjp3R74AOIGSmp2UfBJ8HFw==",
+    "node_modules/@typescript-eslint/types": {
+      "version": "8.39.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.39.1.tgz",
+      "integrity": "sha512-7sPDKQQp+S11laqTrhHqeAbsCfMkwJMrV7oTDvtDds4mEofJYir414bYKUEb8YPUm9QL3U+8f6L6YExSoAGdQw==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@types/express-serve-static-core": "*",
-        "@types/node": "*"
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@types/cors": {
-      "version": "2.8.17",
-      "resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.17.tgz",
-      "integrity": "sha512-8CGDvrBj1zgo2qE+oS3pOCyYNqCPryMWY2bGfwA0dcfopWGgxs+78df0Rs3rc9THP4JkOhLsAa+15VdpAqkcUA==",
+    "node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.39.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.39.1.tgz",
+      "integrity": "sha512-EKkpcPuIux48dddVDXyQBlKdeTPMmALqBUbEk38McWv0qVEZwOpVJBi7ugK5qVNgeuYjGNQxrrnoM/5+TI/BPw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@types/node": "*"
+        "@typescript-eslint/project-service": "8.39.1",
+        "@typescript-eslint/tsconfig-utils": "8.39.1",
+        "@typescript-eslint/types": "8.39.1",
+        "@typescript-eslint/visitor-keys": "8.39.1",
+        "debug": "^4.3.4",
+        "fast-glob": "^3.3.2",
+        "is-glob": "^4.0.3",
+        "minimatch": "^9.0.4",
+        "semver": "^7.6.0",
+        "ts-api-utils": "^2.1.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.0.0"
       }
     },
-    "node_modules/@types/eslint": {
-      "version": "9.6.1",
-      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-9.6.1.tgz",
-      "integrity": "sha512-FXx2pKgId/WyYo2jXw63kk7/+TY7u7AziEJxJAnSFzHlqTAS3Ync6SvgYAN/k4/PQpnnVuzoMuVnByKK2qp0ag==",
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@types/estree": "*",
-        "@types/json-schema": "*"
+        "balanced-match": "^1.0.0"
       }
     },
-    "node_modules/@types/eslint-scope": {
-      "version": "3.7.7",
-      "resolved": "https://registry.npmjs.org/@types/eslint-scope/-/eslint-scope-3.7.7.tgz",
-      "integrity": "sha512-MzMFlSLBqNF2gcHWO0G1vP/YQyfvrxZ0bF+u7mzUdZ1/xK4A4sru+nraZz5i3iEIk1l1uyicaDVTB4QbbEkAYg==",
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dev": true,
-      "license": "MIT",
+      "license": "ISC",
       "dependencies": {
-        "@types/eslint": "*",
-        "@types/estree": "*"
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/@types/estree": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz",
-      "integrity": "sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/@types/express": {
-      "version": "4.17.21",
-      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.21.tgz",
-      "integrity": "sha512-ejlPM315qwLpaQlQDTjPdsUFSc6ZsP4AN6AlWnogPjQ7CVi7PYF3YVz+CY3jE2pwYf7E/7HlDAN0rV2GxTG0HQ==",
+    "node_modules/@typescript-eslint/utils": {
+      "version": "8.39.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.39.1.tgz",
+      "integrity": "sha512-VF5tZ2XnUSTuiqZFXCZfZs1cgkdd3O/sSYmdo2EpSyDlC86UM/8YytTmKnehOW3TGAlivqTDT6bS87B/GQ/jyg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@types/body-parser": "*",
-        "@types/express-serve-static-core": "^4.17.33",
-        "@types/qs": "*",
-        "@types/serve-static": "*"
+        "@eslint-community/eslint-utils": "^4.7.0",
+        "@typescript-eslint/scope-manager": "8.39.1",
+        "@typescript-eslint/types": "8.39.1",
+        "@typescript-eslint/typescript-estree": "8.39.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
       }
     },
-    "node_modules/@types/express-serve-static-core": {
-      "version": "4.19.6",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.19.6.tgz",
-      "integrity": "sha512-N4LZ2xG7DatVqhCZzOGb1Yi5lMbXSZcmdLDe9EzSndPV2HpWYWzRbaerl2n27irrm94EPpprqa8KpskPT085+A==",
+    "node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.39.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.39.1.tgz",
+      "integrity": "sha512-W8FQi6kEh2e8zVhQ0eeRnxdvIoOkAp/CPAahcNio6nO9dsIwb9b34z90KOlheoyuVf6LSOEdjlkxSkapNEc+4A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@types/node": "*",
-        "@types/qs": "*",
-        "@types/range-parser": "*",
-        "@types/send": "*"
+        "@typescript-eslint/types": "8.39.1",
+        "eslint-visitor-keys": "^4.2.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@types/http-errors": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/@types/http-errors/-/http-errors-2.0.4.tgz",
-      "integrity": "sha512-D0CFMMtydbJAegzOyHjtiKPLlvnm3iTZyZRSZoLq2mRhDdmLfIWOCYPfQJ4cu2erKghU++QvjcUjp/5h7hESpA==",
+    "node_modules/@typescript-eslint/visitor-keys/node_modules/eslint-visitor-keys": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
       "dev": true,
-      "license": "MIT"
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
     },
-    "node_modules/@types/http-proxy": {
-      "version": "1.17.16",
-      "resolved": "https://registry.npmjs.org/@types/http-proxy/-/http-proxy-1.17.16.tgz",
-      "integrity": "sha512-sdWoUajOB1cd0A8cRRQ1cfyWNbmFKLAqBB89Y8x5iYyG/mkJHc0YUH8pdWBy2omi9qtCpiIgGjuwO0dQST2l5w==",
+    "node_modules/@unrs/resolver-binding-android-arm-eabi": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-android-arm-eabi/-/resolver-binding-android-arm-eabi-1.11.1.tgz",
+      "integrity": "sha512-ppLRUgHVaGRWUx0R0Ut06Mjo9gBaBkg3v/8AxusGLhsIotbBLuRk51rAzqLC8gq6NyyAojEXglNjzf6R948DNw==",
+      "cpu": [
+        "arm"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@types/node": "*"
-      }
+      "optional": true,
+      "os": [
+        "android"
+      ]
     },
-    "node_modules/@types/jasmine": {
-      "version": "5.1.7",
-      "resolved": "https://registry.npmjs.org/@types/jasmine/-/jasmine-5.1.7.tgz",
-      "integrity": "sha512-DVOfk9FaClQfNFpSfaML15jjB5cjffDMvjtph525sroR5BEAW2uKnTOYUTqTFuZFjNvH0T5XMIydvIctnUKufw==",
+    "node_modules/@unrs/resolver-binding-android-arm64": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-android-arm64/-/resolver-binding-android-arm64-1.11.1.tgz",
+      "integrity": "sha512-lCxkVtb4wp1v+EoN+HjIG9cIIzPkX5OtM03pQYkG+U5O/wL53LC4QbIeazgiKqluGeVEeBlZahHalCaBvU1a2g==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
     },
-    "node_modules/@types/json-schema": {
-      "version": "7.0.15",
-      "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
-      "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==",
+    "node_modules/@unrs/resolver-binding-darwin-arm64": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-darwin-arm64/-/resolver-binding-darwin-arm64-1.11.1.tgz",
+      "integrity": "sha512-gPVA1UjRu1Y/IsB/dQEsp2V1pm44Of6+LWvbLc9SDk1c2KhhDRDBUkQCYVWe6f26uJb3fOK8saWMgtX8IrMk3g==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
     },
-    "node_modules/@types/mime": {
-      "version": "1.3.5",
-      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.5.tgz",
-      "integrity": "sha512-/pyBZWSLD2n0dcHE3hq8s8ZvcETHtEuF+3E7XVt0Ig2nvsVQXdghHVcEkIWjy9A0wKfTn97a/PSDYohKIlnP/w==",
+    "node_modules/@unrs/resolver-binding-darwin-x64": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-darwin-x64/-/resolver-binding-darwin-x64-1.11.1.tgz",
+      "integrity": "sha512-cFzP7rWKd3lZaCsDze07QX1SC24lO8mPty9vdP+YVa3MGdVgPmFc59317b2ioXtgCMKGiCLxJ4HQs62oz6GfRQ==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
     },
-    "node_modules/@types/mute-stream": {
-      "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/@types/mute-stream/-/mute-stream-0.0.4.tgz",
-      "integrity": "sha512-CPM9nzrCPPJHQNA9keH9CVkVI+WR5kMa+7XEs5jcGQ0VoAGnLv242w8lIVgwAEfmE4oufJRaTc9PNLQl0ioAow==",
+    "node_modules/@unrs/resolver-binding-freebsd-x64": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-freebsd-x64/-/resolver-binding-freebsd-x64-1.11.1.tgz",
+      "integrity": "sha512-fqtGgak3zX4DCB6PFpsH5+Kmt/8CIi4Bry4rb1ho6Av2QHTREM+47y282Uqiu3ZRF5IQioJQ5qWRV6jduA+iGw==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@types/node": "*"
-      }
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
     },
-    "node_modules/@types/node": {
-      "version": "18.19.111",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-18.19.111.tgz",
-      "integrity": "sha512-90sGdgA+QLJr1F9X79tQuEut0gEYIfkX9pydI4XGRgvFo9g2JWswefI+WUSUHPYVBHYSEfTEqBxA5hQvAZB3Mw==",
+    "node_modules/@unrs/resolver-binding-linux-arm-gnueabihf": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-linux-arm-gnueabihf/-/resolver-binding-linux-arm-gnueabihf-1.11.1.tgz",
+      "integrity": "sha512-u92mvlcYtp9MRKmP+ZvMmtPN34+/3lMHlyMj7wXJDeXxuM0Vgzz0+PPJNsro1m3IZPYChIkn944wW8TYgGKFHw==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "undici-types": "~5.26.4"
-      }
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@types/node-fetch": {
-      "version": "2.6.12",
-      "resolved": "https://registry.npmjs.org/@types/node-fetch/-/node-fetch-2.6.12.tgz",
-      "integrity": "sha512-8nneRWKCg3rMtF69nLQJnOYUcbafYeFSjqkw3jCRLsqkWFlHaoQrr5mXmofFGOx3DKn7UfmBMyov8ySvLRVldA==",
+    "node_modules/@unrs/resolver-binding-linux-arm-musleabihf": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-linux-arm-musleabihf/-/resolver-binding-linux-arm-musleabihf-1.11.1.tgz",
+      "integrity": "sha512-cINaoY2z7LVCrfHkIcmvj7osTOtm6VVT16b5oQdS4beibX2SYBwgYLmqhBjA1t51CarSaBuX5YNsWLjsqfW5Cw==",
+      "cpu": [
+        "arm"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@types/node": "*",
-        "form-data": "^4.0.0"
-      }
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@types/node-forge": {
-      "version": "1.3.11",
-      "resolved": "https://registry.npmjs.org/@types/node-forge/-/node-forge-1.3.11.tgz",
-      "integrity": "sha512-FQx220y22OKNTqaByeBGqHWYz4cl94tpcxeFdvBo3wjG6XPBuZ0BNgNZRV5J5TFmmcsJ4IzsLkmGRiQbnYsBEQ==",
+    "node_modules/@unrs/resolver-binding-linux-arm64-gnu": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-linux-arm64-gnu/-/resolver-binding-linux-arm64-gnu-1.11.1.tgz",
+      "integrity": "sha512-34gw7PjDGB9JgePJEmhEqBhWvCiiWCuXsL9hYphDF7crW7UgI05gyBAi6MF58uGcMOiOqSJ2ybEeCvHcq0BCmQ==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@types/node": "*"
-      }
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@types/pg": {
-      "version": "8.15.2",
-      "resolved": "https://registry.npmjs.org/@types/pg/-/pg-8.15.2.tgz",
-      "integrity": "sha512-+BKxo5mM6+/A1soSHBI7ufUglqYXntChLDyTbvcAn1Lawi9J7J9Ok3jt6w7I0+T/UDJ4CyhHk66+GZbwmkYxSg==",
+    "node_modules/@unrs/resolver-binding-linux-arm64-musl": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-linux-arm64-musl/-/resolver-binding-linux-arm64-musl-1.11.1.tgz",
+      "integrity": "sha512-RyMIx6Uf53hhOtJDIamSbTskA99sPHS96wxVE/bJtePJJtpdKGXO1wY90oRdXuYOGOTuqjT8ACccMc4K6QmT3w==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@types/node": "*",
-        "pg-protocol": "*",
-        "pg-types": "^4.0.1"
-      }
-    },
-    "node_modules/@types/phoenix": {
-      "version": "1.6.6",
-      "resolved": "https://registry.npmjs.org/@types/phoenix/-/phoenix-1.6.6.tgz",
-      "integrity": "sha512-PIzZZlEppgrpoT2QgbnDU+MMzuR6BbCjllj0bM70lWoejMeNJAxCchxnv7J3XFkI8MpygtRpzXrIlmWUBclP5A==",
-      "license": "MIT"
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@types/qs": {
-      "version": "6.9.18",
-      "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.18.tgz",
-      "integrity": "sha512-kK7dgTYDyGqS+e2Q4aK9X3D7q234CIZ1Bv0q/7Z5IwRDoADNU81xXJK/YVyLbLTZCoIwUoDoffFeF+p/eIklAA==",
+    "node_modules/@unrs/resolver-binding-linux-ppc64-gnu": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-linux-ppc64-gnu/-/resolver-binding-linux-ppc64-gnu-1.11.1.tgz",
+      "integrity": "sha512-D8Vae74A4/a+mZH0FbOkFJL9DSK2R6TFPC9M+jCWYia/q2einCubX10pecpDiTmkJVUH+y8K3BZClycD8nCShA==",
+      "cpu": [
+        "ppc64"
+      ],
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@types/range-parser": {
-      "version": "1.2.7",
-      "resolved": "https://registry.npmjs.org/@types/range-parser/-/range-parser-1.2.7.tgz",
-      "integrity": "sha512-hKormJbkJqzQGhziax5PItDUTMAM9uE2XXQmM37dyd4hVM+5aVl7oVxMVUiVQn2oCQFN/LKCZdvSM0pFRqbSmQ==",
+    "node_modules/@unrs/resolver-binding-linux-riscv64-gnu": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-linux-riscv64-gnu/-/resolver-binding-linux-riscv64-gnu-1.11.1.tgz",
+      "integrity": "sha512-frxL4OrzOWVVsOc96+V3aqTIQl1O2TjgExV4EKgRY09AJ9leZpEg8Ak9phadbuX0BA4k8U5qtvMSQQGGmaJqcQ==",
+      "cpu": [
+        "riscv64"
+      ],
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@types/retry": {
-      "version": "0.12.2",
-      "resolved": "https://registry.npmjs.org/@types/retry/-/retry-0.12.2.tgz",
-      "integrity": "sha512-XISRgDJ2Tc5q4TRqvgJtzsRkFYNJzZrhTdtMoGVBttwzzQJkPnS3WWTFc7kuDRoPtPakl+T+OfdEUjYJj7Jbow==",
+    "node_modules/@unrs/resolver-binding-linux-riscv64-musl": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-linux-riscv64-musl/-/resolver-binding-linux-riscv64-musl-1.11.1.tgz",
+      "integrity": "sha512-mJ5vuDaIZ+l/acv01sHoXfpnyrNKOk/3aDoEdLO/Xtn9HuZlDD6jKxHlkN8ZhWyLJsRBxfv9GYM2utQ1SChKew==",
+      "cpu": [
+        "riscv64"
+      ],
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@types/send": {
-      "version": "0.17.4",
-      "resolved": "https://registry.npmjs.org/@types/send/-/send-0.17.4.tgz",
-      "integrity": "sha512-x2EM6TJOybec7c52BX0ZspPodMsQUd5L6PRwOunVyVUhXiBSKf3AezDL8Dgvgt5o0UfKNfuA0eMLr2wLT4AiBA==",
+    "node_modules/@unrs/resolver-binding-linux-s390x-gnu": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-linux-s390x-gnu/-/resolver-binding-linux-s390x-gnu-1.11.1.tgz",
+      "integrity": "sha512-kELo8ebBVtb9sA7rMe1Cph4QHreByhaZ2QEADd9NzIQsYNQpt9UkM9iqr2lhGr5afh885d/cB5QeTXSbZHTYPg==",
+      "cpu": [
+        "s390x"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@types/mime": "^1",
-        "@types/node": "*"
-      }
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@types/serve-index": {
-      "version": "1.9.4",
-      "resolved": "https://registry.npmjs.org/@types/serve-index/-/serve-index-1.9.4.tgz",
-      "integrity": "sha512-qLpGZ/c2fhSs5gnYsQxtDEq3Oy8SXPClIXkW5ghvAvsNuVSA8k+gCONcUCS/UjLEYvYps+e8uBtfgXgvhwfNug==",
+    "node_modules/@unrs/resolver-binding-linux-x64-gnu": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-linux-x64-gnu/-/resolver-binding-linux-x64-gnu-1.11.1.tgz",
+      "integrity": "sha512-C3ZAHugKgovV5YvAMsxhq0gtXuwESUKc5MhEtjBpLoHPLYM+iuwSj3lflFwK3DPm68660rZ7G8BMcwSro7hD5w==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@types/express": "*"
-      }
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@types/serve-static": {
-      "version": "1.15.7",
-      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.15.7.tgz",
-      "integrity": "sha512-W8Ym+h8nhuRwaKPaDw34QUkwsGi6Rc4yYqvKFo5rm2FUEhCFbzVWrxXUxuKK8TASjWsysJY0nsmNCGhCOIsrOw==",
+    "node_modules/@unrs/resolver-binding-linux-x64-musl": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-linux-x64-musl/-/resolver-binding-linux-x64-musl-1.11.1.tgz",
+      "integrity": "sha512-rV0YSoyhK2nZ4vEswT/QwqzqQXw5I6CjoaYMOX0TqBlWhojUf8P94mvI7nuJTeaCkkds3QE4+zS8Ko+GdXuZtA==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@types/http-errors": "*",
-        "@types/node": "*",
-        "@types/send": "*"
-      }
+      "optional": true,
+      "os": [
+        "linux"
+      ]
     },
-    "node_modules/@types/sockjs": {
-      "version": "0.3.36",
-      "resolved": "https://registry.npmjs.org/@types/sockjs/-/sockjs-0.3.36.tgz",
-      "integrity": "sha512-MK9V6NzAS1+Ud7JV9lJLFqW85VbC9dq3LmwZCuBe4wBDgKC0Kj/jd8Xl+nSviU+Qc3+m7umHHyHg//2KSa0a0Q==",
+    "node_modules/@unrs/resolver-binding-wasm32-wasi": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-wasm32-wasi/-/resolver-binding-wasm32-wasi-1.11.1.tgz",
+      "integrity": "sha512-5u4RkfxJm+Ng7IWgkzi3qrFOvLvQYnPBmjmZQ8+szTK/b31fQCnleNl1GgEt7nIsZRIf5PLhPwT0WM+q45x/UQ==",
+      "cpu": [
+        "wasm32"
+      ],
       "dev": true,
       "license": "MIT",
+      "optional": true,
       "dependencies": {
-        "@types/node": "*"
+        "@napi-rs/wasm-runtime": "^0.2.11"
+      },
+      "engines": {
+        "node": ">=14.0.0"
       }
     },
-    "node_modules/@types/urijs": {
-      "version": "1.19.25",
-      "resolved": "https://registry.npmjs.org/@types/urijs/-/urijs-1.19.25.tgz",
-      "integrity": "sha512-XOfUup9r3Y06nFAZh3WvO0rBU4OtlfPB/vgxpjg+NRdGU6CN6djdc6OEiH+PcqHCY6eFLo9Ista73uarf4gnBg==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/@types/uuid": {
-      "version": "10.0.0",
-      "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-10.0.0.tgz",
-      "integrity": "sha512-7gqG38EyHgyP1S+7+xomFtL+ZNHcKv6DwNaCZmJmo1vgMugyF3TCnXVg4t1uk89mLNwnLtnY3TpOpCOyp1/xHQ==",
+    "node_modules/@unrs/resolver-binding-win32-arm64-msvc": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-win32-arm64-msvc/-/resolver-binding-win32-arm64-msvc-1.11.1.tgz",
+      "integrity": "sha512-nRcz5Il4ln0kMhfL8S3hLkxI85BXs3o8EYoattsJNdsX4YUU89iOkVn7g0VHSRxFuVMdM4Q1jEpIId1Ihim/Uw==",
+      "cpu": [
+        "arm64"
+      ],
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
     },
-    "node_modules/@types/wrap-ansi": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/@types/wrap-ansi/-/wrap-ansi-3.0.0.tgz",
-      "integrity": "sha512-ltIpx+kM7g/MLRZfkbL7EsCEjfzCcScLpkg37eXEtx5kmrAKBkTJwd1GIAjDSL8wTpM6Hzn5YO4pSb91BEwu1g==",
+    "node_modules/@unrs/resolver-binding-win32-ia32-msvc": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-win32-ia32-msvc/-/resolver-binding-win32-ia32-msvc-1.11.1.tgz",
+      "integrity": "sha512-DCEI6t5i1NmAZp6pFonpD5m7i6aFrpofcp4LA2i8IIq60Jyo28hamKBxNrZcyOwVOZkgsRp9O2sXWBWP8MnvIQ==",
+      "cpu": [
+        "ia32"
+      ],
       "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/@types/ws": {
-      "version": "8.18.0",
-      "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.18.0.tgz",
-      "integrity": "sha512-8svvI3hMyvN0kKCJMvTJP/x6Y/EoQbepff882wL+Sn5QsXb3etnamgrJq4isrBxSJj5L2AuXcI0+bgkoAXGUJw==",
       "license": "MIT",
-      "dependencies": {
-        "@types/node": "*"
-      }
+      "optional": true,
+      "os": [
+        "win32"
+      ]
     },
-    "node_modules/@vitejs/plugin-basic-ssl": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@vitejs/plugin-basic-ssl/-/plugin-basic-ssl-1.2.0.tgz",
-      "integrity": "sha512-mkQnxTkcldAzIsomk1UuLfAu9n+kpQ3JbHcpCp7d2Oo6ITtji8pHS3QToOWjhPFvNQSnhlkAjmGbhv2QvwO/7Q==",
+    "node_modules/@unrs/resolver-binding-win32-x64-msvc": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-win32-x64-msvc/-/resolver-binding-win32-x64-msvc-1.11.1.tgz",
+      "integrity": "sha512-lrW200hZdbfRtztbygyaq/6jP6AKE8qQN2KvPcJ+x7wiD038YtnYtZ82IMNJ69GJibV7bwL3y9FgK+5w/pYt6g==",
+      "cpu": [
+        "x64"
+      ],
       "dev": true,
       "license": "MIT",
-      "engines": {
-        "node": ">=14.21.3"
-      },
-      "peerDependencies": {
-        "vite": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0"
-      }
+      "optional": true,
+      "os": [
+        "win32"
+      ]
     },
     "node_modules/@webassemblyjs/ast": {
       "version": "1.14.1",
@@ -5261,6 +7339,7 @@
       "integrity": "sha512-nuBEDgQfm1ccRp/8bCQrx1frohyufl4JlbMMZ4P1wpeOfDhF6FQkxZJ1b/e+PLwr6X1Nhw6OLme5usuBWYBvuQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@webassemblyjs/helper-numbers": "1.13.2",
         "@webassemblyjs/helper-wasm-bytecode": "1.13.2"
@@ -5271,21 +7350,24 @@
       "resolved": "https://registry.npmjs.org/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.13.2.tgz",
       "integrity": "sha512-6oXyTOzbKxGH4steLbLNOu71Oj+C8Lg34n6CqRvqfS2O71BxY6ByfMDRhBytzknj9yGUPVJ1qIKhRlAwO1AovA==",
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/@webassemblyjs/helper-api-error": {
       "version": "1.13.2",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-api-error/-/helper-api-error-1.13.2.tgz",
       "integrity": "sha512-U56GMYxy4ZQCbDZd6JuvvNV/WFildOjsaWD3Tzzvmw/mas3cXzRJPMjP83JqEsgSbyrmaGjBfDtV7KDXV9UzFQ==",
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/@webassemblyjs/helper-buffer": {
       "version": "1.14.1",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-buffer/-/helper-buffer-1.14.1.tgz",
       "integrity": "sha512-jyH7wtcHiKssDtFPRB+iQdxlDf96m0E39yb0k5uJVhFGleZFoNw1c4aeIcVUPPbXUVJ94wwnMOAqUHyzoEPVMA==",
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/@webassemblyjs/helper-numbers": {
       "version": "1.13.2",
@@ -5293,6 +7375,7 @@
       "integrity": "sha512-FE8aCmS5Q6eQYcV3gI35O4J789wlQA+7JrqTTpJqn5emA4U2hvwJmvFRC0HODS+3Ye6WioDklgd6scJ3+PLnEA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@webassemblyjs/floating-point-hex-parser": "1.13.2",
         "@webassemblyjs/helper-api-error": "1.13.2",
@@ -5304,7 +7387,8 @@
       "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.13.2.tgz",
       "integrity": "sha512-3QbLKy93F0EAIXLh0ogEVR6rOubA9AoZ+WRYhNbFyuB70j3dRdwH9g+qXhLAO0kiYGlg3TxDV+I4rQTr/YNXkA==",
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/@webassemblyjs/helper-wasm-section": {
       "version": "1.14.1",
@@ -5312,6 +7396,7 @@
       "integrity": "sha512-ds5mXEqTJ6oxRoqjhWDU83OgzAYjwsCV8Lo/N+oRsNDmx/ZDpqalmrtgOMkHwxsG0iI//3BwWAErYRHtgn0dZw==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@webassemblyjs/ast": "1.14.1",
         "@webassemblyjs/helper-buffer": "1.14.1",
@@ -5325,6 +7410,7 @@
       "integrity": "sha512-4LtOzh58S/5lX4ITKxnAK2USuNEvpdVV9AlgGQb8rJDHaLeHciwG4zlGr0j/SNWlr7x3vO1lDEsuePvtcDNCkw==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@xtuc/ieee754": "^1.2.0"
       }
@@ -5335,6 +7421,7 @@
       "integrity": "sha512-Lde1oNoIdzVzdkNEAWZ1dZ5orIbff80YPdHx20mrHwHrVNNTjNr8E3xz9BdpcGqRQbAEa+fkrCb+fRFTl/6sQw==",
       "dev": true,
       "license": "Apache-2.0",
+      "peer": true,
       "dependencies": {
         "@xtuc/long": "4.2.2"
       }
@@ -5344,7 +7431,8 @@
       "resolved": "https://registry.npmjs.org/@webassemblyjs/utf8/-/utf8-1.13.2.tgz",
       "integrity": "sha512-3NQWGjKTASY1xV5m7Hr0iPeXD9+RDobLll3T9d2AO+g3my8xy5peVyjSag4I50mR1bBSN/Ct12lo+R9tJk0NZQ==",
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/@webassemblyjs/wasm-edit": {
       "version": "1.14.1",
@@ -5352,6 +7440,7 @@
       "integrity": "sha512-RNJUIQH/J8iA/1NzlE4N7KtyZNHi3w7at7hDjvRNm5rcUXa00z1vRz3glZoULfJ5mpvYhLybmVcwcjGrC1pRrQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@webassemblyjs/ast": "1.14.1",
         "@webassemblyjs/helper-buffer": "1.14.1",
@@ -5369,6 +7458,7 @@
       "integrity": "sha512-AmomSIjP8ZbfGQhumkNvgC33AY7qtMCXnN6bL2u2Js4gVCg8fp735aEiMSBbDR7UQIj90n4wKAFUSEd0QN2Ukg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@webassemblyjs/ast": "1.14.1",
         "@webassemblyjs/helper-wasm-bytecode": "1.13.2",
@@ -5383,6 +7473,7 @@
       "integrity": "sha512-PTcKLUNvBqnY2U6E5bdOQcSM+oVP/PmrDY9NzowJjislEjwP/C4an2303MCVS2Mg9d3AJpIGdUFIQQWbPds0Sw==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@webassemblyjs/ast": "1.14.1",
         "@webassemblyjs/helper-buffer": "1.14.1",
@@ -5396,6 +7487,7 @@
       "integrity": "sha512-JLBl+KZ0R5qB7mCnud/yyX08jWFw5MsoalJ1pQ4EdFlgj9VdXKGuENGsiCIjegI1W7p91rUlcB/LB5yRJKNTcQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@webassemblyjs/ast": "1.14.1",
         "@webassemblyjs/helper-api-error": "1.13.2",
@@ -5411,6 +7503,7 @@
       "integrity": "sha512-kPSSXE6De1XOR820C90RIo2ogvZG+c3KiHzqUoO/F34Y2shGzesfqv7o57xrxovZJH/MetF5UjroJ/R/3isoiw==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@webassemblyjs/ast": "1.14.1",
         "@xtuc/long": "4.2.2"
@@ -5468,14 +7561,16 @@
       "resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
       "integrity": "sha512-DX8nKgqcGwsc0eJSqYt5lwP4DH5FlHnmuWWBRy7X0NcaGR0ZtuyeESgMwTYVEtxmsNGY+qit4QYT/MIYTOTPeA==",
       "dev": true,
-      "license": "BSD-3-Clause"
+      "license": "BSD-3-Clause",
+      "peer": true
     },
     "node_modules/@xtuc/long": {
       "version": "4.2.2",
       "resolved": "https://registry.npmjs.org/@xtuc/long/-/long-4.2.2.tgz",
       "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==",
       "dev": true,
-      "license": "Apache-2.0"
+      "license": "Apache-2.0",
+      "peer": true
     },
     "node_modules/@yarnpkg/lockfile": {
       "version": "1.1.0",
@@ -5485,9 +7580,9 @@
       "license": "BSD-2-Clause"
     },
     "node_modules/abbrev": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-3.0.0.tgz",
-      "integrity": "sha512-+/kfrslGQ7TNV2ecmQwMJj/B65g5KVq1/L3SGVZ3tCYGqlzFuFCGBZJtMP99wH3NpEUyAjn0zPdPUg0D+DwrOA==",
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-3.0.1.tgz",
+      "integrity": "sha512-AO2ac6pjRB3SJmGJo+v5/aK6Omggp6fsLrs6wN9bd35ulu4cCwaAU9+7ZhXjeqHVkaHThLuzH0nZr0YpCDhygg==",
       "dev": true,
       "license": "ISC",
       "engines": {
@@ -5511,6 +7606,7 @@
       "version": "1.3.8",
       "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz",
       "integrity": "sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "mime-types": "~2.1.34",
@@ -5524,15 +7620,16 @@
       "version": "0.6.3",
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz",
       "integrity": "sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==",
+      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 0.6"
       }
     },
     "node_modules/acorn": {
-      "version": "8.14.1",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.14.1.tgz",
-      "integrity": "sha512-OvQ/2pUDKmgfCg++xsTX1wGxfTaszcHVcTctW4UJB4hibJx2HXxxO5UmVgyjMa+ZDsiaf5wWLXYpRWMmBI0QHg==",
+      "version": "8.15.0",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz",
+      "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
       "devOptional": true,
       "license": "MIT",
       "bin": {
@@ -5542,6 +7639,16 @@
         "node": ">=0.4.0"
       }
     },
+    "node_modules/acorn-jsx": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz",
+      "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==",
+      "dev": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
+      }
+    },
     "node_modules/acorn-walk": {
       "version": "8.3.4",
       "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.4.tgz",
@@ -5555,39 +7662,10 @@
         "node": ">=0.4.0"
       }
     },
-    "node_modules/adjust-sourcemap-loader": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/adjust-sourcemap-loader/-/adjust-sourcemap-loader-4.0.0.tgz",
-      "integrity": "sha512-OXwN5b9pCUXNQHJpwwD2qP40byEmSgzj8B4ydSN0uMNYWiFmJ6x6KwUllMmfk8Rwu/HJDFR7U8ubsWBoN0Xp0A==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "loader-utils": "^2.0.0",
-        "regex-parser": "^2.2.11"
-      },
-      "engines": {
-        "node": ">=8.9"
-      }
-    },
-    "node_modules/adjust-sourcemap-loader/node_modules/loader-utils": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz",
-      "integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "big.js": "^5.2.2",
-        "emojis-list": "^3.0.0",
-        "json5": "^2.1.2"
-      },
-      "engines": {
-        "node": ">=8.9.0"
-      }
-    },
     "node_modules/agent-base": {
-      "version": "7.1.3",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.3.tgz",
-      "integrity": "sha512-jRR5wdylq8CkOe6hei19GGZnxM6rBGwFl3Bg0YItGDimvjGtAvdZk4Pu6Cl4u4Igsws4a1fd1Vq3ezrhn4KmFw==",
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.4.tgz",
+      "integrity": "sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -5648,11 +7726,200 @@
       "integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.3"
       },
-      "peerDependencies": {
-        "ajv": "^8.8.2"
+      "peerDependencies": {
+        "ajv": "^8.8.2"
+      }
+    },
+    "node_modules/algoliasearch": {
+      "version": "5.32.0",
+      "resolved": "https://registry.npmjs.org/algoliasearch/-/algoliasearch-5.32.0.tgz",
+      "integrity": "sha512-84xBncKNPBK8Ae89F65+SyVcOihrIbm/3N7to+GpRBHEUXGjA3ydWTMpcRW6jmFzkBQ/eqYy/y+J+NBpJWYjBg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-abtesting": "5.32.0",
+        "@algolia/client-analytics": "5.32.0",
+        "@algolia/client-common": "5.32.0",
+        "@algolia/client-insights": "5.32.0",
+        "@algolia/client-personalization": "5.32.0",
+        "@algolia/client-query-suggestions": "5.32.0",
+        "@algolia/client-search": "5.32.0",
+        "@algolia/ingestion": "1.32.0",
+        "@algolia/monitoring": "1.32.0",
+        "@algolia/recommend": "5.32.0",
+        "@algolia/requester-browser-xhr": "5.32.0",
+        "@algolia/requester-fetch": "5.32.0",
+        "@algolia/requester-node-http": "5.32.0"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/angular-eslint": {
+      "version": "20.1.1",
+      "resolved": "https://registry.npmjs.org/angular-eslint/-/angular-eslint-20.1.1.tgz",
+      "integrity": "sha512-sJ/7vdBMmmYGq5054UHfBXCWHABo79bPbNiXVznqBu6mV85RZsT+IBV1JKLHmV4JtfHoNx1ElkSL2hR3ZeJbkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/core": ">= 20.0.0 < 21.0.0",
+        "@angular-devkit/schematics": ">= 20.0.0 < 21.0.0",
+        "@angular-eslint/builder": "20.1.1",
+        "@angular-eslint/eslint-plugin": "20.1.1",
+        "@angular-eslint/eslint-plugin-template": "20.1.1",
+        "@angular-eslint/schematics": "20.1.1",
+        "@angular-eslint/template-parser": "20.1.1",
+        "@typescript-eslint/types": "^8.0.0",
+        "@typescript-eslint/utils": "^8.0.0"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": "*",
+        "typescript-eslint": "^8.0.0"
+      }
+    },
+    "node_modules/angular-eslint/node_modules/@angular-devkit/core": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-20.1.6.tgz",
+      "integrity": "sha512-Wooe+nTmHOLvveBQWDmSsdKg39re5BUMGVkwKlPHTQ/YU9aYshvPEBu1K0l4gSqe3qtqVVAx0HlPb53bEFFa8w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ajv": "8.17.1",
+        "ajv-formats": "3.0.1",
+        "jsonc-parser": "3.3.1",
+        "picomatch": "4.0.2",
+        "rxjs": "7.8.2",
+        "source-map": "0.7.4"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      },
+      "peerDependencies": {
+        "chokidar": "^4.0.0"
+      },
+      "peerDependenciesMeta": {
+        "chokidar": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/angular-eslint/node_modules/@angular-devkit/schematics": {
+      "version": "20.1.6",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-20.1.6.tgz",
+      "integrity": "sha512-Maj/yCkn3Qjum2kCYUOYMw8VYh/8725XN8/4cae9VllMwkN5D8jYDvX40qmfgQve2x0x6r3L8rmaIHn8227cHg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/core": "20.1.6",
+        "jsonc-parser": "3.3.1",
+        "magic-string": "0.30.17",
+        "ora": "8.2.0",
+        "rxjs": "7.8.2"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/angular-eslint/node_modules/chalk": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.6.0.tgz",
+      "integrity": "sha512-46QrSQFyVSEyYAgQ22hQ+zDa60YHA4fBstHmtSApj1Y5vKtG27fWowW03jCk5KcbXEWPZUIR894aARCA/G1kfQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/angular-eslint/node_modules/is-interactive": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-2.0.0.tgz",
+      "integrity": "sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/angular-eslint/node_modules/is-unicode-supported": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-2.1.0.tgz",
+      "integrity": "sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/angular-eslint/node_modules/log-symbols": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-6.0.0.tgz",
+      "integrity": "sha512-i24m8rpwhmPIS4zscNzK6MSEhk0DUWa/8iYQWxhffV8jkI4Phvs3F+quL5xvS0gdQR0FyTCMMH33Y78dDTzzIw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^5.3.0",
+        "is-unicode-supported": "^1.3.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/angular-eslint/node_modules/log-symbols/node_modules/is-unicode-supported": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-1.3.0.tgz",
+      "integrity": "sha512-43r2mRvz+8JRIKnWJ+3j8JtjRKZ6GmjzfaE/qiBJnikNnYv/6bagRJ1kUhNk8R5EX/GkobD+r+sfxCPJsiKBLQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/angular-eslint/node_modules/ora": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/ora/-/ora-8.2.0.tgz",
+      "integrity": "sha512-weP+BZ8MVNnlCm8c0Qdc1WSWq4Qn7I+9CJGm7Qali6g44e/PUzbjNqJX5NJ9ljlNMosfJvg1fKEGILklK9cwnw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^5.3.0",
+        "cli-cursor": "^5.0.0",
+        "cli-spinners": "^2.9.2",
+        "is-interactive": "^2.0.0",
+        "is-unicode-supported": "^2.0.0",
+        "log-symbols": "^6.0.0",
+        "stdin-discarder": "^0.2.2",
+        "string-width": "^7.2.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
     "node_modules/ansi-colors": {
@@ -5681,19 +7948,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/ansi-html-community": {
-      "version": "0.0.8",
-      "resolved": "https://registry.npmjs.org/ansi-html-community/-/ansi-html-community-0.0.8.tgz",
-      "integrity": "sha512-1APHAyr3+PCamwNw3bXCPp4HFLONZt/yIH0sZp0/469KWNTEy+qN5jQ3GVX6DMZ1UXAi34yVwtTeaG/HpBuuzw==",
-      "dev": true,
-      "engines": [
-        "node >= 0.8.0"
-      ],
-      "license": "Apache-2.0",
-      "bin": {
-        "ansi-html": "bin/ansi-html"
-      }
-    },
     "node_modules/ansi-regex": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz",
@@ -5765,6 +8019,33 @@
       "dev": true,
       "license": "Python-2.0"
     },
+    "node_modules/aria-query": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.2.tgz",
+      "integrity": "sha512-COROpnaoap1E2F000S62r6A60uHZnmlvomhfyT2DlTcrY1OrBKn2UhH7qn5wTC9zMvD0AY7csdPSNwKP+7WiQw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/array-buffer-byte-length": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.2.tgz",
+      "integrity": "sha512-LHE+8BuR7RYGDKvnrmcuSq3tDcKv9OFEXQt/HpbZhY7V6h0zlUXutnAD82GiFx9rdieCMjkvtcsPqBwgUl1Iiw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "is-array-buffer": "^3.0.5"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/array-differ": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-4.0.0.tgz",
@@ -5778,11 +8059,28 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/array-flatten": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
-      "integrity": "sha512-PCVAQswWemu6UdxsDFFX/+gVeYqKAod3D3UVm91jHwynguOwAvYPhx8nNlM++NqRcK6CxxpUafjmhIdKiHibqg==",
-      "license": "MIT"
+    "node_modules/array-includes": {
+      "version": "3.1.9",
+      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.9.tgz",
+      "integrity": "sha512-FmeCCAenzH0KH381SPT5FZmiA/TmpndpcaShhfgEN9eCVjnFBqq3l1xrI42y8+PPLI6hypzou4GXw00WHmPBLQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.24.0",
+        "es-object-atoms": "^1.1.1",
+        "get-intrinsic": "^1.3.0",
+        "is-string": "^1.1.1",
+        "math-intrinsics": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
     },
     "node_modules/array-union": {
       "version": "3.0.1",
@@ -5797,6 +8095,105 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/array.prototype.findlastindex": {
+      "version": "1.2.6",
+      "resolved": "https://registry.npmjs.org/array.prototype.findlastindex/-/array.prototype.findlastindex-1.2.6.tgz",
+      "integrity": "sha512-F/TKATkzseUExPlfvmwQKGITM3DGTK+vkAsCZoDc5daVygbJBnjEUCbgkAvVFsgfXfX4YIqZ/27G3k3tdXrTxQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.9",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "es-shim-unscopables": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/array.prototype.flat": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/array.prototype.flat/-/array.prototype.flat-1.3.3.tgz",
+      "integrity": "sha512-rwG/ja1neyLqCuGZ5YYrznA62D4mZXg0i1cIskIUKSiqF3Cje9/wXAls9B9s1Wa2fomMsIv8czB8jZcPmxCXFg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-shim-unscopables": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/array.prototype.flatmap": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.3.3.tgz",
+      "integrity": "sha512-Y7Wt51eKJSyi80hFrJCePGGNo5ktJCslFuboqJsbf57CCPcm5zztluPlc4/aD8sWsKvlwatezpV4U1efk8kpjg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-shim-unscopables": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/arraybuffer.prototype.slice": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.4.tgz",
+      "integrity": "sha512-BNoCY6SXXPQ7gF2opIP4GBE+Xw7U+pHMYKuzjgCN3GwiaIR09UUeKfheyIry77QtrCBlC0KK0q5/TER/tYh3PQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "array-buffer-byte-length": "^1.0.1",
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6",
+        "is-array-buffer": "^3.0.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/async": {
+      "version": "3.2.6",
+      "resolved": "https://registry.npmjs.org/async/-/async-3.2.6.tgz",
+      "integrity": "sha512-htCUDlxyyCLMgaM3xXg0C0LW2xqfuQ6p05pCEIsXuyQ+a1koYKTuBMzRNwmybfLgvJDMd0r1LTn4+E0Ti6C2AA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/async-function": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/async-function/-/async-function-1.0.0.tgz",
+      "integrity": "sha512-hsU18Ae8CDTR6Kgu9DYf0EbCr/a5iGL0rytQDobUcdpYOKokk8LEjVphnXkDkgpi0wYVsqrXuP0bZxJaTqdgoA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/asynckit": {
       "version": "0.4.0",
       "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
@@ -5842,74 +8239,30 @@
         "postcss": "^8.1.0"
       }
     },
-    "node_modules/babel-loader": {
-      "version": "9.2.1",
-      "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-9.2.1.tgz",
-      "integrity": "sha512-fqe8naHt46e0yIdkjUZYqddSXfej3AHajX+CSO5X7oy0EmPc6o5Xh+RClNoHjnieWz9AW4kZxW9yyFMhVB1QLA==",
+    "node_modules/available-typed-arrays": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
+      "integrity": "sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "find-cache-dir": "^4.0.0",
-        "schema-utils": "^4.0.0"
+        "possible-typed-array-names": "^1.0.0"
       },
       "engines": {
-        "node": ">= 14.15.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.12.0",
-        "webpack": ">=5"
-      }
-    },
-    "node_modules/babel-plugin-polyfill-corejs2": {
-      "version": "0.4.12",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.12.tgz",
-      "integrity": "sha512-CPWT6BwvhrTO2d8QVorhTCQw9Y43zOu7G9HigcfxvepOU6b8o3tcWad6oVgZIsZCTt42FFv97aA7ZJsbM4+8og==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/compat-data": "^7.22.6",
-        "@babel/helper-define-polyfill-provider": "^0.6.3",
-        "semver": "^6.3.1"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
-      }
-    },
-    "node_modules/babel-plugin-polyfill-corejs2/node_modules/semver": {
-      "version": "6.3.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
-      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-      "dev": true,
-      "license": "ISC",
-      "bin": {
-        "semver": "bin/semver.js"
-      }
-    },
-    "node_modules/babel-plugin-polyfill-corejs3": {
-      "version": "0.10.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.10.6.tgz",
-      "integrity": "sha512-b37+KR2i/khY5sKmWNVQAnitvquQbNdWy6lJdsr0kmquCKEEUgMKK4SboVM3HtfnZilfjr4MMQ7vY58FVWDtIA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/helper-define-polyfill-provider": "^0.6.2",
-        "core-js-compat": "^3.38.0"
+        "node": ">= 0.4"
       },
-      "peerDependencies": {
-        "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/babel-plugin-polyfill-regenerator": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.6.3.tgz",
-      "integrity": "sha512-LiWSbl4CRSIa5x/JAU6jZiG9eit9w6mz+yVMFwDE83LAWvt0AfGBoZ7HS/mkhrKuh2ZlzfVZYKoLjXdqw6Yt7Q==",
+    "node_modules/axobject-query": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-4.1.0.tgz",
+      "integrity": "sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==",
       "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/helper-define-polyfill-provider": "^0.6.3"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">= 0.4"
       }
     },
     "node_modules/balanced-match": {
@@ -5955,17 +8308,30 @@
         "node": "^4.5.0 || >= 5.9"
       }
     },
-    "node_modules/batch": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/batch/-/batch-0.6.1.tgz",
-      "integrity": "sha512-x+VAiMRL6UPkx+kudNvxTl6hB2XNNCG2r+7wixVfIYwu/2HKRXimwQyaumLjMveWvT2Hkd/cAJw+QBMfJ/EKVw==",
+    "node_modules/basic-auth": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/basic-auth/-/basic-auth-2.0.1.tgz",
+      "integrity": "sha512-NF+epuEdnUYVlGuhaxbbq+dvJttwLnGY+YixlXlME5KpQ5W3CnXA5cVTneY3SPbPDRkcjMbifrwmFYcClgOZeg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "safe-buffer": "5.1.2"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/basic-auth/node_modules/safe-buffer": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
+      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/beasties": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/beasties/-/beasties-0.2.0.tgz",
-      "integrity": "sha512-Ljqskqx/tbZagIglYoJIMzH5zgssyp+in9+9sAyh15N22AornBeIDnb8EZ6Rk+6ShfMxd92uO3gfpT0NtZbpow==",
+      "version": "0.3.4",
+      "resolved": "https://registry.npmjs.org/beasties/-/beasties-0.3.4.tgz",
+      "integrity": "sha512-NmzN1zN1cvGccXFyZ73335+ASXwBlVWcUPssiUDIlFdfyatHPRRufjCd5w8oPaQPvVnf9ELklaCGb1gi9FBwIw==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -5973,7 +8339,7 @@
         "css-what": "^6.1.0",
         "dom-serializer": "^2.0.0",
         "domhandler": "^5.0.3",
-        "htmlparser2": "^9.1.0",
+        "htmlparser2": "^10.0.0",
         "picocolors": "^1.1.1",
         "postcss": "^8.4.49",
         "postcss-media-query-parser": "^0.2.3"
@@ -5982,16 +8348,6 @@
         "node": ">=14.0.0"
       }
     },
-    "node_modules/big.js": {
-      "version": "5.2.2",
-      "resolved": "https://registry.npmjs.org/big.js/-/big.js-5.2.2.tgz",
-      "integrity": "sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": "*"
-      }
-    },
     "node_modules/binary-extensions": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
@@ -6020,6 +8376,7 @@
       "version": "1.20.3",
       "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.3.tgz",
       "integrity": "sha512-7rAxByjUMqQ3/bHJy7D6OGXvx/MMc4IqBn/X0fcM1QUcAItpZrBEYhWGem+tzXH90c+G01ypMcYJBO9Y30203g==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "bytes": "3.1.2",
@@ -6044,6 +8401,7 @@
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
       "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ms": "2.0.0"
@@ -6053,18 +8411,8 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
       "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
-      "license": "MIT"
-    },
-    "node_modules/bonjour-service": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/bonjour-service/-/bonjour-service-1.3.0.tgz",
-      "integrity": "sha512-3YuAUiSkWykd+2Azjgyxei8OWf8thdn8AITIog2M4UICzoqfjlqr64WIjEXZllf/W6vK1goqleSR6brGomxQqA==",
       "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "fast-deep-equal": "^3.1.3",
-        "multicast-dns": "^7.2.5"
-      }
+      "license": "MIT"
     },
     "node_modules/boolbase": {
       "version": "1.0.0",
@@ -6104,9 +8452,9 @@
       "license": "MIT"
     },
     "node_modules/browserslist": {
-      "version": "4.24.4",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.24.4.tgz",
-      "integrity": "sha512-KDi1Ny1gSePi1vm0q4oxSF8b4DR44GF4BbmS2YdhPLOEqd8pDviZOGH/GsmRwoWJ2+5Lr085X7naowMwKHDG1A==",
+      "version": "4.25.2",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.25.2.tgz",
+      "integrity": "sha512-0si2SJK3ooGzIawRu61ZdPCO1IncZwS8IzuX73sPZsXW6EQ/w/DAfPyKI8l1ETTCr2MnvqWitmlCUxgdul45jA==",
       "dev": true,
       "funding": [
         {
@@ -6124,10 +8472,10 @@
       ],
       "license": "MIT",
       "dependencies": {
-        "caniuse-lite": "^1.0.30001688",
-        "electron-to-chromium": "^1.5.73",
+        "caniuse-lite": "^1.0.30001733",
+        "electron-to-chromium": "^1.5.199",
         "node-releases": "^2.0.19",
-        "update-browserslist-db": "^1.1.1"
+        "update-browserslist-db": "^1.1.3"
       },
       "bin": {
         "browserslist": "cli.js"
@@ -6136,6 +8484,19 @@
         "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
       }
     },
+    "node_modules/btoa": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/btoa/-/btoa-1.2.1.tgz",
+      "integrity": "sha512-SB4/MIGlsiVkMcHmT+pSmIPoNDoHg+7cMzmt3Uxt628MTz2487DKSqK/fuhFBrkuqrYv5UCEnACpF4dTFNKc/g==",
+      "dev": true,
+      "license": "(MIT OR Apache-2.0)",
+      "bin": {
+        "btoa": "bin/btoa.js"
+      },
+      "engines": {
+        "node": ">= 0.4.0"
+      }
+    },
     "node_modules/buffer": {
       "version": "5.7.1",
       "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
@@ -6168,22 +8529,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/bundle-name": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/bundle-name/-/bundle-name-4.1.0.tgz",
-      "integrity": "sha512-tjwM5exMg6BGRI+kNmTntNsvdZS1X8BFYS6tnJ2hdH0kVxM6/eVZ2xy+FqStSWvYmtfFMDLIxurorHwDKfDz5Q==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "run-applescript": "^7.0.0"
-      },
-      "engines": {
-        "node": ">=18"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/bytes": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz",
@@ -6311,9 +8656,9 @@
       }
     },
     "node_modules/cacache/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6418,6 +8763,25 @@
         "node": ">=18"
       }
     },
+    "node_modules/call-bind": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.8.tgz",
+      "integrity": "sha512-oKlSFMcMwpUg2ednkhQ454wfWiU/ul3CkJe/PEHcTKuiX6RpbehUiFMXu13HalGZxfUwCQzZG747YXBn1im9ww==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.0",
+        "es-define-property": "^1.0.0",
+        "get-intrinsic": "^1.2.4",
+        "set-function-length": "^1.2.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/call-bind-apply-helpers": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
@@ -6480,9 +8844,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001703",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001703.tgz",
-      "integrity": "sha512-kRlAGTRWgPsOj7oARC9m1okJEXdL/8fekFVcxA8Hl7GH4r/sN4OJn/i6Flde373T50KS7Y37oFbMwlE8+F42kQ==",
+      "version": "1.0.30001735",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001735.tgz",
+      "integrity": "sha512-EV/laoX7Wq2J9TQlyIXRxTJqIw4sxfXS4OYgudGxBYRuTv0q7AM6yMEpU/Vo1I94thg9U6EZ2NfZx9GJq83u7w==",
       "dev": true,
       "funding": [
         {
@@ -6573,6 +8937,7 @@
       "integrity": "sha512-rNjApaLzuwaOTjCiT8lSDdGN1APCiqkChLMJxJPWLunPAt5fy8xgU9/jNOchV84wfIxrA0lRQB7oCT8jrn/wrQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=6.0"
       }
@@ -6802,92 +9167,33 @@
       "license": "MIT"
     },
     "node_modules/combined-stream": {
-      "version": "1.0.8",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
-      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "delayed-stream": "~1.0.0"
-      },
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/commander": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
-      "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 6"
-      }
-    },
-    "node_modules/common-path-prefix": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/common-path-prefix/-/common-path-prefix-3.0.0.tgz",
-      "integrity": "sha512-QE33hToZseCH3jS0qN96O/bSh3kaw/h+Tq7ngyY9eWDUnTlTNUyqfqvCXioLe5Na5jFsL78ra/wuBU4iuEgd4w==",
-      "dev": true,
-      "license": "ISC"
-    },
-    "node_modules/compressible": {
-      "version": "2.0.18",
-      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz",
-      "integrity": "sha512-AF3r7P5dWxL8MxyITRMlORQNaOA2IkAFaTr4k7BUumjPtRpGDTZpl0Pb1XCO6JeDCBdp126Cgs9sMxqSjgYyRg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "mime-db": ">= 1.43.0 < 2"
-      },
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/compression": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/compression/-/compression-1.8.0.tgz",
-      "integrity": "sha512-k6WLKfunuqCYD3t6AsuPGvQWaKwuLLh2/xHNcX4qE+vIfDNXpSqnrhwA7O53R7WVQUnt8dVAIW+YHr7xTgOgGA==",
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "bytes": "3.1.2",
-        "compressible": "~2.0.18",
-        "debug": "2.6.9",
-        "negotiator": "~0.6.4",
-        "on-headers": "~1.0.2",
-        "safe-buffer": "5.2.1",
-        "vary": "~1.1.2"
+        "delayed-stream": "~1.0.0"
       },
       "engines": {
-        "node": ">= 0.8.0"
+        "node": ">= 0.8"
       }
     },
-    "node_modules/compression/node_modules/debug": {
-      "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-      "dev": true,
+    "node_modules/commander": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
+      "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==",
       "license": "MIT",
-      "dependencies": {
-        "ms": "2.0.0"
+      "engines": {
+        "node": ">= 6"
       }
     },
-    "node_modules/compression/node_modules/ms": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/compression/node_modules/negotiator": {
-      "version": "0.6.4",
-      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.4.tgz",
-      "integrity": "sha512-myRT3DiWPHqho5PrJaIRyaMv2kgYf0mUVgBNOYMuCH5Ki1yEiQaf/ZJuQ62nvpc44wL5WDbTX7yGJi1Neevw8w==",
+    "node_modules/common-path-prefix": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/common-path-prefix/-/common-path-prefix-3.0.0.tgz",
+      "integrity": "sha512-QE33hToZseCH3jS0qN96O/bSh3kaw/h+Tq7ngyY9eWDUnTlTNUyqfqvCXioLe5Na5jFsL78ra/wuBU4iuEgd4w==",
       "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.6"
-      }
+      "license": "ISC"
     },
     "node_modules/concat-map": {
       "version": "0.0.1",
@@ -6919,16 +9225,6 @@
         "node": ">= 0.10.0"
       }
     },
-    "node_modules/connect-history-api-fallback": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-2.0.0.tgz",
-      "integrity": "sha512-U73+6lQFmfiNPrYbXqr6kZ1i1wiRqXnp2nhMsINseWXO8lDau0LGEffJ8kQi4EjLZympVgRdvqjAgiZ1tgzDDA==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.8"
-      }
-    },
     "node_modules/connect/node_modules/debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -7009,9 +9305,9 @@
       }
     },
     "node_modules/content-disposition": {
-      "version": "0.5.4",
-      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz",
-      "integrity": "sha512-FveZTNuGw04cxlAiWbzi6zTAL/lhehaWbTtgluJh4/E95DqMwTmha3KZN1aAWA8cFIhHzMZUvLevkw5Rqk+tSQ==",
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-1.0.0.tgz",
+      "integrity": "sha512-Au9nRL8VNUut/XSzbQA38+M78dzP4D+eqg3gfJHMIHHYa3bg067xj1KxMUWj+VULbiZMowKngFFbKczUrNJ1mg==",
       "license": "MIT",
       "dependencies": {
         "safe-buffer": "5.2.1"
@@ -7046,10 +9342,13 @@
       }
     },
     "node_modules/cookie-signature": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
-      "integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ==",
-      "license": "MIT"
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.2.2.tgz",
+      "integrity": "sha512-D76uU73ulSXrD1UXF4KE2TMxVVwhsnCgfAyTg9k8P6KGZjlXKrOLe4dJQKI3Bxi5wjesZoFXJWElNWBjPZMbhg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.6.0"
+      }
     },
     "node_modules/copy-anything": {
       "version": "2.0.6",
@@ -7064,52 +9363,6 @@
         "url": "https://github.com/sponsors/mesqueeb"
       }
     },
-    "node_modules/copy-webpack-plugin": {
-      "version": "12.0.2",
-      "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-12.0.2.tgz",
-      "integrity": "sha512-SNwdBeHyII+rWvee/bTnAYyO8vfVdcSTud4EIb6jcZ8inLeWucJE0DnxXQBjlQ5zlteuuvooGQy3LIyGxhvlOA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "fast-glob": "^3.3.2",
-        "glob-parent": "^6.0.1",
-        "globby": "^14.0.0",
-        "normalize-path": "^3.0.0",
-        "schema-utils": "^4.2.0",
-        "serialize-javascript": "^6.0.2"
-      },
-      "engines": {
-        "node": ">= 18.12.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/webpack"
-      },
-      "peerDependencies": {
-        "webpack": "^5.1.0"
-      }
-    },
-    "node_modules/core-js-compat": {
-      "version": "3.41.0",
-      "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.41.0.tgz",
-      "integrity": "sha512-RFsU9LySVue9RTwdDVX/T0e2Y6jRYWXERKElIjpuEOEnxaXffI0X7RUwVzfYLfzuLXSNJDYoRYUAmRUcyln20A==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "browserslist": "^4.24.4"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/core-js"
-      }
-    },
-    "node_modules/core-util-is": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz",
-      "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/cors": {
       "version": "2.8.5",
       "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
@@ -7124,31 +9377,14 @@
         "node": ">= 0.10"
       }
     },
-    "node_modules/cosmiconfig": {
-      "version": "9.0.0",
-      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.0.tgz",
-      "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==",
+    "node_modules/corser": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/corser/-/corser-2.0.1.tgz",
+      "integrity": "sha512-utCYNzRSQIZNPIcGZdQc92UVJYAhtGAteCFg0yRaFm8f0P+CPtyGyHXJcGXnffjCybUCEx3FQ2G7U3/o9eIkVQ==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "env-paths": "^2.2.1",
-        "import-fresh": "^3.3.0",
-        "js-yaml": "^4.1.0",
-        "parse-json": "^5.2.0"
-      },
       "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/d-fischer"
-      },
-      "peerDependencies": {
-        "typescript": ">=4.9.5"
-      },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
+        "node": ">= 0.4.0"
       }
     },
     "node_modules/create-require": {
@@ -7228,46 +9464,10 @@
         "node": "*"
       }
     },
-    "node_modules/css-loader": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-7.1.2.tgz",
-      "integrity": "sha512-6WvYYn7l/XEGN8Xu2vWFt9nVzrCn39vKyTEFf/ExEyoksJjjSZV/0/35XPlMbpnr6VGhZIUg5yJrL8tGfes/FA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "icss-utils": "^5.1.0",
-        "postcss": "^8.4.33",
-        "postcss-modules-extract-imports": "^3.1.0",
-        "postcss-modules-local-by-default": "^4.0.5",
-        "postcss-modules-scope": "^3.2.0",
-        "postcss-modules-values": "^4.0.0",
-        "postcss-value-parser": "^4.2.0",
-        "semver": "^7.5.4"
-      },
-      "engines": {
-        "node": ">= 18.12.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/webpack"
-      },
-      "peerDependencies": {
-        "@rspack/core": "0.x || 1.x",
-        "webpack": "^5.27.0"
-      },
-      "peerDependenciesMeta": {
-        "@rspack/core": {
-          "optional": true
-        },
-        "webpack": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/css-select": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/css-select/-/css-select-5.1.0.tgz",
-      "integrity": "sha512-nwoRF1rvRRnnCqqY7updORDsuqKzqYJ28+oSMaJMMgOauh3fvwHqMS7EZpIPqK8GL+g9mKxF1vP/ZjSeNjEVHg==",
+      "version": "5.2.2",
+      "resolved": "https://registry.npmjs.org/css-select/-/css-select-5.2.2.tgz",
+      "integrity": "sha512-TizTzUddG/xYLA3NXodFM0fSbNizXjOKhqiQQwvhlspadZokn1KDy0NZFS0wuEubIYAV5/c1/lAr0TaaFXEXzw==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -7293,9 +9493,9 @@
       }
     },
     "node_modules/css-what": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.1.0.tgz",
-      "integrity": "sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==",
+      "version": "6.2.2",
+      "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.2.2.tgz",
+      "integrity": "sha512-u/O3vwbptzhMs3L1fQE82ZSLHQQfto5gyZzwteVIEyeaY5Fc7R4dapF/BvRoSYFeqfBk4m0V1Vafq5Pjv25wvA==",
       "dev": true,
       "license": "BSD-2-Clause",
       "engines": {
@@ -7363,6 +9563,60 @@
         "node": ">= 12"
       }
     },
+    "node_modules/data-view-buffer": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.2.tgz",
+      "integrity": "sha512-EmKO5V3OLXh1rtK2wgXRansaK1/mtVdTUEiEI0W8RkvgT05kfxaH29PliLnpLP73yYO6142Q72QNa8Wx/A5CqQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/data-view-byte-length": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.2.tgz",
+      "integrity": "sha512-tuhGbE6CfTM9+5ANGf+oQb72Ky/0+s3xKUpHvShfiz2RxMFgFPjsXuRLBVMtvMs15awe45SRb83D6wH4ew6wlQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/inspect-js"
+      }
+    },
+    "node_modules/data-view-byte-offset": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.1.tgz",
+      "integrity": "sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/date-format": {
       "version": "4.0.14",
       "resolved": "https://registry.npmjs.org/date-format/-/date-format-4.0.14.tgz",
@@ -7381,10 +9635,9 @@
       "license": "MIT"
     },
     "node_modules/debug": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
-      "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==",
-      "dev": true,
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
+      "integrity": "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==",
       "license": "MIT",
       "dependencies": {
         "ms": "^2.1.3"
@@ -7430,6 +9683,13 @@
         }
       }
     },
+    "node_modules/deep-is": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz",
+      "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/deepmerge": {
       "version": "4.3.1",
       "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz",
@@ -7440,60 +9700,63 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/default-browser": {
-      "version": "5.2.1",
-      "resolved": "https://registry.npmjs.org/default-browser/-/default-browser-5.2.1.tgz",
-      "integrity": "sha512-WY/3TUME0x3KPYdRRxEJJvXRHV4PyPoUsxtZa78lwItwRQRHhd2U9xOscaT/YTf8uCXIAjeJOFBVEh/7FtD8Xg==",
+    "node_modules/defaults": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.4.tgz",
+      "integrity": "sha512-eFuaLoy/Rxalv2kr+lqMlUnrDWV+3j4pljOIJgLIhI058IQfWJ7vXhyEIHu+HtC738klGALYxOKDO0bQP3tg8A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "bundle-name": "^4.1.0",
-        "default-browser-id": "^5.0.0"
-      },
-      "engines": {
-        "node": ">=18"
+        "clone": "^1.0.2"
       },
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/default-browser-id": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/default-browser-id/-/default-browser-id-5.0.0.tgz",
-      "integrity": "sha512-A6p/pu/6fyBcA1TRz/GqWYPViplrftcW2gZC9q79ngNCKAeR/X3gcEdXQHl4KNXV+3wgIJ1CPkJQ3IHM6lcsyA==",
+    "node_modules/define-data-property": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz",
+      "integrity": "sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==",
       "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "es-define-property": "^1.0.0",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.0.1"
+      },
       "engines": {
-        "node": ">=18"
+        "node": ">= 0.4"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/defaults": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.4.tgz",
-      "integrity": "sha512-eFuaLoy/Rxalv2kr+lqMlUnrDWV+3j4pljOIJgLIhI058IQfWJ7vXhyEIHu+HtC738klGALYxOKDO0bQP3tg8A==",
+    "node_modules/define-lazy-prop": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz",
+      "integrity": "sha512-Ds09qNh8yw3khSjiJjiUInaGX9xlqZDY7JVryGxdxV7NPeuqQfplOpQ66yJFZut3jLa5zOwkXw1g9EI2uKh4Og==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "clone": "^1.0.2"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+      "engines": {
+        "node": ">=8"
       }
     },
-    "node_modules/define-lazy-prop": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-3.0.0.tgz",
-      "integrity": "sha512-N+MeXYoqr3pOgn8xfyRPREN7gHakLYjhsHhWGT3fWAiL4IkAt0iDw14QiiEm2bE30c5XX5q0FtAA3CK5f9/BUg==",
+    "node_modules/define-properties": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.2.1.tgz",
+      "integrity": "sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==",
       "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "define-data-property": "^1.0.1",
+        "has-property-descriptors": "^1.0.0",
+        "object-keys": "^1.1.1"
+      },
       "engines": {
-        "node": ">=12"
+        "node": ">= 0.4"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/defu": {
@@ -7522,6 +9785,16 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/dependency-graph": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/dependency-graph/-/dependency-graph-1.0.0.tgz",
+      "integrity": "sha512-cW3gggJ28HZ/LExwxP2B++aiKxhJXMSIt9K48FOXQkm+vuG5gyatXnLsONRJdzO/7VfjDIiaOOa/bs4l464Lwg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/destr": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/destr/-/destr-2.0.5.tgz",
@@ -7533,6 +9806,7 @@
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.2.0.tgz",
       "integrity": "sha512-2sJGJTaXIIaR1w4iJSNoN0hnMY7Gpc/n8D4qSCJw8QqFWXf7cuAgnEHxBpweaVcPevC2l3KpjYCx3NypQQgaJg==",
+      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 0.8",
@@ -7540,9 +9814,9 @@
       }
     },
     "node_modules/detect-libc": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.3.tgz",
-      "integrity": "sha512-bwy0MGW55bG41VqxxypOsdSdGqLwXPI/focwgTYCFMbdUiBAxLg9CFzG08sz2aqzknwiX7Hkl0bQENjg8iLByw==",
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz",
+      "integrity": "sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==",
       "dev": true,
       "license": "Apache-2.0",
       "optional": true,
@@ -7550,13 +9824,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/detect-node": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.1.0.tgz",
-      "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/di": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz",
@@ -7604,17 +9871,17 @@
       "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==",
       "license": "MIT"
     },
-    "node_modules/dns-packet": {
-      "version": "5.6.1",
-      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-5.6.1.tgz",
-      "integrity": "sha512-l4gcSouhcgIKRvyy99RNVOgxXiicE+2jZoNmaNmZ6JXiGajBOJAesk1OBlJuM5k2c+eudGdLxDqXuPCKIj6kpw==",
+    "node_modules/doctrine": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.1.0.tgz",
+      "integrity": "sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==",
       "dev": true,
-      "license": "MIT",
+      "license": "Apache-2.0",
       "dependencies": {
-        "@leichtgewicht/ip-codec": "^2.0.1"
+        "esutils": "^2.0.2"
       },
       "engines": {
-        "node": ">=6"
+        "node": ">=0.10.0"
       }
     },
     "node_modules/dom-serialize": {
@@ -7745,10 +10012,26 @@
       "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==",
       "license": "MIT"
     },
+    "node_modules/ejs": {
+      "version": "3.1.10",
+      "resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.10.tgz",
+      "integrity": "sha512-UeJmFfOrAQS8OJWPZ4qtgHyWExa088/MtK5UEyoJGFH67cDEXkZSviOiKRCZ4Xij0zxI3JECgYs3oKx+AizQBA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "jake": "^10.8.5"
+      },
+      "bin": {
+        "ejs": "bin/cli.js"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/electron-to-chromium": {
-      "version": "1.5.114",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.114.tgz",
-      "integrity": "sha512-DFptFef3iktoKlFQK/afbo274/XNWD00Am0xa7M8FZUepHlHT8PEuiNBoRfFHbH1okqN58AlhbJ4QTkcnXorjA==",
+      "version": "1.5.203",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.203.tgz",
+      "integrity": "sha512-uz4i0vLhfm6dLZWbz/iH88KNDV+ivj5+2SA+utpgjKaj9Q0iDLuwk6Idhe9BTxciHudyx6IvTvijhkPvFGUQ0g==",
       "dev": true,
       "license": "ISC"
     },
@@ -7759,16 +10042,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/emojis-list": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz",
-      "integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 4"
-      }
-    },
     "node_modules/encodeurl": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-2.0.0.tgz",
@@ -7868,6 +10141,7 @@
       "integrity": "sha512-ZSW3ma5GkcQBIpwZTSRAI8N71Uuwgs93IezB7mf7R60tC8ZbJideoDNKjHn2O9KIlx6rkGTTEk1xUCK2E1Y2Yg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "graceful-fs": "^4.2.4",
         "tapable": "^2.2.0"
@@ -7962,14 +10236,73 @@
         "errno": "cli.js"
       }
     },
-    "node_modules/error-ex": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
-      "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==",
+    "node_modules/es-abstract": {
+      "version": "1.24.0",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.24.0.tgz",
+      "integrity": "sha512-WSzPgsdLtTcQwm4CROfS5ju2Wa1QQcVeT37jFjYzdFz1r9ahadC8B8/a4qxJxM+09F18iumCdRmlr96ZYkQvEg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "is-arrayish": "^0.2.1"
+        "array-buffer-byte-length": "^1.0.2",
+        "arraybuffer.prototype.slice": "^1.0.4",
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "data-view-buffer": "^1.0.2",
+        "data-view-byte-length": "^1.0.2",
+        "data-view-byte-offset": "^1.0.1",
+        "es-define-property": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "es-set-tostringtag": "^2.1.0",
+        "es-to-primitive": "^1.3.0",
+        "function.prototype.name": "^1.1.8",
+        "get-intrinsic": "^1.3.0",
+        "get-proto": "^1.0.1",
+        "get-symbol-description": "^1.1.0",
+        "globalthis": "^1.0.4",
+        "gopd": "^1.2.0",
+        "has-property-descriptors": "^1.0.2",
+        "has-proto": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "internal-slot": "^1.1.0",
+        "is-array-buffer": "^3.0.5",
+        "is-callable": "^1.2.7",
+        "is-data-view": "^1.0.2",
+        "is-negative-zero": "^2.0.3",
+        "is-regex": "^1.2.1",
+        "is-set": "^2.0.3",
+        "is-shared-array-buffer": "^1.0.4",
+        "is-string": "^1.1.1",
+        "is-typed-array": "^1.1.15",
+        "is-weakref": "^1.1.1",
+        "math-intrinsics": "^1.1.0",
+        "object-inspect": "^1.13.4",
+        "object-keys": "^1.1.1",
+        "object.assign": "^4.1.7",
+        "own-keys": "^1.0.1",
+        "regexp.prototype.flags": "^1.5.4",
+        "safe-array-concat": "^1.1.3",
+        "safe-push-apply": "^1.0.0",
+        "safe-regex-test": "^1.1.0",
+        "set-proto": "^1.0.0",
+        "stop-iteration-iterator": "^1.1.0",
+        "string.prototype.trim": "^1.2.10",
+        "string.prototype.trimend": "^1.0.9",
+        "string.prototype.trimstart": "^1.0.8",
+        "typed-array-buffer": "^1.0.3",
+        "typed-array-byte-length": "^1.0.3",
+        "typed-array-byte-offset": "^1.0.4",
+        "typed-array-length": "^1.0.7",
+        "unbox-primitive": "^1.1.0",
+        "which-typed-array": "^1.1.19"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/es-define-property": {
@@ -7995,7 +10328,8 @@
       "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.6.0.tgz",
       "integrity": "sha512-qqnD1yMU6tk/jnaMosogGySTZP8YtUgAffA9nMN+E/rjxcfRQ6IEk7IiozUjgxKoFHBGjTLnrHB/YC45r/59EQ==",
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/es-object-atoms": {
       "version": "1.1.1",
@@ -8025,10 +10359,41 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/es-shim-unscopables": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/es-shim-unscopables/-/es-shim-unscopables-1.1.0.tgz",
+      "integrity": "sha512-d9T8ucsEhh8Bi1woXCf+TIKDIROLG5WCkxg8geBCbvk22kzwC5G2OnXVMO6FUsvQlgUUXQ2itephWDLqDzbeCw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-to-primitive": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.3.0.tgz",
+      "integrity": "sha512-w+5mJ3GuFL+NjVtJlvydShqE1eN3h3PbI7/5LAsYJP/2qtuMXjfL2LpHSRqo4b4eSF5K/DH1JXKUAHSB2UW50g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-callable": "^1.2.7",
+        "is-date-object": "^1.0.5",
+        "is-symbol": "^1.0.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/esbuild": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.0.tgz",
-      "integrity": "sha512-BXq5mqc8ltbaN34cDqWuYKyNhX8D/Z0J1xdtdQ8UcIIIyJyz+ZMKUt58tF3SrZ85jcfN/PZYhjR5uDQAYNVbuw==",
+      "version": "0.25.5",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.5.tgz",
+      "integrity": "sha512-P8OtKZRv/5J5hhz0cUAdu/cLuPIKXpQl1R9pZtvmHWQvrAUVd0UNIPT4IB4W3rNOqVO0rlqHmCIbSwxh/c9yUQ==",
       "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
@@ -8039,41 +10404,46 @@
         "node": ">=18"
       },
       "optionalDependencies": {
-        "@esbuild/aix-ppc64": "0.25.0",
-        "@esbuild/android-arm": "0.25.0",
-        "@esbuild/android-arm64": "0.25.0",
-        "@esbuild/android-x64": "0.25.0",
-        "@esbuild/darwin-arm64": "0.25.0",
-        "@esbuild/darwin-x64": "0.25.0",
-        "@esbuild/freebsd-arm64": "0.25.0",
-        "@esbuild/freebsd-x64": "0.25.0",
-        "@esbuild/linux-arm": "0.25.0",
-        "@esbuild/linux-arm64": "0.25.0",
-        "@esbuild/linux-ia32": "0.25.0",
-        "@esbuild/linux-loong64": "0.25.0",
-        "@esbuild/linux-mips64el": "0.25.0",
-        "@esbuild/linux-ppc64": "0.25.0",
-        "@esbuild/linux-riscv64": "0.25.0",
-        "@esbuild/linux-s390x": "0.25.0",
-        "@esbuild/linux-x64": "0.25.0",
-        "@esbuild/netbsd-arm64": "0.25.0",
-        "@esbuild/netbsd-x64": "0.25.0",
-        "@esbuild/openbsd-arm64": "0.25.0",
-        "@esbuild/openbsd-x64": "0.25.0",
-        "@esbuild/sunos-x64": "0.25.0",
-        "@esbuild/win32-arm64": "0.25.0",
-        "@esbuild/win32-ia32": "0.25.0",
-        "@esbuild/win32-x64": "0.25.0"
-      }
-    },
-    "node_modules/esbuild-wasm": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/esbuild-wasm/-/esbuild-wasm-0.25.0.tgz",
-      "integrity": "sha512-60iuWr6jdTVylmGXjpnqk3pCktUi5Rmjiv6EMza3h4X20BLtfL2BjUGs1+UCt2G9UK7jVGrJdUr5i1k0sL3wBg==",
+        "@esbuild/aix-ppc64": "0.25.5",
+        "@esbuild/android-arm": "0.25.5",
+        "@esbuild/android-arm64": "0.25.5",
+        "@esbuild/android-x64": "0.25.5",
+        "@esbuild/darwin-arm64": "0.25.5",
+        "@esbuild/darwin-x64": "0.25.5",
+        "@esbuild/freebsd-arm64": "0.25.5",
+        "@esbuild/freebsd-x64": "0.25.5",
+        "@esbuild/linux-arm": "0.25.5",
+        "@esbuild/linux-arm64": "0.25.5",
+        "@esbuild/linux-ia32": "0.25.5",
+        "@esbuild/linux-loong64": "0.25.5",
+        "@esbuild/linux-mips64el": "0.25.5",
+        "@esbuild/linux-ppc64": "0.25.5",
+        "@esbuild/linux-riscv64": "0.25.5",
+        "@esbuild/linux-s390x": "0.25.5",
+        "@esbuild/linux-x64": "0.25.5",
+        "@esbuild/netbsd-arm64": "0.25.5",
+        "@esbuild/netbsd-x64": "0.25.5",
+        "@esbuild/openbsd-arm64": "0.25.5",
+        "@esbuild/openbsd-x64": "0.25.5",
+        "@esbuild/sunos-x64": "0.25.5",
+        "@esbuild/win32-arm64": "0.25.5",
+        "@esbuild/win32-ia32": "0.25.5",
+        "@esbuild/win32-x64": "0.25.5"
+      }
+    },
+    "node_modules/esbuild-visualizer": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/esbuild-visualizer/-/esbuild-visualizer-0.7.0.tgz",
+      "integrity": "sha512-Vz22k+G2WT7GuCo7rbhaQwGbZ26lEhwzsctkEdQlu2SVrshoM4hzQeRpu/3DP596a9+9K2JyYsinuC6AC896Og==",
       "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "open": "^8.4.0",
+        "picomatch": "^4.0.0",
+        "yargs": "^17.6.2"
+      },
       "bin": {
-        "esbuild": "bin/esbuild"
+        "esbuild-visualizer": "dist/bin/cli.js"
       },
       "engines": {
         "node": ">=18"
@@ -8108,18 +10478,422 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/eslint": {
+      "version": "9.33.0",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.33.0.tgz",
+      "integrity": "sha512-TS9bTNIryDzStCpJN93aC5VRSW3uTx9sClUn4B87pwiCaJh220otoI0X8mJKr+VcPtniMdN8GKjlwgWGUv5ZKA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.2.0",
+        "@eslint-community/regexpp": "^4.12.1",
+        "@eslint/config-array": "^0.21.0",
+        "@eslint/config-helpers": "^0.3.1",
+        "@eslint/core": "^0.15.2",
+        "@eslint/eslintrc": "^3.3.1",
+        "@eslint/js": "9.33.0",
+        "@eslint/plugin-kit": "^0.3.5",
+        "@humanfs/node": "^0.16.6",
+        "@humanwhocodes/module-importer": "^1.0.1",
+        "@humanwhocodes/retry": "^0.4.2",
+        "@types/estree": "^1.0.6",
+        "@types/json-schema": "^7.0.15",
+        "ajv": "^6.12.4",
+        "chalk": "^4.0.0",
+        "cross-spawn": "^7.0.6",
+        "debug": "^4.3.2",
+        "escape-string-regexp": "^4.0.0",
+        "eslint-scope": "^8.4.0",
+        "eslint-visitor-keys": "^4.2.1",
+        "espree": "^10.4.0",
+        "esquery": "^1.5.0",
+        "esutils": "^2.0.2",
+        "fast-deep-equal": "^3.1.3",
+        "file-entry-cache": "^8.0.0",
+        "find-up": "^5.0.0",
+        "glob-parent": "^6.0.2",
+        "ignore": "^5.2.0",
+        "imurmurhash": "^0.1.4",
+        "is-glob": "^4.0.0",
+        "json-stable-stringify-without-jsonify": "^1.0.1",
+        "lodash.merge": "^4.6.2",
+        "minimatch": "^3.1.2",
+        "natural-compare": "^1.4.0",
+        "optionator": "^0.9.3"
+      },
+      "bin": {
+        "eslint": "bin/eslint.js"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://eslint.org/donate"
+      },
+      "peerDependencies": {
+        "jiti": "*"
+      },
+      "peerDependenciesMeta": {
+        "jiti": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/eslint-import-context": {
+      "version": "0.1.9",
+      "resolved": "https://registry.npmjs.org/eslint-import-context/-/eslint-import-context-0.1.9.tgz",
+      "integrity": "sha512-K9Hb+yRaGAGUbwjhFNHvSmmkZs9+zbuoe3kFQ4V1wYjrepUFYM2dZAfNtjbbj3qsPfUfsA68Bx/ICWQMi+C8Eg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "get-tsconfig": "^4.10.1",
+        "stable-hash-x": "^0.2.0"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.18.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint-import-context"
+      },
+      "peerDependencies": {
+        "unrs-resolver": "^1.0.0"
+      },
+      "peerDependenciesMeta": {
+        "unrs-resolver": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/eslint-import-resolver-node": {
+      "version": "0.3.9",
+      "resolved": "https://registry.npmjs.org/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.9.tgz",
+      "integrity": "sha512-WFj2isz22JahUv+B788TlO3N6zL3nNJGU8CcZbPZvVEkBPaJdCV4vy5wyghty5ROFbCRnm132v8BScu5/1BQ8g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^3.2.7",
+        "is-core-module": "^2.13.0",
+        "resolve": "^1.22.4"
+      }
+    },
+    "node_modules/eslint-import-resolver-node/node_modules/debug": {
+      "version": "3.2.7",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
+      "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ms": "^2.1.1"
+      }
+    },
+    "node_modules/eslint-import-resolver-typescript": {
+      "version": "4.4.4",
+      "resolved": "https://registry.npmjs.org/eslint-import-resolver-typescript/-/eslint-import-resolver-typescript-4.4.4.tgz",
+      "integrity": "sha512-1iM2zeBvrYmUNTj2vSC/90JTHDth+dfOfiNKkxApWRsTJYNrc8rOdxxIf5vazX+BiAXTeOT0UvWpGI/7qIWQOw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "debug": "^4.4.1",
+        "eslint-import-context": "^0.1.8",
+        "get-tsconfig": "^4.10.1",
+        "is-bun-module": "^2.0.0",
+        "stable-hash-x": "^0.2.0",
+        "tinyglobby": "^0.2.14",
+        "unrs-resolver": "^1.7.11"
+      },
+      "engines": {
+        "node": "^16.17.0 || >=18.6.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint-import-resolver-typescript"
+      },
+      "peerDependencies": {
+        "eslint": "*",
+        "eslint-plugin-import": "*",
+        "eslint-plugin-import-x": "*"
+      },
+      "peerDependenciesMeta": {
+        "eslint-plugin-import": {
+          "optional": true
+        },
+        "eslint-plugin-import-x": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/eslint-module-utils": {
+      "version": "2.12.0",
+      "resolved": "https://registry.npmjs.org/eslint-module-utils/-/eslint-module-utils-2.12.0.tgz",
+      "integrity": "sha512-wALZ0HFoytlyh/1+4wuZ9FJCD/leWHQzzrxJ8+rebyReSLk7LApMyd3WJaLVoN+D5+WIdJyDK1c6JnE65V4Zyg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^3.2.7"
+      },
+      "engines": {
+        "node": ">=4"
+      },
+      "peerDependenciesMeta": {
+        "eslint": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/eslint-module-utils/node_modules/debug": {
+      "version": "3.2.7",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
+      "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ms": "^2.1.1"
+      }
+    },
+    "node_modules/eslint-plugin-boundaries": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-boundaries/-/eslint-plugin-boundaries-5.0.1.tgz",
+      "integrity": "sha512-QBw1TgoA3JnD+AQ8EHqZL8LtiFVREnFmD2BnHzVl38UKtRTds8rawIg03ZLwFs/90yKSh+DVVXRpvVK631Z/0w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "4.1.2",
+        "eslint-import-resolver-node": "0.3.9",
+        "eslint-module-utils": "2.12.0",
+        "micromatch": "4.0.8"
+      },
+      "engines": {
+        "node": ">=18.18"
+      },
+      "peerDependencies": {
+        "eslint": ">=6.0.0"
+      }
+    },
+    "node_modules/eslint-plugin-import": {
+      "version": "2.32.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.32.0.tgz",
+      "integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@rtsao/scc": "^1.1.0",
+        "array-includes": "^3.1.9",
+        "array.prototype.findlastindex": "^1.2.6",
+        "array.prototype.flat": "^1.3.3",
+        "array.prototype.flatmap": "^1.3.3",
+        "debug": "^3.2.7",
+        "doctrine": "^2.1.0",
+        "eslint-import-resolver-node": "^0.3.9",
+        "eslint-module-utils": "^2.12.1",
+        "hasown": "^2.0.2",
+        "is-core-module": "^2.16.1",
+        "is-glob": "^4.0.3",
+        "minimatch": "^3.1.2",
+        "object.fromentries": "^2.0.8",
+        "object.groupby": "^1.0.3",
+        "object.values": "^1.2.1",
+        "semver": "^6.3.1",
+        "string.prototype.trimend": "^1.0.9",
+        "tsconfig-paths": "^3.15.0"
+      },
+      "engines": {
+        "node": ">=4"
+      },
+      "peerDependencies": {
+        "eslint": "^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8 || ^9"
+      }
+    },
+    "node_modules/eslint-plugin-import/node_modules/debug": {
+      "version": "3.2.7",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
+      "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ms": "^2.1.1"
+      }
+    },
+    "node_modules/eslint-plugin-import/node_modules/eslint-module-utils": {
+      "version": "2.12.1",
+      "resolved": "https://registry.npmjs.org/eslint-module-utils/-/eslint-module-utils-2.12.1.tgz",
+      "integrity": "sha512-L8jSWTze7K2mTg0vos/RuLRS5soomksDPoJLXIslC7c8Wmut3bx7CPpJijDcBZtxQ5lrbUdM+s0OlNbz0DCDNw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^3.2.7"
+      },
+      "engines": {
+        "node": ">=4"
+      },
+      "peerDependenciesMeta": {
+        "eslint": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/eslint-plugin-import/node_modules/semver": {
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      }
+    },
     "node_modules/eslint-scope": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
       "integrity": "sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==",
       "dev": true,
       "license": "BSD-2-Clause",
-      "dependencies": {
-        "esrecurse": "^4.3.0",
-        "estraverse": "^4.1.1"
-      },
+      "peer": true,
+      "dependencies": {
+        "esrecurse": "^4.3.0",
+        "estraverse": "^4.1.1"
+      },
+      "engines": {
+        "node": ">=8.0.0"
+      }
+    },
+    "node_modules/eslint-visitor-keys": {
+      "version": "3.4.3",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
+      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/eslint/node_modules/ajv": {
+      "version": "6.12.6",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
+      "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.1",
+        "fast-json-stable-stringify": "^2.0.0",
+        "json-schema-traverse": "^0.4.1",
+        "uri-js": "^4.2.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
+    "node_modules/eslint/node_modules/eslint-scope": {
+      "version": "8.4.0",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-8.4.0.tgz",
+      "integrity": "sha512-sNXOfKCn74rt8RICKMvJS7XKV/Xk9kA7DyJr8mJik3S7Cwgy3qlkkmyS2uQB3jiJg6VNdZd/pDBJu0nvG2NlTg==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "esrecurse": "^4.3.0",
+        "estraverse": "^5.2.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/eslint/node_modules/eslint-visitor-keys": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/eslint/node_modules/estraverse": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
+      "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=4.0"
+      }
+    },
+    "node_modules/eslint/node_modules/ignore": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
+      "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/eslint/node_modules/json-schema-traverse": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/espree": {
+      "version": "10.4.0",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-10.4.0.tgz",
+      "integrity": "sha512-j6PAQ2uUr79PZhBjP5C5fhl8e39FmRnOjsD5lGnWrFU8i2G776tBK7+nP8KuQUTTyAZUwfQqXAgrVH5MbH9CYQ==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "acorn": "^8.15.0",
+        "acorn-jsx": "^5.3.2",
+        "eslint-visitor-keys": "^4.2.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/espree/node_modules/eslint-visitor-keys": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/esquery": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.6.0.tgz",
+      "integrity": "sha512-ca9pw9fomFcKPvFLXhBKUK90ZvGibiGOvRJNbjljY7s7uq/5YO4BOzcYtJqExdx99rF6aAcnRxHmcUHcz6sQsg==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "estraverse": "^5.1.0"
+      },
+      "engines": {
+        "node": ">=0.10"
+      }
+    },
+    "node_modules/esquery/node_modules/estraverse": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
+      "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
+      "dev": true,
+      "license": "BSD-2-Clause",
       "engines": {
-        "node": ">=8.0.0"
+        "node": ">=4.0"
       }
     },
     "node_modules/esrecurse": {
@@ -8151,10 +10925,18 @@
       "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==",
       "dev": true,
       "license": "BSD-2-Clause",
+      "peer": true,
       "engines": {
         "node": ">=4.0"
       }
     },
+    "node_modules/estree-walker": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz",
+      "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/esutils": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
@@ -8201,6 +10983,29 @@
         "node": ">=0.8.x"
       }
     },
+    "node_modules/eventsource": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-3.0.7.tgz",
+      "integrity": "sha512-CRT1WTyuQoD771GW56XEZFQ/ZoSfWid1alKGDYMmkt2yl8UXrVR4pspqWNEcqKvVIzg6PAltWjxcSSPrboA4iA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "eventsource-parser": "^3.0.1"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/eventsource-parser": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/eventsource-parser/-/eventsource-parser-3.0.3.tgz",
+      "integrity": "sha512-nVpZkTMM9rF6AQ9gPJpFsNAMt48wIzB5TQgiTLdHiuO8XEDhUgZEhqKlZWXbIzo9VmJ/HvysHqEaVeD5v9TPvA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.0.0"
+      }
+    },
     "node_modules/execa": {
       "version": "8.0.1",
       "resolved": "https://registry.npmjs.org/execa/-/execa-8.0.1.tgz",
@@ -8275,65 +11080,172 @@
       "license": "Apache-2.0"
     },
     "node_modules/express": {
-      "version": "4.21.2",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.21.2.tgz",
-      "integrity": "sha512-28HqgMZAmih1Czt9ny7qr6ek2qddF4FclbMzwhCREB6OFfH+rXAnuNCwo1/wFvrtbgsQDb4kSbX9de9lFbrXnA==",
-      "license": "MIT",
-      "dependencies": {
-        "accepts": "~1.3.8",
-        "array-flatten": "1.1.1",
-        "body-parser": "1.20.3",
-        "content-disposition": "0.5.4",
-        "content-type": "~1.0.4",
-        "cookie": "0.7.1",
-        "cookie-signature": "1.0.6",
-        "debug": "2.6.9",
-        "depd": "2.0.0",
-        "encodeurl": "~2.0.0",
-        "escape-html": "~1.0.3",
-        "etag": "~1.8.1",
-        "finalhandler": "1.3.1",
-        "fresh": "0.5.2",
-        "http-errors": "2.0.0",
-        "merge-descriptors": "1.0.3",
-        "methods": "~1.1.2",
-        "on-finished": "2.4.1",
-        "parseurl": "~1.3.3",
-        "path-to-regexp": "0.1.12",
-        "proxy-addr": "~2.0.7",
-        "qs": "6.13.0",
-        "range-parser": "~1.2.1",
-        "safe-buffer": "5.2.1",
-        "send": "0.19.0",
-        "serve-static": "1.16.2",
-        "setprototypeof": "1.2.0",
-        "statuses": "2.0.1",
-        "type-is": "~1.6.18",
-        "utils-merge": "1.0.1",
-        "vary": "~1.1.2"
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/express/-/express-5.1.0.tgz",
+      "integrity": "sha512-DT9ck5YIRU+8GYzzU5kT3eHGA5iL+1Zd0EutOmTE9Dtk+Tvuzd23VBU+ec7HPNSTxXYO55gPV/hq4pSBJDjFpA==",
+      "license": "MIT",
+      "dependencies": {
+        "accepts": "^2.0.0",
+        "body-parser": "^2.2.0",
+        "content-disposition": "^1.0.0",
+        "content-type": "^1.0.5",
+        "cookie": "^0.7.1",
+        "cookie-signature": "^1.2.1",
+        "debug": "^4.4.0",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "etag": "^1.8.1",
+        "finalhandler": "^2.1.0",
+        "fresh": "^2.0.0",
+        "http-errors": "^2.0.0",
+        "merge-descriptors": "^2.0.0",
+        "mime-types": "^3.0.0",
+        "on-finished": "^2.4.1",
+        "once": "^1.4.0",
+        "parseurl": "^1.3.3",
+        "proxy-addr": "^2.0.7",
+        "qs": "^6.14.0",
+        "range-parser": "^1.2.1",
+        "router": "^2.2.0",
+        "send": "^1.1.0",
+        "serve-static": "^2.2.0",
+        "statuses": "^2.0.1",
+        "type-is": "^2.0.1",
+        "vary": "^1.1.2"
       },
       "engines": {
-        "node": ">= 0.10.0"
+        "node": ">= 18"
       },
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/express"
       }
     },
-    "node_modules/express/node_modules/debug": {
-      "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+    "node_modules/express-rate-limit": {
+      "version": "7.5.1",
+      "resolved": "https://registry.npmjs.org/express-rate-limit/-/express-rate-limit-7.5.1.tgz",
+      "integrity": "sha512-7iN8iPMDzOMHPUYllBEsQdWVB6fPDMPqwjBaFrgr4Jgr/+okjvzAy+UHlYYL/Vs0OsOrMkwS6PJDkFlJwoxUnw==",
+      "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "ms": "2.0.0"
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/express-rate-limit"
+      },
+      "peerDependencies": {
+        "express": ">= 4.11"
       }
     },
-    "node_modules/express/node_modules/ms": {
+    "node_modules/express/node_modules/accepts": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
-      "license": "MIT"
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-2.0.0.tgz",
+      "integrity": "sha512-5cvg6CtKwfgdmVqY1WIiXKc3Q1bkRqGLi+2W/6ao+6Y7gu/RCwRuAhGEzh5B4KlszSuTLgZYuqFqo5bImjNKng==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-types": "^3.0.0",
+        "negotiator": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/express/node_modules/body-parser": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-2.2.0.tgz",
+      "integrity": "sha512-02qvAaxv8tp7fBa/mw1ga98OGm+eCbqzJOKoRt70sLmfEEi+jyBYVTDGfCL/k06/4EMk/z01gCe7HoCH/f2LTg==",
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "^3.1.2",
+        "content-type": "^1.0.5",
+        "debug": "^4.4.0",
+        "http-errors": "^2.0.0",
+        "iconv-lite": "^0.6.3",
+        "on-finished": "^2.4.1",
+        "qs": "^6.14.0",
+        "raw-body": "^3.0.0",
+        "type-is": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/express/node_modules/iconv-lite": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
+      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/express/node_modules/media-typer": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-1.1.0.tgz",
+      "integrity": "sha512-aisnrDP4GNe06UcKFnV5bfMNPBUw4jsLGaWwWfnH3v02GnBuXX2MCVn5RbrWo0j3pczUilYblq7fQ7Nw2t5XKw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/express/node_modules/mime-types": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-3.0.1.tgz",
+      "integrity": "sha512-xRc4oEhT6eaBpU1XF7AjpOFD+xQmXNB5OVKwp4tqCuBpHLS/ZbBDrc07mYTDqVMg6PfxUjjNp85O6Cd2Z/5HWA==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "^1.54.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/express/node_modules/qs": {
+      "version": "6.14.0",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.14.0.tgz",
+      "integrity": "sha512-YWWTjgABSKcvs/nWBi9PycY/JiPJqOD4JA6o9Sej2AtvSGarXxKC3OQSk4pAarbdQlKAh5D4FCQkJNkW+GAn3w==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "side-channel": "^1.1.0"
+      },
+      "engines": {
+        "node": ">=0.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/express/node_modules/raw-body": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-3.0.0.tgz",
+      "integrity": "sha512-RmkhL8CAyCRPXCE28MMH0z2PNWQBNk2Q09ZdxM9IOOXwxwZbN+qbWaatPkdkWIKL2ZVDImrN/pK5HTRz2PcS4g==",
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "3.1.2",
+        "http-errors": "2.0.0",
+        "iconv-lite": "0.6.3",
+        "unpipe": "1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/express/node_modules/type-is": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/type-is/-/type-is-2.0.1.tgz",
+      "integrity": "sha512-OZs6gsjF4vMp32qrCbiVSkrFmXtG/AZhY3t0iAMrMBiAZyV9oALtXO8hsrHbMXF9x6L3grlFuwW2oAz7cav+Gw==",
+      "license": "MIT",
+      "dependencies": {
+        "content-type": "^1.0.5",
+        "media-typer": "^1.1.0",
+        "mime-types": "^3.0.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
     },
     "node_modules/extend": {
       "version": "3.0.2",
@@ -8412,6 +11324,13 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/fast-levenshtein": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+      "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/fast-uri": {
       "version": "3.0.6",
       "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.0.6.tgz",
@@ -8455,17 +11374,22 @@
         "reusify": "^1.0.4"
       }
     },
-    "node_modules/faye-websocket": {
-      "version": "0.11.4",
-      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.4.tgz",
-      "integrity": "sha512-CzbClwlXAuiRQAlUyfqPgvPoNKTckTPGfwZV4ZdAhVcP2lh9KUxJg2b5GkE7XbjKQ3YJnQ9z6D9ntLAlB+tP8g==",
+    "node_modules/fdir": {
+      "version": "6.5.0",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
+      "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
       "dev": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "websocket-driver": ">=0.5.1"
-      },
+      "license": "MIT",
       "engines": {
-        "node": ">=0.8.0"
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
+        }
       }
     },
     "node_modules/fetch-blob": {
@@ -8504,6 +11428,52 @@
         "siphash": "^1.1.0"
       }
     },
+    "node_modules/file-entry-cache": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz",
+      "integrity": "sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "flat-cache": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=16.0.0"
+      }
+    },
+    "node_modules/filelist": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/filelist/-/filelist-1.0.4.tgz",
+      "integrity": "sha512-w1cEuf3S+DrLCQL7ET6kz+gmlJdbq9J7yXCSjK/OZCPA+qEN1WyF4ZAf0YYJa4/shHJra2t/d/r8SV4Ji+x+8Q==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "minimatch": "^5.0.1"
+      }
+    },
+    "node_modules/filelist/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/filelist/node_modules/minimatch": {
+      "version": "5.1.6",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.6.tgz",
+      "integrity": "sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/fill-range": {
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
@@ -8517,72 +11487,111 @@
       }
     },
     "node_modules/finalhandler": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.3.1.tgz",
-      "integrity": "sha512-6BN9trH7bp3qvnrRyzsBz+g3lZxTNZTbVO2EV1CS0WIcDbawYVdYvGflME/9QP0h0pYlCDBCTjYa9nZzMDpyxQ==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-2.1.0.tgz",
+      "integrity": "sha512-/t88Ty3d5JWQbWYgaOGCCYfXRwV1+be02WqYYlL6h0lEiUAMPM8o8qKGO01YIkOHzka2up08wvgYD0mDiI+q3Q==",
       "license": "MIT",
       "dependencies": {
-        "debug": "2.6.9",
-        "encodeurl": "~2.0.0",
-        "escape-html": "~1.0.3",
-        "on-finished": "2.4.1",
-        "parseurl": "~1.3.3",
-        "statuses": "2.0.1",
-        "unpipe": "~1.0.0"
+        "debug": "^4.4.0",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "on-finished": "^2.4.1",
+        "parseurl": "^1.3.3",
+        "statuses": "^2.0.1"
       },
       "engines": {
         "node": ">= 0.8"
       }
     },
-    "node_modules/finalhandler/node_modules/debug": {
-      "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+    "node_modules/find-cache-directory": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/find-cache-directory/-/find-cache-directory-6.0.0.tgz",
+      "integrity": "sha512-CvFd5ivA6HcSHbD+59P7CyzINHXzwhuQK8RY7CxJZtgDSAtRlHiCaQpZQ2lMR/WRyUIEmzUvL6G2AGurMfegZA==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "ms": "2.0.0"
+        "common-path-prefix": "^3.0.0",
+        "pkg-dir": "^8.0.0"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/finalhandler/node_modules/ms": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
-      "license": "MIT"
+    "node_modules/find-up": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
+      "integrity": "sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "locate-path": "^6.0.0",
+        "path-exists": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
     },
-    "node_modules/find-cache-dir": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-4.0.0.tgz",
-      "integrity": "sha512-9ZonPT4ZAK4a+1pUPVPZJapbi7O5qbbJPdYw/NOQWZZbVLdDTYM3A4R9z/DpAM08IDaFGsvPgiGZ82WEwUDWjg==",
+    "node_modules/find-up-simple": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/find-up-simple/-/find-up-simple-1.0.1.tgz",
+      "integrity": "sha512-afd4O7zpqHeRyg4PfDQsXmlDe2PfdHtJt6Akt8jOWaApLOZk5JXs6VMR29lz03pRe9mpykrRCYIYxaJYcfpncQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/find-up/node_modules/locate-path": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
+      "integrity": "sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "common-path-prefix": "^3.0.0",
-        "pkg-dir": "^7.0.0"
+        "p-locate": "^5.0.0"
       },
       "engines": {
-        "node": ">=14.16"
+        "node": ">=10"
       },
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/find-up": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-6.3.0.tgz",
-      "integrity": "sha512-v2ZsoEuVHYy8ZIlYqwPe/39Cy+cFDzp4dXPaxNvkEuouymu+2Jbz0PxpKarJHYJTmv2HWT3O382qY8l4jMWthw==",
+    "node_modules/find-up/node_modules/p-locate": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz",
+      "integrity": "sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "locate-path": "^7.1.0",
-        "path-exists": "^5.0.0"
+        "p-limit": "^3.0.2"
       },
       "engines": {
-        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+        "node": ">=10"
       },
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/find-up/node_modules/path-exists": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
+      "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/flat": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/flat/-/flat-5.0.2.tgz",
@@ -8593,6 +11602,20 @@
         "flat": "cli.js"
       }
     },
+    "node_modules/flat-cache": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-4.0.1.tgz",
+      "integrity": "sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "flatted": "^3.2.9",
+        "keyv": "^4.5.4"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
     "node_modules/flatted": {
       "version": "3.3.3",
       "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.3.tgz",
@@ -8628,6 +11651,22 @@
         }
       }
     },
+    "node_modules/for-each": {
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.5.tgz",
+      "integrity": "sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-callable": "^1.2.7"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/foreground-child": {
       "version": "3.3.1",
       "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.1.tgz",
@@ -8727,12 +11766,12 @@
       }
     },
     "node_modules/fresh": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
-      "integrity": "sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q==",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-2.0.0.tgz",
+      "integrity": "sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A==",
       "license": "MIT",
       "engines": {
-        "node": ">= 0.6"
+        "node": ">= 0.8"
       }
     },
     "node_modules/fs-extra": {
@@ -8793,6 +11832,37 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/function.prototype.name": {
+      "version": "1.1.8",
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.8.tgz",
+      "integrity": "sha512-e5iwyodOHhbMr/yNrc7fDYG4qlbIvI5gajyzPnb5TCwyhjApznQh1BMFou9b30SevY43gCJKXycoCBjMbsuW0Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "functions-have-names": "^1.2.3",
+        "hasown": "^2.0.2",
+        "is-callable": "^1.2.7"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/functions-have-names": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/functions-have-names/-/functions-have-names-1.2.3.tgz",
+      "integrity": "sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/gensync": {
       "version": "1.0.0-beta.2",
       "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
@@ -8876,10 +11946,28 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/get-symbol-description": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.1.0.tgz",
+      "integrity": "sha512-w9UMqWwJxHNOvoNzSJ2oPF5wvYcvP7jUvYzhp67yEhTi17ZDBBC1z9pTdGuzjD+EFIqLSYRweZjqfiPzQ06Ebg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/get-tsconfig": {
-      "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/get-tsconfig/-/get-tsconfig-4.10.0.tgz",
-      "integrity": "sha512-kGzZ3LWWQcGIAmg6iWvXn0ei6WDtV26wzHRMwDSzmAbcXrTEXxHy6IehI6/4eT6VRKyMP1eF1VqwrVUmE/LR7A==",
+      "version": "4.10.1",
+      "resolved": "https://registry.npmjs.org/get-tsconfig/-/get-tsconfig-4.10.1.tgz",
+      "integrity": "sha512-auHyJ4AgMz7vgS8Hp3N6HXSmlMdUyhSUrfBF16w153rxtLIEOE+HGqaBppczZvnHLqQJfiHotCYpNhl0lUROFQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8957,34 +12045,33 @@
       "license": "BSD-2-Clause"
     },
     "node_modules/globals": {
-      "version": "11.12.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
-      "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==",
+      "version": "14.0.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-14.0.0.tgz",
+      "integrity": "sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=4"
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/globby": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-14.1.0.tgz",
-      "integrity": "sha512-0Ia46fDOaT7k4og1PDW4YbodWWr3scS2vAr2lTbsplOt2WkKp0vQbkI9wKis/T5LV/dqPjO3bpS/z6GTJB82LA==",
+    "node_modules/globalthis": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.4.tgz",
+      "integrity": "sha512-DpLKbNU4WylpxJykQujfCcwYWiV/Jhm50Goo0wrVILAv5jOr9d+H+UR3PhSCD2rCCEIg0uc+G+muBTwD54JhDQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@sindresorhus/merge-streams": "^2.1.0",
-        "fast-glob": "^3.3.3",
-        "ignore": "^7.0.3",
-        "path-type": "^6.0.0",
-        "slash": "^5.1.0",
-        "unicorn-magic": "^0.3.0"
+        "define-properties": "^1.2.1",
+        "gopd": "^1.0.1"
       },
       "engines": {
-        "node": ">=18"
+        "node": ">= 0.4"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/gopd": {
@@ -9006,6 +12093,13 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/graphemer": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/graphemer/-/graphemer-1.4.0.tgz",
+      "integrity": "sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/groq-sdk": {
       "version": "0.3.3",
       "resolved": "https://registry.npmjs.org/groq-sdk/-/groq-sdk-0.3.3.tgz",
@@ -9024,6 +12118,16 @@
         "web-streams-polyfill": "^3.2.1"
       }
     },
+    "node_modules/groq-sdk/node_modules/@types/node": {
+      "version": "18.19.123",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-18.19.123.tgz",
+      "integrity": "sha512-K7DIaHnh0mzVxreCR9qwgNxp3MH9dltPNIEddW9MYUlcKAzm+3grKNSTe2vCJHI1FaLpvpL5JGJrz1UZDKYvDg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": "~5.26.4"
+      }
+    },
     "node_modules/groq-sdk/node_modules/node-fetch": {
       "version": "2.7.0",
       "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.7.0.tgz",
@@ -9045,6 +12149,13 @@
         }
       }
     },
+    "node_modules/groq-sdk/node_modules/undici-types": {
+      "version": "5.26.5",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
+      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/gzip-size": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-6.0.0.tgz",
@@ -9061,12 +12172,18 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/handle-thing": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-2.0.1.tgz",
-      "integrity": "sha512-9Qn4yBxelxoh2Ow62nP+Ka/kMnOXRi8BXnRaUwezLNhqelnN49xKz4F/dPP8OYLxLxq6JDtZb2i9XznUQbNPTg==",
+    "node_modules/has-bigints": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.1.0.tgz",
+      "integrity": "sha512-R3pbpkcIqv2Pm3dUwgjclDRVmWpTJW2DcMzcIhEXEx1oh/CEMObMm3KLmRJOdvhM7o4uQBnwr8pzRK2sJWIqfg==",
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
     },
     "node_modules/has-flag": {
       "version": "4.0.0",
@@ -9078,6 +12195,35 @@
         "node": ">=8"
       }
     },
+    "node_modules/has-property-descriptors": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz",
+      "integrity": "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-define-property": "^1.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-proto": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.2.0.tgz",
+      "integrity": "sha512-KIL7eQPfHQRC8+XluaIw7BHUwwqL19bQn4hzNgdr+1wXoU0KKj6rufu47lhY7KbJR2C6T6+PfyN0Ea7wkSS+qQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/has-symbols": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
@@ -9118,6 +12264,16 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/he": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
+      "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "he": "bin/he"
+      }
+    },
     "node_modules/highlight.js": {
       "version": "11.11.1",
       "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.11.1.tgz",
@@ -9128,9 +12284,9 @@
       }
     },
     "node_modules/hosted-git-info": {
-      "version": "8.0.2",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-8.0.2.tgz",
-      "integrity": "sha512-sYKnA7eGln5ov8T8gnYlkSOxFJvywzEx9BueN6xo/GKO8PGiI6uK6xx+DIGe45T3bdVjLAQDQW1aicT8z8JwQg==",
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-8.1.0.tgz",
+      "integrity": "sha512-Rw/B2DNQaPBICNXEm8balFz9a6WpZrkCGpcWFpy7nCj+NyhSdqXipmfvtmWt9xGfp0wZnBxB+iVpLmQMYt47Tw==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -9147,50 +12303,17 @@
       "dev": true,
       "license": "ISC"
     },
-    "node_modules/hpack.js": {
-      "version": "2.1.6",
-      "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
-      "integrity": "sha512-zJxVehUdMGIKsRaNt7apO2Gqp0BdqW5yaiGHXXmbpvxgBYVZnAql+BJb4RO5ad2MgpbZKn5G6nMnegrH1FcNYQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "inherits": "^2.0.1",
-        "obuf": "^1.0.0",
-        "readable-stream": "^2.0.1",
-        "wbuf": "^1.1.0"
-      }
-    },
-    "node_modules/hpack.js/node_modules/readable-stream": {
-      "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
-      "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "core-util-is": "~1.0.0",
-        "inherits": "~2.0.3",
-        "isarray": "~1.0.0",
-        "process-nextick-args": "~2.0.0",
-        "safe-buffer": "~5.1.1",
-        "string_decoder": "~1.1.1",
-        "util-deprecate": "~1.0.1"
-      }
-    },
-    "node_modules/hpack.js/node_modules/safe-buffer": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/hpack.js/node_modules/string_decoder": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-      "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
+    "node_modules/html-encoding-sniffer": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-3.0.0.tgz",
+      "integrity": "sha512-oWv4T4yJ52iKrufjnyZPkrN0CH3QnrUqdB6In1g5Fe1mia8GmF36gnfNySxoZtxD5+NmYw1EElVXiBk93UeskA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "safe-buffer": "~5.1.0"
+        "whatwg-encoding": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=12"
       }
     },
     "node_modules/html-escaper": {
@@ -9201,9 +12324,9 @@
       "license": "MIT"
     },
     "node_modules/htmlparser2": {
-      "version": "9.1.0",
-      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-9.1.0.tgz",
-      "integrity": "sha512-5zfg6mHUoaer/97TxnGpxmbR7zJtPwIYFMZ/H5ucTlPZhKvtum05yiPK3Mgai3a0DyVxv7qYqoweaEd2nrYQzQ==",
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-10.0.0.tgz",
+      "integrity": "sha512-TwAZM+zE5Tq3lrEHvOlvwgj1XLWQCtaaibSN11Q+gGBAS7Y1uZSWwXXRe4iF6OXnaq1riyQAPFOBtYc77Mxq0g==",
       "dev": true,
       "funding": [
         "https://github.com/fb55/htmlparser2?sponsor=1",
@@ -9216,23 +12339,29 @@
       "dependencies": {
         "domelementtype": "^2.3.0",
         "domhandler": "^5.0.3",
-        "domutils": "^3.1.0",
-        "entities": "^4.5.0"
+        "domutils": "^3.2.1",
+        "entities": "^6.0.0"
       }
     },
-    "node_modules/http-cache-semantics": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.1.tgz",
-      "integrity": "sha512-er295DKPVsV82j5kw1Gjt+ADA/XYHsajl82cGNQG2eyoPkvgUhX+nDIyelzhIWbbsXP39EHcI6l5tYs2FYqYXQ==",
+    "node_modules/htmlparser2/node_modules/entities": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz",
+      "integrity": "sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==",
       "dev": true,
-      "license": "BSD-2-Clause"
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
     },
-    "node_modules/http-deceiver": {
-      "version": "1.2.7",
-      "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
-      "integrity": "sha512-LmpOGxTfbpgtGVxJrj5k7asXHCgNZp5nLfp+hWc8QQRqtb7fUy6kRY3BO1h9ddF6yIPYUARgxGOwB42DnxIaNw==",
+    "node_modules/http-cache-semantics": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.2.0.tgz",
+      "integrity": "sha512-dTxcvPXqPvXBQpq5dUr6mEMJX4oIEFv6bwom3FDwKRDsuIjjJGANqhBuoAn9c1RQJIdAKav33ED65E2ys+87QQ==",
       "dev": true,
-      "license": "MIT"
+      "license": "BSD-2-Clause"
     },
     "node_modules/http-errors": {
       "version": "2.0.0",
@@ -9250,13 +12379,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/http-parser-js": {
-      "version": "0.5.9",
-      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.9.tgz",
-      "integrity": "sha512-n1XsPy3rXVxlqxVioEWdC+0+M+SQw0DpJynwtOPo1X+ZlvdzTLtDBIJJlDQTnwZIFJrZSzSGmIOUdP8tu+SgLw==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/http-proxy": {
       "version": "1.18.1",
       "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz",
@@ -9286,22 +12408,32 @@
         "node": ">= 14"
       }
     },
-    "node_modules/http-proxy-middleware": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-3.0.3.tgz",
-      "integrity": "sha512-usY0HG5nyDUwtqpiZdETNbmKtw3QQ1jwYFZ9wi5iHzX2BcILwQKtYDJPo7XHTsu5Z0B2Hj3W9NNnbd+AjFWjqg==",
+    "node_modules/http-server": {
+      "version": "14.1.1",
+      "resolved": "https://registry.npmjs.org/http-server/-/http-server-14.1.1.tgz",
+      "integrity": "sha512-+cbxadF40UXd9T01zUHgA+rlo2Bg1Srer4+B4NwIHdaGxAGGv59nYRnGGDJ9LBk7alpS0US+J+bLLdQOOkJq4A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@types/http-proxy": "^1.17.15",
-        "debug": "^4.3.6",
+        "basic-auth": "^2.0.1",
+        "chalk": "^4.1.2",
+        "corser": "^2.0.1",
+        "he": "^1.2.0",
+        "html-encoding-sniffer": "^3.0.0",
         "http-proxy": "^1.18.1",
-        "is-glob": "^4.0.3",
-        "is-plain-object": "^5.0.0",
-        "micromatch": "^4.0.8"
+        "mime": "^1.6.0",
+        "minimist": "^1.2.6",
+        "opener": "^1.5.1",
+        "portfinder": "^1.0.28",
+        "secure-compare": "3.0.1",
+        "union": "~0.5.0",
+        "url-join": "^4.0.1"
+      },
+      "bin": {
+        "http-server": "bin/http-server"
       },
       "engines": {
-        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+        "node": ">=12"
       }
     },
     "node_modules/https-proxy-agent": {
@@ -9338,16 +12470,6 @@
         "ms": "^2.0.0"
       }
     },
-    "node_modules/hyperdyperid": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/hyperdyperid/-/hyperdyperid-1.2.0.tgz",
-      "integrity": "sha512-Y93lCzHYgGWdrJ66yIktxiaGULYc6oGiABxhcO5AufBeOyoIdZF7bIfLaOrbM0iGIOXQQgxxRrFEnb+Y6w1n4A==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10.18"
-      }
-    },
     "node_modules/i": {
       "version": "0.3.7",
       "resolved": "https://registry.npmjs.org/i/-/i-0.3.7.tgz",
@@ -9360,6 +12482,7 @@
       "version": "0.4.24",
       "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
       "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "safer-buffer": ">= 2.1.2 < 3"
@@ -9368,19 +12491,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/icss-utils": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz",
-      "integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==",
-      "dev": true,
-      "license": "ISC",
-      "engines": {
-        "node": "^10 || ^12 || >= 14"
-      },
-      "peerDependencies": {
-        "postcss": "^8.1.0"
-      }
-    },
     "node_modules/ieee754": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",
@@ -9403,9 +12513,9 @@
       "license": "BSD-3-Clause"
     },
     "node_modules/ignore": {
-      "version": "7.0.3",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.3.tgz",
-      "integrity": "sha512-bAH5jbK/F3T3Jls4I0SO1hmPR0dKU0a7+SY6n1yzRtG54FLO8d6w/nxLFX2Nb7dBu6cCWXPaAME6cYqFUMmuCA==",
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz",
+      "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9413,39 +12523,29 @@
       }
     },
     "node_modules/ignore-walk": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/ignore-walk/-/ignore-walk-7.0.0.tgz",
-      "integrity": "sha512-T4gbf83A4NH95zvhVYZc+qWocBBGlpzUXLPGurJggw/WIOwicfXJChLDP/iBZnN5WqROSu5Bm3hhle4z8a8YGQ==",
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/ignore-walk/-/ignore-walk-8.0.0.tgz",
+      "integrity": "sha512-FCeMZT4NiRQGh+YkeKMtWrOmBgWjHjMJ26WQWrRQyoyzqevdaGSakUaJW5xQYmjLlUVk2qUnCjYVBax9EKKg8A==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
-        "minimatch": "^9.0.0"
+        "minimatch": "^10.0.3"
       },
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
-      }
-    },
-    "node_modules/ignore-walk/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0"
+        "node": "^20.17.0 || >=22.9.0"
       }
     },
     "node_modules/ignore-walk/node_modules/minimatch": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
-      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+      "version": "10.0.3",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-10.0.3.tgz",
+      "integrity": "sha512-IPZ167aShDZZUMdRk66cyQAW3qr0WzbHkPdMYa8bzZhlHhO3jALbKdxcaak7W9FfT2rZNpQuUu4Od7ILEpXSaw==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
-        "brace-expansion": "^2.0.1"
+        "@isaacs/brace-expansion": "^5.0.0"
       },
       "engines": {
-        "node": ">=16 || 14 >=14.17"
+        "node": "20 || >=22"
       },
       "funding": {
         "url": "https://github.com/sponsors/isaacs"
@@ -9636,6 +12736,31 @@
         "node": "^18.17.0 || >=20.5.0"
       }
     },
+    "node_modules/injection-js": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/injection-js/-/injection-js-2.5.0.tgz",
+      "integrity": "sha512-UpY2ONt4xbht4GhSqQ2zMJ1rBIQq4uOY+DlR6aOeYyqK7xadXt7UQbJIyxmgk288bPMkIZKjViieHm0O0i72Jw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.0.0"
+      }
+    },
+    "node_modules/internal-slot": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.1.0.tgz",
+      "integrity": "sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "hasown": "^2.0.2",
+        "side-channel": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/interpret": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/interpret/-/interpret-3.1.1.tgz",
@@ -9646,36 +12771,79 @@
         "node": ">=10.13.0"
       }
     },
-    "node_modules/ip-address": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-9.0.5.tgz",
-      "integrity": "sha512-zHtQzGojZXTwZTHQqra+ETKd4Sn3vgi7uBmlPoXVWZqYvuKmtI0l/VZTjqGmJY9x88GGOaZ9+G9ES8hC4T4X8g==",
+    "node_modules/ip-address": {
+      "version": "10.0.1",
+      "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-10.0.1.tgz",
+      "integrity": "sha512-NWv9YLW4PoW2B7xtzaS3NCot75m6nK7Icdv0o3lfMceJVRfSoQwqD4wEH5rLwoKJwUiZ/rfpiVBhnaF0FK4HoA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
+    "node_modules/ipaddr.js": {
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz",
+      "integrity": "sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
+    "node_modules/is-array-buffer": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.5.tgz",
+      "integrity": "sha512-DDfANUiiG2wC1qawP66qlTugJeL5HyzMpfr8lLK+jMQirGzNod0B12cFB/9q838Ru27sBwfw78/rdoU7RERz6A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "get-intrinsic": "^1.2.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-async-function": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-async-function/-/is-async-function-2.1.1.tgz",
+      "integrity": "sha512-9dgM/cZBnNvjzaMYHVoxxfPj2QXt22Ev7SuuPrs+xav0ukGB0S6d4ydZdEiM48kLx5kDV+QBPrpVnFyefL8kkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "async-function": "^1.0.0",
+        "call-bound": "^1.0.3",
+        "get-proto": "^1.0.1",
+        "has-tostringtag": "^1.0.2",
+        "safe-regex-test": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-bigint": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.1.0.tgz",
+      "integrity": "sha512-n4ZT37wG78iz03xPRKJrHTdZbe3IicyucEtdRsV5yglwc3GyUfbAfpSeD0FJ41NbUNSt5wbhqfp1fS+BgnvDFQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "jsbn": "1.1.0",
-        "sprintf-js": "^1.1.3"
+        "has-bigints": "^1.0.2"
       },
       "engines": {
-        "node": ">= 12"
-      }
-    },
-    "node_modules/ipaddr.js": {
-      "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz",
-      "integrity": "sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.10"
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/is-arrayish": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-      "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/is-binary-path": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
@@ -9688,6 +12856,23 @@
         "node": ">=8"
       }
     },
+    "node_modules/is-boolean-object": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.2.2.tgz",
+      "integrity": "sha512-wa56o2/ElJMYqjCjGkXri7it5FbebW5usLw/nPmCMs5DeZ7eziSYZhSmPRn0txqeW4LnAmQQU7FgqLpsEFKM4A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-buffer": {
       "version": "1.1.6",
       "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
@@ -9695,6 +12880,29 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/is-bun-module": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-bun-module/-/is-bun-module-2.0.0.tgz",
+      "integrity": "sha512-gNCGbnnnnFAUGKeZ9PdbyeGYJqewpmc2aKHUEMO5nQPWU9lOmv7jcmQIv+qHD8fXW6W7qfuCwX4rY9LNRjXrkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "semver": "^7.7.1"
+      }
+    },
+    "node_modules/is-callable": {
+      "version": "1.2.7",
+      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.2.7.tgz",
+      "integrity": "sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-core-module": {
       "version": "2.16.1",
       "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.16.1.tgz",
@@ -9710,17 +12918,52 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/is-data-view": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.2.tgz",
+      "integrity": "sha512-RKtWF8pGmS87i2D6gqQu/l7EYRlVdfzemCJN/P3UOs//x1QE7mfhvzHIApBTRf7axvT6DMGwSwBXYCT0nfB9xw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "get-intrinsic": "^1.2.6",
+        "is-typed-array": "^1.1.13"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-date-object": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.1.0.tgz",
+      "integrity": "sha512-PwwhEakHVKTdRNVOw+/Gyh0+MzlCl4R6qKvkhuvLtPMggI1WAHt9sOwZxQLSGpUaDnrdyDsomoRgNnCfKNSXXg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-docker": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-3.0.0.tgz",
-      "integrity": "sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ==",
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz",
+      "integrity": "sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==",
       "dev": true,
       "license": "MIT",
       "bin": {
         "is-docker": "cli.js"
       },
       "engines": {
-        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+        "node": ">=8"
       },
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
@@ -9735,6 +12978,22 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/is-finalizationregistry": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-finalizationregistry/-/is-finalizationregistry-1.1.1.tgz",
+      "integrity": "sha512-1pC6N8qWJbWoPtEjgcL2xyhQOP491EQjeUo3qTKcmV8YSDDJrOepfG8pcC7h/QgnQHYSv0mJ3Z/ZWxmatVrysg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-fullwidth-code-point": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-4.0.0.tgz",
@@ -9748,6 +13007,25 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/is-generator-function": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.1.0.tgz",
+      "integrity": "sha512-nPUB5km40q9e8UfN/Zc24eLlzdSf9OfKByBw9CIdw4H1giPMeA0OIJvbchsCu4npfI2QcMVBsGEBHKZ7wLTWmQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "get-proto": "^1.0.0",
+        "has-tostringtag": "^1.0.2",
+        "safe-regex-test": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-glob": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
@@ -9760,46 +13038,40 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/is-inside-container": {
+    "node_modules/is-interactive": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-inside-container/-/is-inside-container-1.0.0.tgz",
-      "integrity": "sha512-KIYLCCJghfHZxqjYBE7rEy0OBuTd5xCHS7tHVgvCLkx7StIoaxwNW3hCALgEUjFfeRk+MG/Qxmp/vtETEF3tRA==",
+      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-1.0.0.tgz",
+      "integrity": "sha512-2HvIEKRoqS62guEC+qBjpvRubdX910WCMuJTZ+I9yvqKU2/12eSL549HMwtabb4oupdj2sMP50k+XJfB/8JE6w==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "is-docker": "^3.0.0"
-      },
-      "bin": {
-        "is-inside-container": "cli.js"
-      },
       "engines": {
-        "node": ">=14.16"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "node": ">=8"
       }
     },
-    "node_modules/is-interactive": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-1.0.0.tgz",
-      "integrity": "sha512-2HvIEKRoqS62guEC+qBjpvRubdX910WCMuJTZ+I9yvqKU2/12eSL549HMwtabb4oupdj2sMP50k+XJfB/8JE6w==",
+    "node_modules/is-map": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.3.tgz",
+      "integrity": "sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=8"
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/is-network-error": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/is-network-error/-/is-network-error-1.1.0.tgz",
-      "integrity": "sha512-tUdRRAnhT+OtCZR/LxZelH/C7QtjtFrTu5tXCA8pl55eTUElUHT+GPYV8MBMBvea/j+NxQqVt3LbWMRir7Gx9g==",
+    "node_modules/is-negative-zero": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.3.tgz",
+      "integrity": "sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=16"
+        "node": ">= 0.4"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/is-number": {
@@ -9811,28 +13083,28 @@
         "node": ">=0.12.0"
       }
     },
-    "node_modules/is-plain-obj": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-3.0.0.tgz",
-      "integrity": "sha512-gwsOE28k+23GP1B6vFl1oVh/WOzmawBrKwo5Ev6wMKzPkaXaCDIQKzLnvsA42DRlbVTWorkgTKIviAKCWkfUwA==",
+    "node_modules/is-number-object": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.1.1.tgz",
+      "integrity": "sha512-lZhclumE1G6VYD8VHe35wFaIif+CTy5SJIi5+3y4psDgWu4wPDoBhF8NxUOinEc7pHgiTsT6MaBb92rKhhD+Xw==",
       "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "has-tostringtag": "^1.0.2"
+      },
       "engines": {
-        "node": ">=10"
+        "node": ">= 0.4"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/is-plain-object": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-5.0.0.tgz",
-      "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.10.0"
-      }
+    "node_modules/is-promise": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-4.0.0.tgz",
+      "integrity": "sha512-hvpoI6korhJMnej285dSg6nu1+e6uxs7zG3BYAm5byqDsgJNWwxzM6z6iZiAgQR4TJ30JmBTOwqZUw3WlyH3AQ==",
+      "license": "MIT"
     },
     "node_modules/is-regex": {
       "version": "1.2.1",
@@ -9853,6 +13125,35 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/is-set": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.3.tgz",
+      "integrity": "sha512-iPAjerrse27/ygGLxw+EBR9agv9Y6uLeYVJMu+QNCoouJ1/1ri0mGrcWpfCqFZuzzx3WjtwxG098X+n4OuRkPg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-shared-array-buffer": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.4.tgz",
+      "integrity": "sha512-ISWac8drv4ZGfwKl5slpHG9OwPNty4jOWPRIhBpxOoD+hqITiwuipOQ2bNthAzwA3B4fIjO4Nln74N0S9byq8A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-stream": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-3.0.0.tgz",
@@ -9866,6 +13167,57 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/is-string": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.1.1.tgz",
+      "integrity": "sha512-BtEeSsoaQjlSPBemMQIrY1MY0uM6vnS1g5fmufYOtnxLGUZM2178PKbhsk7Ffv58IX+ZtcvoGwccYsh0PglkAA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-symbol": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.1.1.tgz",
+      "integrity": "sha512-9gGx6GTtCQM73BgmHQXfDmLtfjjTUDSyoxTCbp5WtoixAhfgsDirWIcVQ/IHpvI5Vgd5i/J5F7B9cN/WlVbC/w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "has-symbols": "^1.1.0",
+        "safe-regex-test": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-typed-array": {
+      "version": "1.1.15",
+      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.15.tgz",
+      "integrity": "sha512-p3EcsicXjit7SaskXHs1hA91QxgTw46Fv6EFKKGS5DRFLD8yKnohjF3hxoju94b/OcMZoQukzpPpBE9uLVKzgQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "which-typed-array": "^1.1.16"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-unicode-supported": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-0.1.0.tgz",
@@ -9873,19 +13225,65 @@
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=10"
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-url": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/is-url/-/is-url-1.2.4.tgz",
+      "integrity": "sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/is-weakmap": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.2.tgz",
+      "integrity": "sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-weakref": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.1.1.tgz",
+      "integrity": "sha512-6i9mGWSlqzNMEqpCp93KwRS1uUOodk2OJ6b+sq7ZPDSy2WuI5NFIxp/254TytR8ftefexkWn5xNiHUNpPOfSew==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-weakset": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.4.tgz",
+      "integrity": "sha512-mfcwb6IzQyOKTs84CQMrOwW4gQcaTOAWJ0zzJCl2WSPDrWk/OzDaImWFH3djXhb24g4eudZfLRozAvPGw4d9hQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "get-intrinsic": "^1.2.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/is-url": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/is-url/-/is-url-1.2.4.tgz",
-      "integrity": "sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/is-what": {
       "version": "3.14.1",
       "resolved": "https://registry.npmjs.org/is-what/-/is-what-3.14.1.tgz",
@@ -9894,25 +13292,22 @@
       "license": "MIT"
     },
     "node_modules/is-wsl": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-3.1.0.tgz",
-      "integrity": "sha512-UcVfVfaK4Sc4m7X3dUSoHoozQGBEFeDC+zVo06t98xe8CzHSZZBekNXH+tu0NalHolcJ/QAGqS46Hef7QXBIMw==",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz",
+      "integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "is-inside-container": "^1.0.0"
+        "is-docker": "^2.0.0"
       },
       "engines": {
-        "node": ">=16"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "node": ">=8"
       }
     },
     "node_modules/isarray": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
+      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==",
       "dev": true,
       "license": "MIT"
     },
@@ -10041,6 +13436,24 @@
         "@pkgjs/parseargs": "^0.11.0"
       }
     },
+    "node_modules/jake": {
+      "version": "10.9.4",
+      "resolved": "https://registry.npmjs.org/jake/-/jake-10.9.4.tgz",
+      "integrity": "sha512-wpHYzhxiVQL+IV05BLE2Xn34zW1S223hvjtqk0+gsPrwd/8JNLXJgZZM/iPFsYc1xyphF+6M6EvdE5E9MBGkDA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "async": "^3.2.6",
+        "filelist": "^1.0.4",
+        "picocolors": "^1.1.1"
+      },
+      "bin": {
+        "jake": "bin/cli.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/jasmine-core": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/jasmine-core/-/jasmine-core-5.1.2.tgz",
@@ -10061,6 +13474,7 @@
       "integrity": "sha512-7vuh85V5cdDofPyxn58nrPjBktZo0u9x1g8WtjQol+jZDaE+fhN+cIvTj11GndBnMnyfrUOG1sZQxCdjKh+DKg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/node": "*",
         "merge-stream": "^2.0.0",
@@ -10076,6 +13490,7 @@
       "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "has-flag": "^4.0.0"
       },
@@ -10132,13 +13547,6 @@
         "js-yaml": "bin/js-yaml.js"
       }
     },
-    "node_modules/jsbn": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-1.1.0.tgz",
-      "integrity": "sha512-4bYVV3aAMtDTTu4+xsDYa6sy9GyJ69/amsu9sYF2zqjiEoZA5xJi3BrfX3uY+/IekIu7MwdObdbDWpoZdBv3/A==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/jsesc": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
@@ -10152,6 +13560,13 @@
         "node": ">=6"
       }
     },
+    "node_modules/json-buffer": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz",
+      "integrity": "sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/json-parse-even-better-errors": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-4.0.0.tgz",
@@ -10185,6 +13600,13 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/json-stable-stringify-without-jsonify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
+      "integrity": "sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/json5": {
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
@@ -10354,16 +13776,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/karma-source-map-support": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/karma-source-map-support/-/karma-source-map-support-1.4.0.tgz",
-      "integrity": "sha512-RsBECncGO17KAoJCYXjv+ckIz+Ii9NCi+9enk+rq6XC81ezYkb4/RHE6CTXdA7IOJqoF3wcaLfVG0CPmE5ca6A==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "source-map-support": "^0.5.5"
-      }
-    },
     "node_modules/karma/node_modules/ansi-regex": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
@@ -10575,6 +13987,16 @@
         "node": ">=10"
       }
     },
+    "node_modules/keyv": {
+      "version": "4.5.4",
+      "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
+      "integrity": "sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "json-buffer": "3.0.1"
+      }
+    },
     "node_modules/kind-of": {
       "version": "6.0.3",
       "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",
@@ -10595,21 +14017,10 @@
         "node": ">=6"
       }
     },
-    "node_modules/launch-editor": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/launch-editor/-/launch-editor-2.10.0.tgz",
-      "integrity": "sha512-D7dBRJo/qcGX9xlvt/6wUYzQxjh5G1RvZPgPv8vi4KRU99DVQL/oW7tnVOCCTm2HGeo3C5HvGE5Yrh6UBoZ0vA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "picocolors": "^1.0.0",
-        "shell-quote": "^1.8.1"
-      }
-    },
     "node_modules/less": {
-      "version": "4.2.2",
-      "resolved": "https://registry.npmjs.org/less/-/less-4.2.2.tgz",
-      "integrity": "sha512-tkuLHQlvWUTeQ3doAqnHbNn8T6WX1KA8yvbKG9x4VtKtIjHsVKQZCH11zRgAfbDAXC2UNIg/K9BYAAcEzUIrNg==",
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/less/-/less-4.3.0.tgz",
+      "integrity": "sha512-X9RyH9fvemArzfdP8Pi3irr7lor2Ok4rOttDXBhlwDg+wKQsXOXgHWduAJE1EsF7JJx0w0bcO6BC6tCKKYnXKA==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -10621,7 +14032,7 @@
         "lessc": "bin/lessc"
       },
       "engines": {
-        "node": ">=6"
+        "node": ">=14"
       },
       "optionalDependencies": {
         "errno": "^0.1.1",
@@ -10633,33 +14044,6 @@
         "source-map": "~0.6.0"
       }
     },
-    "node_modules/less-loader": {
-      "version": "12.2.0",
-      "resolved": "https://registry.npmjs.org/less-loader/-/less-loader-12.2.0.tgz",
-      "integrity": "sha512-MYUxjSQSBUQmowc0l5nPieOYwMzGPUaTzB6inNW/bdPEG9zOL3eAAD1Qw5ZxSPk7we5dMojHwNODYMV1hq4EVg==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 18.12.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/webpack"
-      },
-      "peerDependencies": {
-        "@rspack/core": "0.x || 1.x",
-        "less": "^3.5.0 || ^4.0.0",
-        "webpack": "^5.0.0"
-      },
-      "peerDependenciesMeta": {
-        "@rspack/core": {
-          "optional": true
-        },
-        "webpack": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/less/node_modules/make-dir": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
@@ -10675,20 +14059,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/less/node_modules/mime": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
-      "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "bin": {
-        "mime": "cli.js"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/less/node_modules/pify": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
@@ -10722,22 +14092,18 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/license-webpack-plugin": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/license-webpack-plugin/-/license-webpack-plugin-4.0.2.tgz",
-      "integrity": "sha512-771TFWFD70G1wLTC4oU2Cw4qvtmNrIw+wRvBtn+okgHl7slJVi7zfNcdmqDL72BojM30VNJ2UHylr1o77U37Jw==",
+    "node_modules/levn": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
+      "integrity": "sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==",
       "dev": true,
-      "license": "ISC",
+      "license": "MIT",
       "dependencies": {
-        "webpack-sources": "^3.0.0"
+        "prelude-ls": "^1.2.1",
+        "type-check": "~0.4.0"
       },
-      "peerDependenciesMeta": {
-        "webpack": {
-          "optional": true
-        },
-        "webpack-sources": {
-          "optional": true
-        }
+      "engines": {
+        "node": ">= 0.8.0"
       }
     },
     "node_modules/lilconfig": {
@@ -10759,9 +14125,9 @@
       "license": "MIT"
     },
     "node_modules/listr2": {
-      "version": "8.2.5",
-      "resolved": "https://registry.npmjs.org/listr2/-/listr2-8.2.5.tgz",
-      "integrity": "sha512-iyAZCeyD+c1gPyE9qpFu8af0Y+MRtmKOncdGoA2S5EY8iFq99dmmvkNnHiWo+pj0s7yH7l3KPIgee77tKpXPWQ==",
+      "version": "8.3.3",
+      "resolved": "https://registry.npmjs.org/listr2/-/listr2-8.3.3.tgz",
+      "integrity": "sha512-LWzX2KsqcB1wqQ4AHgYb4RsDXauQiqhjLk+6hjbaeHG4zpjjVAB6wC/gz6X0l+Du1cN3pUB5ZlrvTbhGSNnUQQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10815,9 +14181,9 @@
       }
     },
     "node_modules/lmdb": {
-      "version": "3.2.6",
-      "resolved": "https://registry.npmjs.org/lmdb/-/lmdb-3.2.6.tgz",
-      "integrity": "sha512-SuHqzPl7mYStna8WRotY8XX/EUZBjjv3QyKIByeCLFfC9uXT/OIHByEcA07PzbMfQAM0KYJtLgtpMRlIe5dErQ==",
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/lmdb/-/lmdb-3.4.1.tgz",
+      "integrity": "sha512-hoG9RIv42kdGJiieyElgWcKCTaw5S6Jqwyd1gLSVdsJ3+8MVm8e4yLronThiRJI9DazFAAs9xfB9nWeMQ2DWKA==",
       "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
@@ -10833,12 +14199,13 @@
         "download-lmdb-prebuilds": "bin/download-prebuilds.js"
       },
       "optionalDependencies": {
-        "@lmdb/lmdb-darwin-arm64": "3.2.6",
-        "@lmdb/lmdb-darwin-x64": "3.2.6",
-        "@lmdb/lmdb-linux-arm": "3.2.6",
-        "@lmdb/lmdb-linux-arm64": "3.2.6",
-        "@lmdb/lmdb-linux-x64": "3.2.6",
-        "@lmdb/lmdb-win32-x64": "3.2.6"
+        "@lmdb/lmdb-darwin-arm64": "3.4.1",
+        "@lmdb/lmdb-darwin-x64": "3.4.1",
+        "@lmdb/lmdb-linux-arm": "3.4.1",
+        "@lmdb/lmdb-linux-arm64": "3.4.1",
+        "@lmdb/lmdb-linux-x64": "3.4.1",
+        "@lmdb/lmdb-win32-arm64": "3.4.1",
+        "@lmdb/lmdb-win32-x64": "3.4.1"
       }
     },
     "node_modules/loader-runner": {
@@ -10847,20 +14214,11 @@
       "integrity": "sha512-3R/1M+yS3j5ou80Me59j7F9IMs4PXs3VqRrm0TU3AbKPxlmpoY1TNscJV/oGJXo8qCatFGTfDbY6W6ipGOYXfg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=6.11.5"
       }
     },
-    "node_modules/loader-utils": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-3.3.1.tgz",
-      "integrity": "sha512-FMJTLMXfCLMLfJxcX9PFqX5qD88Z5MRGaZCVzfuqeZSPsyiBzs+pahDQjbIWz2QIzPZz0NX9Zy4FX3lmK6YHIg==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 12.13.0"
-      }
-    },
     "node_modules/locate-path": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-7.2.0.tgz",
@@ -10896,13 +14254,6 @@
       "integrity": "sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ==",
       "license": "MIT"
     },
-    "node_modules/lodash.debounce": {
-      "version": "4.0.8",
-      "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
-      "integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/lodash.isequal": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
@@ -10910,6 +14261,13 @@
       "deprecated": "This package is deprecated. Use require('node:util').isDeepStrictEqual instead.",
       "license": "MIT"
     },
+    "node_modules/lodash.merge": {
+      "version": "4.6.2",
+      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
+      "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/log-symbols": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-4.1.0.tgz",
@@ -11135,36 +14493,20 @@
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
       "integrity": "sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==",
+      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 0.6"
       }
     },
-    "node_modules/memfs": {
-      "version": "4.17.0",
-      "resolved": "https://registry.npmjs.org/memfs/-/memfs-4.17.0.tgz",
-      "integrity": "sha512-4eirfZ7thblFmqFjywlTmuWVSvccHAJbn1r8qQLzmTO11qcqpohOjmY2mFce6x7x7WtskzRqApPD0hv+Oa74jg==",
-      "dev": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@jsonjoy.com/json-pack": "^1.0.3",
-        "@jsonjoy.com/util": "^1.3.0",
-        "tree-dump": "^1.0.1",
-        "tslib": "^2.0.0"
-      },
-      "engines": {
-        "node": ">= 4.0.0"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/streamich"
-      }
-    },
     "node_modules/merge-descriptors": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.3.tgz",
-      "integrity": "sha512-gaNvAS7TZ897/rVaZ0nMtAyxNyi/pdbjbAwUpFQpN70GqnVfOiXpeUUMKRBmzXaSQ8DdTX4/0ms62r2K+hE6mQ==",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-2.0.0.tgz",
+      "integrity": "sha512-Snk314V5ayFLhp3fkUREub6WtjBfPdCPY1Ln8/8munuLuiYhsABgBVWsozAG+MWMbVEvcdcpbi9R7ww22l9Q3g==",
       "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
       }
@@ -11185,15 +14527,6 @@
         "node": ">= 8"
       }
     },
-    "node_modules/methods": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
-      "integrity": "sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
     "node_modules/micromatch": {
       "version": "4.0.8",
       "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
@@ -11219,12 +14552,24 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
-    "node_modules/mime-db": {
-      "version": "1.53.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.53.0.tgz",
-      "integrity": "sha512-oHlN/w+3MQ3rba9rqFr6V/ypF10LSkdwUysQL7GkXoTgIWeV+tcXGA852TBxH+gsh8UWoyhR1hKcoMJTuWflpg==",
+    "node_modules/mime": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
+      "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
       "dev": true,
       "license": "MIT",
+      "bin": {
+        "mime": "cli.js"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/mime-db": {
+      "version": "1.54.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz",
+      "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==",
+      "license": "MIT",
       "engines": {
         "node": ">= 0.6"
       }
@@ -11233,6 +14578,7 @@
       "version": "2.1.35",
       "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
       "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "mime-db": "1.52.0"
@@ -11245,6 +14591,7 @@
       "version": "1.52.0",
       "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
       "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 0.6"
@@ -11273,34 +14620,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/mini-css-extract-plugin": {
-      "version": "2.9.2",
-      "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-2.9.2.tgz",
-      "integrity": "sha512-GJuACcS//jtq4kCtd5ii/M0SZf7OZRH+BxdqXZHaJfb8TJiVl+NgQRPwiYt2EuqeSkNydn/7vP+bcE27C5mb9w==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "schema-utils": "^4.0.0",
-        "tapable": "^2.2.1"
-      },
-      "engines": {
-        "node": ">= 12.13.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/webpack"
-      },
-      "peerDependencies": {
-        "webpack": "^5.0.0"
-      }
-    },
-    "node_modules/minimalistic-assert": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",
-      "integrity": "sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A==",
-      "dev": true,
-      "license": "ISC"
-    },
     "node_modules/minimatch": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
@@ -11464,82 +14783,18 @@
       "license": "ISC"
     },
     "node_modules/minizlib": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-3.0.1.tgz",
-      "integrity": "sha512-umcy022ILvb5/3Djuu8LWeqUa8D68JaBzlttKeMWen48SjabqS3iY5w/vzeMzMUNhLDifyhbOwKDSznB1vvrwg==",
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-3.0.2.tgz",
+      "integrity": "sha512-oG62iEk+CYt5Xj2YqI5Xi9xWUeZhDI8jjQmC5oThVH5JGCTgIjr7ciJDzC7MBzYd//WvR1OTmP5Q38Q8ShQtVA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "minipass": "^7.0.4",
-        "rimraf": "^5.0.5"
+        "minipass": "^7.1.2"
       },
       "engines": {
         "node": ">= 18"
       }
     },
-    "node_modules/minizlib/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0"
-      }
-    },
-    "node_modules/minizlib/node_modules/glob": {
-      "version": "10.4.5",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
-      "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "foreground-child": "^3.1.0",
-        "jackspeak": "^3.1.2",
-        "minimatch": "^9.0.4",
-        "minipass": "^7.1.2",
-        "package-json-from-dist": "^1.0.0",
-        "path-scurry": "^1.11.1"
-      },
-      "bin": {
-        "glob": "dist/esm/bin.mjs"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/minizlib/node_modules/minimatch": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
-      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "brace-expansion": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/minizlib/node_modules/rimraf": {
-      "version": "5.0.10",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-5.0.10.tgz",
-      "integrity": "sha512-l0OE8wL34P4nJH/H2ffoaniAokM2qSmrtXHmlpvYr5AVVX8msAyW0l8NVJFDxlSK4u3Uh/f41cQheDVdnYijwQ==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "glob": "^10.3.7"
-      },
-      "bin": {
-        "rimraf": "dist/esm/bin.mjs"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/mkdirp": {
       "version": "0.5.6",
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.6.tgz",
@@ -11597,9 +14852,9 @@
       "license": "MIT"
     },
     "node_modules/msgpackr": {
-      "version": "1.11.2",
-      "resolved": "https://registry.npmjs.org/msgpackr/-/msgpackr-1.11.2.tgz",
-      "integrity": "sha512-F9UngXRlPyWCDEASDpTf6c9uNhGPTqnTeLVt7bN+bU1eajoR/8V9ys2BRaV5C/e5ihE6sJ9uPIKaYt6bFuO32g==",
+      "version": "1.11.5",
+      "resolved": "https://registry.npmjs.org/msgpackr/-/msgpackr-1.11.5.tgz",
+      "integrity": "sha512-UjkUHN0yqp9RWKy0Lplhh+wlpdt9oQBYgULZOiFhV3VclSF1JnSQWZ5r9gORQlNYaUKQoR8itv7g7z1xDDuACA==",
       "dev": true,
       "license": "MIT",
       "optional": true,
@@ -11624,24 +14879,10 @@
       "optionalDependencies": {
         "@msgpackr-extract/msgpackr-extract-darwin-arm64": "3.0.3",
         "@msgpackr-extract/msgpackr-extract-darwin-x64": "3.0.3",
-        "@msgpackr-extract/msgpackr-extract-linux-arm": "3.0.3",
-        "@msgpackr-extract/msgpackr-extract-linux-arm64": "3.0.3",
-        "@msgpackr-extract/msgpackr-extract-linux-x64": "3.0.3",
-        "@msgpackr-extract/msgpackr-extract-win32-x64": "3.0.3"
-      }
-    },
-    "node_modules/multicast-dns": {
-      "version": "7.2.5",
-      "resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-7.2.5.tgz",
-      "integrity": "sha512-2eznPJP8z2BFLX50tf0LuODrpINqP1RVIm/CObbTcBRITQgmC/TjcREF1NeTBzIcR5XO/ukWo+YHOjBbFwIupg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "dns-packet": "^5.2.2",
-        "thunky": "^1.0.2"
-      },
-      "bin": {
-        "multicast-dns": "cli.js"
+        "@msgpackr-extract/msgpackr-extract-linux-arm": "3.0.3",
+        "@msgpackr-extract/msgpackr-extract-linux-arm64": "3.0.3",
+        "@msgpackr-extract/msgpackr-extract-linux-x64": "3.0.3",
+        "@msgpackr-extract/msgpackr-extract-win32-x64": "3.0.3"
       }
     },
     "node_modules/multimatch": {
@@ -11720,9 +14961,9 @@
       }
     },
     "node_modules/nanoid": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.9.tgz",
-      "integrity": "sha512-SppoicMGpZvbF1l3z4x7No3OlIjP7QJvC9XR7AhZr1kL133KHnKPztkKDc+Ir4aJ/1VhTySrtKhrsycmrMQfvg==",
+      "version": "3.3.11",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
+      "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
       "funding": [
         {
           "type": "github",
@@ -11737,6 +14978,29 @@
         "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
       }
     },
+    "node_modules/napi-postinstall": {
+      "version": "0.3.3",
+      "resolved": "https://registry.npmjs.org/napi-postinstall/-/napi-postinstall-0.3.3.tgz",
+      "integrity": "sha512-uTp172LLXSxuSYHv/kou+f6KW3SMppU9ivthaVTXian9sOt3XM/zHYHpRZiLgQoxeWfYUnslNWQHF1+G71xcow==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "napi-postinstall": "lib/cli.js"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.18.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/napi-postinstall"
+      }
+    },
+    "node_modules/natural-compare": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
+      "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/nearley": {
       "version": "2.20.1",
       "resolved": "https://registry.npmjs.org/nearley/-/nearley-2.20.1.tgz",
@@ -11803,7 +15067,6 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-1.0.0.tgz",
       "integrity": "sha512-8Ofs/AUQh8MaEcrlq5xOX0CQ9ypTF5dl78mjlMNfOK08fzpgTHQRQPBxcPlEtIw0yRpws+Zo/3r+5WRby7u3Gg==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 0.6"
@@ -11814,7 +15077,161 @@
       "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.2.tgz",
       "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==",
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
+    },
+    "node_modules/ng-packagr": {
+      "version": "20.1.0",
+      "resolved": "https://registry.npmjs.org/ng-packagr/-/ng-packagr-20.1.0.tgz",
+      "integrity": "sha512-objHk39HWnSSv54KD0Ct4A02rug6HiqbmXo1KJW39npzuVc37QWfiZy94afltH1zIx+mQqollmGaCmwibmagvQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@ampproject/remapping": "^2.3.0",
+        "@rollup/plugin-json": "^6.1.0",
+        "@rollup/wasm-node": "^4.24.0",
+        "ajv": "^8.17.1",
+        "ansi-colors": "^4.1.3",
+        "browserslist": "^4.22.1",
+        "chokidar": "^4.0.1",
+        "commander": "^14.0.0",
+        "dependency-graph": "^1.0.0",
+        "esbuild": "^0.25.0",
+        "find-cache-directory": "^6.0.0",
+        "injection-js": "^2.4.0",
+        "jsonc-parser": "^3.3.1",
+        "less": "^4.2.0",
+        "ora": "^8.2.0",
+        "piscina": "^5.0.0",
+        "postcss": "^8.4.47",
+        "rollup-plugin-dts": "^6.2.0",
+        "rxjs": "^7.8.1",
+        "sass": "^1.81.0",
+        "tinyglobby": "^0.2.12"
+      },
+      "bin": {
+        "ng-packagr": "src/cli/main.js"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "optionalDependencies": {
+        "rollup": "^4.24.0"
+      },
+      "peerDependencies": {
+        "@angular/compiler-cli": "^20.0.0 || ^20.1.0-next.0 || ^20.2.0-next.0",
+        "tailwindcss": "^2.0.0 || ^3.0.0 || ^4.0.0",
+        "tslib": "^2.3.0",
+        "typescript": ">=5.8 <5.9"
+      },
+      "peerDependenciesMeta": {
+        "tailwindcss": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/ng-packagr/node_modules/chalk": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.6.0.tgz",
+      "integrity": "sha512-46QrSQFyVSEyYAgQ22hQ+zDa60YHA4fBstHmtSApj1Y5vKtG27fWowW03jCk5KcbXEWPZUIR894aARCA/G1kfQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/ng-packagr/node_modules/commander": {
+      "version": "14.0.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-14.0.0.tgz",
+      "integrity": "sha512-2uM9rYjPvyq39NwLRqaiLtWHyDC1FvryJDa2ATTVims5YAS4PupsEQsDvP14FqhFr0P49CYDugi59xaxJlTXRA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/ng-packagr/node_modules/is-interactive": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-2.0.0.tgz",
+      "integrity": "sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/ng-packagr/node_modules/is-unicode-supported": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-2.1.0.tgz",
+      "integrity": "sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/ng-packagr/node_modules/log-symbols": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-6.0.0.tgz",
+      "integrity": "sha512-i24m8rpwhmPIS4zscNzK6MSEhk0DUWa/8iYQWxhffV8jkI4Phvs3F+quL5xvS0gdQR0FyTCMMH33Y78dDTzzIw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^5.3.0",
+        "is-unicode-supported": "^1.3.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/ng-packagr/node_modules/log-symbols/node_modules/is-unicode-supported": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-1.3.0.tgz",
+      "integrity": "sha512-43r2mRvz+8JRIKnWJ+3j8JtjRKZ6GmjzfaE/qiBJnikNnYv/6bagRJ1kUhNk8R5EX/GkobD+r+sfxCPJsiKBLQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/ng-packagr/node_modules/ora": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/ora/-/ora-8.2.0.tgz",
+      "integrity": "sha512-weP+BZ8MVNnlCm8c0Qdc1WSWq4Qn7I+9CJGm7Qali6g44e/PUzbjNqJX5NJ9ljlNMosfJvg1fKEGILklK9cwnw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^5.3.0",
+        "cli-cursor": "^5.0.0",
+        "cli-spinners": "^2.9.2",
+        "is-interactive": "^2.0.0",
+        "is-unicode-supported": "^2.0.0",
+        "log-symbols": "^6.0.0",
+        "stdin-discarder": "^0.2.2",
+        "string-width": "^7.2.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
     },
     "node_modules/ngx-highlightjs": {
       "version": "12.0.0",
@@ -11831,9 +15248,9 @@
       }
     },
     "node_modules/ngx-quill": {
-      "version": "27.0.1",
-      "resolved": "https://registry.npmjs.org/ngx-quill/-/ngx-quill-27.0.1.tgz",
-      "integrity": "sha512-gVv5qNM35Azb/ARk22CJ2NVUnVhU+Ds6Z5eCv7GjISCZr+ELTPVEx1S7EL2R+VUfPxy4fwVA8X6agq6k1BvOiQ==",
+      "version": "28.0.1",
+      "resolved": "https://registry.npmjs.org/ngx-quill/-/ngx-quill-28.0.1.tgz",
+      "integrity": "sha512-fbhPzAPkSSgTutkpXW46kVfP++m1yEAZUJ/kqLZ9DjkF50Ati8n7PJZw/pnxssQP4BRWAtoTypaHFzCkHNrzQw==",
       "license": "MIT",
       "dependencies": {
         "tslib": "^2.3.0"
@@ -11842,7 +15259,7 @@
         "node": "^18.19.1 || ^20.11.1 || >=22.0.0"
       },
       "peerDependencies": {
-        "@angular/core": "^19.0.0",
+        "@angular/core": "^20.0.0",
         "quill": "^2.0.0",
         "rxjs": "^7.0.0"
       }
@@ -11899,32 +15316,22 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/node-forge": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-1.3.1.tgz",
-      "integrity": "sha512-dPEtOeMvF9VMcYV/1Wb8CPoVAXtp6MKMlcbAt4ddqmGqUJ6fQZFXkNZNkNlfevtNkGtaSoXf/vNNNSvgrdXwtA==",
-      "dev": true,
-      "license": "(BSD-3-Clause OR GPL-2.0)",
-      "engines": {
-        "node": ">= 6.13.0"
-      }
-    },
     "node_modules/node-gyp": {
-      "version": "11.1.0",
-      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-11.1.0.tgz",
-      "integrity": "sha512-/+7TuHKnBpnMvUQnsYEb0JOozDZqarQbfNuSGLXIjhStMT0fbw7IdSqWgopOP5xhRZE+lsbIvAHcekddruPZgQ==",
+      "version": "11.3.0",
+      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-11.3.0.tgz",
+      "integrity": "sha512-9J0+C+2nt3WFuui/mC46z2XCZ21/cKlFDuywULmseD/LlmnOrSeEAE4c/1jw6aybXLmpZnQY3/LmOJfgyHIcng==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "env-paths": "^2.2.0",
         "exponential-backoff": "^3.1.1",
-        "glob": "^10.3.10",
         "graceful-fs": "^4.2.6",
         "make-fetch-happen": "^14.0.3",
         "nopt": "^8.0.0",
         "proc-log": "^5.0.0",
         "semver": "^7.3.5",
         "tar": "^7.4.3",
+        "tinyglobby": "^0.2.12",
         "which": "^5.0.0"
       },
       "bin": {
@@ -11950,16 +15357,6 @@
         "node-gyp-build-optional-packages-test": "build-test.js"
       }
     },
-    "node_modules/node-gyp/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0"
-      }
-    },
     "node_modules/node-gyp/node_modules/chownr": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/chownr/-/chownr-3.0.0.tgz",
@@ -11970,27 +15367,6 @@
         "node": ">=18"
       }
     },
-    "node_modules/node-gyp/node_modules/glob": {
-      "version": "10.4.5",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
-      "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "foreground-child": "^3.1.0",
-        "jackspeak": "^3.1.2",
-        "minimatch": "^9.0.4",
-        "minipass": "^7.1.2",
-        "package-json-from-dist": "^1.0.0",
-        "path-scurry": "^1.11.1"
-      },
-      "bin": {
-        "glob": "dist/esm/bin.mjs"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/node-gyp/node_modules/isexe": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-3.1.1.tgz",
@@ -12001,22 +15377,6 @@
         "node": ">=16"
       }
     },
-    "node_modules/node-gyp/node_modules/minimatch": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
-      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "brace-expansion": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/node-gyp/node_modules/mkdirp": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-3.0.1.tgz",
@@ -12332,16 +15692,16 @@
       }
     },
     "node_modules/npm-packlist": {
-      "version": "9.0.0",
-      "resolved": "https://registry.npmjs.org/npm-packlist/-/npm-packlist-9.0.0.tgz",
-      "integrity": "sha512-8qSayfmHJQTx3nJWYbbUmflpyarbLMBc6LCAjYsiGtXxDB68HaZpb8re6zeaLGxZzDuMdhsg70jryJe+RrItVQ==",
+      "version": "10.0.1",
+      "resolved": "https://registry.npmjs.org/npm-packlist/-/npm-packlist-10.0.1.tgz",
+      "integrity": "sha512-vaC03b2PqJA6QqmwHi1jNU8fAPXEnnyv4j/W4PVfgm24C4/zZGSVut3z0YUeN0WIFCo1oGOL02+6LbvFK7JL4Q==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
-        "ignore-walk": "^7.0.0"
+        "ignore-walk": "^8.0.0"
       },
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": "^20.17.0 || >=22.9.0"
       }
     },
     "node_modules/npm-pick-manifest": {
@@ -14865,6 +18225,90 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/object-keys": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
+      "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/object.assign": {
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.7.tgz",
+      "integrity": "sha512-nK28WOo+QIjBkDduTINE4JkF/UJJKyf2EJxvJKfblDpyg0Q+pkOHNTL0Qwy6NP6FhE/EnzV73BxxqcJaXY9anw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0",
+        "has-symbols": "^1.1.0",
+        "object-keys": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/object.fromentries": {
+      "version": "2.0.8",
+      "resolved": "https://registry.npmjs.org/object.fromentries/-/object.fromentries-2.0.8.tgz",
+      "integrity": "sha512-k6E21FzySsSK5a21KRADBd/NGneRegFO5pLHfdQLpRDETUNJueLXs3WCzyQ3tFRDYgbq3KHGXfTbi2bs8WQ6rQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/object.groupby": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/object.groupby/-/object.groupby-1.0.3.tgz",
+      "integrity": "sha512-+Lhy3TQTuzXI5hevh8sBGqbmurHbbIjAi0Z4S63nthVLmLxfbj4T54a4CfZrXIrt9iP4mVAPYMo/v99taj3wjQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/object.values": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.2.1.tgz",
+      "integrity": "sha512-gXah6aZrcUxjWg2zR2MwouP2eHlCBzdV4pygudehaKXSGW4v2AsRQUK+lwwXhii6KFZcunEnmSUoYp5CXibxtA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/obuf": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.2.tgz",
@@ -14891,21 +18335,10 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/on-headers": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.2.tgz",
-      "integrity": "sha512-pZAE+FJLoyITytdqK0U5s+FIpjN0JP3OzFi/u8Rx+EV5/W+JTWGXG8xFzevE7AjBfDqHv/8vL8qQsIhHnqRkrA==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
     "node_modules/once": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
       "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
-      "dev": true,
       "license": "ISC",
       "dependencies": {
         "wrappy": "1"
@@ -14928,19 +18361,18 @@
       }
     },
     "node_modules/open": {
-      "version": "10.1.0",
-      "resolved": "https://registry.npmjs.org/open/-/open-10.1.0.tgz",
-      "integrity": "sha512-mnkeQ1qP5Ue2wd+aivTD3NHd/lZ96Lu0jgf0pwktLPtx6cTZiH7tyeGRRHs0zX0rbrahXPnXlUnbeXyaBBuIaw==",
+      "version": "8.4.2",
+      "resolved": "https://registry.npmjs.org/open/-/open-8.4.2.tgz",
+      "integrity": "sha512-7x81NCL719oNbsq/3mh+hVrAWmFuEYUqrq/Iw3kUzH8ReypT9QQ0BLoJS7/G9k6N81XjW4qHWtjWwe/9eLy1EQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "default-browser": "^5.2.1",
-        "define-lazy-prop": "^3.0.0",
-        "is-inside-container": "^1.0.0",
-        "is-wsl": "^3.1.0"
+        "define-lazy-prop": "^2.0.0",
+        "is-docker": "^2.1.1",
+        "is-wsl": "^2.2.0"
       },
       "engines": {
-        "node": ">=18"
+        "node": ">=12"
       },
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
@@ -14956,6 +18388,24 @@
         "opener": "bin/opener-bin.js"
       }
     },
+    "node_modules/optionator": {
+      "version": "0.9.4",
+      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz",
+      "integrity": "sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "deep-is": "^0.1.3",
+        "fast-levenshtein": "^2.0.6",
+        "levn": "^0.4.1",
+        "prelude-ls": "^1.2.1",
+        "type-check": "^0.4.0",
+        "word-wrap": "^1.2.5"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
     "node_modules/ora": {
       "version": "5.4.1",
       "resolved": "https://registry.npmjs.org/ora/-/ora-5.4.1.tgz",
@@ -15054,9 +18504,9 @@
       }
     },
     "node_modules/ordered-binary": {
-      "version": "1.5.3",
-      "resolved": "https://registry.npmjs.org/ordered-binary/-/ordered-binary-1.5.3.tgz",
-      "integrity": "sha512-oGFr3T+pYdTGJ+YFEILMpS3es+GiIbs9h/XQrclBXUtd44ey7XwfsMzM31f64I1SQOawDoDr/D823kNCADI8TA==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/ordered-binary/-/ordered-binary-1.6.0.tgz",
+      "integrity": "sha512-IQh2aMfMIDbPjI/8a3Edr+PiOpcsB7yo8NdW7aHWVaoR/pcDldunMvnnwbk/auPGqmKeAdxtZl7MHX/QmPwhvQ==",
       "dev": true,
       "license": "MIT",
       "optional": true
@@ -15071,6 +18521,24 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/own-keys": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/own-keys/-/own-keys-1.0.1.tgz",
+      "integrity": "sha512-qFOyK5PjiWZd+QQIh+1jhdb9LpxTF0qs7Pm8o5QHYZ0M3vKqSqzsZaEB6oWlxZ+q2sJBMI/Ktgd2N5ZwQoRHfg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "get-intrinsic": "^1.2.6",
+        "object-keys": "^1.1.1",
+        "safe-push-apply": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/p-finally": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz",
@@ -15081,6 +18549,22 @@
         "node": ">=4"
       }
     },
+    "node_modules/p-limit": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
+      "integrity": "sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "yocto-queue": "^0.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/p-locate": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-6.0.0.tgz",
@@ -15156,24 +18640,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/p-retry": {
-      "version": "6.2.1",
-      "resolved": "https://registry.npmjs.org/p-retry/-/p-retry-6.2.1.tgz",
-      "integrity": "sha512-hEt02O4hUct5wtwg4H4KcWgDdm+l1bOaEy/hWzd8xtXB9BqxTWBBhb+2ImAtH4Cv4rPjV76xN3Zumqk3k3AhhQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@types/retry": "0.12.2",
-        "is-network-error": "^1.0.0",
-        "retry": "^0.13.1"
-      },
-      "engines": {
-        "node": ">=16.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/p-timeout": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/p-timeout/-/p-timeout-3.2.0.tgz",
@@ -15204,9 +18670,9 @@
       "license": "BlueOak-1.0.0"
     },
     "node_modules/pacote": {
-      "version": "20.0.0",
-      "resolved": "https://registry.npmjs.org/pacote/-/pacote-20.0.0.tgz",
-      "integrity": "sha512-pRjC5UFwZCgx9kUFDVM9YEahv4guZ1nSLqwmWiLUnDbGsjs+U5w7z6Uc8HNR1a6x8qnu5y9xtGE6D1uAuYz+0A==",
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/pacote/-/pacote-21.0.0.tgz",
+      "integrity": "sha512-lcqexq73AMv6QNLo7SOpz0JJoaGdS3rBFgF122NZVl1bApo2mfu+XzUBU/X/XsiJu+iUmKpekRayqQYAs+PhkA==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -15219,7 +18685,7 @@
         "fs-minipass": "^3.0.0",
         "minipass": "^7.0.2",
         "npm-package-arg": "^12.0.0",
-        "npm-packlist": "^9.0.0",
+        "npm-packlist": "^10.0.0",
         "npm-pick-manifest": "^10.0.0",
         "npm-registry-fetch": "^18.0.0",
         "proc-log": "^5.0.0",
@@ -15232,7 +18698,7 @@
         "pacote": "bin/index.js"
       },
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": "^20.17.0 || >=22.9.0"
       }
     },
     "node_modules/pako": {
@@ -15261,32 +18727,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/parse-json": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz",
-      "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/code-frame": "^7.0.0",
-        "error-ex": "^1.3.1",
-        "json-parse-even-better-errors": "^2.3.0",
-        "lines-and-columns": "^1.1.6"
-      },
-      "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
-    "node_modules/parse-json/node_modules/json-parse-even-better-errors": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
-      "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/parse-node-version": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/parse-node-version/-/parse-node-version-1.0.1.tgz",
@@ -15298,26 +18738,26 @@
       }
     },
     "node_modules/parse5": {
-      "version": "7.2.1",
-      "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.2.1.tgz",
-      "integrity": "sha512-BuBYQYlv1ckiPdQi/ohiivi9Sagc9JG+Ozs0r7b/0iK3sKmrb0b9FdWdBbOdx6hBCM/F9Ir82ofnBhtZOjCRPQ==",
+      "version": "7.3.0",
+      "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.3.0.tgz",
+      "integrity": "sha512-IInvU7fabl34qmi9gY8XOVxhYyMyuH2xUNpb2q8/Y+7552KlejkRvqvD19nMoUW/uQGGbqNpA6Tufu5FL5BZgw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "entities": "^4.5.0"
+        "entities": "^6.0.0"
       },
       "funding": {
         "url": "https://github.com/inikulin/parse5?sponsor=1"
       }
     },
     "node_modules/parse5-html-rewriting-stream": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/parse5-html-rewriting-stream/-/parse5-html-rewriting-stream-7.0.0.tgz",
-      "integrity": "sha512-mazCyGWkmCRWDI15Zp+UiCqMp/0dgEmkZRvhlsqqKYr4SsVm/TvnSpD9fCvqCA2zoWJcfRym846ejWBBHRiYEg==",
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/parse5-html-rewriting-stream/-/parse5-html-rewriting-stream-7.1.0.tgz",
+      "integrity": "sha512-2ifK6Jb+ONoqOy5f+cYHsqvx1obHQdvIk13Jmt/5ezxP0U9p+fqd+R6O73KblGswyuzBYfetmsfK9ThMgnuPPg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "entities": "^4.3.0",
+        "entities": "^6.0.0",
         "parse5": "^7.0.0",
         "parse5-sax-parser": "^7.0.0"
       },
@@ -15325,6 +18765,19 @@
         "url": "https://github.com/inikulin/parse5?sponsor=1"
       }
     },
+    "node_modules/parse5-html-rewriting-stream/node_modules/entities": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz",
+      "integrity": "sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
     "node_modules/parse5-sax-parser": {
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/parse5-sax-parser/-/parse5-sax-parser-7.0.0.tgz",
@@ -15338,6 +18791,19 @@
         "url": "https://github.com/inikulin/parse5?sponsor=1"
       }
     },
+    "node_modules/parse5/node_modules/entities": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz",
+      "integrity": "sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
     "node_modules/parseurl": {
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
@@ -15404,25 +18870,6 @@
       "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
       "license": "ISC"
     },
-    "node_modules/path-to-regexp": {
-      "version": "0.1.12",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.12.tgz",
-      "integrity": "sha512-RA1GjUVMnvYFxuqovrEqZoxxW5NUZqbwKtYz/Tt7nXerk0LbLblQmrsgdeOxV5SFHf0UDggjS/bSeOZwt1pmEQ==",
-      "license": "MIT"
-    },
-    "node_modules/path-type": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/path-type/-/path-type-6.0.0.tgz",
-      "integrity": "sha512-Vj7sf++t5pBD637NSfkxpHSMfWaeig5+DKWLhcqIYx6mWQz5hdJTGDVMQiJcw1ZYkhs7AazKDGpRVji1LJCZUQ==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=18"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/pathe": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/pathe/-/pathe-1.1.2.tgz",
@@ -15644,26 +19091,39 @@
       }
     },
     "node_modules/piscina": {
-      "version": "4.8.0",
-      "resolved": "https://registry.npmjs.org/piscina/-/piscina-4.8.0.tgz",
-      "integrity": "sha512-EZJb+ZxDrQf3dihsUL7p42pjNyrNIFJCrRHPMgxu/svsj+P3xS3fuEWp7k2+rfsavfl1N0G29b1HGs7J0m8rZA==",
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/piscina/-/piscina-5.1.2.tgz",
+      "integrity": "sha512-9cE/BTA/xhDiyNUEj6EKWLEQC17fh/24ydYzQwcA7QdYh75K6kzL2GHvxDF5i9rFGtUaaKk7/u4xp07qiKXccQ==",
       "dev": true,
       "license": "MIT",
+      "engines": {
+        "node": ">=20.x"
+      },
       "optionalDependencies": {
         "@napi-rs/nice": "^1.0.1"
       }
     },
+    "node_modules/pkce-challenge": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/pkce-challenge/-/pkce-challenge-5.0.0.tgz",
+      "integrity": "sha512-ueGLflrrnvwB3xuo/uGob5pd5FN7l0MsLf0Z87o/UQmRtwjvfylfc9MurIxRAWywCYTgrvpXBcqjV4OfCYGCIQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
     "node_modules/pkg-dir": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-7.0.0.tgz",
-      "integrity": "sha512-Ie9z/WINcxxLp27BKOCHGde4ITq9UklYKDzVo1nhk5sqGEXU3FpkwP5GM2voTGJkGd9B3Otl+Q4uwSOeSUtOBA==",
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-8.0.0.tgz",
+      "integrity": "sha512-4peoBq4Wks0riS0z8741NVv+/8IiTvqnZAr8QGgtdifrtpdXbNw/FxRS1l6NFqm4EMzuS0EDqNNx4XGaz8cuyQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "find-up": "^6.3.0"
+        "find-up-simple": "^1.0.0"
       },
       "engines": {
-        "node": ">=14.16"
+        "node": ">=18"
       },
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
@@ -15762,10 +19222,34 @@
         "node": ">=4"
       }
     },
+    "node_modules/portfinder": {
+      "version": "1.0.37",
+      "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.37.tgz",
+      "integrity": "sha512-yuGIEjDAYnnOex9ddMnKZEMFE0CcGo6zbfzDklkmT1m5z734ss6JMzN9rNB3+RR7iS+F10D4/BVIaXOyh8PQKw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "async": "^3.2.6",
+        "debug": "^4.3.6"
+      },
+      "engines": {
+        "node": ">= 10.12"
+      }
+    },
+    "node_modules/possible-typed-array-names": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.1.0.tgz",
+      "integrity": "sha512-/+5VFTchJDoVj3bhoqi6UeymcD00DAwb1nJwamzPvHEszJ4FpF6SNNbUbOS8yI56qHzdV8eK0qEfOSiodkTdxg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/postcss": {
-      "version": "8.5.3",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.3.tgz",
-      "integrity": "sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==",
+      "version": "8.5.6",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz",
+      "integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==",
       "funding": [
         {
           "type": "opencollective",
@@ -15782,7 +19266,7 @@
       ],
       "license": "MIT",
       "dependencies": {
-        "nanoid": "^3.3.8",
+        "nanoid": "^3.3.11",
         "picocolors": "^1.1.1",
         "source-map-js": "^1.2.1"
       },
@@ -15861,38 +19345,6 @@
         }
       }
     },
-    "node_modules/postcss-loader": {
-      "version": "8.1.1",
-      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-8.1.1.tgz",
-      "integrity": "sha512-0IeqyAsG6tYiDRCYKQJLAmgQr47DX6N7sFSWvQxt6AcupX8DIdmykuk/o/tx0Lze3ErGHJEp5OSRxrelC6+NdQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "cosmiconfig": "^9.0.0",
-        "jiti": "^1.20.0",
-        "semver": "^7.5.4"
-      },
-      "engines": {
-        "node": ">= 18.12.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/webpack"
-      },
-      "peerDependencies": {
-        "@rspack/core": "0.x || 1.x",
-        "postcss": "^7.0.0 || ^8.0.1",
-        "webpack": "^5.0.0"
-      },
-      "peerDependenciesMeta": {
-        "@rspack/core": {
-          "optional": true
-        },
-        "webpack": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/postcss-media-query-parser": {
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz",
@@ -15900,69 +19352,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/postcss-modules-extract-imports": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.1.0.tgz",
-      "integrity": "sha512-k3kNe0aNFQDAZGbin48pL2VNidTF0w4/eASDsxlyspobzU3wZQLOGj7L9gfRe0Jo9/4uud09DsjFNH7winGv8Q==",
-      "dev": true,
-      "license": "ISC",
-      "engines": {
-        "node": "^10 || ^12 || >= 14"
-      },
-      "peerDependencies": {
-        "postcss": "^8.1.0"
-      }
-    },
-    "node_modules/postcss-modules-local-by-default": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.2.0.tgz",
-      "integrity": "sha512-5kcJm/zk+GJDSfw+V/42fJ5fhjL5YbFDl8nVdXkJPLLW+Vf9mTD5Xe0wqIaDnLuL2U6cDNpTr+UQ+v2HWIBhzw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "icss-utils": "^5.0.0",
-        "postcss-selector-parser": "^7.0.0",
-        "postcss-value-parser": "^4.1.0"
-      },
-      "engines": {
-        "node": "^10 || ^12 || >= 14"
-      },
-      "peerDependencies": {
-        "postcss": "^8.1.0"
-      }
-    },
-    "node_modules/postcss-modules-scope": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-3.2.1.tgz",
-      "integrity": "sha512-m9jZstCVaqGjTAuny8MdgE88scJnCiQSlSrOWcTQgM2t32UBe+MUmFSO5t7VMSfAf/FJKImAxBav8ooCHJXCJA==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "postcss-selector-parser": "^7.0.0"
-      },
-      "engines": {
-        "node": "^10 || ^12 || >= 14"
-      },
-      "peerDependencies": {
-        "postcss": "^8.1.0"
-      }
-    },
-    "node_modules/postcss-modules-values": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-4.0.0.tgz",
-      "integrity": "sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "icss-utils": "^5.0.0"
-      },
-      "engines": {
-        "node": "^10 || ^12 || >= 14"
-      },
-      "peerDependencies": {
-        "postcss": "^8.1.0"
-      }
-    },
     "node_modules/postcss-nested": {
       "version": "6.2.0",
       "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.2.0.tgz",
@@ -16001,20 +19390,6 @@
         "node": ">=4"
       }
     },
-    "node_modules/postcss-selector-parser": {
-      "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.0.tgz",
-      "integrity": "sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "cssesc": "^3.0.0",
-        "util-deprecate": "^1.0.2"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/postcss-value-parser": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
@@ -16071,6 +19446,16 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/prelude-ls": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
+      "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
     "node_modules/prettier": {
       "version": "3.4.2",
       "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.4.2.tgz",
@@ -16107,13 +19492,6 @@
         "node": ">= 0.6.0"
       }
     },
-    "node_modules/process-nextick-args": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
-      "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/promise-retry": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/promise-retry/-/promise-retry-2.0.1.tgz",
@@ -16204,6 +19582,7 @@
       "version": "6.13.0",
       "resolved": "https://registry.npmjs.org/qs/-/qs-6.13.0.tgz",
       "integrity": "sha512-+38qI9SOr8tfZ4QmJNplMUxqjbe7LKvvZgWdExBOmd+egZTtjLB67Gu0HRX3u/XOq7UU2Nx6nsjvS16Z9uwfpg==",
+      "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
         "side-channel": "^1.0.6"
@@ -16363,6 +19742,7 @@
       "integrity": "sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "safe-buffer": "^5.1.0"
       }
@@ -16380,6 +19760,7 @@
       "version": "2.5.2",
       "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.5.2.tgz",
       "integrity": "sha512-8zGqypfENjCIqGhgXToC8aB2r7YrBX+AQAfIPs/Mlk+BtPTztOvTS01NRW/3Eh60J+a48lt8qsCzirQ6loCVfA==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "bytes": "3.1.2",
@@ -16436,123 +19817,72 @@
         "node": ">= 14.18.0"
       },
       "funding": {
-        "type": "individual",
-        "url": "https://paulmillr.com/funding/"
-      }
-    },
-    "node_modules/rechoir": {
-      "version": "0.8.0",
-      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.8.0.tgz",
-      "integrity": "sha512-/vxpCXddiX8NGfGO/mTafwjq4aFa/71pvamip0++IQk3zG8cbCj0fifNPrjjF1XMXUne91jL9OoxmdykoEtifQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "resolve": "^1.20.0"
-      },
-      "engines": {
-        "node": ">= 10.13.0"
-      }
-    },
-    "node_modules/reflect-metadata": {
-      "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.2.2.tgz",
-      "integrity": "sha512-urBwgfrvVP/eAyXx4hluJivBKzuEbSQs9rKWCrCkbSxNv8mxPcUZKeuoF3Uy4mJl3Lwprp6yy5/39VWigZ4K6Q==",
-      "dev": true,
-      "license": "Apache-2.0"
-    },
-    "node_modules/regenerate": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz",
-      "integrity": "sha512-zrceR/XhGYU/d/opr2EKO7aRHUeiBI8qjtfHqADTwZd6Szfy16la6kqD0MIUs5z5hx6AaKa+PixpPrR289+I0A==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/regenerate-unicode-properties": {
-      "version": "10.2.0",
-      "resolved": "https://registry.npmjs.org/regenerate-unicode-properties/-/regenerate-unicode-properties-10.2.0.tgz",
-      "integrity": "sha512-DqHn3DwbmmPVzeKj9woBadqmXxLvQoQIwu7nopMc72ztvxVmVk2SBhSnx67zuye5TP+lJsb/TBQsjLKhnDf3MA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "regenerate": "^1.4.2"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/regenerator-runtime": {
-      "version": "0.14.1",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
-      "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/regenerator-transform": {
-      "version": "0.15.2",
-      "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.15.2.tgz",
-      "integrity": "sha512-hfMp2BoF0qOk3uc5V20ALGDS2ddjQaLrdl7xrGXvAIow7qeWRM2VA2HuCHkUKk9slq3VwEwLNK3DFBqDfPGYtg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/runtime": "^7.8.4"
+        "type": "individual",
+        "url": "https://paulmillr.com/funding/"
       }
     },
-    "node_modules/regex-parser": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/regex-parser/-/regex-parser-2.3.1.tgz",
-      "integrity": "sha512-yXLRqatcCuKtVHsWrNg0JL3l1zGfdXeEvDa0bdu4tCDQw0RpMDZsqbkyRTUnKMR0tXF627V2oEWjBEaEdqTwtQ==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/regexpu-core": {
-      "version": "6.2.0",
-      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-6.2.0.tgz",
-      "integrity": "sha512-H66BPQMrv+V16t8xtmq+UC0CBpiTBA60V8ibS1QVReIp8T1z8hwFxqcGzm9K6lgsN7sB5edVH8a+ze6Fqm4weA==",
+    "node_modules/rechoir": {
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.8.0.tgz",
+      "integrity": "sha512-/vxpCXddiX8NGfGO/mTafwjq4aFa/71pvamip0++IQk3zG8cbCj0fifNPrjjF1XMXUne91jL9OoxmdykoEtifQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "regenerate": "^1.4.2",
-        "regenerate-unicode-properties": "^10.2.0",
-        "regjsgen": "^0.8.0",
-        "regjsparser": "^0.12.0",
-        "unicode-match-property-ecmascript": "^2.0.0",
-        "unicode-match-property-value-ecmascript": "^2.1.0"
+        "resolve": "^1.20.0"
       },
       "engines": {
-        "node": ">=4"
+        "node": ">= 10.13.0"
       }
     },
-    "node_modules/regjsgen": {
-      "version": "0.8.0",
-      "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.8.0.tgz",
-      "integrity": "sha512-RvwtGe3d7LvWiDQXeQw8p5asZUmfU1G/l6WbUXeHta7Y2PEIvBTwH6E2EfmYUK8pxcxEdEmaomqyp0vZZ7C+3Q==",
+    "node_modules/reflect-metadata": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.2.2.tgz",
+      "integrity": "sha512-urBwgfrvVP/eAyXx4hluJivBKzuEbSQs9rKWCrCkbSxNv8mxPcUZKeuoF3Uy4mJl3Lwprp6yy5/39VWigZ4K6Q==",
       "dev": true,
-      "license": "MIT"
+      "license": "Apache-2.0"
     },
-    "node_modules/regjsparser": {
-      "version": "0.12.0",
-      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.12.0.tgz",
-      "integrity": "sha512-cnE+y8bz4NhMjISKbgeVJtqNbtf5QpjZP+Bslo+UqkIt9QPnX9q095eiRRASJG1/tz6dlNr6Z5NsBiWYokp6EQ==",
+    "node_modules/reflect.getprototypeof": {
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.10.tgz",
+      "integrity": "sha512-00o4I+DVrefhv+nX0ulyi3biSHCPDe+yLv5o/p6d/UVlirijB8E16FtfwSAi4g3tcqrQ4lRAqQSoFEZJehYEcw==",
       "dev": true,
-      "license": "BSD-2-Clause",
+      "license": "MIT",
       "dependencies": {
-        "jsesc": "~3.0.2"
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.9",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0",
+        "get-intrinsic": "^1.2.7",
+        "get-proto": "^1.0.1",
+        "which-builtin-type": "^1.2.1"
       },
-      "bin": {
-        "regjsparser": "bin/parser"
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/regjsparser/node_modules/jsesc": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.0.2.tgz",
-      "integrity": "sha512-xKqzzWXDttJuOcawBt4KnKHHIf5oQ/Cxax+0PWFG+DFDgHNAdi+TXECADI+RYiFUMmx8792xsMbbgXj4CwnP4g==",
+    "node_modules/regexp.prototype.flags": {
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.4.tgz",
+      "integrity": "sha512-dYqgNSZbDwkaJ2ceRd9ojCGjBq+mOm9LmtXnAnEGyHhN/5R7iDW2TRw3h+o/jCFxus3P2LfWIIiwowAjANm7IA==",
       "dev": true,
       "license": "MIT",
-      "bin": {
-        "jsesc": "bin/jsesc"
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-errors": "^1.3.0",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "set-function-name": "^2.0.2"
       },
       "engines": {
-        "node": ">=6"
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/remeda": {
@@ -16652,48 +19982,6 @@
         "url": "https://github.com/privatenumber/resolve-pkg-maps?sponsor=1"
       }
     },
-    "node_modules/resolve-url-loader": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/resolve-url-loader/-/resolve-url-loader-5.0.0.tgz",
-      "integrity": "sha512-uZtduh8/8srhBoMx//5bwqjQ+rfYOUq8zC9NrMUGtjBiGTtFJM42s58/36+hTqeqINcnYe08Nj3LkK9lW4N8Xg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "adjust-sourcemap-loader": "^4.0.0",
-        "convert-source-map": "^1.7.0",
-        "loader-utils": "^2.0.0",
-        "postcss": "^8.2.14",
-        "source-map": "0.6.1"
-      },
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/resolve-url-loader/node_modules/loader-utils": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz",
-      "integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "big.js": "^5.2.2",
-        "emojis-list": "^3.0.0",
-        "json5": "^2.1.2"
-      },
-      "engines": {
-        "node": ">=8.9.0"
-      }
-    },
-    "node_modules/resolve-url-loader/node_modules/source-map": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-      "dev": true,
-      "license": "BSD-3-Clause",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/restore-cursor": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-5.1.0.tgz",
@@ -16766,13 +20054,13 @@
       }
     },
     "node_modules/rollup": {
-      "version": "4.34.8",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.34.8.tgz",
-      "integrity": "sha512-489gTVMzAYdiZHFVA/ig/iYFllCcWFHMvUHI1rpFmkoUtRlQxqh6/yiNqnYibjMZ2b/+FUQwldG+aLsEt6bglQ==",
+      "version": "4.44.1",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.44.1.tgz",
+      "integrity": "sha512-x8H8aPvD+xbl0Do8oez5f5o8eMS3trfCghc4HhLAnCkj7Vl0d1JWGs0UF/D886zLW2rOj2QymV/JcSSsw+XDNg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@types/estree": "1.0.6"
+        "@types/estree": "1.0.8"
       },
       "bin": {
         "rollup": "dist/bin/rollup"
@@ -16782,39 +20070,75 @@
         "npm": ">=8.0.0"
       },
       "optionalDependencies": {
-        "@rollup/rollup-android-arm-eabi": "4.34.8",
-        "@rollup/rollup-android-arm64": "4.34.8",
-        "@rollup/rollup-darwin-arm64": "4.34.8",
-        "@rollup/rollup-darwin-x64": "4.34.8",
-        "@rollup/rollup-freebsd-arm64": "4.34.8",
-        "@rollup/rollup-freebsd-x64": "4.34.8",
-        "@rollup/rollup-linux-arm-gnueabihf": "4.34.8",
-        "@rollup/rollup-linux-arm-musleabihf": "4.34.8",
-        "@rollup/rollup-linux-arm64-gnu": "4.34.8",
-        "@rollup/rollup-linux-arm64-musl": "4.34.8",
-        "@rollup/rollup-linux-loongarch64-gnu": "4.34.8",
-        "@rollup/rollup-linux-powerpc64le-gnu": "4.34.8",
-        "@rollup/rollup-linux-riscv64-gnu": "4.34.8",
-        "@rollup/rollup-linux-s390x-gnu": "4.34.8",
-        "@rollup/rollup-linux-x64-gnu": "4.34.8",
-        "@rollup/rollup-linux-x64-musl": "4.34.8",
-        "@rollup/rollup-win32-arm64-msvc": "4.34.8",
-        "@rollup/rollup-win32-ia32-msvc": "4.34.8",
-        "@rollup/rollup-win32-x64-msvc": "4.34.8",
+        "@rollup/rollup-android-arm-eabi": "4.44.1",
+        "@rollup/rollup-android-arm64": "4.44.1",
+        "@rollup/rollup-darwin-arm64": "4.44.1",
+        "@rollup/rollup-darwin-x64": "4.44.1",
+        "@rollup/rollup-freebsd-arm64": "4.44.1",
+        "@rollup/rollup-freebsd-x64": "4.44.1",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.44.1",
+        "@rollup/rollup-linux-arm-musleabihf": "4.44.1",
+        "@rollup/rollup-linux-arm64-gnu": "4.44.1",
+        "@rollup/rollup-linux-arm64-musl": "4.44.1",
+        "@rollup/rollup-linux-loongarch64-gnu": "4.44.1",
+        "@rollup/rollup-linux-powerpc64le-gnu": "4.44.1",
+        "@rollup/rollup-linux-riscv64-gnu": "4.44.1",
+        "@rollup/rollup-linux-riscv64-musl": "4.44.1",
+        "@rollup/rollup-linux-s390x-gnu": "4.44.1",
+        "@rollup/rollup-linux-x64-gnu": "4.44.1",
+        "@rollup/rollup-linux-x64-musl": "4.44.1",
+        "@rollup/rollup-win32-arm64-msvc": "4.44.1",
+        "@rollup/rollup-win32-ia32-msvc": "4.44.1",
+        "@rollup/rollup-win32-x64-msvc": "4.44.1",
         "fsevents": "~2.3.2"
       }
     },
-    "node_modules/run-applescript": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/run-applescript/-/run-applescript-7.0.0.tgz",
-      "integrity": "sha512-9by4Ij99JUr/MCFBUkDKLWK3G9HVXmabKz9U5MlIAIuvuzkiOicRYs8XJLxX+xahD+mLiiCYDqF9dKAgtzKP1A==",
+    "node_modules/rollup-plugin-dts": {
+      "version": "6.2.3",
+      "resolved": "https://registry.npmjs.org/rollup-plugin-dts/-/rollup-plugin-dts-6.2.3.tgz",
+      "integrity": "sha512-UgnEsfciXSPpASuOelix7m4DrmyQgiaWBnvI0TM4GxuDh5FkqW8E5hu57bCxXB90VvR1WNfLV80yEDN18UogSA==",
       "dev": true,
-      "license": "MIT",
+      "license": "LGPL-3.0-only",
+      "dependencies": {
+        "magic-string": "^0.30.17"
+      },
       "engines": {
-        "node": ">=18"
+        "node": ">=16"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "url": "https://github.com/sponsors/Swatinem"
+      },
+      "optionalDependencies": {
+        "@babel/code-frame": "^7.27.1"
+      },
+      "peerDependencies": {
+        "rollup": "^3.29.4 || ^4",
+        "typescript": "^4.5 || ^5.0"
+      }
+    },
+    "node_modules/router": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/router/-/router-2.2.0.tgz",
+      "integrity": "sha512-nLTrUKm2UyiL7rlhapu/Zl45FwNgkZGaCpZbIHajDYgwlJCOzLSk+cIPAnsEqV955GjILJnKbdQC1nVPz+gAYQ==",
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^4.4.0",
+        "depd": "^2.0.0",
+        "is-promise": "^4.0.0",
+        "parseurl": "^1.3.3",
+        "path-to-regexp": "^8.0.0"
+      },
+      "engines": {
+        "node": ">= 18"
+      }
+    },
+    "node_modules/router/node_modules/path-to-regexp": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-8.2.0.tgz",
+      "integrity": "sha512-TdrF7fW9Rphjq4RjrW0Kp2AW0Ahwu9sRGTkS6bvDi0SCwZlEZYmcfDbEsTz8RVk0EHIS/Vd1bv3JhG+1xZuAyQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=16"
       }
     },
     "node_modules/run-parallel": {
@@ -16849,6 +20173,26 @@
         "tslib": "^2.1.0"
       }
     },
+    "node_modules/safe-array-concat": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.3.tgz",
+      "integrity": "sha512-AURm5f0jYEOydBj7VQlVvDrjeFgthDdEF5H1dP+6mNpoXOMo1quQqJ4wvJDyRZ9+pO3kGWoOdmV08cSv2aJV6Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.2",
+        "get-intrinsic": "^1.2.6",
+        "has-symbols": "^1.1.0",
+        "isarray": "^2.0.5"
+      },
+      "engines": {
+        "node": ">=0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/safe-buffer": {
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
@@ -16869,6 +20213,23 @@
       ],
       "license": "MIT"
     },
+    "node_modules/safe-push-apply": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/safe-push-apply/-/safe-push-apply-1.0.0.tgz",
+      "integrity": "sha512-iKE9w/Z7xCzUMIZqdBsp6pEQvwuEebH4vdpjcDWnyzaI6yl6O9FHvVpmGelvEHNsoY6wGblkxR6Zty/h00WiSA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "isarray": "^2.0.5"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/safe-regex-test": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.1.0.tgz",
@@ -16894,9 +20255,9 @@
       "license": "MIT"
     },
     "node_modules/sass": {
-      "version": "1.85.0",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.85.0.tgz",
-      "integrity": "sha512-3ToiC1xZ1Y8aU7+CkgCI/tqyuPXEmYGJXO7H4uqp0xkLXUqp88rQQ4j1HmP37xSJLbCJPaIiv+cT1y+grssrww==",
+      "version": "1.89.2",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.89.2.tgz",
+      "integrity": "sha512-xCmtksBKd/jdJ9Bt9p7nPKiuqrlBMBuuGkQlkhZjjQk3Ty48lv93k5Dq6OPkKt4XwxDJ7tvlfrTa1MPA9bf+QA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -16914,47 +20275,6 @@
         "@parcel/watcher": "^2.4.1"
       }
     },
-    "node_modules/sass-loader": {
-      "version": "16.0.5",
-      "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-16.0.5.tgz",
-      "integrity": "sha512-oL+CMBXrj6BZ/zOq4os+UECPL+bWqt6OAC6DWS8Ln8GZRcMDjlJ4JC3FBDuHJdYaFWIdKNIBYmtZtK2MaMkNIw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "neo-async": "^2.6.2"
-      },
-      "engines": {
-        "node": ">= 18.12.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/webpack"
-      },
-      "peerDependencies": {
-        "@rspack/core": "0.x || 1.x",
-        "node-sass": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0",
-        "sass": "^1.3.0",
-        "sass-embedded": "*",
-        "webpack": "^5.0.0"
-      },
-      "peerDependenciesMeta": {
-        "@rspack/core": {
-          "optional": true
-        },
-        "node-sass": {
-          "optional": true
-        },
-        "sass": {
-          "optional": true
-        },
-        "sass-embedded": {
-          "optional": true
-        },
-        "webpack": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/sax": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/sax/-/sax-1.4.1.tgz",
@@ -16964,11 +20284,12 @@
       "optional": true
     },
     "node_modules/schema-utils": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.0.tgz",
-      "integrity": "sha512-Gf9qqc58SpCA/xdziiHz35F4GNIWYWZrEshUc/G/r5BnLph6xpKuLeoJoQuj5WfBIx/eQLf+hmVPYHaxJu7V2g==",
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.2.tgz",
+      "integrity": "sha512-Gn/JaSk/Mt9gYubxTtSn/QCV4em9mpAPiR1rqy/Ocu19u/G9J5WWdNoUT4SiV6mFC3y6cxyFcFwdzPM3FgxGAQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/json-schema": "^7.0.9",
         "ajv": "^8.9.0",
@@ -16989,6 +20310,7 @@
       "integrity": "sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "ajv": "^8.0.0"
       },
@@ -17001,31 +20323,17 @@
         }
       }
     },
-    "node_modules/select-hose": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
-      "integrity": "sha512-mEugaLK+YfkijB4fx0e6kImuJdCIt2LxCRcbEYPqRGCs4F2ogyfZU5IAZRdjCP8JPq2AtdNoC/Dux63d9Kiryg==",
+    "node_modules/secure-compare": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/secure-compare/-/secure-compare-3.0.1.tgz",
+      "integrity": "sha512-AckIIV90rPDcBcglUwXPF3kg0P0qmPsPXAj6BBEENQE1p5yA1xfmDJzfi1Tappj37Pv2mVbKpL3Z1T+Nn7k1Qw==",
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/selfsigned": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-2.4.1.tgz",
-      "integrity": "sha512-th5B4L2U+eGLq1TVh7zNRGBapioSORUeymIydxgFpwww9d2qyKvtuPU2jJuHvYAwwqi2Y596QBL3eEqcPEYL8Q==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@types/node-forge": "^1.3.0",
-        "node-forge": "^1"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/semver": {
-      "version": "7.7.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.1.tgz",
-      "integrity": "sha512-hlq8tAfn0m/61p4BVRcPzIGr6LKiMwo4VM6dGi6pt4qcRkmNzTcWq6eCEjEh+qXjkMDvPlOFFSGwQjoEa6gyMA==",
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
       "dev": true,
       "license": "ISC",
       "bin": {
@@ -17036,63 +20344,37 @@
       }
     },
     "node_modules/send": {
-      "version": "0.19.0",
-      "resolved": "https://registry.npmjs.org/send/-/send-0.19.0.tgz",
-      "integrity": "sha512-dW41u5VfLXu8SJh5bwRmyYUbAoSB3c9uQh6L8h/KtsFREPWpbX1lrljJo186Jc4nmci/sGUZ9a0a0J2zgfq2hw==",
-      "license": "MIT",
-      "dependencies": {
-        "debug": "2.6.9",
-        "depd": "2.0.0",
-        "destroy": "1.2.0",
-        "encodeurl": "~1.0.2",
-        "escape-html": "~1.0.3",
-        "etag": "~1.8.1",
-        "fresh": "0.5.2",
-        "http-errors": "2.0.0",
-        "mime": "1.6.0",
-        "ms": "2.1.3",
-        "on-finished": "2.4.1",
-        "range-parser": "~1.2.1",
-        "statuses": "2.0.1"
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/send/-/send-1.2.0.tgz",
+      "integrity": "sha512-uaW0WwXKpL9blXE2o0bRhoL2EGXIrZxQ2ZQ4mgcfoBxdFmQold+qWsD2jLrfZ0trjKL6vOw0j//eAwcALFjKSw==",
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^4.3.5",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "etag": "^1.8.1",
+        "fresh": "^2.0.0",
+        "http-errors": "^2.0.0",
+        "mime-types": "^3.0.1",
+        "ms": "^2.1.3",
+        "on-finished": "^2.4.1",
+        "range-parser": "^1.2.1",
+        "statuses": "^2.0.1"
       },
       "engines": {
-        "node": ">= 0.8.0"
+        "node": ">= 18"
       }
     },
-    "node_modules/send/node_modules/debug": {
-      "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+    "node_modules/send/node_modules/mime-types": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-3.0.1.tgz",
+      "integrity": "sha512-xRc4oEhT6eaBpU1XF7AjpOFD+xQmXNB5OVKwp4tqCuBpHLS/ZbBDrc07mYTDqVMg6PfxUjjNp85O6Cd2Z/5HWA==",
       "license": "MIT",
       "dependencies": {
-        "ms": "2.0.0"
-      }
-    },
-    "node_modules/send/node_modules/debug/node_modules/ms": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
-      "license": "MIT"
-    },
-    "node_modules/send/node_modules/encodeurl": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
-      "integrity": "sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/send/node_modules/mime": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
-      "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
-      "license": "MIT",
-      "bin": {
-        "mime": "cli.js"
+        "mime-db": "^1.54.0"
       },
       "engines": {
-        "node": ">=4"
+        "node": ">= 0.6"
       }
     },
     "node_modules/serialize-javascript": {
@@ -17101,109 +20383,73 @@
       "integrity": "sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==",
       "dev": true,
       "license": "BSD-3-Clause",
+      "peer": true,
       "dependencies": {
         "randombytes": "^2.1.0"
       }
     },
-    "node_modules/serve-index": {
-      "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz",
-      "integrity": "sha512-pXHfKNP4qujrtteMrSBb0rc8HJ9Ms/GrXwcUtUtD5s4ewDJI8bT3Cz2zTVRMKtri49pLx2e0Ya8ziP5Ya2pZZw==",
-      "dev": true,
+    "node_modules/serve-static": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-2.2.0.tgz",
+      "integrity": "sha512-61g9pCh0Vnh7IutZjtLGGpTA355+OPn2TyDv/6ivP2h/AdAVX9azsoxmg2/M6nZeQZNYBEwIcsne1mJd9oQItQ==",
       "license": "MIT",
       "dependencies": {
-        "accepts": "~1.3.4",
-        "batch": "0.6.1",
-        "debug": "2.6.9",
-        "escape-html": "~1.0.3",
-        "http-errors": "~1.6.2",
-        "mime-types": "~2.1.17",
-        "parseurl": "~1.3.2"
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "parseurl": "^1.3.3",
+        "send": "^1.2.0"
       },
       "engines": {
-        "node": ">= 0.8.0"
-      }
-    },
-    "node_modules/serve-index/node_modules/debug": {
-      "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ms": "2.0.0"
-      }
-    },
-    "node_modules/serve-index/node_modules/depd": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz",
-      "integrity": "sha512-7emPTl6Dpo6JRXOXjLRxck+FlLRX5847cLKEn00PLAgc3g2hTZZgr+e4c2v6QpSmLeFP3n5yUo7ft6avBK/5jQ==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.6"
+        "node": ">= 18"
       }
     },
-    "node_modules/serve-index/node_modules/http-errors": {
-      "version": "1.6.3",
-      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.3.tgz",
-      "integrity": "sha512-lks+lVC8dgGyh97jxvxeYTWQFvh4uw4yC12gVl63Cg30sjPX4wuGcdkICVXDAESr6OJGjqGA8Iz5mkeN6zlD7A==",
+    "node_modules/set-function-length": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz",
+      "integrity": "sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "depd": "~1.1.2",
-        "inherits": "2.0.3",
-        "setprototypeof": "1.1.0",
-        "statuses": ">= 1.4.0 < 2"
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2",
+        "get-intrinsic": "^1.2.4",
+        "gopd": "^1.0.1",
+        "has-property-descriptors": "^1.0.2"
       },
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/serve-index/node_modules/inherits": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
-      "integrity": "sha512-x00IRNXNy63jwGkJmzPigoySHbaqpNuzKbBOmzK+g2OdZpQ9w+sxCN+VSB3ja7IAge2OP2qpfxTjeNcyjmW1uw==",
-      "dev": true,
-      "license": "ISC"
-    },
-    "node_modules/serve-index/node_modules/ms": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/serve-index/node_modules/setprototypeof": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
-      "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ==",
-      "dev": true,
-      "license": "ISC"
+      "engines": {
+        "node": ">= 0.4"
+      }
     },
-    "node_modules/serve-index/node_modules/statuses": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
-      "integrity": "sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA==",
+    "node_modules/set-function-name": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.2.tgz",
+      "integrity": "sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==",
       "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
+        "functions-have-names": "^1.2.3",
+        "has-property-descriptors": "^1.0.2"
+      },
       "engines": {
-        "node": ">= 0.6"
+        "node": ">= 0.4"
       }
     },
-    "node_modules/serve-static": {
-      "version": "1.16.2",
-      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.16.2.tgz",
-      "integrity": "sha512-VqpjJZKadQB/PEbEwvFdO43Ax5dFBZ2UECszz8bQ7pi7wt//PWe1P6MN7eCnjsatYtBT6EuiClbjSWP2WrIoTw==",
+    "node_modules/set-proto": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/set-proto/-/set-proto-1.0.0.tgz",
+      "integrity": "sha512-RJRdvCo6IAnPdsvP/7m6bsQqNnn1FCBX5ZNtFL98MmFF/4xAIJTIg1YbHW5DC2W5SKZanrC6i4HsJqlajw/dZw==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "encodeurl": "~2.0.0",
-        "escape-html": "~1.0.3",
-        "parseurl": "~1.3.3",
-        "send": "0.19.0"
+        "dunder-proto": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0"
       },
       "engines": {
-        "node": ">= 0.8.0"
+        "node": ">= 0.4"
       }
     },
     "node_modules/setprototypeof": {
@@ -17246,19 +20492,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/shell-quote": {
-      "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.8.2.tgz",
-      "integrity": "sha512-AzqKpGKjrj7EM6rKVQEPpB288oCfnrEIuyoT9cyF4nmGa7V8Zk6f7RRqYisX8X9m+Q7bd632aZW4ky7EhbQztA==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
     "node_modules/side-channel": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.1.0.tgz",
@@ -17390,19 +20623,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/slash": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-5.1.0.tgz",
-      "integrity": "sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=14.16"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/slice-ansi": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-5.0.0.tgz",
@@ -17555,36 +20775,14 @@
         }
       }
     },
-    "node_modules/sockjs": {
-      "version": "0.3.24",
-      "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz",
-      "integrity": "sha512-GJgLTZ7vYb/JtPSSZ10hsOYIvEYsjbNU+zPdIHcUaWVNUEPivzxku31865sSSud0Da0W4lEeOPlmw93zLQchuQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "faye-websocket": "^0.11.3",
-        "uuid": "^8.3.2",
-        "websocket-driver": "^0.7.4"
-      }
-    },
-    "node_modules/sockjs/node_modules/uuid": {
-      "version": "8.3.2",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
-      "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
-      "dev": true,
-      "license": "MIT",
-      "bin": {
-        "uuid": "dist/bin/uuid"
-      }
-    },
     "node_modules/socks": {
-      "version": "2.8.4",
-      "resolved": "https://registry.npmjs.org/socks/-/socks-2.8.4.tgz",
-      "integrity": "sha512-D3YaD0aRxR3mEcqnidIs7ReYJFVzWdd6fXJYUM8ixcQcJRGTka/b3saV0KflYhyVJXKhb947GndU35SxYNResQ==",
+      "version": "2.8.7",
+      "resolved": "https://registry.npmjs.org/socks/-/socks-2.8.7.tgz",
+      "integrity": "sha512-HLpt+uLy/pxB+bum/9DzAgiKS8CX1EvbWxI4zlmgGCExImLdiad2iCwXT5Z4c9c3Eq8rP2318mPW2c+QbtjK8A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "ip-address": "^9.0.5",
+        "ip-address": "^10.0.1",
         "smart-buffer": "^4.2.0"
       },
       "engines": {
@@ -17617,45 +20815,170 @@
         "node": ">= 8"
       }
     },
-    "node_modules/source-map-js": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
-      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
-      "license": "BSD-3-Clause",
+    "node_modules/source-map-explorer": {
+      "version": "2.5.3",
+      "resolved": "https://registry.npmjs.org/source-map-explorer/-/source-map-explorer-2.5.3.tgz",
+      "integrity": "sha512-qfUGs7UHsOBE5p/lGfQdaAj/5U/GWYBw2imEpD6UQNkqElYonkow8t+HBL1qqIl3CuGZx7n8/CQo4x1HwSHhsg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "btoa": "^1.2.1",
+        "chalk": "^4.1.0",
+        "convert-source-map": "^1.7.0",
+        "ejs": "^3.1.5",
+        "escape-html": "^1.0.3",
+        "glob": "^7.1.6",
+        "gzip-size": "^6.0.0",
+        "lodash": "^4.17.20",
+        "open": "^7.3.1",
+        "source-map": "^0.7.4",
+        "temp": "^0.9.4",
+        "yargs": "^16.2.0"
+      },
+      "bin": {
+        "sme": "bin/cli.js",
+        "source-map-explorer": "bin/cli.js"
+      },
       "engines": {
-        "node": ">=0.10.0"
+        "node": ">=12"
       }
     },
-    "node_modules/source-map-loader": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-5.0.0.tgz",
-      "integrity": "sha512-k2Dur7CbSLcAH73sBcIkV5xjPV4SzqO1NJ7+XaQl8if3VODDUj3FNchNGpqgJSKbvUfJuhVdv8K2Eu8/TNl2eA==",
+    "node_modules/source-map-explorer/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
       "dev": true,
       "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/source-map-explorer/node_modules/cliui": {
+      "version": "7.0.4",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz",
+      "integrity": "sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==",
+      "dev": true,
+      "license": "ISC",
       "dependencies": {
-        "iconv-lite": "^0.6.3",
-        "source-map-js": "^1.0.2"
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.0",
+        "wrap-ansi": "^7.0.0"
+      }
+    },
+    "node_modules/source-map-explorer/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/source-map-explorer/node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/source-map-explorer/node_modules/open": {
+      "version": "7.4.2",
+      "resolved": "https://registry.npmjs.org/open/-/open-7.4.2.tgz",
+      "integrity": "sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-docker": "^2.0.0",
+        "is-wsl": "^2.1.1"
       },
       "engines": {
-        "node": ">= 18.12.0"
+        "node": ">=8"
       },
       "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/webpack"
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/source-map-explorer/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
       },
-      "peerDependencies": {
-        "webpack": "^5.72.1"
+      "engines": {
+        "node": ">=8"
       }
     },
-    "node_modules/source-map-loader/node_modules/iconv-lite": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
-      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
+    "node_modules/source-map-explorer/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "safer-buffer": ">= 2.1.2 < 3.0.0"
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/source-map-explorer/node_modules/wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/source-map-explorer/node_modules/yargs": {
+      "version": "16.2.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-16.2.0.tgz",
+      "integrity": "sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cliui": "^7.0.2",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.0",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^20.2.2"
       },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/source-map-explorer/node_modules/yargs-parser": {
+      "version": "20.2.9",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.9.tgz",
+      "integrity": "sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/source-map-js": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
+      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
+      "license": "BSD-3-Clause",
       "engines": {
         "node": ">=0.10.0"
       }
@@ -17711,44 +21034,12 @@
       }
     },
     "node_modules/spdx-license-ids": {
-      "version": "3.0.21",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.21.tgz",
-      "integrity": "sha512-Bvg/8F5XephndSK3JffaRqdT+gyhfqIPwDHpX80tJrF8QQRYMo8sNMeaZ2Dp5+jhwKnUmIOyFFQfHRkjJm5nXg==",
+      "version": "3.0.22",
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.22.tgz",
+      "integrity": "sha512-4PRT4nh1EImPbt2jASOKHX7PB7I+e4IWNLvkKFDxNhJlfjbYlleYQh285Z/3mPTHSAK/AvdMmw5BNNuYH8ShgQ==",
       "dev": true,
       "license": "CC0-1.0"
     },
-    "node_modules/spdy": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/spdy/-/spdy-4.0.2.tgz",
-      "integrity": "sha512-r46gZQZQV+Kl9oItvl1JZZqJKGr+oEkB08A6BzkiR7593/7IbtuncXHd2YoYeTsG4157ZssMu9KYvUHLcjcDoA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "debug": "^4.1.0",
-        "handle-thing": "^2.0.0",
-        "http-deceiver": "^1.2.7",
-        "select-hose": "^2.0.0",
-        "spdy-transport": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=6.0.0"
-      }
-    },
-    "node_modules/spdy-transport": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-3.0.0.tgz",
-      "integrity": "sha512-hsLVFE5SjA6TCisWeJXFKniGGOpBgMLmerfO2aCyCU5s7nJ/rpAepqmFifv/GCbSbueEeAJJnmSQ2rKC/g8Fcw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "debug": "^4.1.0",
-        "detect-node": "^2.0.4",
-        "hpack.js": "^2.1.6",
-        "obuf": "^1.1.2",
-        "readable-stream": "^3.0.6",
-        "wbuf": "^1.7.3"
-      }
-    },
     "node_modules/split2": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/split2/-/split2-4.2.0.tgz",
@@ -17759,13 +21050,6 @@
         "node": ">= 10.x"
       }
     },
-    "node_modules/sprintf-js": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.3.tgz",
-      "integrity": "sha512-Oo+0REFV59/rz3gfJNKQiBlwfHaSESl1pcGyABQsnnIfWOFt6JNj5gCog2U6MLZ//IGYD+nA8nI+mTShREReaA==",
-      "dev": true,
-      "license": "BSD-3-Clause"
-    },
     "node_modules/sqlstring": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/sqlstring/-/sqlstring-2.3.3.tgz",
@@ -17789,6 +21073,16 @@
         "node": "^18.17.0 || >=20.5.0"
       }
     },
+    "node_modules/stable-hash-x": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/stable-hash-x/-/stable-hash-x-0.2.0.tgz",
+      "integrity": "sha512-o3yWv49B/o4QZk5ZcsALc6t0+eCelPc44zZsLtCQnZPDwFpDYSWcDnrv2TtMmMbQ7uKo3J0HTURCqckw23czNQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
     "node_modules/statuses": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.1.tgz",
@@ -17811,6 +21105,20 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/stop-iteration-iterator": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/stop-iteration-iterator/-/stop-iteration-iterator-1.1.0.tgz",
+      "integrity": "sha512-eLoXW/DHyl62zxY4SCaIgnRhuMr6ri4juEYARS8E6sCEqzKpOiE521Ucofdx+KnDZl5xmvGYaaKCk5FEOxJCoQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "internal-slot": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/streamroller": {
       "version": "3.1.5",
       "resolved": "https://registry.npmjs.org/streamroller/-/streamroller-3.1.5.tgz",
@@ -17900,19 +21208,78 @@
       "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
       "license": "MIT",
       "engines": {
-        "node": ">=8"
+        "node": ">=8"
+      }
+    },
+    "node_modules/string-width-cjs/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/string.prototype.trim": {
+      "version": "1.2.10",
+      "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.10.tgz",
+      "integrity": "sha512-Rs66F0P/1kedk5lyYyH9uBzuiI/kNRmwJAR9quK6VOtIpZ2G+hMZd+HQbbv25MgCA6gEffoMZYxlTod4WcdrKA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.2",
+        "define-data-property": "^1.1.4",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-object-atoms": "^1.0.0",
+        "has-property-descriptors": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/string.prototype.trimend": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.9.tgz",
+      "integrity": "sha512-G7Ok5C6E/j4SGfyLCloXTrngQIQU3PWtXGst3yM7Bea9FRURf1S42ZHlZZtsNque2FN2PoUhfZXYLNWwEr4dLQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.2",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/string-width-cjs/node_modules/strip-ansi": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
-      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+    "node_modules/string.prototype.trimstart": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.8.tgz",
+      "integrity": "sha512-UXSH262CSZY1tfu3G3Secr6uGLCFVPMhIqHjlgCUtCCcgihYc/xKs9djMTMUOb2j1mVSeU8EU6NWc/iQKU6Gfg==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "ansi-regex": "^5.0.1"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
       },
       "engines": {
-        "node": ">=8"
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/strip-ansi": {
@@ -17952,6 +21319,16 @@
         "node": ">=8"
       }
     },
+    "node_modules/strip-bom": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
+      "integrity": "sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/strip-final-newline": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-3.0.0.tgz",
@@ -17965,6 +21342,19 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/strip-json-comments": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
+      "integrity": "sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/sucrase": {
       "version": "3.35.0",
       "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.35.0.tgz",
@@ -18070,16 +21460,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/symbol-observable": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-4.0.0.tgz",
-      "integrity": "sha512-b19dMThMV4HVFynSAM1++gBHAbk2Tc/osgLIBZMKsyqh34jb2e8Os7T6ZW/Bt3pJFdBTd2JwAnAAEQV7rSNvcQ==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.10"
-      }
-    },
     "node_modules/tailwindcss": {
       "version": "3.4.17",
       "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.17.tgz",
@@ -18196,6 +21576,7 @@
       "integrity": "sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=6"
       }
@@ -18301,6 +21682,34 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/temp": {
+      "version": "0.9.4",
+      "resolved": "https://registry.npmjs.org/temp/-/temp-0.9.4.tgz",
+      "integrity": "sha512-yYrrsWnrXMcdsnu/7YMYAofM1ktpL5By7vZhf15CrXijWWrEYZks5AXBudalfSWJLlnen/QUJUB5aoB0kqZUGA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mkdirp": "^0.5.1",
+        "rimraf": "~2.6.2"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/temp/node_modules/rimraf": {
+      "version": "2.6.3",
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.3.tgz",
+      "integrity": "sha512-mwqeW5XsA2qAejG46gYdENaxXjx9onRNCfn7L0duuP4hCuTIi/QO7PDK07KJfp1d+izWPrzEJDcSqBa0OZQriA==",
+      "deprecated": "Rimraf versions prior to v4 are no longer supported",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "glob": "^7.1.3"
+      },
+      "bin": {
+        "rimraf": "bin.js"
+      }
+    },
     "node_modules/terminal-link": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/terminal-link/-/terminal-link-3.0.0.tgz",
@@ -18348,14 +21757,15 @@
       }
     },
     "node_modules/terser": {
-      "version": "5.39.0",
-      "resolved": "https://registry.npmjs.org/terser/-/terser-5.39.0.tgz",
-      "integrity": "sha512-LBAhFyLho16harJoWMg/nZsQYgTrg5jXOn2nCYjRUcZZEdE3qa2zb8QEDRUGVZBW4rlazf2fxkg8tztybTaqWw==",
+      "version": "5.43.1",
+      "resolved": "https://registry.npmjs.org/terser/-/terser-5.43.1.tgz",
+      "integrity": "sha512-+6erLbBm0+LROX2sPXlUYx/ux5PyE9K/a92Wrt6oA+WDAoFTdpHE5tCYCI5PNzq2y8df4rA+QgHLJuR4jNymsg==",
       "dev": true,
       "license": "BSD-2-Clause",
+      "peer": true,
       "dependencies": {
         "@jridgewell/source-map": "^0.3.3",
-        "acorn": "^8.8.2",
+        "acorn": "^8.14.0",
         "commander": "^2.20.0",
         "source-map-support": "~0.5.20"
       },
@@ -18372,6 +21782,7 @@
       "integrity": "sha512-vkZjpUjb6OMS7dhV+tILUW6BhpDR7P2L/aQSAv+Uwk+m8KATX9EccViHTJR2qDtACKPIYndLGCyl3FMo+r2LMw==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@jridgewell/trace-mapping": "^0.3.25",
         "jest-worker": "^27.4.5",
@@ -18406,7 +21817,8 @@
       "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
       "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/thenify": {
       "version": "3.3.1",
@@ -18429,26 +21841,6 @@
         "node": ">=0.8"
       }
     },
-    "node_modules/thingies": {
-      "version": "1.21.0",
-      "resolved": "https://registry.npmjs.org/thingies/-/thingies-1.21.0.tgz",
-      "integrity": "sha512-hsqsJsFMsV+aD4s3CWKk85ep/3I9XzYV/IXaSouJMYIoDlgyi11cBhsqYe9/geRfB0YIikBQg6raRaM+nIMP9g==",
-      "dev": true,
-      "license": "Unlicense",
-      "engines": {
-        "node": ">=10.18"
-      },
-      "peerDependencies": {
-        "tslib": "^2"
-      }
-    },
-    "node_modules/thunky": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/thunky/-/thunky-1.1.0.tgz",
-      "integrity": "sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/tiny-inflate": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/tiny-inflate/-/tiny-inflate-1.0.3.tgz",
@@ -18463,6 +21855,23 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/tinyglobby": {
+      "version": "0.2.14",
+      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.14.tgz",
+      "integrity": "sha512-tX5e7OM1HnYr2+a2C/4V0htOcSQcoSTH9KgJnVvNm5zm/cyEWKJ7j7YutsH9CxMdtOkkLFy2AHrMci9IM8IPZQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fdir": "^6.4.4",
+        "picomatch": "^4.0.2"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/SuperchupuDev"
+      }
+    },
     "node_modules/tmp": {
       "version": "0.0.33",
       "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
@@ -18513,31 +21922,17 @@
       "integrity": "sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==",
       "license": "MIT"
     },
-    "node_modules/tree-dump": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/tree-dump/-/tree-dump-1.0.2.tgz",
-      "integrity": "sha512-dpev9ABuLWdEubk+cIaI9cHwRNNDjkBBLXTwI4UCUFdQ5xXKqNXoK4FEciw/vxf+NQ7Cb7sGUyeUtORvHIdRXQ==",
+    "node_modules/ts-api-utils": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.1.0.tgz",
+      "integrity": "sha512-CUgTZL1irw8u29bzrOD/nH85jqyc74D6SshFgujOIA7osm2Rz7dYH77agkx7H4FBNxDq7Cjf+IjaX/8zwFW+ZQ==",
       "dev": true,
-      "license": "Apache-2.0",
+      "license": "MIT",
       "engines": {
-        "node": ">=10.0"
-      },
-      "funding": {
-        "type": "github",
-        "url": "https://github.com/sponsors/streamich"
+        "node": ">=18.12"
       },
       "peerDependencies": {
-        "tslib": "2"
-      }
-    },
-    "node_modules/tree-kill": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/tree-kill/-/tree-kill-1.2.2.tgz",
-      "integrity": "sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A==",
-      "dev": true,
-      "license": "MIT",
-      "bin": {
-        "tree-kill": "cli.js"
+        "typescript": ">=4.8.4"
       }
     },
     "node_modules/ts-interface-checker": {
@@ -18597,92 +21992,407 @@
       "devOptional": true,
       "license": "MIT"
     },
+    "node_modules/tsconfig-paths": {
+      "version": "3.15.0",
+      "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.15.0.tgz",
+      "integrity": "sha512-2Ac2RgzDe/cn48GvOe3M+o82pEFewD3UPbyoUHHdKasHwJKjds4fLXWf/Ux5kATBKN20oaFGu+jbElp1pos0mg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/json5": "^0.0.29",
+        "json5": "^1.0.2",
+        "minimist": "^1.2.6",
+        "strip-bom": "^3.0.0"
+      }
+    },
+    "node_modules/tsconfig-paths/node_modules/json5": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
+      "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "minimist": "^1.2.0"
+      },
+      "bin": {
+        "json5": "lib/cli.js"
+      }
+    },
     "node_modules/tslib": {
       "version": "2.8.1",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
       "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
       "license": "0BSD"
     },
-    "node_modules/tsx": {
-      "version": "4.19.4",
-      "resolved": "https://registry.npmjs.org/tsx/-/tsx-4.19.4.tgz",
-      "integrity": "sha512-gK5GVzDkJK1SI1zwHf32Mqxf2tSJkNx+eYcNly5+nHvWqXUJYUkWBQtKauoESz3ymezAI++ZwT855x5p5eop+Q==",
+    "node_modules/tsx": {
+      "version": "4.19.4",
+      "resolved": "https://registry.npmjs.org/tsx/-/tsx-4.19.4.tgz",
+      "integrity": "sha512-gK5GVzDkJK1SI1zwHf32Mqxf2tSJkNx+eYcNly5+nHvWqXUJYUkWBQtKauoESz3ymezAI++ZwT855x5p5eop+Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "esbuild": "~0.25.0",
+        "get-tsconfig": "^4.7.5"
+      },
+      "bin": {
+        "tsx": "dist/cli.mjs"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
+      }
+    },
+    "node_modules/tuf-js": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/tuf-js/-/tuf-js-3.1.0.tgz",
+      "integrity": "sha512-3T3T04WzowbwV2FDiGXBbr81t64g1MUGGJRgT4x5o97N+8ArdhVCAF9IxFrxuSJmM3E5Asn7nKHkao0ibcZXAg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@tufjs/models": "3.0.1",
+        "debug": "^4.4.1",
+        "make-fetch-happen": "^14.0.3"
+      },
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
+    "node_modules/type-check": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
+      "integrity": "sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "prelude-ls": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/type-fest": {
+      "version": "0.21.3",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz",
+      "integrity": "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==",
+      "dev": true,
+      "license": "(MIT OR CC0-1.0)",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/type-is": {
+      "version": "1.6.18",
+      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
+      "integrity": "sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "media-typer": "0.3.0",
+        "mime-types": "~2.1.24"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/typed-array-buffer": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.3.tgz",
+      "integrity": "sha512-nAYYwfY3qnzX30IkA6AQZjVbtK6duGontcQm1WSG1MD94YLqK0515GNApXkoxKOWMusVssAHWLh9SeaoefYFGw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "es-errors": "^1.3.0",
+        "is-typed-array": "^1.1.14"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/typed-array-byte-length": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.3.tgz",
+      "integrity": "sha512-BaXgOuIxz8n8pIq3e7Atg/7s+DpiYrxn4vdot3w9KbnBhcRQq6o3xemQdIfynqSeXeDrF32x+WvfzmOjPiY9lg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "for-each": "^0.3.3",
+        "gopd": "^1.2.0",
+        "has-proto": "^1.2.0",
+        "is-typed-array": "^1.1.14"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/typed-array-byte-offset": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.4.tgz",
+      "integrity": "sha512-bTlAFB/FBYMcuX81gbL4OcpH5PmlFHqlCCpAl8AlEzMz5k53oNDvN8p1PNOWLEmI2x4orp3raOFB51tv9X+MFQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.8",
+        "for-each": "^0.3.3",
+        "gopd": "^1.2.0",
+        "has-proto": "^1.2.0",
+        "is-typed-array": "^1.1.15",
+        "reflect.getprototypeof": "^1.0.9"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/typed-array-length": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.7.tgz",
+      "integrity": "sha512-3KS2b+kL7fsuk/eJZ7EQdnEmQoaho/r6KUef7hxvltNA5DR8NAUM+8wJMbJyZ4G9/7i3v5zPBIMN5aybAh2/Jg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "for-each": "^0.3.3",
+        "gopd": "^1.0.1",
+        "is-typed-array": "^1.1.13",
+        "possible-typed-array-names": "^1.0.0",
+        "reflect.getprototypeof": "^1.0.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/typescript": {
+      "version": "5.8.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.3.tgz",
+      "integrity": "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==",
+      "devOptional": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "tsc": "bin/tsc",
+        "tsserver": "bin/tsserver"
+      },
+      "engines": {
+        "node": ">=14.17"
+      }
+    },
+    "node_modules/typescript-eslint": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.34.1.tgz",
+      "integrity": "sha512-XjS+b6Vg9oT1BaIUfkW3M3LvqZE++rbzAMEHuccCfO/YkP43ha6w3jTEMilQxMF92nVOYCcdjv1ZUhAa1D/0ow==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/eslint-plugin": "8.34.1",
+        "@typescript-eslint/parser": "8.34.1",
+        "@typescript-eslint/utils": "8.34.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <5.9.0"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/project-service": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.34.1.tgz",
+      "integrity": "sha512-nuHlOmFZfuRwLJKDGQOVc0xnQrAmuq1Mj/ISou5044y1ajGNp2BNliIqp7F2LPQ5sForz8lempMFCovfeS1XoA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/tsconfig-utils": "^8.34.1",
+        "@typescript-eslint/types": "^8.34.1",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.34.1.tgz",
+      "integrity": "sha512-beu6o6QY4hJAgL1E8RaXNC071G4Kso2MGmJskCFQhRhg8VOH/FDbC8soP8NHN7e/Hdphwp8G8cE6OBzC8o41ZA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "esbuild": "~0.25.0",
-        "get-tsconfig": "^4.7.5"
+        "@typescript-eslint/types": "8.34.1",
+        "@typescript-eslint/visitor-keys": "8.34.1"
       },
-      "bin": {
-        "tsx": "dist/cli.mjs"
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.34.1.tgz",
+      "integrity": "sha512-K4Sjdo4/xF9NEeA2khOb7Y5nY6NSXBnod87uniVYW9kHP+hNlDV8trUSFeynA2uxWam4gIWgWoygPrv9VMWrYg==",
+      "dev": true,
+      "license": "MIT",
       "engines": {
-        "node": ">=18.0.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
-      "optionalDependencies": {
-        "fsevents": "~2.3.3"
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/tuf-js": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/tuf-js/-/tuf-js-3.0.1.tgz",
-      "integrity": "sha512-+68OP1ZzSF84rTckf3FA95vJ1Zlx/uaXyiiKyPd1pA4rZNkpEvDAKmsu1xUSmbF/chCRYgZ6UZkDwC7PmzmAyA==",
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/types": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.34.1.tgz",
+      "integrity": "sha512-rjLVbmE7HR18kDsjNIZQHxmv9RZwlgzavryL5Lnj2ujIRTeXlKtILHgRNmQ3j4daw7zd+mQgy+uyt6Zo6I0IGA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.34.1.tgz",
+      "integrity": "sha512-rjCNqqYPuMUF5ODD+hWBNmOitjBWghkGKJg6hiCHzUvXRy6rK22Jd3rwbP2Xi+R7oYVvIKhokHVhH41BxPV5mA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@tufjs/models": "3.0.1",
-        "debug": "^4.3.6",
-        "make-fetch-happen": "^14.0.1"
+        "@typescript-eslint/project-service": "8.34.1",
+        "@typescript-eslint/tsconfig-utils": "8.34.1",
+        "@typescript-eslint/types": "8.34.1",
+        "@typescript-eslint/visitor-keys": "8.34.1",
+        "debug": "^4.3.4",
+        "fast-glob": "^3.3.2",
+        "is-glob": "^4.0.3",
+        "minimatch": "^9.0.4",
+        "semver": "^7.6.0",
+        "ts-api-utils": "^2.1.0"
       },
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/type-fest": {
-      "version": "0.21.3",
-      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz",
-      "integrity": "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==",
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/utils": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.34.1.tgz",
+      "integrity": "sha512-mqOwUdZ3KjtGk7xJJnLbHxTuWVn3GO2WZZuM+Slhkun4+qthLdXx32C8xIXbO1kfCECb3jIs3eoxK3eryk7aoQ==",
       "dev": true,
-      "license": "(MIT OR CC0-1.0)",
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.7.0",
+        "@typescript-eslint/scope-manager": "8.34.1",
+        "@typescript-eslint/types": "8.34.1",
+        "@typescript-eslint/typescript-estree": "8.34.1"
+      },
       "engines": {
-        "node": ">=10"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
-    "node_modules/type-is": {
-      "version": "1.6.18",
-      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
-      "integrity": "sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==",
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.34.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.34.1.tgz",
+      "integrity": "sha512-xoh5rJ+tgsRKoXnkBPFRLZ7rjKM0AfVbC68UZ/ECXoDbfggb9RbEySN359acY1vS3qZ0jVTVWzbtfapwm5ztxw==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "media-typer": "0.3.0",
-        "mime-types": "~2.1.24"
+        "@typescript-eslint/types": "8.34.1",
+        "eslint-visitor-keys": "^4.2.1"
       },
       "engines": {
-        "node": ">= 0.6"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/typed-assert": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/typed-assert/-/typed-assert-1.0.9.tgz",
-      "integrity": "sha512-KNNZtayBCtmnNmbo5mG47p1XsCyrx6iVqomjcZnec/1Y5GGARaxPs6r49RnSPeUP3YjNYiU9sQHAtY4BBvnZwg==",
+    "node_modules/typescript-eslint/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
     },
-    "node_modules/typescript": {
-      "version": "5.7.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.7.3.tgz",
-      "integrity": "sha512-84MVSjMEHP+FQRPy3pX9sTVV/INIex71s9TL2Gm5FG/WG1SqXeKyZ0k7/blY/4FdOzI12CBy1vGc4og/eus0fw==",
-      "devOptional": true,
+    "node_modules/typescript-eslint/node_modules/eslint-visitor-keys": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
+      "dev": true,
       "license": "Apache-2.0",
-      "bin": {
-        "tsc": "bin/tsc",
-        "tsserver": "bin/tsserver"
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
       },
       "engines": {
-        "node": ">=14.17"
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
       }
     },
     "node_modules/ua-parser-js": {
@@ -18719,45 +22429,30 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/undici-types": {
-      "version": "5.26.5",
-      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
-      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
-      "license": "MIT"
-    },
-    "node_modules/unicode-canonical-property-names-ecmascript": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.1.tgz",
-      "integrity": "sha512-dA8WbNeb2a6oQzAQ55YlT5vQAWGV9WXOsi3SskE3bcCdM0P4SDd+24zS/OCacdRq5BkdsRj9q3Pg6YyQoxIGqg==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/unicode-match-property-ecmascript": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/unicode-match-property-ecmascript/-/unicode-match-property-ecmascript-2.0.0.tgz",
-      "integrity": "sha512-5kaZCrbp5mmbz5ulBkDkbY0SsPOjKqVS35VpL9ulMPfSl0J0Xsm+9Evphv9CoIZFwre7aJoa94AY6seMKGVN5Q==",
+    "node_modules/unbox-primitive": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.1.0.tgz",
+      "integrity": "sha512-nWJ91DjeOkej/TA8pXQ3myruKpKEYgqvpw9lz4OPHj/NWFNluYrjbz9j01CJ8yKQd2g4jFoOkINCTW2I5LEEyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "unicode-canonical-property-names-ecmascript": "^2.0.0",
-        "unicode-property-aliases-ecmascript": "^2.0.0"
+        "call-bound": "^1.0.3",
+        "has-bigints": "^1.0.2",
+        "has-symbols": "^1.1.0",
+        "which-boxed-primitive": "^1.1.1"
       },
       "engines": {
-        "node": ">=4"
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/unicode-match-property-value-ecmascript": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/unicode-match-property-value-ecmascript/-/unicode-match-property-value-ecmascript-2.2.0.tgz",
-      "integrity": "sha512-4IehN3V/+kkr5YeSSDDQG8QLqO26XpL2XP3GQtqwlT/QYSECAwFztxVHjlbh0+gjJ3XmNLS0zDsbgs9jWKExLg==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=4"
-      }
+    "node_modules/undici-types": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz",
+      "integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==",
+      "license": "MIT"
     },
     "node_modules/unicode-properties": {
       "version": "1.4.1",
@@ -18770,16 +22465,6 @@
         "unicode-trie": "^2.0.0"
       }
     },
-    "node_modules/unicode-property-aliases-ecmascript": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-2.1.0.tgz",
-      "integrity": "sha512-6t3foTQI9qne+OZoVQB/8x8rk2k1eVy1gRXhV3oFQ5T6R1dqQ1xtin3XqSlx3+ATBkliTaR/hHyJBm+LVPNM8w==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/unicode-trie": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/unicode-trie/-/unicode-trie-2.0.0.tgz",
@@ -18798,17 +22483,16 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/unicorn-magic": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.3.0.tgz",
-      "integrity": "sha512-+QBBXBCvifc56fsbuxZQ6Sic3wqqc3WWaqxs58gvJrcOuN83HGTCwz3oS5phzU9LthRNE9VrJCFCLUgHeeFnfA==",
+    "node_modules/union": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/union/-/union-0.5.0.tgz",
+      "integrity": "sha512-N6uOhuW6zO95P3Mel2I2zMsbsanvvtgn6jVqJv4vbVcz/JN0OkL9suomjQGmWtxJQXOCqUJvquc1sMeNz/IwlA==",
       "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=18"
+      "dependencies": {
+        "qs": "^6.4.0"
       },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+      "engines": {
+        "node": ">= 0.8.0"
       }
     },
     "node_modules/unique-filename": {
@@ -18856,6 +22540,41 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/unrs-resolver": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/unrs-resolver/-/unrs-resolver-1.11.1.tgz",
+      "integrity": "sha512-bSjt9pjaEBnNiGgc9rUiHGKv5l4/TGzDmYw3RhnkJGtLhbnnA/5qJj7x3dNDCRx/PJxu774LlH8lCOlB4hEfKg==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "dependencies": {
+        "napi-postinstall": "^0.3.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/unrs-resolver"
+      },
+      "optionalDependencies": {
+        "@unrs/resolver-binding-android-arm-eabi": "1.11.1",
+        "@unrs/resolver-binding-android-arm64": "1.11.1",
+        "@unrs/resolver-binding-darwin-arm64": "1.11.1",
+        "@unrs/resolver-binding-darwin-x64": "1.11.1",
+        "@unrs/resolver-binding-freebsd-x64": "1.11.1",
+        "@unrs/resolver-binding-linux-arm-gnueabihf": "1.11.1",
+        "@unrs/resolver-binding-linux-arm-musleabihf": "1.11.1",
+        "@unrs/resolver-binding-linux-arm64-gnu": "1.11.1",
+        "@unrs/resolver-binding-linux-arm64-musl": "1.11.1",
+        "@unrs/resolver-binding-linux-ppc64-gnu": "1.11.1",
+        "@unrs/resolver-binding-linux-riscv64-gnu": "1.11.1",
+        "@unrs/resolver-binding-linux-riscv64-musl": "1.11.1",
+        "@unrs/resolver-binding-linux-s390x-gnu": "1.11.1",
+        "@unrs/resolver-binding-linux-x64-gnu": "1.11.1",
+        "@unrs/resolver-binding-linux-x64-musl": "1.11.1",
+        "@unrs/resolver-binding-wasm32-wasi": "1.11.1",
+        "@unrs/resolver-binding-win32-arm64-msvc": "1.11.1",
+        "@unrs/resolver-binding-win32-ia32-msvc": "1.11.1",
+        "@unrs/resolver-binding-win32-x64-msvc": "1.11.1"
+      }
+    },
     "node_modules/update-browserslist-db": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.3.tgz",
@@ -18887,6 +22606,26 @@
         "browserslist": ">= 4.21.0"
       }
     },
+    "node_modules/uri-js": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
+      "integrity": "sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "punycode": "^2.1.0"
+      }
+    },
+    "node_modules/uri-js/node_modules/punycode": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
+      "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/urijs": {
       "version": "1.19.11",
       "resolved": "https://registry.npmjs.org/urijs/-/urijs-1.19.11.tgz",
@@ -18894,6 +22633,13 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/url-join": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/url-join/-/url-join-4.0.1.tgz",
+      "integrity": "sha512-jk1+QP6ZJqyOiuEI9AEWQfju/nB2Pw466kbA0LEZljHwKeMgd9WrAEgEGxjPDD2+TNbbb37rTyhEfrCXfuKXnA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -18904,6 +22650,7 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
       "integrity": "sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA==",
+      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 0.4.0"
@@ -18948,9 +22695,9 @@
       }
     },
     "node_modules/validate-npm-package-name": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/validate-npm-package-name/-/validate-npm-package-name-6.0.0.tgz",
-      "integrity": "sha512-d7KLgL1LD3U3fgnvWEY1cQXoO/q6EQ1BSz48Sa149V/5zVTAbgmZIpyI8TRi6U9/JNyeYLlTKsEMPtLC27RFUg==",
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/validate-npm-package-name/-/validate-npm-package-name-6.0.2.tgz",
+      "integrity": "sha512-IUoow1YUtvoBBC06dXs8bR8B9vuA3aJfmQNKMoaPG/OFsPmoQvw8xh+6Ye25Gx9DQhoEom3Pcu9MKHerm/NpUQ==",
       "dev": true,
       "license": "ISC",
       "engines": {
@@ -18961,82 +22708,9 @@
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
       "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/vite": {
-      "version": "6.2.1",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-6.2.1.tgz",
-      "integrity": "sha512-n2GnqDb6XPhlt9B8olZPrgMD/es/Nd1RdChF6CBD/fHW6pUyUTt2sQW2fPRX5GiD9XEa6+8A6A4f2vT6pSsE7Q==",
-      "dev": true,
-      "license": "MIT",
-      "peer": true,
-      "dependencies": {
-        "esbuild": "^0.25.0",
-        "postcss": "^8.5.3",
-        "rollup": "^4.30.1"
-      },
-      "bin": {
-        "vite": "bin/vite.js"
-      },
-      "engines": {
-        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
-      },
-      "funding": {
-        "url": "https://github.com/vitejs/vite?sponsor=1"
-      },
-      "optionalDependencies": {
-        "fsevents": "~2.3.3"
-      },
-      "peerDependencies": {
-        "@types/node": "^18.0.0 || ^20.0.0 || >=22.0.0",
-        "jiti": ">=1.21.0",
-        "less": "*",
-        "lightningcss": "^1.21.0",
-        "sass": "*",
-        "sass-embedded": "*",
-        "stylus": "*",
-        "sugarss": "*",
-        "terser": "^5.16.0",
-        "tsx": "^4.8.1",
-        "yaml": "^2.4.2"
-      },
-      "peerDependenciesMeta": {
-        "@types/node": {
-          "optional": true
-        },
-        "jiti": {
-          "optional": true
-        },
-        "less": {
-          "optional": true
-        },
-        "lightningcss": {
-          "optional": true
-        },
-        "sass": {
-          "optional": true
-        },
-        "sass-embedded": {
-          "optional": true
-        },
-        "stylus": {
-          "optional": true
-        },
-        "sugarss": {
-          "optional": true
-        },
-        "terser": {
-          "optional": true
-        },
-        "tsx": {
-          "optional": true
-        },
-        "yaml": {
-          "optional": true
-        }
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
       }
     },
     "node_modules/void-elements": {
@@ -19050,9 +22724,9 @@
       }
     },
     "node_modules/watchpack": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.2.tgz",
-      "integrity": "sha512-TnbFSbcOCcDgjZ4piURLCbJ3nJhznVh9kw6F6iokjiFPl8ONxe9A6nMDVXDiNbrSfLILs6vB07F7wLBrwPYzJw==",
+      "version": "2.4.4",
+      "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.4.tgz",
+      "integrity": "sha512-c5EGNOiyxxV5qmTtAB7rbiXxi1ooX1pQKMLX/MIabJjRA0SJBQOjKF+KSVfHkr9U1cADPon0mRiVe/riyaiDUA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -19063,16 +22737,6 @@
         "node": ">=10.13.0"
       }
     },
-    "node_modules/wbuf": {
-      "version": "1.7.3",
-      "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.3.tgz",
-      "integrity": "sha512-O84QOnr0icsbFGLS0O3bI5FswxzRr8/gHwWkDlQFskhSPryQXvrTMxjxGP4+iWYoauLoBvfDpkrOauZ+0iZpDA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "minimalistic-assert": "^1.0.0"
-      }
-    },
     "node_modules/wcwidth": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/wcwidth/-/wcwidth-1.0.1.tgz",
@@ -19107,14 +22771,16 @@
       "license": "BSD-2-Clause"
     },
     "node_modules/webpack": {
-      "version": "5.98.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.98.0.tgz",
-      "integrity": "sha512-UFynvx+gM44Gv9qFgj0acCQK2VE1CtdfwFdimkapco3hlPCJ/zeq73n2yVKimVbtm+TnApIugGhLJnkU6gjYXA==",
+      "version": "5.99.9",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.99.9.tgz",
+      "integrity": "sha512-brOPwM3JnmOa+7kd3NsmOUOwbDAj8FT9xDsG3IW0MgbN9yZV7Oi/s/+MNQ/EcSMqw7qfoRyXPoeEWT8zLVdVGg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/eslint-scope": "^3.7.7",
         "@types/estree": "^1.0.6",
+        "@types/json-schema": "^7.0.15",
         "@webassemblyjs/ast": "^1.14.1",
         "@webassemblyjs/wasm-edit": "^1.14.1",
         "@webassemblyjs/wasm-parser": "^1.14.1",
@@ -19131,7 +22797,7 @@
         "loader-runner": "^4.2.0",
         "mime-types": "^2.1.27",
         "neo-async": "^2.6.2",
-        "schema-utils": "^4.3.0",
+        "schema-utils": "^4.3.2",
         "tapable": "^2.1.1",
         "terser-webpack-plugin": "^5.3.11",
         "watchpack": "^2.4.1",
@@ -19303,314 +22969,161 @@
         "node": ">=10.0.0"
       }
     },
-    "node_modules/webpack-dev-middleware": {
-      "version": "7.4.2",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-7.4.2.tgz",
-      "integrity": "sha512-xOO8n6eggxnwYpy1NlzUKpvrjfJTvae5/D6WOK0S2LSo7vjmo5gCM1DbLUmFqrMTJP+W/0YZNctm7jasWvLuBA==",
+    "node_modules/webpack-sources": {
+      "version": "3.2.3",
+      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.3.tgz",
+      "integrity": "sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "colorette": "^2.0.10",
-        "memfs": "^4.6.0",
-        "mime-types": "^2.1.31",
-        "on-finished": "^2.4.1",
-        "range-parser": "^1.2.1",
-        "schema-utils": "^4.0.0"
-      },
+      "peer": true,
       "engines": {
-        "node": ">= 18.12.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/webpack"
-      },
-      "peerDependencies": {
-        "webpack": "^5.0.0"
-      },
-      "peerDependenciesMeta": {
-        "webpack": {
-          "optional": true
-        }
+        "node": ">=10.13.0"
       }
     },
-    "node_modules/webpack-dev-server": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-5.2.0.tgz",
-      "integrity": "sha512-90SqqYXA2SK36KcT6o1bvwvZfJFcmoamqeJY7+boioffX9g9C0wjjJRGUrQIuh43pb0ttX7+ssavmj/WN2RHtA==",
+    "node_modules/webpack/node_modules/json-parse-even-better-errors": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
+      "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@types/bonjour": "^3.5.13",
-        "@types/connect-history-api-fallback": "^1.5.4",
-        "@types/express": "^4.17.21",
-        "@types/serve-index": "^1.9.4",
-        "@types/serve-static": "^1.15.5",
-        "@types/sockjs": "^0.3.36",
-        "@types/ws": "^8.5.10",
-        "ansi-html-community": "^0.0.8",
-        "bonjour-service": "^1.2.1",
-        "chokidar": "^3.6.0",
-        "colorette": "^2.0.10",
-        "compression": "^1.7.4",
-        "connect-history-api-fallback": "^2.0.0",
-        "express": "^4.21.2",
-        "graceful-fs": "^4.2.6",
-        "http-proxy-middleware": "^2.0.7",
-        "ipaddr.js": "^2.1.0",
-        "launch-editor": "^2.6.1",
-        "open": "^10.0.3",
-        "p-retry": "^6.2.0",
-        "schema-utils": "^4.2.0",
-        "selfsigned": "^2.4.1",
-        "serve-index": "^1.9.1",
-        "sockjs": "^0.3.24",
-        "spdy": "^4.0.2",
-        "webpack-dev-middleware": "^7.4.2",
-        "ws": "^8.18.0"
-      },
-      "bin": {
-        "webpack-dev-server": "bin/webpack-dev-server.js"
-      },
-      "engines": {
-        "node": ">= 18.12.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/webpack"
-      },
-      "peerDependencies": {
-        "webpack": "^5.0.0"
-      },
-      "peerDependenciesMeta": {
-        "webpack": {
-          "optional": true
-        },
-        "webpack-cli": {
-          "optional": true
-        }
-      }
+      "peer": true
     },
-    "node_modules/webpack-dev-server/node_modules/chokidar": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
-      "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
+    "node_modules/whatwg-encoding": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-2.0.0.tgz",
+      "integrity": "sha512-p41ogyeMUrw3jWclHWTQg1k05DSVXPLcVxRTYsXUk+ZooOCZLcoYgPZ/HL/D/N+uQPOtcp1me1WhBEaX02mhWg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "anymatch": "~3.1.2",
-        "braces": "~3.0.2",
-        "glob-parent": "~5.1.2",
-        "is-binary-path": "~2.1.0",
-        "is-glob": "~4.0.1",
-        "normalize-path": "~3.0.0",
-        "readdirp": "~3.6.0"
-      },
-      "engines": {
-        "node": ">= 8.10.0"
-      },
-      "funding": {
-        "url": "https://paulmillr.com/funding/"
-      },
-      "optionalDependencies": {
-        "fsevents": "~2.3.2"
-      }
-    },
-    "node_modules/webpack-dev-server/node_modules/glob-parent": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
-      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "is-glob": "^4.0.1"
+        "iconv-lite": "0.6.3"
       },
       "engines": {
-        "node": ">= 6"
+        "node": ">=12"
       }
     },
-    "node_modules/webpack-dev-server/node_modules/http-proxy-middleware": {
-      "version": "2.0.7",
-      "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-2.0.7.tgz",
-      "integrity": "sha512-fgVY8AV7qU7z/MmXJ/rxwbrtQH4jBQ9m7kp3llF0liB7glmFeVZFBepQb32T3y8n8k2+AEYuMPCpinYW+/CuRA==",
+    "node_modules/whatwg-encoding/node_modules/iconv-lite": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
+      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@types/http-proxy": "^1.17.8",
-        "http-proxy": "^1.18.1",
-        "is-glob": "^4.0.1",
-        "is-plain-obj": "^3.0.0",
-        "micromatch": "^4.0.2"
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
       },
       "engines": {
-        "node": ">=12.0.0"
-      },
-      "peerDependencies": {
-        "@types/express": "^4.17.13"
-      },
-      "peerDependenciesMeta": {
-        "@types/express": {
-          "optional": true
-        }
+        "node": ">=0.10.0"
       }
     },
-    "node_modules/webpack-dev-server/node_modules/ipaddr.js": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-2.2.0.tgz",
-      "integrity": "sha512-Ag3wB2o37wslZS19hZqorUnrnzSkpOVy+IiiDEiTqNubEYpYuHWIf6K4psgN2ZWKExS4xhVCrRVfb/wfW8fWJA==",
-      "dev": true,
+    "node_modules/whatwg-url": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz",
+      "integrity": "sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==",
       "license": "MIT",
-      "engines": {
-        "node": ">= 10"
+      "dependencies": {
+        "tr46": "~0.0.3",
+        "webidl-conversions": "^3.0.0"
       }
     },
-    "node_modules/webpack-dev-server/node_modules/picomatch": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
-      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+    "node_modules/which": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
+      "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
       "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=8.6"
+      "license": "ISC",
+      "dependencies": {
+        "isexe": "^2.0.0"
       },
-      "funding": {
-        "url": "https://github.com/sponsors/jonschlinkert"
+      "bin": {
+        "which": "bin/which"
       }
     },
-    "node_modules/webpack-dev-server/node_modules/readdirp": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
-      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+    "node_modules/which-boxed-primitive": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.1.1.tgz",
+      "integrity": "sha512-TbX3mj8n0odCBFVlY8AxkqcHASw3L60jIuF8jFP78az3C2YhmGvqbHBpAjTRH2/xqYunrJ9g1jSyjCjpoWzIAA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "picomatch": "^2.2.1"
+        "is-bigint": "^1.1.0",
+        "is-boolean-object": "^1.2.1",
+        "is-number-object": "^1.1.1",
+        "is-string": "^1.1.1",
+        "is-symbol": "^1.1.1"
       },
       "engines": {
-        "node": ">=8.10.0"
-      }
-    },
-    "node_modules/webpack-dev-server/node_modules/ws": {
-      "version": "8.18.1",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.1.tgz",
-      "integrity": "sha512-RKW2aJZMXeMxVpnZ6bck+RswznaxmzdULiBr6KY7XkTnW8uvt0iT9H5DkHUChXrc+uurzwa0rVI16n/Xzjdz1w==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10.0.0"
-      },
-      "peerDependencies": {
-        "bufferutil": "^4.0.1",
-        "utf-8-validate": ">=5.0.2"
+        "node": ">= 0.4"
       },
-      "peerDependenciesMeta": {
-        "bufferutil": {
-          "optional": true
-        },
-        "utf-8-validate": {
-          "optional": true
-        }
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/webpack-merge": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/webpack-merge/-/webpack-merge-6.0.1.tgz",
-      "integrity": "sha512-hXXvrjtx2PLYx4qruKl+kyRSLc52V+cCvMxRjmKwoA+CBbbF5GfIBtR6kCvl0fYGqTUPKB+1ktVmTHqMOzgCBg==",
+    "node_modules/which-builtin-type": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/which-builtin-type/-/which-builtin-type-1.2.1.tgz",
+      "integrity": "sha512-6iBczoX+kDQ7a3+YJBnh3T+KZRxM/iYNPXicqk66/Qfm1b93iu+yOImkg0zHbj5LNOcNv1TEADiZ0xa34B4q6Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "clone-deep": "^4.0.1",
-        "flat": "^5.0.2",
-        "wildcard": "^2.0.1"
+        "call-bound": "^1.0.2",
+        "function.prototype.name": "^1.1.6",
+        "has-tostringtag": "^1.0.2",
+        "is-async-function": "^2.0.0",
+        "is-date-object": "^1.1.0",
+        "is-finalizationregistry": "^1.1.0",
+        "is-generator-function": "^1.0.10",
+        "is-regex": "^1.2.1",
+        "is-weakref": "^1.0.2",
+        "isarray": "^2.0.5",
+        "which-boxed-primitive": "^1.1.0",
+        "which-collection": "^1.0.2",
+        "which-typed-array": "^1.1.16"
       },
       "engines": {
-        "node": ">=18.0.0"
-      }
-    },
-    "node_modules/webpack-sources": {
-      "version": "3.2.3",
-      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.3.tgz",
-      "integrity": "sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10.13.0"
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/webpack-subresource-integrity": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/webpack-subresource-integrity/-/webpack-subresource-integrity-5.1.0.tgz",
-      "integrity": "sha512-sacXoX+xd8r4WKsy9MvH/q/vBtEHr86cpImXwyg74pFIpERKt6FmB8cXpeuh0ZLgclOlHI4Wcll7+R5L02xk9Q==",
+    "node_modules/which-collection": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.2.tgz",
+      "integrity": "sha512-K4jVyjnBdgvc86Y6BkaLZEN933SwYOuBFkdmBu9ZfkcAbdVbpITnDmjvZ/aQjRXQrv5EPkTnD1s39GiiqbngCw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "typed-assert": "^1.0.8"
+        "is-map": "^2.0.3",
+        "is-set": "^2.0.3",
+        "is-weakmap": "^2.0.2",
+        "is-weakset": "^2.0.3"
       },
       "engines": {
-        "node": ">= 12"
-      },
-      "peerDependencies": {
-        "html-webpack-plugin": ">= 5.0.0-beta.1 < 6",
-        "webpack": "^5.12.0"
+        "node": ">= 0.4"
       },
-      "peerDependenciesMeta": {
-        "html-webpack-plugin": {
-          "optional": true
-        }
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/webpack/node_modules/json-parse-even-better-errors": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
-      "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/websocket-driver": {
-      "version": "0.7.4",
-      "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz",
-      "integrity": "sha512-b17KeDIQVjvb0ssuSDF2cYXSg2iztliJ4B9WdsuB6J952qCPKmnVq4DyW5motImXHDC1cBT/1UezrJVsKw5zjg==",
+    "node_modules/which-typed-array": {
+      "version": "1.1.19",
+      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.19.tgz",
+      "integrity": "sha512-rEvr90Bck4WZt9HHFC4DJMsjvu7x+r6bImz0/BrbWb7A2djJ8hnZMrWnHo9F8ssv0OMErasDhftrfROTyqSDrw==",
       "dev": true,
-      "license": "Apache-2.0",
+      "license": "MIT",
       "dependencies": {
-        "http-parser-js": ">=0.5.1",
-        "safe-buffer": ">=5.1.0",
-        "websocket-extensions": ">=0.1.1"
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "for-each": "^0.3.5",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-tostringtag": "^1.0.2"
       },
       "engines": {
-        "node": ">=0.8.0"
-      }
-    },
-    "node_modules/websocket-extensions": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.4.tgz",
-      "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==",
-      "dev": true,
-      "license": "Apache-2.0",
-      "engines": {
-        "node": ">=0.8.0"
-      }
-    },
-    "node_modules/whatwg-url": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz",
-      "integrity": "sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==",
-      "license": "MIT",
-      "dependencies": {
-        "tr46": "~0.0.3",
-        "webidl-conversions": "^3.0.0"
-      }
-    },
-    "node_modules/which": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
-      "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "isexe": "^2.0.0"
+        "node": ">= 0.4"
       },
-      "bin": {
-        "which": "bin/which"
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/wildcard": {
@@ -19620,6 +23133,16 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/word-wrap": {
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz",
+      "integrity": "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/wordwrap": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
@@ -19769,7 +23292,6 @@
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
       "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
-      "dev": true,
       "license": "ISC"
     },
     "node_modules/ws": {
@@ -19936,6 +23458,19 @@
         "node": ">=6"
       }
     },
+    "node_modules/yocto-queue": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",
+      "integrity": "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/yoctocolors-cjs": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/yoctocolors-cjs/-/yoctocolors-cjs-2.1.2.tgz",
@@ -19950,9 +23485,9 @@
       }
     },
     "node_modules/zod": {
-      "version": "3.25.28",
-      "resolved": "https://registry.npmjs.org/zod/-/zod-3.25.28.tgz",
-      "integrity": "sha512-/nt/67WYKnr5by3YS7LroZJbtcCBurDKKPBPWWzaxvVCGuG/NOsiKkrjoOhI8mJ+SQUXEbUzeB3S+6XDUEEj7Q==",
+      "version": "3.25.75",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-3.25.75.tgz",
+      "integrity": "sha512-OhpzAmVzabPOL6C3A3gpAifqr9MqihV/Msx3gor2b2kviCgcb+HM9SEOpMWwwNp9MRunWnhtAKUoo0AHhjyPPg==",
       "dev": true,
       "license": "MIT",
       "funding": {
diff --git a/package.json b/package.json
index ae3d396..f87fafe 100755
--- a/package.json
+++ b/package.json
@@ -3,43 +3,65 @@
   "version": "0.0.0",
   "scripts": {
     "ng": "ng",
-    "start": "ng serve",
-    "build": "ng build",
+    "start": "ng serve web",
+    "build": "ng build web",
+    "build:all": "ng build shared && ng build web && ng build admin && ng build code-samples-mfe",
     "watch": "ng build --watch --configuration development",
-    "test": "ng test",
-    "serve:ssr:AngularBlogApp": "node dist/angular-blog-app/server/server.mjs",
-    "build:stats": "ng build --stats-json",
-    "analyze": "webpack-bundle-analyzer dist/angular-blog-app/stats.json",
-    "start:local": "ng serve --configuration=local",
+    "test": "ng test web",
+    "test:all": "ng test shared && ng test web && ng test admin && ng test code-samples-mfe",
+    "format": "prettier --write .",
+    "format:check": "prettier --check .",
+    "format:staged": "prettier --write",
+    "serve:ssr:web": "node dist/web/server/server.mjs",
+    "build:stats": "ng build web --stats-json",
+    "analyze": "webpack-bundle-analyzer dist/web/stats.json",
+    "start:local": "ng serve web --configuration=local",
     "start:local:docker": "open -a Docker",
     "start:local:backend": "npx supabase start",
     "schema:pull": "find supabase/migrations -name '*_remote_schema.sql' -delete && supabase db pull --db-url $PG_EXPORT_URL",
     "db:createSeed": "scripts/create-seed.sh",
     "db:seed": "npx @snaplet/seed init",
     "users:passwords": "scripts/set-passwords.sh",
-    "e2e": "ng e2e",
-    "e2e:local": "ng e2e -c local"
+    "routes:generate": "node scripts/generate-routes.js",
+    "routes:generate:ts": "tsx scripts/generate-routes.ts",
+    "e2e": "playwright test",
+    "e2e:web": "playwright test --project=web",
+    "e2e:web:local": "playwright test --project=web --project=local",
+    "e2e:admin": "playwright test --project=admin",
+    "e2e:admin:local": "playwright test --project=admin",
+    "lint": "npm run lint:projects",
+    "lint:fix": "npm run lint:projects -- --fix",
+    "lint:all": "ng lint admin && ng lint web && ng lint code-samples-mfe",
+    "lint:all:fix": "ng lint admin --fix && ng lint web --fix && ng lint code-samples-mfe --fix",
+    "lint:boundaries": "eslint --ext .ts,.html projects",
+    "lint:projects": "ng lint admin && ng lint web && ng lint code-samples-mfe",
+    "lint:admin": "ng lint admin",
+    "lint:admin:fix": "ng lint admin --fix",
+    "lint:web": "ng lint web",
+    "lint:web:fix": "ng lint web --fix",
+    "lint:mfe": "ng lint code-samples-mfe",
+    "lint:mfe:fix": "ng lint code-samples-mfe --fix"
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^19.2.1",
-    "@angular/common": "^19.2.1",
-    "@angular/compiler": "^19.2.1",
-    "@angular/core": "^19.2.1",
-    "@angular/forms": "^19.2.1",
-    "@angular/platform-browser": "^19.2.1",
-    "@angular/platform-browser-dynamic": "^19.2.1",
-    "@angular/platform-server": "^19.2.1",
-    "@angular/router": "^19.2.1",
-    "@angular/ssr": "^19.2.1",
-    "@ngrx/operators": "^19.1.0",
-    "@ngrx/signals": "^19.1.0",
+    "@angular/animations": "^20.1.7",
+    "@angular/common": "^20.1.7",
+    "@angular/compiler": "^20.1.7",
+    "@angular/core": "^20.1.7",
+    "@angular/forms": "^20.1.7",
+    "@angular/platform-browser": "^20.1.7",
+    "@angular/platform-browser-dynamic": "^20.1.7",
+    "@angular/platform-server": "^20.1.7",
+    "@angular/router": "^20.1.7",
+    "@angular/ssr": "^20.1.6",
+    "@ngrx/operators": "^20.0.0",
+    "@ngrx/signals": "^20.0.0",
     "@supabase/supabase-js": "^2.49.4",
     "@tailwindcss/line-clamp": "^0.4.4",
-    "express": "^4.18.2",
+    "express": "^5.1.0",
     "i": "^0.3.7",
     "ngx-highlightjs": "^12.0.0",
-    "ngx-quill": "^27.0.0",
+    "ngx-quill": "^28.0.1",
     "node-fetch": "^3.3.2",
     "npm": "^10.8.2",
     "quill": "^2.0.2",
@@ -48,33 +70,43 @@
     "zone.js": "~0.15.0"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^19.2.1",
-    "@angular/cli": "^19.2.1",
-    "@angular/compiler-cli": "^19.2.1",
+    "@angular/build": "^20.1.6",
+    "@angular/cli": "^20.1.6",
+    "@angular/compiler-cli": "^20.1.7",
     "@playwright/test": "^1.53.0",
     "@snaplet/copycat": "^6.0.0",
     "@snaplet/seed": "^0.98.0",
     "@types/compression": "^1.7.5",
-    "@types/express": "^4.17.17",
+    "@types/express": "^5.0.1",
     "@types/jasmine": "~5.1.0",
-    "@types/node": "^18.19.111",
+    "@types/node": "^20.17.19",
     "@types/pg": "^8.15.2",
+    "angular-eslint": "20.1.1",
     "autoprefixer": "^10.4.19",
     "daisyui": "^4.12.10",
+    "esbuild-visualizer": "^0.7.0",
+    "eslint": "^9.29.0",
+    "eslint-import-resolver-typescript": "^4.4.4",
+    "eslint-plugin-boundaries": "^5.0.1",
+    "eslint-plugin-import": "^2.32.0",
+    "http-server": "^14.1.1",
     "jasmine-core": "~5.1.0",
     "karma": "~6.4.0",
     "karma-chrome-launcher": "~3.2.0",
     "karma-coverage": "~2.2.0",
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "~2.1.0",
+    "ng-packagr": "^20.1.0",
     "pg": "^8.16.0",
     "playwright-ng-schematics": "^2.0.3",
     "postcss": "^8.4.38",
     "prettier": "3.4.2",
+    "source-map-explorer": "^2.5.3",
     "tailwindcss": "^3.4.4",
     "ts-node": "^10.9.2",
     "tsx": "^4.19.4",
-    "typescript": "~5.7.3",
+    "typescript": "~5.8.3",
+    "typescript-eslint": "8.34.1",
     "webpack-bundle-analyzer": "^4.10.2",
     "webpack-cli": "^5.1.4"
   }
diff --git a/playwright.config.ts b/playwright.config.ts
index 06d19b7..f7bd31e 100644
--- a/playwright.config.ts
+++ b/playwright.config.ts
@@ -32,23 +32,45 @@ export default defineConfig({
 
   /* Configure projects for major browsers */
   projects: [
+    {
+      name: 'web',
+      testDir: './e2e/web',
+      use: {
+        ...devices['Desktop Chrome'],
+        baseURL: process.env['PLAYWRIGHT_TEST_BASE_URL'] ?? 'http://localhost:4200',
+      },
+    },
+
+    {
+      name: 'admin',
+      testDir: './e2e/admin',
+      use: {
+        ...devices['Desktop Chrome'],
+        baseURL: process.env['PLAYWRIGHT_TEST_BASE_URL'] ?? 'http://localhost:4201',
+      },
+    },
+
     {
       name: 'chromium',
+      testDir: './e2e/web',
       use: { ...devices['Desktop Chrome'] },
     },
 
     {
       name: 'firefox',
+      testDir: './e2e/web',
       use: { ...devices['Desktop Firefox'] },
     },
 
     {
       name: 'webkit',
+      testDir: './e2e/web',
       use: { ...devices['Desktop Safari'] },
     },
 
     {
       name: 'local',
+      testDir: './e2e/web',
       use: {
         ...devices['Desktop Chrome'],
         baseURL: 'http://localhost:4200',
diff --git a/projects/admin/eslint.config.js b/projects/admin/eslint.config.js
new file mode 100644
index 0000000..15a3421
--- /dev/null
+++ b/projects/admin/eslint.config.js
@@ -0,0 +1,32 @@
+// @ts-check
+const tseslint = require("typescript-eslint");
+const rootConfig = require("../../eslint.config.js");
+
+module.exports = tseslint.config(
+  ...rootConfig,
+  {
+    files: ["**/*.ts"],
+    rules: {
+      "@angular-eslint/directive-selector": [
+        "error",
+        {
+          type: "attribute",
+          prefix: "admin",
+          style: "camelCase",
+        },
+      ],
+      "@angular-eslint/component-selector": [
+        "error",
+        {
+          type: "element",
+          prefix: "admin",
+          style: "kebab-case",
+        },
+      ],
+    },
+  },
+  {
+    files: ["**/*.html"],
+    rules: {},
+  }
+);
diff --git a/projects/admin/public/favicon.ico b/projects/admin/public/favicon.ico
new file mode 100644
index 0000000..57614f9
Binary files /dev/null and b/projects/admin/public/favicon.ico differ
diff --git a/projects/admin/src/app/app.component.spec.ts b/projects/admin/src/app/app.component.spec.ts
new file mode 100644
index 0000000..7cfa258
--- /dev/null
+++ b/projects/admin/src/app/app.component.spec.ts
@@ -0,0 +1,26 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { provideZonelessChangeDetection } from '@angular/core';
+import { RouterTestingModule } from '@angular/router/testing';
+
+import { AppComponent } from './app.component';
+
+describe('AppComponent', () => {
+  let component: AppComponent;
+  let fixture: ComponentFixture<AppComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [AppComponent, RouterTestingModule],
+      providers: [provideZonelessChangeDetection()]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(AppComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/projects/admin/src/app/app.component.ts b/projects/admin/src/app/app.component.ts
new file mode 100644
index 0000000..a7ec9aa
--- /dev/null
+++ b/projects/admin/src/app/app.component.ts
@@ -0,0 +1,10 @@
+import { Component } from '@angular/core';
+import { MainLayoutComponent } from './layout/main-layout/main-layout.component';
+
+@Component({
+  selector: 'admin-root',
+  standalone: true,
+  imports: [MainLayoutComponent],
+  template: '<admin-main-layout/>',
+})
+export class AppComponent {}
diff --git a/src/app/app.config.ts b/projects/admin/src/app/app.config.ts
old mode 100755
new mode 100644
similarity index 76%
rename from src/app/app.config.ts
rename to projects/admin/src/app/app.config.ts
index 2fda609..afae07a
--- a/src/app/app.config.ts
+++ b/projects/admin/src/app/app.config.ts
@@ -1,35 +1,29 @@
 import {
   ApplicationConfig,
-  provideZoneChangeDetection,
+  provideZonelessChangeDetection,
   inject,
   provideAppInitializer,
 } from '@angular/core';
 import { provideRouter, withComponentInputBinding } from '@angular/router';
-
-import { routes } from './app.routes';
-import {
-  provideClientHydration,
-  withEventReplay,
-} from '@angular/platform-browser';
 import { provideHttpClient, withFetch } from '@angular/common/http';
-import { provideQuillConfig } from 'ngx-quill/config';
 import { provideHighlightOptions } from 'ngx-highlightjs';
-import { quillToolbarConfig } from './utlis/quill-toolbar';
+import { provideQuillConfig } from 'ngx-quill/config';
 import hljs from 'highlight.js/lib/core';
-import { SupabaseService } from './services/supabase.service';
-import { supabaseInitializer } from './utlis/initialize-supabase';
+import { routes } from './app.routes';
+import { quillToolbarConfig } from './core/utils/quill-toolbar';
+import { SupabaseService } from 'shared';
+import { supabaseInitializer } from 'shared';
 
 export const appConfig: ApplicationConfig = {
   providers: [
-    provideHttpClient(withFetch()),
-    provideZoneChangeDetection({ eventCoalescing: true }),
+    provideZonelessChangeDetection(),
     provideRouter(routes, withComponentInputBinding()),
-    provideClientHydration(withEventReplay()),
+    provideHttpClient(withFetch()),
+
     provideAppInitializer(() => {
       const supabaseService = inject(SupabaseService);
       return supabaseInitializer(supabaseService)();
     }),
-
     provideHighlightOptions({
       coreLibraryLoader: () => import('highlight.js/lib/core'),
       languages: {
diff --git a/projects/admin/src/app/app.html b/projects/admin/src/app/app.html
new file mode 100644
index 0000000..7dd570e
--- /dev/null
+++ b/projects/admin/src/app/app.html
@@ -0,0 +1 @@
+<router-outlet/>
diff --git a/projects/admin/src/app/app.routes.ts b/projects/admin/src/app/app.routes.ts
new file mode 100644
index 0000000..5e12a56
--- /dev/null
+++ b/projects/admin/src/app/app.routes.ts
@@ -0,0 +1,23 @@
+import { Routes } from '@angular/router';
+import { authAdminGuard } from './core/guards/authAdminGuard';
+
+export const routes: Routes = [
+  {
+    path: '',
+    redirectTo: '/login',
+    pathMatch: 'full',
+  },
+  {
+    path: 'login',
+    loadComponent: () => import('./layout/login/login.component').then(m => m.LoginComponent),
+  },
+  {
+    path: 'posts',
+    canMatch: [authAdminGuard],
+    loadChildren: () => import('./features/add-post/add-post.routes'),
+  },
+  {
+    path: '**',
+    redirectTo: '/login',
+  },
+];
diff --git a/src/app/admin/_components/add-post/add-image/add-image.component.scss b/projects/admin/src/app/app.scss
similarity index 100%
rename from src/app/admin/_components/add-post/add-image/add-image.component.scss
rename to projects/admin/src/app/app.scss
diff --git a/src/app/app.component.spec.ts b/projects/admin/src/app/app.spec.ts
old mode 100755
new mode 100644
similarity index 53%
rename from src/app/app.component.spec.ts
rename to projects/admin/src/app/app.spec.ts
index 7cd488c..d2cae37
--- a/src/app/app.component.spec.ts
+++ b/projects/admin/src/app/app.spec.ts
@@ -1,15 +1,17 @@
+import { provideZonelessChangeDetection } from '@angular/core';
 import { TestBed } from '@angular/core/testing';
-import { AppComponent } from './app.component';
+import { App } from './app';
 
-describe('AppComponent', () => {
+describe('App', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [AppComponent],
+      imports: [App],
+      providers: [provideZonelessChangeDetection()],
     }).compileComponents();
   });
 
   it('should create the app', () => {
-    const fixture = TestBed.createComponent(AppComponent);
+    const fixture = TestBed.createComponent(App);
     const app = fixture.componentInstance;
     expect(app).toBeTruthy();
   });
diff --git a/projects/admin/src/app/app.ts b/projects/admin/src/app/app.ts
new file mode 100644
index 0000000..e52f5b0
--- /dev/null
+++ b/projects/admin/src/app/app.ts
@@ -0,0 +1,12 @@
+import { Component, signal } from '@angular/core';
+import { RouterOutlet } from '@angular/router';
+
+@Component({
+  selector: 'admin-root',
+  imports: [RouterOutlet],
+  templateUrl: './app.html',
+  styleUrl: './app.scss'
+})
+export class App {
+  protected readonly title = signal('admin');
+}
diff --git a/projects/admin/src/app/core/auth/README.md b/projects/admin/src/app/core/auth/README.md
new file mode 100644
index 0000000..546ee19
--- /dev/null
+++ b/projects/admin/src/app/core/auth/README.md
@@ -0,0 +1,14 @@
+# Admin Authentication - Admin
+
+Admin-specific authentication with role validation and session management.
+
+## Contents
+- Admin login/logout
+- Role-based access control
+- Admin session persistence
+- Permission checking
+- Admin-only guards
+
+## Dependencies
+- Uses Supabase client for authentication
+- Validates admin role permissions
\ No newline at end of file
diff --git a/src/app/auth/_guards/authAdminGuard.ts b/projects/admin/src/app/core/guards/authAdminGuard.ts
similarity index 72%
rename from src/app/auth/_guards/authAdminGuard.ts
rename to projects/admin/src/app/core/guards/authAdminGuard.ts
index ede6a08..5388b89 100644
--- a/src/app/auth/_guards/authAdminGuard.ts
+++ b/projects/admin/src/app/core/guards/authAdminGuard.ts
@@ -1,7 +1,7 @@
 import { inject } from '@angular/core';
 import { CanMatchFn, Router } from '@angular/router';
-import { SupabaseService } from '../../services/supabase.service';
-import { Roles } from '../../shared/_enums/roles';
+import { Roles } from 'shared';
+import { SupabaseService } from 'shared';
 
 export const authAdminGuard: CanMatchFn = (): boolean => {
   const supabaseService = inject(SupabaseService);
@@ -10,8 +10,7 @@ export const authAdminGuard: CanMatchFn = (): boolean => {
   if (session?.user?.app_metadata?.['role'] === Roles.ADMIN) {
     return true;
   } else {
-    router.navigate(['/posts']);
+    router.navigate(['/login']);
     return false;
   }
 };
-
diff --git a/projects/admin/src/app/core/http/README.md b/projects/admin/src/app/core/http/README.md
new file mode 100644
index 0000000..cddbd42
--- /dev/null
+++ b/projects/admin/src/app/core/http/README.md
@@ -0,0 +1,13 @@
+# Admin HTTP Layer
+
+HTTP interceptors and configuration for admin API operations.
+
+## Contents
+- Admin API authentication
+- Error handling for admin operations
+- Request/response logging
+- API versioning headers
+
+## Configuration
+- Supabase client setup for admin operations
+- Enhanced error handling for admin workflows
\ No newline at end of file
diff --git a/src/app/admin/_services/admin-api.service.ts b/projects/admin/src/app/core/services/admin-api.service.ts
similarity index 73%
rename from src/app/admin/_services/admin-api.service.ts
rename to projects/admin/src/app/core/services/admin-api.service.ts
index ac265b2..a44b448 100755
--- a/src/app/admin/_services/admin-api.service.ts
+++ b/projects/admin/src/app/core/services/admin-api.service.ts
@@ -1,9 +1,9 @@
 import { inject, Injectable } from '@angular/core';
 import { map, Observable } from 'rxjs';
 import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
-import { SupabaseService } from '../../services/supabase.service';
-import { environment } from '../../../environments/environment';
-import { Post, PostInsert, PostUpdate, Tag } from '../../types/supabase';
+import { environment } from '../../../../../../environments/environment';
+import { Post, PostInsert, PostUpdate, Tag } from 'shared';
+import { SupabaseService } from 'shared';
 
 @Injectable()
 export class AdminApiService {
@@ -16,12 +16,11 @@ export class AdminApiService {
     const { tags, ...postData } = post;
 
     try {
-      const { data: insertedPost, error: postError } =
-        await this.supabaseService.getClient
-          .from('posts')
-          .insert({ ...postData })
-          .select('id')
-          .single();
+      const { data: insertedPost, error: postError } = await this.supabaseService.getClient
+        .from('posts')
+        .insert({ ...postData })
+        .select('id')
+        .single();
 
       if (postError) {
         console.error('Error inserting post:', postError);
@@ -29,7 +28,7 @@ export class AdminApiService {
       }
 
       if (tags && tags.length > 0 && insertedPost) {
-        const postTagInserts = tags.map((tag) => ({
+        const postTagInserts = tags.map(tag => ({
           post_id: insertedPost.id,
           tag_id: tag.id,
         }));
@@ -61,9 +60,7 @@ export class AdminApiService {
       .replace(/\s+/g, ' ')
       .trim();
 
-    const params = new HttpParams()
-      .set('select', selectQuery)
-      .set('id', `eq.${id}`);
+    const params = new HttpParams().set('select', selectQuery).set('id', `eq.${id}`);
 
     const headers = new HttpHeaders({
       apikey: this.apiKey,
@@ -73,13 +70,10 @@ export class AdminApiService {
 
     return this.http
       .get<Post[]>(`${this.baseUrl}posts`, { headers, params })
-      .pipe(map((results) => results[0] ?? null));
+      .pipe(map(results => results[0] ?? null));
   }
 
-  async updatePost(
-    id: string,
-    post: PostUpdate & { tags?: Tag[] },
-  ): Promise<void> {
+  async updatePost(id: string, post: PostUpdate & { tags?: Tag[] }): Promise<void> {
     const { tags, ...postData } = post;
 
     try {
@@ -97,25 +91,21 @@ export class AdminApiService {
       // Handle tags if provided
       if (tags !== undefined) {
         // Get existing tags for comparison
-        const { data: existingPostTags, error: fetchError } =
-          await this.supabaseService.getClient
-            .from('post_tags')
-            .select('tag_id')
-            .eq('post_id', id);
+        const { data: existingPostTags, error: fetchError } = await this.supabaseService.getClient
+          .from('post_tags')
+          .select('tag_id')
+          .eq('post_id', id);
 
         if (fetchError) {
           console.error('Error fetching existing post tags:', fetchError);
           throw fetchError;
         }
 
-        const existingTagIds = (existingPostTags || [])
-          .map((pt) => pt.tag_id)
-          .sort();
+        const existingTagIds = (existingPostTags || []).map(pt => pt.tag_id).sort();
         const newTagIds = tags.map((tag: Tag) => tag.id).sort();
 
         // Check if tags have actually changed using JSON comparison for better accuracy
-        const tagsChanged =
-          JSON.stringify(existingTagIds) !== JSON.stringify(newTagIds);
+        const tagsChanged = JSON.stringify(existingTagIds) !== JSON.stringify(newTagIds);
 
         if (tagsChanged) {
           console.log('Tags changed, updating...');
@@ -133,7 +123,7 @@ export class AdminApiService {
 
           // Insert new post-tag relationships if tags exist
           if (tags.length > 0) {
-            const postTagInserts = tags.map((tag) => ({
+            const postTagInserts = tags.map(tag => ({
               post_id: id,
               tag_id: tag.id,
             }));
@@ -158,4 +148,13 @@ export class AdminApiService {
       throw error;
     }
   }
+
+  getTags(): Observable<Tag[]> {
+    const headers = new HttpHeaders({
+      apikey: this.apiKey,
+      Authorization: `Bearer ${this.apiKey}`,
+      Accept: 'application/json',
+    });
+    return this.http.get<Tag[]>(`${this.baseUrl}tags`, { headers });
+  }
 }
diff --git a/src/app/utlis/quill-configuration.ts b/projects/admin/src/app/core/utils/quill-configuration.ts
similarity index 99%
rename from src/app/utlis/quill-configuration.ts
rename to projects/admin/src/app/core/utils/quill-configuration.ts
index 9243449..258c12f 100644
--- a/src/app/utlis/quill-configuration.ts
+++ b/projects/admin/src/app/core/utils/quill-configuration.ts
@@ -20,5 +20,4 @@ export async function loadQuillModules(): Promise<void> {
   QuillModule.default.register(Block, true);
   QuillModule.default.register(SyntaxModule, true);
 
-}
-
+}
\ No newline at end of file
diff --git a/src/app/utlis/quill-toolbar.ts b/projects/admin/src/app/core/utils/quill-toolbar.ts
similarity index 100%
rename from src/app/utlis/quill-toolbar.ts
rename to projects/admin/src/app/core/utils/quill-toolbar.ts
diff --git a/src/app/admin/_components/add-post/add-image/add-image-controls.interface.ts b/projects/admin/src/app/features/add-post/add-image/add-image-controls.interface.ts
similarity index 100%
rename from src/app/admin/_components/add-post/add-image/add-image-controls.interface.ts
rename to projects/admin/src/app/features/add-post/add-image/add-image-controls.interface.ts
diff --git a/src/app/admin/_components/add-post/add-image/add-image.component.html b/projects/admin/src/app/features/add-post/add-image/add-image.component.html
similarity index 100%
rename from src/app/admin/_components/add-post/add-image/add-image.component.html
rename to projects/admin/src/app/features/add-post/add-image/add-image.component.html
diff --git a/src/app/admin/_components/add-post/add-post.component.scss b/projects/admin/src/app/features/add-post/add-image/add-image.component.scss
old mode 100755
new mode 100644
similarity index 100%
rename from src/app/admin/_components/add-post/add-post.component.scss
rename to projects/admin/src/app/features/add-post/add-image/add-image.component.scss
diff --git a/src/app/admin/_components/add-post/add-image/add-image.component.ts b/projects/admin/src/app/features/add-post/add-image/add-image.component.ts
similarity index 95%
rename from src/app/admin/_components/add-post/add-image/add-image.component.ts
rename to projects/admin/src/app/features/add-post/add-image/add-image.component.ts
index 638c9c2..6a1de2c 100644
--- a/src/app/admin/_components/add-post/add-image/add-image.component.ts
+++ b/projects/admin/src/app/features/add-post/add-image/add-image.component.ts
@@ -3,7 +3,7 @@ import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
 import { AddImageControls } from './add-image-controls.interface';
 
 @Component({
-  selector: 'app-add-image',
+  selector: 'admin-add-image',
   standalone: true,
   imports: [ReactiveFormsModule],
   templateUrl: './add-image.component.html',
diff --git a/projects/admin/src/app/features/add-post/add-post.component.html b/projects/admin/src/app/features/add-post/add-post.component.html
new file mode 100755
index 0000000..5337879
--- /dev/null
+++ b/projects/admin/src/app/features/add-post/add-post.component.html
@@ -0,0 +1,113 @@
+@defer {
+  <div class="admin-post-layout">
+    <!-- Header -->
+    <header class="post-header">
+      <div class="header-content">
+        <div class="header-left">
+          <h1 class="page-title">Create New Post</h1>
+          <p class="page-subtitle">Write and publish your blog content</p>
+        </div>
+        <div class="header-right">
+          <div class="status-indicator">
+            @if (!postId) {
+              <span class="status-text">New Post</span>
+            } @else {
+              <span class="status-text">Editing Post</span>
+            }
+          </div>
+        </div>
+      </div>
+    </header>
+
+    <!-- Main Content -->
+    <main class="post-main">
+      <form class="post-form" [formGroup]="blogForm" (ngSubmit)="onSubmit()">
+        <!-- Title and Meta Section -->
+        <section class="meta-section">
+          <div class="section-header">
+            <h2 class="section-title">Post Details</h2>
+          </div>
+
+          <div class="meta-grid">
+            <!-- Title Field -->
+            <div class="field-group full-width">
+              <label for="title" class="field-label">Title</label>
+              <input
+                id="title"
+                type="text"
+                formControlName="title"
+                class="field-input title-input"
+                placeholder="Enter your post title..."
+                required
+              />
+              @if (blogForm.controls.title.invalid && (blogForm.controls.title.dirty || blogForm.controls.title.touched)) {
+                @if (blogForm.controls.title.errors?.['required']) {
+                  <div class="field-error">Title is required</div>
+                }
+              }
+            </div>
+
+            <!-- Tags Section -->
+            <div class="field-group full-width">
+              <span class="field-label">Tags & Categories</span>
+              <div class="tags-container">
+                <admin-tag-multi-select formControlName="tags"/>
+              </div>
+            </div>
+          </div>
+        </section>
+
+        <!-- Content Editor Section -->
+        <section class="content-section">
+          <div class="section-header">
+            <h2 class="section-title">Content Editor</h2>
+            <div class="section-actions">
+              <button
+                type="button"
+                class="action-button"
+                (click)="insertImage()"
+              >
+                Add Image
+              </button>
+            </div>
+          </div>
+
+          <div class="editor-container">
+            <quill-editor
+              #quill
+              formControlName="content"
+              class="post-editor"
+            />
+          </div>
+        </section>
+
+        <!-- Action Section -->
+        <section class="actions-section">
+          <div class="actions-layout">
+            <div class="primary-actions">
+              <button
+                type="submit"
+                class="btn-publish"
+                [disabled]="blogForm.invalid"
+              >
+                Publish Post
+              </button>
+
+              <button
+                type="button"
+                class="btn-draft"
+                (click)="onSubmit(true)"
+              >
+                Save as Draft
+              </button>
+            </div>
+
+            <div class="secondary-info">
+              <span class="auto-save-status">Auto-saved 2 minutes ago</span>
+            </div>
+          </div>
+        </section>
+      </form>
+    </main>
+  </div>
+}
diff --git a/projects/admin/src/app/features/add-post/add-post.component.scss b/projects/admin/src/app/features/add-post/add-post.component.scss
new file mode 100755
index 0000000..b96e877
--- /dev/null
+++ b/projects/admin/src/app/features/add-post/add-post.component.scss
@@ -0,0 +1,508 @@
+// Clean Admin Add-Post Layout - Structure Focused
+// Brand colors: primary (#12372A), secondary (#436850), tertiary (#ADBC9F), quaternary (#FBFADA)
+
+.admin-post-layout {
+  min-height: 100vh;
+  background: rgba(251, 250, 218, 0.2);
+  display: flex;
+  flex-direction: column;
+}
+
+// Header Section
+.post-header {
+  background: white;
+  border-bottom: 2px solid rgba(173, 188, 159, 0.2);
+  padding: 1.5rem 2rem;
+  position: sticky;
+  top: 0;
+  z-index: 100;
+}
+
+.header-content {
+  max-width: 1200px;
+  margin: 0 auto;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.header-left {
+  .page-title {
+    font-size: 1.875rem;
+    font-weight: 700;
+    color: #12372A;
+    margin: 0 0 0.25rem 0;
+    line-height: 1.2;
+  }
+
+  .page-subtitle {
+    font-size: 1rem;
+    color: #436850;
+    margin: 0;
+  }
+}
+
+.header-right {
+  .status-indicator {
+    padding: 0.5rem 1rem;
+    background: rgba(173, 188, 159, 0.2);
+    border-radius: 20px;
+    border: 1px solid rgba(173, 188, 159, 0.3);
+
+    .status-text {
+      font-size: 0.875rem;
+      font-weight: 600;
+      color: #436850;
+    }
+  }
+}
+
+// Main Content
+.post-main {
+  flex: 1;
+  padding: 2rem 2rem 120px 2rem; // Add bottom padding for fixed actions
+}
+
+.post-form {
+  max-width: 1200px;
+  margin: 0 auto;
+  display: grid;
+  gap: 2rem;
+}
+
+// Sections
+.meta-section,
+.content-section,
+.actions-section {
+  background: white;
+  border-radius: 12px;
+  border: 1px solid rgba(173, 188, 159, 0.2);
+  box-shadow: 0 2px 8px rgba(18, 55, 42, 0.06);
+}
+
+.section-header {
+  padding: 1.5rem 2rem;
+  border-bottom: 1px solid rgba(173, 188, 159, 0.2);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  .section-title {
+    font-size: 1.25rem;
+    font-weight: 600;
+    color: #12372A;
+    margin: 0;
+  }
+}
+
+.section-actions {
+  display: flex;
+  gap: 1rem;
+}
+
+.action-button {
+  padding: 0.5rem 1rem;
+  background: rgba(67, 104, 80, 0.1);
+  color: #436850;
+  border: 1px solid rgba(67, 104, 80, 0.2);
+  border-radius: 6px;
+  font-size: 0.875rem;
+  font-weight: 500;
+  cursor: pointer;
+  transition: all 0.2s ease;
+
+  &:hover {
+    background: rgba(67, 104, 80, 0.2);
+    border-color: rgba(67, 104, 80, 0.3);
+  }
+}
+
+// Meta Section
+.meta-grid {
+  padding: 2rem;
+  display: grid;
+  gap: 2rem;
+}
+
+.field-group {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+
+  &.full-width {
+    grid-column: 1 / -1;
+  }
+}
+
+.field-label {
+  font-size: 0.875rem;
+  font-weight: 600;
+  color: #12372A;
+  margin: 0;
+}
+
+.field-input {
+  padding: 0.875rem 1rem;
+  border: 2px solid rgba(173, 188, 159, 0.3);
+  border-radius: 8px;
+  font-size: 1rem;
+  background: white;
+  color: #12372A;
+  transition: all 0.2s ease;
+
+  &:focus {
+    outline: none;
+    border-color: #12372A;
+    box-shadow: 0 0 0 3px rgba(18, 55, 42, 0.1);
+  }
+
+  &::placeholder {
+    color: rgba(67, 104, 80, 0.5);
+  }
+
+  &.title-input {
+    font-size: 1.25rem;
+    font-weight: 600;
+    padding: 1rem 1.25rem;
+  }
+}
+
+.field-error {
+  font-size: 0.8125rem;
+  color: #ef4444;
+  margin-top: 0.25rem;
+}
+
+.tags-container {
+  padding: 1rem;
+  border: 2px solid rgba(173, 188, 159, 0.2);
+  border-radius: 8px;
+  background: rgba(251, 250, 218, 0.3);
+  min-height: 3rem;
+
+  blog-tag-multi-select {
+    display: block;
+  }
+}
+
+// Content Section
+.content-section {
+  .section-header {
+    padding: 1.5rem 2rem;
+  }
+}
+
+.editor-container {
+  padding: 0;
+
+  .post-editor {
+    border: none;
+    border-radius: 0 0 12px 12px;
+
+    ::ng-deep {
+      .ql-toolbar {
+        border: none;
+        border-bottom: 1px solid rgba(173, 188, 159, 0.2);
+        background: white;
+        padding: 1rem 1.5rem;
+        position: sticky;
+        top: 112px;
+        z-index: 150;
+        box-shadow: 0 2px 8px rgba(18, 55, 42, 0.08);
+
+        .ql-formats {
+          margin-right: 1.5rem;
+
+          &:last-child {
+            margin-right: 0;
+          }
+        }
+
+        button,
+        .ql-picker {
+          padding: 0.5rem;
+          margin: 0 0.125rem;
+          border-radius: 4px;
+          transition: all 0.15s ease;
+          min-width: 32px;
+          min-height: 32px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+
+          svg {
+            width: 18px;
+            height: 18px;
+          }
+
+          &:hover {
+            background: rgba(18, 55, 42, 0.1);
+          }
+
+          &.ql-active {
+            background: #12372A;
+            color: white;
+          }
+        }
+
+        .ql-picker-label {
+          padding: 0.5rem 0.75rem;
+          border-radius: 4px;
+        }
+
+        .ql-picker.ql-expanded .ql-picker-label {
+          background: #12372A;
+          color: white;
+        }
+
+        .ql-picker-options {
+          background: white;
+          border: 1px solid rgba(173, 188, 159, 0.3);
+          border-radius: 8px;
+          box-shadow: 0 4px 12px rgba(18, 55, 42, 0.1);
+          padding: 0.5rem;
+
+          .ql-picker-item {
+            padding: 0.5rem 0.75rem;
+            border-radius: 4px;
+
+            &:hover {
+              background: rgba(18, 55, 42, 0.1);
+            }
+          }
+        }
+      }
+
+      .ql-container {
+        border: none;
+        font-family: inherit;
+
+        .ql-editor {
+          padding: 2rem;
+          font-size: 1rem;
+          line-height: 1.6;
+          color: #436850;
+          min-height: 400px;
+
+          &.ql-blank::before {
+            color: rgba(67, 104, 80, 0.5);
+            font-style: italic;
+            left: 2rem;
+            right: 2rem;
+          }
+
+          h1, h2, h3, h4, h5, h6 {
+            color: #12372A;
+            font-weight: 600;
+            margin: 1.5em 0 0.75em;
+
+            &:first-child {
+              margin-top: 0;
+            }
+          }
+
+          p {
+            margin: 0 0 1em;
+          }
+
+          blockquote {
+            border-left: 4px solid #ADBC9F;
+            padding-left: 1rem;
+            margin: 1rem 0;
+            font-style: italic;
+            color: rgba(67, 104, 80, 0.8);
+          }
+
+          pre {
+            background: rgba(18, 55, 42, 0.05);
+            padding: 1rem;
+            border-radius: 6px;
+            border-left: 4px solid #ADBC9F;
+            overflow-x: auto;
+          }
+
+          code {
+            background: rgba(173, 188, 159, 0.2);
+            color: #12372A;
+            padding: 0.125rem 0.375rem;
+            border-radius: 3px;
+            font-size: 0.9em;
+          }
+        }
+      }
+    }
+  }
+}
+
+// Actions Section
+.actions-section {
+  padding: 2rem;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: white;
+  border-top: 1px solid rgba(173, 188, 159, 0.2);
+  box-shadow: 0 -2px 8px rgba(18, 55, 42, 0.06);
+  z-index: 200;
+}
+
+.actions-layout {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  max-width: 1200px;
+  margin: 0 auto;
+}
+
+.primary-actions {
+  display: flex;
+  gap: 1rem;
+}
+
+.btn-publish {
+  padding: 0.875rem 1.5rem;
+  background: #12372A;
+  color: white;
+  border: none;
+  border-radius: 8px;
+  font-size: 1rem;
+  font-weight: 600;
+  cursor: pointer;
+  transition: all 0.2s ease;
+
+  &:hover:not(:disabled) {
+    background: rgba(18, 55, 42, 0.9);
+    transform: translateY(-1px);
+    box-shadow: 0 4px 12px rgba(18, 55, 42, 0.25);
+  }
+
+  &:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+    transform: none;
+  }
+}
+
+.btn-draft {
+  padding: 0.875rem 1.5rem;
+  background: white;
+  color: #436850;
+  border: 2px solid rgba(173, 188, 159, 0.3);
+  border-radius: 8px;
+  font-size: 1rem;
+  font-weight: 600;
+  cursor: pointer;
+  transition: all 0.2s ease;
+
+  &:hover {
+    background: rgba(251, 250, 218, 0.3);
+    border-color: rgba(67, 104, 80, 0.4);
+    transform: translateY(-1px);
+    box-shadow: 0 4px 12px rgba(67, 104, 80, 0.15);
+  }
+}
+
+.secondary-info {
+  .auto-save-status {
+    font-size: 0.875rem;
+    color: rgba(67, 104, 80, 0.6);
+    font-style: italic;
+  }
+}
+
+// Responsive Design
+@media (max-width: 1024px) {
+  .post-main {
+    padding: 1.5rem;
+  }
+
+  .meta-grid,
+  .actions-section {
+    padding: 1.5rem;
+  }
+
+  .section-header {
+    padding: 1.25rem 1.5rem;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 1rem;
+  }
+}
+
+@media (max-width: 768px) {
+  .post-header {
+    padding: 1rem 1.5rem;
+  }
+
+  .header-content {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 1rem;
+  }
+
+  .post-main {
+    padding: 1rem;
+  }
+
+  .meta-grid,
+  .actions-section {
+    padding: 1rem;
+  }
+
+  .section-header {
+    padding: 1rem;
+
+    .section-title {
+      font-size: 1.125rem;
+    }
+  }
+
+  .actions-layout {
+    flex-direction: column;
+    align-items: stretch;
+    gap: 1rem;
+  }
+
+  .primary-actions {
+    flex-direction: column;
+  }
+
+  .secondary-info {
+    text-align: center;
+  }
+
+  .editor-container .post-editor ::ng-deep {
+    .ql-toolbar {
+      padding: 0.75rem 1rem;
+
+      .ql-formats {
+        margin-right: 1rem;
+      }
+    }
+
+    .ql-container .ql-editor {
+      padding: 1rem;
+      min-height: 300px;
+    }
+  }
+}
+
+@media (max-width: 480px) {
+  .post-header {
+    padding: 0.75rem 1rem;
+  }
+
+  .header-left .page-title {
+    font-size: 1.5rem;
+  }
+
+  .post-main {
+    padding: 0.75rem;
+  }
+
+  .field-input.title-input {
+    font-size: 1.125rem;
+    padding: 0.875rem 1rem;
+  }
+}
diff --git a/src/app/admin/_components/add-post/add-post.component.ts b/projects/admin/src/app/features/add-post/add-post.component.ts
similarity index 76%
rename from src/app/admin/_components/add-post/add-post.component.ts
rename to projects/admin/src/app/features/add-post/add-post.component.ts
index c341cf3..a132e4c 100755
--- a/src/app/admin/_components/add-post/add-post.component.ts
+++ b/projects/admin/src/app/features/add-post/add-post.component.ts
@@ -4,7 +4,7 @@ import {
   CUSTOM_ELEMENTS_SCHEMA,
   HostListener,
   inject,
-  Input,
+  input,
   OnInit,
   viewChild,
   ViewContainerRef,
@@ -17,22 +17,21 @@ import {
   ReactiveFormsModule,
   Validators,
 } from '@angular/forms';
-import { AdminApiService } from '../../_services/admin-api.service';
 import { HighlightModule } from 'ngx-highlightjs';
 import { QuillEditorComponent, Range } from 'ngx-quill';
-import { PostForm } from '../../_models/post-from.inteface';
 import hljs from 'highlight.js';
 import { RouterModule } from '@angular/router';
-import { loadQuillModules } from '../../../utlis/quill-configuration';
-import { DynamicDialogService } from '../../../shared/dynamic-dialog/dynamic-dialog.service';
-import { ModalConfig } from '../../../shared/_models/modal-config.intreface';
+import { PostForm } from './models/post-from.inteface';
 import { AddImageComponent } from './add-image/add-image.component';
 import { AddImageForm } from './add-image/add-image-controls.interface';
-import { PostInsert, PostUpdate, Tag } from '../../../types/supabase';
-import { TagMultiSelectComponent } from '../../../shared/tag-multi-select/tag-multi-select.component';
+import { AdminApiService } from '../../core/services/admin-api.service';
+import { TagMultiSelectComponent } from './tag-multi-select/tag-multi-select.component';
+import { loadQuillModules } from '../../core/utils/quill-configuration';
+import { ModalConfig, PostInsert, PostUpdate, Tag } from 'shared';
+import { DynamicDialogService } from 'shared';
 
 @Component({
-  selector: 'blog-add-post',
+  selector: 'admin-add-post',
   standalone: true,
   imports: [
     ReactiveFormsModule,
@@ -49,8 +48,8 @@ import { TagMultiSelectComponent } from '../../../shared/tag-multi-select/tag-mu
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class AddPostComponent implements OnInit {
-  @Input() postId?: string;
-  quill = viewChild.required<QuillEditorComponent>('quill');
+  public readonly postId = input<string | undefined>();
+  readonly quill = viewChild.required<QuillEditorComponent>('quill');
 
   viewContainerRef = inject(ViewContainerRef);
   dialogService = inject(DynamicDialogService<AddImageForm>);
@@ -79,8 +78,8 @@ export class AddPostComponent implements OnInit {
   }
 
   private loadPostIfIdExists(): void {
-    if (this.postId) {
-      this.apiService.getPostById(this.postId).subscribe((post) => {
+    if (this.postId()) {
+      this.apiService.getPostById(this.postId()!).subscribe(post => {
         if (post) {
           this.blogForm.patchValue(post);
           console.log(this.blogForm.value);
@@ -98,7 +97,7 @@ export class AddPostComponent implements OnInit {
     // Test for description
     if (!this.blogForm?.controls?.description?.value) {
       this.blogForm.controls?.description?.setValue(
-        this.blogForm.controls.content.value.toString().substring(0, 150),
+        this.blogForm.controls.content.value.toString().substring(0, 150)
       );
     }
 
@@ -119,7 +118,7 @@ export class AddPostComponent implements OnInit {
       };
 
       if (this.postId) {
-        this.apiService.updatePost(this.postId, formData as PostUpdate & { tags: Tag[] });
+        this.apiService.updatePost(this.postId()!, formData as PostUpdate & { tags: Tag[] });
       } else {
         this.apiService.addPost(formData as PostInsert & { tags: Tag[] });
       }
@@ -128,14 +127,10 @@ export class AddPostComponent implements OnInit {
 
   highlightContent(): void {
     this.blogForm.controls.content.setValue(
-      this.extractAndHighlightHTML(
-        this.blogForm.controls.content.value as string,
-      ),
+      this.extractAndHighlightHTML(this.blogForm.controls.content.value as string)
     );
     this.blogForm.controls.content.setValue(
-      this.extractAndHighlightTS(
-        this.blogForm.controls.content.value as string,
-      ),
+      this.extractAndHighlightTS(this.blogForm.controls.content.value as string)
     );
   }
 
@@ -144,8 +139,8 @@ export class AddPostComponent implements OnInit {
     tempDiv.innerHTML = htmlContent;
 
     const codeBlocksHTML = tempDiv.querySelectorAll('pre[data-language="xml"]');
-    codeBlocksHTML.forEach((block) => {
-      let language = 'xml';
+    codeBlocksHTML.forEach(block => {
+      const language = 'xml';
       const codeElement = document.createElement('code');
       codeElement.className = language;
       codeElement.innerHTML = hljs.highlight(block.textContent || '', {
@@ -162,11 +157,9 @@ export class AddPostComponent implements OnInit {
     const tempDiv = document.createElement('div');
     tempDiv.innerHTML = htmlContent;
 
-    const codeBlocksTS = tempDiv.querySelectorAll(
-      'pre[data-language="typescript"]',
-    );
-    codeBlocksTS.forEach((block) => {
-      let language = 'typescript';
+    const codeBlocksTS = tempDiv.querySelectorAll('pre[data-language="typescript"]');
+    codeBlocksTS.forEach(block => {
+      const language = 'typescript';
       const codeElement = document.createElement('code');
       codeElement.className = language;
       codeElement.innerHTML = hljs.highlight(block.textContent || '', {
@@ -188,19 +181,15 @@ export class AddPostComponent implements OnInit {
     };
     this.range = this.quill().quillEditor.getSelection();
     this.dialogService
-      .openDialog<AddImageComponent>(
-        this.viewContainerRef,
-        modalConfig,
-        AddImageComponent,
-      )
-      .subscribe((modalStatus) => {
+      .openDialog<AddImageComponent>(this.viewContainerRef, modalConfig, AddImageComponent)
+      .subscribe(modalStatus => {
         if (modalStatus.data) {
           const imgTag = `<img src="${modalStatus.data.form.controls.src.value}" alt="${modalStatus.data.form.controls.alt.value}" style="max-width: 100%;">`;
           if (this.range) {
             const newValue = this.insertString(
               this.blogForm.controls.content.value as string,
               this.blogForm.controls.content.value.toString().length,
-              imgTag,
+              imgTag
             );
             this.blogForm.controls.content.setValue(newValue);
           }
@@ -208,11 +197,7 @@ export class AddPostComponent implements OnInit {
       });
   }
 
-  insertString(
-    originalString: string,
-    index: number,
-    stringToInsert: string,
-  ): string {
+  insertString(originalString: string, index: number, stringToInsert: string): string {
     return [
       ...originalString.slice(0, index),
       ...stringToInsert,
diff --git a/src/app/admin/admin.routes.ts b/projects/admin/src/app/features/add-post/add-post.routes.ts
old mode 100755
new mode 100644
similarity index 56%
rename from src/app/admin/admin.routes.ts
rename to projects/admin/src/app/features/add-post/add-post.routes.ts
index 406e9e9..6b51216
--- a/src/app/admin/admin.routes.ts
+++ b/projects/admin/src/app/features/add-post/add-post.routes.ts
@@ -1,8 +1,8 @@
 import { Routes } from '@angular/router';
-import { AddPostComponent } from './_components/add-post/add-post.component';
-import { unsavedChangesGuard } from './_guards/unsaved-changes.guard';
+import { AddPostComponent } from './add-post.component';
+import { unsavedChangesGuard } from './guards/unsaved-changes.guard';
 
-export const adminRoutes: Routes = [
+export default [
   {
     path: '',
     component: AddPostComponent,
@@ -13,4 +13,4 @@ export const adminRoutes: Routes = [
     component: AddPostComponent,
     canDeactivate: [unsavedChangesGuard],
   },
-];
+] as Routes;
diff --git a/projects/admin/src/app/features/add-post/guards/unsaved-changes.guard.ts b/projects/admin/src/app/features/add-post/guards/unsaved-changes.guard.ts
new file mode 100644
index 0000000..b086c1d
--- /dev/null
+++ b/projects/admin/src/app/features/add-post/guards/unsaved-changes.guard.ts
@@ -0,0 +1,28 @@
+import { CanDeactivateFn } from '@angular/router';
+import { inject } from '@angular/core';
+import { map, of } from 'rxjs';
+import { ModalCloseStatusEnum } from 'shared';
+import { DynamicDialogService } from 'shared';
+import { AddPostComponent } from '../add-post.component';
+
+export const unsavedChangesGuard: CanDeactivateFn<AddPostComponent> = (
+  component: AddPostComponent
+) => {
+  const dynamicDialogService = inject(DynamicDialogService);
+  if (component.blogForm.dirty) {
+    return dynamicDialogService
+      .openDialog(component.viewContainerRef, {
+        primaryButton: 'Yes',
+        secondaryButton: 'No',
+        title: 'You have unsaved changes',
+        content: 'Are you sure you want to leave this page?',
+      })
+      .pipe(
+        map(status => {
+          return status.closeStatus === ModalCloseStatusEnum.ACCEPTED;
+        })
+      );
+  } else {
+    return of(true);
+  }
+};
diff --git a/src/app/admin/_models/post-from.inteface.ts b/projects/admin/src/app/features/add-post/models/post-from.inteface.ts
similarity index 86%
rename from src/app/admin/_models/post-from.inteface.ts
rename to projects/admin/src/app/features/add-post/models/post-from.inteface.ts
index bf96ec1..20c7c3e 100644
--- a/src/app/admin/_models/post-from.inteface.ts
+++ b/projects/admin/src/app/features/add-post/models/post-from.inteface.ts
@@ -1,5 +1,5 @@
 import { FormControl } from '@angular/forms';
-import { Tag } from '../../types/supabase';
+import { Tag } from 'shared';
 
 export interface PostForm {
   title: FormControl<string>;
diff --git a/projects/admin/src/app/features/add-post/tag-multi-select/tag-multi-select.component.html b/projects/admin/src/app/features/add-post/tag-multi-select/tag-multi-select.component.html
new file mode 100644
index 0000000..940f835
--- /dev/null
+++ b/projects/admin/src/app/features/add-post/tag-multi-select/tag-multi-select.component.html
@@ -0,0 +1,95 @@
+<div class="tag-multi-select">
+  <!-- Selected Tags Display -->
+  @if (selectedTags().length > 0) {
+    <div class="selected-tags-container">
+      @for (tag of selectedTags(); track tag.id) {
+        <div
+          class="selected-tag"
+          [style.background-color]="tag.color || '#12372A'"
+          (click)="removeTag(tag)"
+          [attr.aria-label]="'Remove ' + tag.name"
+          role="button"
+          tabindex="0"
+          (keydown.enter)="removeTag(tag)"
+          (keydown.space)="removeTag(tag)"
+        >
+          <span class="tag-name">{{ tag.name }}</span>
+          <button class="remove-button" type="button" [attr.aria-label]="'Remove ' + tag.name">
+            <svg viewBox="0 0 20 20" fill="currentColor" class="remove-icon">
+              <path
+                d="M6.28 5.22a.75.75 0 00-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 101.06 1.06L10 11.06l3.72 3.72a.75.75 0 101.06-1.06L11.06 10l3.72-3.72a.75.75 0 00-1.06-1.06L10 8.94 6.28 5.22z"/>
+            </svg>
+          </button>
+        </div>
+      }
+    </div>
+  }
+
+  <!-- Search Input -->
+  <div class="search-container">
+    <input
+      #searchInput
+      type="text"
+      class="search-input"
+      placeholder="Search and add tags..."
+      [value]="searchTerm()"
+      (input)="onSearchChange($event)"
+      (focus)="onInputFocus()"
+      (blur)="onInputBlur()"
+      [disabled]="disabled()"
+      [attr.aria-expanded]="isOpen()"
+      [attr.aria-haspopup]="'listbox'"
+      role="textbox"
+      aria-label="Search tags"
+    />
+
+    <!-- Search Icon -->
+    <div class="search-icon">
+      <svg viewBox="0 0 20 20" fill="currentColor">
+        <path fill-rule="evenodd"
+              d="M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z"
+              clip-rule="evenodd"/>
+      </svg>
+    </div>
+
+    <!-- Dropdown -->
+    @if (isOpen() && !disabled()) {
+      <div class="dropdown-menu" role="listbox" [attr.aria-label]="'Available tags'">
+        @for (tag of filteredTags(); track tag.id) {
+          <div
+            class="dropdown-item"
+            [class.focused]="tag.id === focusedTagId()"
+            (click)="selectTag(tag)"
+            (keydown.enter)="selectTag(tag)"
+            (keydown.space)="selectTag(tag)"
+            [attr.aria-selected]="isTagSelected(tag)"
+            role="option"
+            tabindex="-1"
+          >
+            <div class="tag-info">
+              <span class="tag-name">{{ tag.name }}</span>
+              @if (tag.color) {
+                <div class="tag-color-indicator" [style.background-color]="tag.color"></div>
+              }
+            </div>
+            <div class="add-icon">
+              <svg viewBox="0 0 20 20" fill="currentColor">
+                <path
+                  d="M10.75 4.75a.75.75 0 00-1.5 0v4.5h-4.5a.75.75 0 000 1.5h4.5v4.5a.75.75 0 001.5 0v-4.5h4.5a.75.75 0 000-1.5h-4.5v-4.5z"/>
+              </svg>
+            </div>
+          </div>
+        } @empty {
+          <div class="no-results">
+            <svg viewBox="0 0 20 20" fill="currentColor" class="no-results-icon">
+              <path fill-rule="evenodd"
+                    d="M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z"
+                    clip-rule="evenodd"/>
+            </svg>
+            <span>No tags found</span>
+          </div>
+        }
+      </div>
+    }
+  </div>
+</div>
diff --git a/projects/admin/src/app/features/add-post/tag-multi-select/tag-multi-select.component.scss b/projects/admin/src/app/features/add-post/tag-multi-select/tag-multi-select.component.scss
new file mode 100644
index 0000000..912c112
--- /dev/null
+++ b/projects/admin/src/app/features/add-post/tag-multi-select/tag-multi-select.component.scss
@@ -0,0 +1,312 @@
+// Professional Tag Multi-Select Component
+// Brand colors: primary (#12372A), secondary (#436850), tertiary (#ADBC9F), quaternary (#FBFADA)
+
+.tag-multi-select {
+  width: 100%;
+  position: relative;
+}
+
+// Selected Tags Container
+.selected-tags-container {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.5rem;
+  margin-bottom: 0.75rem;
+  min-height: 2rem;
+}
+
+.selected-tag {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5rem;
+  padding: 0.375rem 0.75rem;
+  background: #12372A;
+  color: white;
+  border-radius: 20px;
+  font-size: 0.875rem;
+  font-weight: 500;
+  cursor: pointer;
+  transition: all 0.15s ease;
+  border: none;
+  outline: none;
+  position: relative;
+
+  &:hover {
+    transform: translateY(-1px);
+    box-shadow: 0 2px 8px rgba(18, 55, 42, 0.2);
+    background: rgba(18, 55, 42, 0.9);
+  }
+
+  &:focus-visible {
+    box-shadow: 0 0 0 2px white, 0 0 0 4px #12372A;
+  }
+
+  .tag-name {
+    line-height: 1;
+  }
+
+  .remove-button {
+    background: none;
+    border: none;
+    color: currentColor;
+    cursor: pointer;
+    padding: 0;
+    margin: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 50%;
+    width: 16px;
+    height: 16px;
+    opacity: 0.7;
+    transition: opacity 0.15s ease;
+
+    &:hover {
+      opacity: 1;
+      background: rgba(255, 255, 255, 0.2);
+    }
+
+    .remove-icon {
+      width: 12px;
+      height: 12px;
+    }
+  }
+}
+
+// Search Container
+.search-container {
+  position: relative;
+}
+
+.search-input {
+  width: 100%;
+  padding: 0.75rem 1rem;
+  padding-right: 2.5rem;
+  border: 2px solid rgba(173, 188, 159, 0.3);
+  border-radius: 8px;
+  font-size: 0.875rem;
+  background: white;
+  color: #12372A;
+  transition: all 0.2s ease;
+
+  &:focus {
+    outline: none;
+    border-color: #12372A;
+    box-shadow: 0 0 0 3px rgba(18, 55, 42, 0.1);
+  }
+
+  &::placeholder {
+    color: rgba(67, 104, 80, 0.5);
+  }
+
+  &:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+    background: rgba(173, 188, 159, 0.1);
+  }
+}
+
+.search-icon {
+  position: absolute;
+  right: 0.75rem;
+  top: 50%;
+  transform: translateY(-50%);
+  color: rgba(67, 104, 80, 0.5);
+  pointer-events: none;
+
+  svg {
+    width: 16px;
+    height: 16px;
+  }
+}
+
+// Dropdown Menu
+.dropdown-menu {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  right: 0;
+  z-index: 1000;
+  margin-top: 0.25rem;
+  background: white;
+  border: 1px solid rgba(173, 188, 159, 0.3);
+  border-radius: 8px;
+  box-shadow: 0 4px 12px rgba(18, 55, 42, 0.15);
+  max-height: 240px;
+  overflow-y: auto;
+  padding: 0.25rem;
+
+  // Custom scrollbar
+  &::-webkit-scrollbar {
+    width: 4px;
+  }
+
+  &::-webkit-scrollbar-track {
+    background: rgba(173, 188, 159, 0.1);
+    border-radius: 2px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background: rgba(173, 188, 159, 0.3);
+    border-radius: 2px;
+    
+    &:hover {
+      background: rgba(173, 188, 159, 0.5);
+    }
+  }
+}
+
+.dropdown-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0.75rem;
+  border-radius: 6px;
+  cursor: pointer;
+  transition: all 0.15s ease;
+  color: #12372A;
+
+  &:hover,
+  &.focused {
+    background: rgba(173, 188, 159, 0.1);
+    color: #12372A;
+  }
+
+  &.focused {
+    background: #12372A;
+    color: white;
+
+    .add-icon {
+      color: white;
+    }
+
+    .tag-color-indicator {
+      border-color: white;
+    }
+  }
+}
+
+.tag-info {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  flex: 1;
+
+  .tag-name {
+    font-size: 0.875rem;
+    font-weight: 500;
+  }
+}
+
+.tag-color-indicator {
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  border: 1px solid rgba(173, 188, 159, 0.3);
+  flex-shrink: 0;
+}
+
+.add-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 20px;
+  color: rgba(67, 104, 80, 0.6);
+  transition: color 0.15s ease;
+
+  svg {
+    width: 14px;
+    height: 14px;
+  }
+}
+
+// No Results State
+.no-results {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 1.5rem;
+  color: rgba(67, 104, 80, 0.6);
+  text-align: center;
+
+  .no-results-icon {
+    width: 24px;
+    height: 24px;
+    margin-bottom: 0.5rem;
+    opacity: 0.5;
+  }
+
+  span {
+    font-size: 0.875rem;
+    font-style: italic;
+  }
+}
+
+// Responsive Design
+@media (max-width: 768px) {
+  .selected-tag {
+    font-size: 0.8125rem;
+    padding: 0.25rem 0.5rem;
+    gap: 0.375rem;
+
+    .remove-button {
+      width: 14px;
+      height: 14px;
+
+      .remove-icon {
+        width: 10px;
+        height: 10px;
+      }
+    }
+  }
+
+  .search-input {
+    font-size: 1rem; // Prevent zoom on iOS
+  }
+
+  .dropdown-menu {
+    max-height: 200px;
+  }
+
+  .dropdown-item {
+    padding: 0.625rem;
+  }
+}
+
+// Focus and Accessibility
+.tag-multi-select:focus-within {
+  .search-input {
+    border-color: #12372A;
+    box-shadow: 0 0 0 3px rgba(18, 55, 42, 0.1);
+  }
+}
+
+// Animation for dropdown
+.dropdown-menu {
+  animation: slideDown 0.15s ease;
+}
+
+@keyframes slideDown {
+  from {
+    opacity: 0;
+    transform: translateY(-8px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+// Empty state for selected tags
+.selected-tags-container:empty {
+  display: none;
+}
+
+.tag-multi-select:has(.selected-tags-container:not(:empty)) {
+  .search-input {
+    border-top-left-radius: 8px;
+    border-top-right-radius: 8px;
+  }
+}
\ No newline at end of file
diff --git a/src/app/shared/tag-multi-select/tag-multi-select.component.ts b/projects/admin/src/app/features/add-post/tag-multi-select/tag-multi-select.component.ts
similarity index 64%
rename from src/app/shared/tag-multi-select/tag-multi-select.component.ts
rename to projects/admin/src/app/features/add-post/tag-multi-select/tag-multi-select.component.ts
index efb1071..75d4e02 100644
--- a/src/app/shared/tag-multi-select/tag-multi-select.component.ts
+++ b/projects/admin/src/app/features/add-post/tag-multi-select/tag-multi-select.component.ts
@@ -12,11 +12,11 @@ import {
 } from '@angular/core';
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { Subject } from 'rxjs';
-import { ReaderApiService } from '../../reader/_services/reader-api.service';
-import { Tag } from '../../types/supabase';
+import { AdminApiService } from '../../../core/services/admin-api.service';
+import { Tag } from 'shared';
 
 @Component({
-  selector: 'blog-tag-multi-select',
+  selector: 'admin-tag-multi-select',
   standalone: true,
   imports: [],
   providers: [
@@ -27,49 +27,48 @@ import { Tag } from '../../types/supabase';
     },
   ],
   templateUrl: './tag-multi-select.component.html',
+  styleUrl: './tag-multi-select.component.scss',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class TagMultiSelectComponent implements ControlValueAccessor, OnInit {
   private elementRef = inject(ElementRef);
-  private readerApi = inject(ReaderApiService);
+  private adminApi = inject(AdminApiService);
 
-  searchInput = viewChild.required<ElementRef<HTMLInputElement>>('searchInput');
+  readonly searchInput = viewChild.required<ElementRef<HTMLInputElement>>('searchInput');
 
   // Signals
-  allTags = signal<Tag[]>([]);
-  selectedTags = signal<Tag[]>([]);
-  searchTerm = signal('');
-  isOpen = signal(false);
-  disabled = signal(false);
-  focusedTagId = signal<number | null>(null);
-  isTouched = signal(false);
+  readonly allTags = signal<Tag[]>([]);
+  readonly selectedTags = signal<Tag[]>([]);
+  readonly searchTerm = signal('');
+  readonly isOpen = signal(false);
+  readonly disabled = signal(false);
+  readonly focusedTagId = signal<number | null>(null);
+  readonly isTouched = signal(false);
 
   // Search subject for debouncing
   private searchSubject = new Subject<string>();
 
   // Computed values
-  filteredTags = computed(() => {
+  readonly filteredTags = computed(() => {
     const search = this.searchTerm().toLowerCase();
     const selected = this.selectedTags();
     return this.allTags().filter(
-      (tag) =>
-        tag.name.toLowerCase().includes(search) &&
-        !selected.some((s) => s.id === tag.id),
+      tag => tag.name.toLowerCase().includes(search) && !selected.some(s => s.id === tag.id)
     );
   });
 
   // ControlValueAccessor
-  private onChange = (value: Tag[]) => {};
-  private onTouched = () => {};
+  private onChange: ((value: Tag[]) => void) | null = null;
+  private onTouched: (() => void) | null = null;
 
   ngOnInit() {
     this.loadTags();
   }
 
   private loadTags() {
-    this.readerApi.getTags().subscribe({
-      next: (tags) => this.allTags.set(tags!),
-      error: (error) => console.error('Failed to load tags:', error),
+    this.adminApi.getTags().subscribe({
+      next: (tags: Tag[]) => this.allTags.set(tags),
+      error: (error: unknown) => console.error('Failed to load tags:', error),
     });
   }
 
@@ -93,10 +92,10 @@ export class TagMultiSelectComponent implements ControlValueAccessor, OnInit {
   }
 
   selectTag(tag: Tag): void {
-    if (!this.selectedTags().find((t) => t.id === tag.id)) {
-      this.selectedTags.update((tags) => [...tags, tag]);
-      this.onChange(this.selectedTags());
-      this.onTouched();
+    if (!this.selectedTags().find(t => t.id === tag.id)) {
+      this.selectedTags.update(tags => [...tags, tag]);
+      this.onChange?.(this.selectedTags());
+      this.onTouched?.();
 
       this.searchTerm.set('');
       this.searchInput().nativeElement.value = '';
@@ -111,14 +110,14 @@ export class TagMultiSelectComponent implements ControlValueAccessor, OnInit {
 
   removeTag(tag: Tag) {
     const current = this.selectedTags();
-    const updated = current.filter((t) => t.id !== tag.id);
+    const updated = current.filter(t => t.id !== tag.id);
     this.selectedTags.set(updated);
-    this.onChange(updated);
+    this.onChange?.(updated);
     this.markAsTouched();
   }
 
   isTagSelected(tag: Tag): boolean {
-    return this.selectedTags().some((t) => t.id === tag.id);
+    return this.selectedTags().some(t => t.id === tag.id);
   }
 
   trackByTagId(index: number, tag: Tag): number {
@@ -128,7 +127,7 @@ export class TagMultiSelectComponent implements ControlValueAccessor, OnInit {
   private markAsTouched() {
     if (!this.isTouched()) {
       this.isTouched.set(true);
-      this.onTouched();
+      this.onTouched?.();
     }
   }
 
@@ -137,34 +136,31 @@ export class TagMultiSelectComponent implements ControlValueAccessor, OnInit {
     if (!this.isOpen() || this.disabled()) return;
 
     const filtered = this.filteredTags();
-    const currentIndex = filtered.findIndex(
-      (tag) => tag.id === this.focusedTagId(),
-    );
+    const currentIndex = filtered.findIndex(tag => tag.id === this.focusedTagId());
 
     switch (event.key) {
-      case 'ArrowDown':
+      case 'ArrowDown': {
         event.preventDefault();
-        const nextIndex =
-          currentIndex < filtered.length - 1 ? currentIndex + 1 : 0;
+        const nextIndex = currentIndex < filtered.length - 1 ? currentIndex + 1 : 0;
         this.focusedTagId.set(filtered[nextIndex]?.id || null);
         break;
+      }
 
-      case 'ArrowUp':
+      case 'ArrowUp': {
         event.preventDefault();
-        const prevIndex =
-          currentIndex > 0 ? currentIndex - 1 : filtered.length - 1;
+        const prevIndex = currentIndex > 0 ? currentIndex - 1 : filtered.length - 1;
         this.focusedTagId.set(filtered[prevIndex]?.id || null);
         break;
+      }
 
-      case 'Enter':
+      case 'Enter': {
         event.preventDefault();
-        const focusedTag = filtered.find(
-          (tag) => tag.id === this.focusedTagId(),
-        );
+        const focusedTag = filtered.find(tag => tag.id === this.focusedTagId());
         if (focusedTag) {
           this.selectTag(focusedTag);
         }
         break;
+      }
 
       case 'Escape':
         event.preventDefault();
diff --git a/projects/admin/src/app/layout/login/login.component.html b/projects/admin/src/app/layout/login/login.component.html
new file mode 100644
index 0000000..9ea7fa3
--- /dev/null
+++ b/projects/admin/src/app/layout/login/login.component.html
@@ -0,0 +1,135 @@
+<div class="admin-login-layout">
+  <div class="admin-login-container">
+    <!-- Header Section -->
+    <header class="admin-header">
+      <div class="brand-section">
+        <h1 class="brand-title">angular.fun</h1>
+        <p class="brand-subtitle">Administrative Panel</p>
+      </div>
+    </header>
+
+    <!-- Main Content Grid -->
+    <main class="admin-main">
+      <!-- Left Panel - Information -->
+      <aside class="admin-sidebar">
+        <div class="info-panel">
+          <div class="panel-header">
+            <h2 class="panel-title">Content Management System</h2>
+          </div>
+          
+          <div class="features-grid">
+            <div class="feature-card">
+              <h3 class="feature-title">Blog Management</h3>
+              <p class="feature-description">Create, edit, and publish blog posts with rich content editor</p>
+            </div>
+            
+            <div class="feature-card">
+              <h3 class="feature-title">Analytics Dashboard</h3>
+              <p class="feature-description">Monitor site performance and user engagement metrics</p>
+            </div>
+            
+            <div class="feature-card">
+              <h3 class="feature-title">User Management</h3>
+              <p class="feature-description">Manage user accounts, roles, and permissions</p>
+            </div>
+          </div>
+        </div>
+      </aside>
+
+      <!-- Right Panel - Login Form -->
+      <section class="admin-form-section">
+        <div class="form-container">
+          <div class="form-header">
+            <h2 class="form-title">Sign In</h2>
+            <p class="form-subtitle">Access your admin dashboard</p>
+          </div>
+
+          <!-- Login Form -->
+          <form class="login-form" [formGroup]="form" (ngSubmit)="onSubmit()">
+            <div class="form-grid">
+              <!-- Email Field -->
+              <div class="input-group">
+                <label for="email" class="input-label">
+                  Email Address
+                </label>
+                <input
+                  id="email"
+                  formControlName="email"
+                  type="email"
+                  autocomplete="email"
+                  class="form-input"
+                  placeholder="admin@angular.fun"
+                  [class.input-error]="isSubmitted && form.controls.email.invalid"
+                />
+                @if (isSubmitted && form.controls.email.errors?.['required']) {
+                  <div class="error-message">Email is required</div>
+                }
+                @if (isSubmitted && form.controls.email.errors?.['email']) {
+                  <div class="error-message">Please enter a valid email address</div>
+                }
+              </div>
+
+              <!-- Password Field -->
+              <div class="input-group">
+                <label for="password" class="input-label">
+                  Password
+                </label>
+                <input
+                  id="password"
+                  formControlName="password"
+                  type="password"
+                  autocomplete="current-password"
+                  class="form-input"
+                  placeholder="Enter your password"
+                  [class.input-error]="isSubmitted && form.controls.password.invalid"
+                />
+                @if (isSubmitted && form.controls.password.errors?.['required']) {
+                  <div class="error-message">Password is required</div>
+                }
+              </div>
+
+              <!-- Error Message -->
+              @if (loginError()) {
+                <div class="login-error">
+                  Invalid credentials. Please try again.
+                </div>
+              }
+
+              <!-- Form Actions -->
+              <div class="form-actions">
+                <button
+                  type="submit"
+                  [disabled]="isLoading()"
+                  class="btn-primary"
+                >
+                  @if (isLoading()) {
+                    <span class="loading-text">Signing in...</span>
+                  } @else {
+                    Sign In
+                  }
+                </button>
+
+                <div class="form-divider">
+                  <span>Or</span>
+                </div>
+
+                <button
+                  (click)="onGoogleLogin()"
+                  [disabled]="isLoading()"
+                  class="btn-secondary"
+                  type="button"
+                >
+                  @if (isLoading()) {
+                    Signing in...
+                  } @else {
+                    Continue with Google
+                  }
+                </button>
+              </div>
+            </div>
+          </form>
+        </div>
+      </section>
+    </main>
+  </div>
+</div>
\ No newline at end of file
diff --git a/projects/admin/src/app/layout/login/login.component.scss b/projects/admin/src/app/layout/login/login.component.scss
new file mode 100644
index 0000000..5cadca9
--- /dev/null
+++ b/projects/admin/src/app/layout/login/login.component.scss
@@ -0,0 +1,366 @@
+// Clean Admin Login Layout - Structure Focused
+// Brand colors: primary (#12372A), secondary (#436850), tertiary (#ADBC9F), quaternary (#FBFADA)
+
+.admin-login-layout {
+  min-height: 100vh;
+  background: rgba(251, 250, 218, 0.5); // quaternary/50
+}
+
+.admin-login-container {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+  max-width: 1400px;
+  margin: 0 auto;
+  background: white;
+  box-shadow: 0 0 40px rgba(18, 55, 42, 0.1);
+}
+
+// Header Section
+.admin-header {
+  padding: 2rem 3rem;
+  background: #12372A; // primary
+  color: white;
+
+  .brand-section {
+    max-width: 1200px;
+    margin: 0 auto;
+  }
+
+  .brand-title {
+    font-size: 2.5rem;
+    font-weight: 800;
+    margin: 0;
+    letter-spacing: -0.025em;
+  }
+
+  .brand-subtitle {
+    font-size: 1.125rem;
+    margin: 0.5rem 0 0 0;
+    opacity: 0.9;
+    font-weight: 500;
+  }
+}
+
+// Main Content Grid
+.admin-main {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  flex: 1;
+  min-height: 0;
+}
+
+// Left Sidebar - Information Panel
+.admin-sidebar {
+  background: rgba(67, 104, 80, 0.05);
+  padding: 3rem;
+
+  .info-panel {
+    max-width: 500px;
+    margin: 0 auto;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+  }
+
+  .panel-header {
+    margin-bottom: 3rem;
+  }
+
+  .panel-title {
+    font-size: 2rem;
+    font-weight: 700;
+    color: #12372A;
+    margin: 0 0 1rem 0;
+    line-height: 1.2;
+  }
+}
+
+// Features Grid
+.features-grid {
+  display: grid;
+  gap: 2rem;
+}
+
+.feature-card {
+  padding: 2rem;
+  background: white;
+  border-radius: 12px;
+  border-left: 4px solid #ADBC9F;
+  box-shadow: 0 2px 8px rgba(18, 55, 42, 0.1);
+
+  .feature-title {
+    font-size: 1.25rem;
+    font-weight: 600;
+    color: #12372A;
+    margin: 0 0 0.75rem 0;
+  }
+
+  .feature-description {
+    font-size: 0.9375rem;
+    color: #436850;
+    margin: 0;
+    line-height: 1.5;
+  }
+}
+
+// Right Form Section
+.admin-form-section {
+  padding: 3rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: rgba(251, 250, 218, 0.2);
+}
+
+.form-container {
+  width: 100%;
+  max-width: 400px;
+}
+
+.form-header {
+  text-align: center;
+  margin-bottom: 2.5rem;
+
+  .form-title {
+    font-size: 2rem;
+    font-weight: 700;
+    color: #12372A;
+    margin: 0 0 0.5rem 0;
+  }
+
+  .form-subtitle {
+    font-size: 1rem;
+    color: #436850;
+    margin: 0;
+  }
+}
+
+// Login Form
+.login-form {
+  background: white;
+  padding: 2.5rem;
+  border-radius: 16px;
+  box-shadow: 0 8px 32px rgba(18, 55, 42, 0.12);
+  border: 1px solid rgba(173, 188, 159, 0.2);
+}
+
+.form-grid {
+  display: grid;
+  gap: 1.5rem;
+}
+
+// Input Groups
+.input-group {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+}
+
+.input-label {
+  font-size: 0.875rem;
+  font-weight: 600;
+  color: #12372A;
+  margin: 0;
+}
+
+.form-input {
+  padding: 0.875rem 1rem;
+  border: 2px solid rgba(173, 188, 159, 0.3);
+  border-radius: 8px;
+  font-size: 1rem;
+  background: white;
+  color: #12372A;
+  transition: all 0.2s ease;
+
+  &:focus {
+    outline: none;
+    border-color: #12372A;
+    box-shadow: 0 0 0 3px rgba(18, 55, 42, 0.1);
+  }
+
+  &::placeholder {
+    color: rgba(67, 104, 80, 0.5);
+  }
+
+  &.input-error {
+    border-color: #ef4444;
+
+    &:focus {
+      border-color: #ef4444;
+      box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
+    }
+  }
+}
+
+.error-message {
+  font-size: 0.8125rem;
+  color: #ef4444;
+  margin-top: 0.25rem;
+}
+
+.login-error {
+  padding: 1rem;
+  background: #fef2f2;
+  border: 1px solid #fecaca;
+  border-radius: 8px;
+  color: #dc2626;
+  font-size: 0.875rem;
+  text-align: center;
+}
+
+// Form Actions
+.form-actions {
+  display: grid;
+  gap: 1rem;
+  margin-top: 1rem;
+}
+
+.btn-primary {
+  padding: 0.875rem 1.5rem;
+  background: #12372A;
+  color: white;
+  border: none;
+  border-radius: 8px;
+  font-size: 1rem;
+  font-weight: 600;
+  cursor: pointer;
+  transition: all 0.2s ease;
+
+  &:hover:not(:disabled) {
+    background: rgba(18, 55, 42, 0.9);
+    transform: translateY(-1px);
+    box-shadow: 0 4px 12px rgba(18, 55, 42, 0.25);
+  }
+
+  &:disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+    transform: none;
+  }
+}
+
+.btn-secondary {
+  padding: 0.875rem 1.5rem;
+  background: white;
+  color: #436850;
+  border: 2px solid rgba(173, 188, 159, 0.3);
+  border-radius: 8px;
+  font-size: 1rem;
+  font-weight: 600;
+  cursor: pointer;
+  transition: all 0.2s ease;
+
+  &:hover:not(:disabled) {
+    background: rgba(251, 250, 218, 0.3);
+    border-color: rgba(67, 104, 80, 0.4);;
+    transform: translateY(-1px);
+    box-shadow: 0 4px 12px rgba(67, 104, 80, 0.15);
+  }
+
+  &:disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+    transform: none;
+  }
+}
+
+.form-divider {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  margin: 0.5rem 0;
+
+  &::before,
+  &::after {
+    content: '';
+    flex: 1;
+    height: 1px;
+    background: rgba(173, 188, 159, 0.3);
+  }
+
+  span {
+    font-size: 0.875rem;
+    color: rgba(67, 104, 80, 0.6);;
+    font-weight: 500;
+  }
+}
+
+.loading-text {
+  opacity: 0.8;
+}
+
+// Responsive Design
+@media (max-width: 1024px) {
+  .admin-main {
+    grid-template-columns: 1fr;
+  }
+
+  .admin-sidebar {
+    order: 2;
+    padding: 2rem;
+
+    .info-panel {
+      justify-content: flex-start;
+    }
+
+    .features-grid {
+      gap: 1.5rem;
+    }
+  }
+
+  .admin-form-section {
+    order: 1;
+    padding: 2rem;
+  }
+}
+
+@media (max-width: 768px) {
+  .admin-header {
+    padding: 1.5rem 2rem;
+
+    .brand-title {
+      font-size: 2rem;
+    }
+
+    .brand-subtitle {
+      font-size: 1rem;
+    }
+  }
+
+  .admin-sidebar {
+    padding: 1.5rem;
+  }
+
+  .admin-form-section {
+    padding: 1.5rem;
+  }
+
+  .login-form {
+    padding: 2rem;
+  }
+
+  .feature-card {
+    padding: 1.5rem;
+  }
+}
+
+@media (max-width: 480px) {
+  .admin-header {
+    padding: 1rem 1.5rem;
+  }
+
+  .admin-sidebar,
+  .admin-form-section {
+    padding: 1rem;
+  }
+
+  .login-form {
+    padding: 1.5rem;
+  }
+
+  .form-header .form-title {
+    font-size: 1.75rem;
+  }
+}
diff --git a/projects/admin/src/app/layout/login/login.component.ts b/projects/admin/src/app/layout/login/login.component.ts
new file mode 100644
index 0000000..2533893
--- /dev/null
+++ b/projects/admin/src/app/layout/login/login.component.ts
@@ -0,0 +1,81 @@
+import { ChangeDetectionStrategy, Component, WritableSignal, inject, signal } from '@angular/core';
+import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
+import { Router } from '@angular/router';
+import { LoginFormControls } from './login.interface';
+import { SupabaseService } from 'shared';
+import { Credentials } from 'shared';
+
+@Component({
+  selector: 'admin-login',
+  standalone: true,
+  imports: [ReactiveFormsModule],
+  templateUrl: './login.component.html',
+  styleUrl: './login.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class LoginComponent {
+  form = new FormGroup<LoginFormControls>({
+    email: new FormControl<string>('', {
+      nonNullable: true,
+      validators: [Validators.required, Validators.email],
+    }),
+    password: new FormControl<string>('', { nonNullable: true, validators: [Validators.required] }),
+  });
+  isSubmitted = false;
+  readonly loginError: WritableSignal<boolean> = signal(false);
+  readonly isLoading: WritableSignal<boolean> = signal(false);
+
+  private router = inject(Router);
+  private supabaseService = inject(SupabaseService);
+
+  onSubmit(): void {
+    this.isSubmitted = true;
+    this.loginError.set(false);
+
+    if (this.form.invalid) {
+      return;
+    }
+
+    const credentials = this.form.value as Credentials;
+    this.isLoading.set(true);
+
+    this.supabaseService
+      .signInWithPassword(credentials.email, credentials.password)
+      .then(({ error }) => {
+        this.isLoading.set(false);
+        console.log(error);
+        console.log('Login successful:', credentials.email);
+        if (error) {
+          this.loginError.set(true);
+          return;
+        }
+
+        this.loginError.set(false);
+        this.router.navigate(['/posts']);
+      })
+      .catch(() => {
+        this.isLoading.set(false);
+        this.loginError.set(true);
+      });
+  }
+
+  onGoogleLogin() {
+    this.isLoading.set(true);
+    this.supabaseService
+      .signInWithProvider('google')
+      .then(({ error }) => {
+        this.isLoading.set(false);
+
+        if (!error) {
+          // Redirect to admin dashboard
+          this.router.navigate(['/posts/add']);
+        } else {
+          this.loginError.set(true);
+        }
+      })
+      .catch(() => {
+        this.isLoading.set(false);
+        this.loginError.set(true);
+      });
+  }
+}
diff --git a/projects/admin/src/app/layout/login/login.interface.ts b/projects/admin/src/app/layout/login/login.interface.ts
new file mode 100644
index 0000000..fdccda0
--- /dev/null
+++ b/projects/admin/src/app/layout/login/login.interface.ts
@@ -0,0 +1,10 @@
+import { FormControl, FormGroup } from "@angular/forms";
+
+export interface LoginFormControls {
+  email: FormControl<string>;
+  password: FormControl<string>;
+}
+
+export interface LoginForm {
+  form: FormGroup<LoginFormControls>;
+}
\ No newline at end of file
diff --git a/projects/admin/src/app/layout/main-layout/main-layout.component.ts b/projects/admin/src/app/layout/main-layout/main-layout.component.ts
new file mode 100644
index 0000000..efc5189
--- /dev/null
+++ b/projects/admin/src/app/layout/main-layout/main-layout.component.ts
@@ -0,0 +1,22 @@
+import { Component } from '@angular/core';
+import { RouterOutlet } from '@angular/router';
+
+@Component({
+  selector: 'admin-main-layout',
+  standalone: true,
+  imports: [RouterOutlet],
+  template: `
+    <main class="admin-main">
+      <router-outlet />
+    </main>
+  `,
+  styles: [
+    `
+      .admin-main {
+        min-height: 100vh;
+        padding: 1rem;
+      }
+    `,
+  ],
+})
+export class MainLayoutComponent {}
diff --git a/projects/admin/src/index.html b/projects/admin/src/index.html
new file mode 100644
index 0000000..79f2b02
--- /dev/null
+++ b/projects/admin/src/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <title>Admin</title>
+  <base href="/">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="icon" type="image/x-icon" href="favicon.ico">
+</head>
+<body>
+  <admin-root></admin-root>
+</body>
+</html>
diff --git a/projects/admin/src/main.ts b/projects/admin/src/main.ts
new file mode 100644
index 0000000..5df75f9
--- /dev/null
+++ b/projects/admin/src/main.ts
@@ -0,0 +1,6 @@
+import { bootstrapApplication } from '@angular/platform-browser';
+import { appConfig } from './app/app.config';
+import { App } from './app/app';
+
+bootstrapApplication(App, appConfig)
+  .catch((err) => console.error(err));
diff --git a/src/styles.scss b/projects/admin/src/styles.scss
old mode 100755
new mode 100644
similarity index 53%
rename from src/styles.scss
rename to projects/admin/src/styles.scss
index 54381d2..3486818
--- a/src/styles.scss
+++ b/projects/admin/src/styles.scss
@@ -1,21 +1,6 @@
-@import "../node_modules/quill/dist/quill.core.css";
-@import "../node_modules/quill/dist/quill.snow.css";
-@import 'highlight.js/styles/atom-one-dark.css';
-
-
-// Custom styles for highlighted code blocks
-pre {
-  overflow-x: auto; /* Enable horizontal scrolling */
-  white-space: pre; /* Preserve whitespace and line breaks */
-  padding: 1rem; /* Add padding for better readability */
-  border-radius: 5px; /* Optional: Add border-radius for rounded corners */
-  background-color: #282c34; /* Optional: Set background color to match the theme */
-  color: #abb2bf; /* Optional: Set text color */
-}
-
-pre code {
-  font-size: 1rem; /* Set font size */
-}
+/* Quill Editor Styles */
+@import "../../../node_modules/quill/dist/quill.core.css";
+@import "../../../node_modules/quill/dist/quill.snow.css";
 
 /* Order */
 @layer reset, primeng;
@@ -26,6 +11,7 @@ pre code {
 @tailwind components;
 @tailwind utilities;
 
+
 h1 {
   @apply text-3xl font-bold mt-4 mb-1;
 }
@@ -118,48 +104,6 @@ h4 {
   @apply text-primary hover:underline;
 }
 
-.editor-container {
-  @apply p-4 border border-gray-300 rounded-lg;
-}
-
-/* Ensure Quill styles are applied correctly */
-.ql-code-block-container {
-  @apply bg-gray-100 border border-gray-300 rounded-lg p-4 break-words;
-}
-
-/* Strike-through text for Quill */
-.ql-strike {
-  @apply line-through;
-}
-
-/* Blockquote style for Quill */
-.ql-blockquote {
-  @apply border-l-4 border-gray-300 pl-4 italic;
-}
-
-/* Header styles for Quill */
-.ql-header.ql-size-h1 {
-  @apply text-4xl;
-}
-
-.ql-header.ql-size-h2 {
-  @apply text-3xl;
-}
-
-.ql-header.ql-size-h3 {
-  @apply text-2xl;
-}
-
-/* custom-quill-styles.css */
-
-.ql-align-center {
-  @apply flex justify-center;
-}
-
-/* Ensure that the flex container applies to block-level elements */
-.ql-align-center > * {
-  @apply flex items-center;
-}
 
 html, body {
   margin: 0;
diff --git a/projects/admin/tsconfig.app.json b/projects/admin/tsconfig.app.json
new file mode 100644
index 0000000..742c488
--- /dev/null
+++ b/projects/admin/tsconfig.app.json
@@ -0,0 +1,15 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/app",
+    "types": []
+  },
+  "include": [
+    "src/**/*.ts"
+  ],
+  "exclude": [
+    "src/**/*.spec.ts"
+  ]
+}
diff --git a/projects/admin/tsconfig.spec.json b/projects/admin/tsconfig.spec.json
new file mode 100644
index 0000000..0feea88
--- /dev/null
+++ b/projects/admin/tsconfig.spec.json
@@ -0,0 +1,14 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": [
+      "jasmine"
+    ]
+  },
+  "include": [
+    "src/**/*.ts"
+  ]
+}
diff --git a/projects/code-samples-mfe/eslint.config.js b/projects/code-samples-mfe/eslint.config.js
new file mode 100644
index 0000000..e8d0865
--- /dev/null
+++ b/projects/code-samples-mfe/eslint.config.js
@@ -0,0 +1,32 @@
+// @ts-check
+const tseslint = require("typescript-eslint");
+const rootConfig = require("../../eslint.config.js");
+
+module.exports = tseslint.config(
+  ...rootConfig,
+  {
+    files: ["**/*.ts"],
+    rules: {
+      "@angular-eslint/directive-selector": [
+        "error",
+        {
+          type: "attribute",
+          prefix: "mfe",
+          style: "camelCase",
+        },
+      ],
+      "@angular-eslint/component-selector": [
+        "error",
+        {
+          type: "element",
+          prefix: "mfe",
+          style: "kebab-case",
+        },
+      ],
+    },
+  },
+  {
+    files: ["**/*.html"],
+    rules: {},
+  }
+);
diff --git a/projects/code-samples-mfe/public/favicon.ico b/projects/code-samples-mfe/public/favicon.ico
new file mode 100644
index 0000000..57614f9
Binary files /dev/null and b/projects/code-samples-mfe/public/favicon.ico differ
diff --git a/projects/code-samples-mfe/src/app/app.component.html b/projects/code-samples-mfe/src/app/app.component.html
new file mode 100644
index 0000000..a36d575
--- /dev/null
+++ b/projects/code-samples-mfe/src/app/app.component.html
@@ -0,0 +1 @@
+<p>app works!</p>
diff --git a/src/app/app.component.scss b/projects/code-samples-mfe/src/app/app.component.scss
old mode 100755
new mode 100644
similarity index 100%
rename from src/app/app.component.scss
rename to projects/code-samples-mfe/src/app/app.component.scss
diff --git a/src/app/admin/admin.component.spec.ts b/projects/code-samples-mfe/src/app/app.component.spec.ts
old mode 100755
new mode 100644
similarity index 55%
rename from src/app/admin/admin.component.spec.ts
rename to projects/code-samples-mfe/src/app/app.component.spec.ts
index 93d56d8..c7baa22
--- a/src/app/admin/admin.component.spec.ts
+++ b/projects/code-samples-mfe/src/app/app.component.spec.ts
@@ -1,18 +1,18 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { AdminComponent } from './admin.component';
+import { AppComponent } from './app.component';
 
-describe('AdminComponent', () => {
-  let component: AdminComponent;
-  let fixture: ComponentFixture<AdminComponent>;
+describe('AppComponent', () => {
+  let component: AppComponent;
+  let fixture: ComponentFixture<AppComponent>;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [AdminComponent]
+      imports: [AppComponent]
     })
     .compileComponents();
-    
-    fixture = TestBed.createComponent(AdminComponent);
+
+    fixture = TestBed.createComponent(AppComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });
diff --git a/projects/code-samples-mfe/src/app/app.component.ts b/projects/code-samples-mfe/src/app/app.component.ts
new file mode 100644
index 0000000..212dde8
--- /dev/null
+++ b/projects/code-samples-mfe/src/app/app.component.ts
@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'mfe-root',
+  imports: [],
+  templateUrl: './app.component.html',
+  styleUrl: './app.component.scss'
+})
+export class AppComponent {
+
+}
diff --git a/projects/code-samples-mfe/src/app/app.config.ts b/projects/code-samples-mfe/src/app/app.config.ts
new file mode 100644
index 0000000..8803f6d
--- /dev/null
+++ b/projects/code-samples-mfe/src/app/app.config.ts
@@ -0,0 +1,11 @@
+import { ApplicationConfig, provideBrowserGlobalErrorListeners, provideZonelessChangeDetection } from '@angular/core';
+import { provideRouter } from '@angular/router';
+import { routes } from './app.routes';
+
+export const appConfig: ApplicationConfig = {
+  providers: [
+    provideBrowserGlobalErrorListeners(),
+    provideZonelessChangeDetection(),
+    provideRouter(routes)
+  ]
+};
diff --git a/projects/code-samples-mfe/src/app/app.html b/projects/code-samples-mfe/src/app/app.html
new file mode 100644
index 0000000..7528372
--- /dev/null
+++ b/projects/code-samples-mfe/src/app/app.html
@@ -0,0 +1,342 @@
+<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
+<!-- * * * * * * * * * * * The content below * * * * * * * * * * * -->
+<!-- * * * * * * * * * * is only a placeholder * * * * * * * * * * -->
+<!-- * * * * * * * * * * and can be replaced.  * * * * * * * * * * -->
+<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
+<!-- * * * * * * * * * Delete the template below * * * * * * * * * -->
+<!-- * * * * * * * to get started with your project! * * * * * * * -->
+<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
+
+<style>
+  :host {
+    --bright-blue: oklch(51.01% 0.274 263.83);
+    --electric-violet: oklch(53.18% 0.28 296.97);
+    --french-violet: oklch(47.66% 0.246 305.88);
+    --vivid-pink: oklch(69.02% 0.277 332.77);
+    --hot-red: oklch(61.42% 0.238 15.34);
+    --orange-red: oklch(63.32% 0.24 31.68);
+
+    --gray-900: oklch(19.37% 0.006 300.98);
+    --gray-700: oklch(36.98% 0.014 302.71);
+    --gray-400: oklch(70.9% 0.015 304.04);
+
+    --red-to-pink-to-purple-vertical-gradient: linear-gradient(
+      180deg,
+      var(--orange-red) 0%,
+      var(--vivid-pink) 50%,
+      var(--electric-violet) 100%
+    );
+
+    --red-to-pink-to-purple-horizontal-gradient: linear-gradient(
+      90deg,
+      var(--orange-red) 0%,
+      var(--vivid-pink) 50%,
+      var(--electric-violet) 100%
+    );
+
+    --pill-accent: var(--bright-blue);
+
+    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+      Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
+      "Segoe UI Symbol";
+    box-sizing: border-box;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+  }
+
+  h1 {
+    font-size: 3.125rem;
+    color: var(--gray-900);
+    font-weight: 500;
+    line-height: 100%;
+    letter-spacing: -0.125rem;
+    margin: 0;
+    font-family: "Inter Tight", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+      Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
+      "Segoe UI Symbol";
+  }
+
+  p {
+    margin: 0;
+    color: var(--gray-700);
+  }
+
+  main {
+    width: 100%;
+    min-height: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 1rem;
+    box-sizing: inherit;
+    position: relative;
+  }
+
+  .angular-logo {
+    max-width: 9.2rem;
+  }
+
+  .content {
+    display: flex;
+    justify-content: space-around;
+    width: 100%;
+    max-width: 700px;
+    margin-bottom: 3rem;
+  }
+
+  .content h1 {
+    margin-top: 1.75rem;
+  }
+
+  .content p {
+    margin-top: 1.5rem;
+  }
+
+  .divider {
+    width: 1px;
+    background: var(--red-to-pink-to-purple-vertical-gradient);
+    margin-inline: 0.5rem;
+  }
+
+  .pill-group {
+    display: flex;
+    flex-direction: column;
+    align-items: start;
+    flex-wrap: wrap;
+    gap: 1.25rem;
+  }
+
+  .pill {
+    display: flex;
+    align-items: center;
+    --pill-accent: var(--bright-blue);
+    background: color-mix(in srgb, var(--pill-accent) 5%, transparent);
+    color: var(--pill-accent);
+    padding-inline: 0.75rem;
+    padding-block: 0.375rem;
+    border-radius: 2.75rem;
+    border: 0;
+    transition: background 0.3s ease;
+    font-family: var(--inter-font);
+    font-size: 0.875rem;
+    font-style: normal;
+    font-weight: 500;
+    line-height: 1.4rem;
+    letter-spacing: -0.00875rem;
+    text-decoration: none;
+    white-space: nowrap;
+  }
+
+  .pill:hover {
+    background: color-mix(in srgb, var(--pill-accent) 15%, transparent);
+  }
+
+  .pill-group .pill:nth-child(6n + 1) {
+    --pill-accent: var(--bright-blue);
+  }
+  .pill-group .pill:nth-child(6n + 2) {
+    --pill-accent: var(--electric-violet);
+  }
+  .pill-group .pill:nth-child(6n + 3) {
+    --pill-accent: var(--french-violet);
+  }
+
+  .pill-group .pill:nth-child(6n + 4),
+  .pill-group .pill:nth-child(6n + 5),
+  .pill-group .pill:nth-child(6n + 6) {
+    --pill-accent: var(--hot-red);
+  }
+
+  .pill-group svg {
+    margin-inline-start: 0.25rem;
+  }
+
+  .social-links {
+    display: flex;
+    align-items: center;
+    gap: 0.73rem;
+    margin-top: 1.5rem;
+  }
+
+  .social-links path {
+    transition: fill 0.3s ease;
+    fill: var(--gray-400);
+  }
+
+  .social-links a:hover svg path {
+    fill: var(--gray-900);
+  }
+
+  @media screen and (max-width: 650px) {
+    .content {
+      flex-direction: column;
+      width: max-content;
+    }
+
+    .divider {
+      height: 1px;
+      width: 100%;
+      background: var(--red-to-pink-to-purple-horizontal-gradient);
+      margin-block: 1.5rem;
+    }
+  }
+</style>
+
+<main class="main">
+  <div class="content">
+    <div class="left-side">
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 982 239"
+        fill="none"
+        class="angular-logo"
+      >
+        <g clip-path="url(#a)">
+          <path
+            fill="url(#b)"
+            d="M388.676 191.625h30.849L363.31 31.828h-35.758l-56.215 159.797h30.848l13.174-39.356h60.061l13.256 39.356Zm-65.461-62.675 21.602-64.311h1.227l21.602 64.311h-44.431Zm126.831-7.527v70.202h-28.23V71.839h27.002v20.374h1.392c2.782-6.71 7.2-12.028 13.255-15.956 6.056-3.927 13.584-5.89 22.503-5.89 8.264 0 15.465 1.8 21.684 5.318 6.137 3.518 10.964 8.673 14.319 15.382 3.437 6.71 5.074 14.81 4.992 24.383v76.175h-28.23v-71.92c0-8.019-2.046-14.237-6.219-18.819-4.173-4.5-9.819-6.791-17.102-6.791-4.91 0-9.328 1.063-13.174 3.272-3.846 2.128-6.792 5.237-9.001 9.328-2.046 4.009-3.191 8.918-3.191 14.728ZM589.233 239c-10.147 0-18.82-1.391-26.103-4.091-7.282-2.7-13.092-6.382-17.511-10.964-4.418-4.582-7.528-9.655-9.164-15.219l25.448-6.136c1.145 2.372 2.782 4.663 4.991 6.954 2.209 2.291 5.155 4.255 8.837 5.81 3.683 1.554 8.428 2.291 14.074 2.291 8.019 0 14.647-1.964 19.884-5.81 5.237-3.845 7.856-10.227 7.856-19.064v-22.665h-1.391c-1.473 2.946-3.601 5.892-6.383 9.001-2.782 3.109-6.464 5.645-10.965 7.691-4.582 2.046-10.228 3.109-17.101 3.109-9.165 0-17.511-2.209-25.039-6.545-7.446-4.337-13.42-10.883-17.757-19.474-4.418-8.673-6.628-19.473-6.628-32.565 0-13.091 2.21-24.301 6.628-33.383 4.419-9.082 10.311-15.955 17.839-20.7 7.528-4.746 15.874-7.037 25.039-7.037 7.037 0 12.846 1.145 17.347 3.518 4.582 2.373 8.182 5.236 10.883 8.51 2.7 3.272 4.746 6.382 6.137 9.327h1.554v-19.8h27.821v121.749c0 10.228-2.454 18.737-7.364 25.447-4.91 6.709-11.538 11.7-20.048 15.055-8.509 3.355-18.165 4.991-28.884 4.991Zm.245-71.266c5.974 0 11.047-1.473 15.302-4.337 4.173-2.945 7.446-7.118 9.573-12.519 2.21-5.482 3.274-12.027 3.274-19.637 0-7.609-1.064-14.155-3.274-19.8-2.127-5.646-5.318-10.064-9.491-13.255-4.174-3.11-9.329-4.746-15.384-4.746s-11.537 1.636-15.792 4.91c-4.173 3.272-7.365 7.772-9.492 13.418-2.128 5.727-3.191 12.191-3.191 19.392 0 7.2 1.063 13.745 3.273 19.228 2.127 5.482 5.318 9.736 9.573 12.764 4.174 3.027 9.41 4.582 15.629 4.582Zm141.56-26.51V71.839h28.23v119.786h-27.412v-21.273h-1.227c-2.7 6.709-7.119 12.191-13.338 16.446-6.137 4.255-13.747 6.382-22.748 6.382-7.855 0-14.81-1.718-20.783-5.237-5.974-3.518-10.72-8.591-14.075-15.382-3.355-6.709-5.073-14.891-5.073-24.464V71.839h28.312v71.921c0 7.609 2.046 13.664 6.219 18.083 4.173 4.5 9.655 6.709 16.365 6.709 4.173 0 8.183-.982 12.111-3.028 3.927-2.045 7.118-5.072 9.655-9.082 2.537-4.091 3.764-9.164 3.764-15.218Zm65.707-109.395v159.796h-28.23V31.828h28.23Zm44.841 162.169c-7.61 0-14.402-1.391-20.457-4.091-6.055-2.7-10.883-6.791-14.32-12.109-3.518-5.319-5.237-11.946-5.237-19.801 0-6.791 1.228-12.355 3.765-16.773 2.536-4.419 5.891-7.937 10.228-10.637 4.337-2.618 9.164-4.664 14.647-6.055 5.4-1.391 11.046-2.373 16.856-3.027 7.037-.737 12.683-1.391 17.102-1.964 4.337-.573 7.528-1.555 9.574-2.782 1.963-1.309 3.027-3.273 3.027-5.973v-.491c0-5.891-1.718-10.391-5.237-13.664-3.518-3.191-8.51-4.828-15.056-4.828-6.955 0-12.356 1.473-16.447 4.5-4.009 3.028-6.71 6.546-8.183 10.719l-26.348-3.764c2.046-7.282 5.483-13.336 10.31-18.328 4.746-4.909 10.638-8.59 17.511-11.045 6.955-2.455 14.565-3.682 22.912-3.682 5.809 0 11.537.654 17.265 2.045s10.965 3.6 15.711 6.71c4.746 3.109 8.51 7.282 11.455 12.6 2.864 5.318 4.337 11.946 4.337 19.883v80.184h-27.166v-16.446h-.9c-1.719 3.355-4.092 6.464-7.201 9.328-3.109 2.864-6.955 5.237-11.619 6.955-4.828 1.718-10.229 2.536-16.529 2.536Zm7.364-20.701c5.646 0 10.556-1.145 14.729-3.354 4.173-2.291 7.364-5.237 9.655-9.001 2.292-3.763 3.355-7.854 3.355-12.273v-14.155c-.9.737-2.373 1.391-4.5 2.046-2.128.654-4.419 1.145-7.037 1.636-2.619.491-5.155.9-7.692 1.227-2.537.328-4.746.655-6.628.901-4.173.572-8.019 1.472-11.292 2.781-3.355 1.31-5.973 3.11-7.855 5.401-1.964 2.291-2.864 5.318-2.864 8.918 0 5.237 1.882 9.164 5.728 11.782 3.682 2.782 8.51 4.091 14.401 4.091Zm64.643 18.328V71.839h27.412v19.965h1.227c2.21-6.955 5.974-12.274 11.292-16.038 5.319-3.763 11.456-5.645 18.329-5.645 1.555 0 3.355.082 5.237.163 1.964.164 3.601.328 4.91.573v25.938c-1.227-.41-3.109-.819-5.646-1.146a58.814 58.814 0 0 0-7.446-.49c-5.155 0-9.738 1.145-13.829 3.354-4.091 2.209-7.282 5.236-9.655 9.164-2.373 3.927-3.519 8.427-3.519 13.5v70.448h-28.312ZM222.077 39.192l-8.019 125.923L137.387 0l84.69 39.192Zm-53.105 162.825-57.933 33.056-57.934-33.056 11.783-28.556h92.301l11.783 28.556ZM111.039 62.675l30.357 73.803H80.681l30.358-73.803ZM7.937 165.115 0 39.192 84.69 0 7.937 165.115Z"
+          />
+          <path
+            fill="url(#c)"
+            d="M388.676 191.625h30.849L363.31 31.828h-35.758l-56.215 159.797h30.848l13.174-39.356h60.061l13.256 39.356Zm-65.461-62.675 21.602-64.311h1.227l21.602 64.311h-44.431Zm126.831-7.527v70.202h-28.23V71.839h27.002v20.374h1.392c2.782-6.71 7.2-12.028 13.255-15.956 6.056-3.927 13.584-5.89 22.503-5.89 8.264 0 15.465 1.8 21.684 5.318 6.137 3.518 10.964 8.673 14.319 15.382 3.437 6.71 5.074 14.81 4.992 24.383v76.175h-28.23v-71.92c0-8.019-2.046-14.237-6.219-18.819-4.173-4.5-9.819-6.791-17.102-6.791-4.91 0-9.328 1.063-13.174 3.272-3.846 2.128-6.792 5.237-9.001 9.328-2.046 4.009-3.191 8.918-3.191 14.728ZM589.233 239c-10.147 0-18.82-1.391-26.103-4.091-7.282-2.7-13.092-6.382-17.511-10.964-4.418-4.582-7.528-9.655-9.164-15.219l25.448-6.136c1.145 2.372 2.782 4.663 4.991 6.954 2.209 2.291 5.155 4.255 8.837 5.81 3.683 1.554 8.428 2.291 14.074 2.291 8.019 0 14.647-1.964 19.884-5.81 5.237-3.845 7.856-10.227 7.856-19.064v-22.665h-1.391c-1.473 2.946-3.601 5.892-6.383 9.001-2.782 3.109-6.464 5.645-10.965 7.691-4.582 2.046-10.228 3.109-17.101 3.109-9.165 0-17.511-2.209-25.039-6.545-7.446-4.337-13.42-10.883-17.757-19.474-4.418-8.673-6.628-19.473-6.628-32.565 0-13.091 2.21-24.301 6.628-33.383 4.419-9.082 10.311-15.955 17.839-20.7 7.528-4.746 15.874-7.037 25.039-7.037 7.037 0 12.846 1.145 17.347 3.518 4.582 2.373 8.182 5.236 10.883 8.51 2.7 3.272 4.746 6.382 6.137 9.327h1.554v-19.8h27.821v121.749c0 10.228-2.454 18.737-7.364 25.447-4.91 6.709-11.538 11.7-20.048 15.055-8.509 3.355-18.165 4.991-28.884 4.991Zm.245-71.266c5.974 0 11.047-1.473 15.302-4.337 4.173-2.945 7.446-7.118 9.573-12.519 2.21-5.482 3.274-12.027 3.274-19.637 0-7.609-1.064-14.155-3.274-19.8-2.127-5.646-5.318-10.064-9.491-13.255-4.174-3.11-9.329-4.746-15.384-4.746s-11.537 1.636-15.792 4.91c-4.173 3.272-7.365 7.772-9.492 13.418-2.128 5.727-3.191 12.191-3.191 19.392 0 7.2 1.063 13.745 3.273 19.228 2.127 5.482 5.318 9.736 9.573 12.764 4.174 3.027 9.41 4.582 15.629 4.582Zm141.56-26.51V71.839h28.23v119.786h-27.412v-21.273h-1.227c-2.7 6.709-7.119 12.191-13.338 16.446-6.137 4.255-13.747 6.382-22.748 6.382-7.855 0-14.81-1.718-20.783-5.237-5.974-3.518-10.72-8.591-14.075-15.382-3.355-6.709-5.073-14.891-5.073-24.464V71.839h28.312v71.921c0 7.609 2.046 13.664 6.219 18.083 4.173 4.5 9.655 6.709 16.365 6.709 4.173 0 8.183-.982 12.111-3.028 3.927-2.045 7.118-5.072 9.655-9.082 2.537-4.091 3.764-9.164 3.764-15.218Zm65.707-109.395v159.796h-28.23V31.828h28.23Zm44.841 162.169c-7.61 0-14.402-1.391-20.457-4.091-6.055-2.7-10.883-6.791-14.32-12.109-3.518-5.319-5.237-11.946-5.237-19.801 0-6.791 1.228-12.355 3.765-16.773 2.536-4.419 5.891-7.937 10.228-10.637 4.337-2.618 9.164-4.664 14.647-6.055 5.4-1.391 11.046-2.373 16.856-3.027 7.037-.737 12.683-1.391 17.102-1.964 4.337-.573 7.528-1.555 9.574-2.782 1.963-1.309 3.027-3.273 3.027-5.973v-.491c0-5.891-1.718-10.391-5.237-13.664-3.518-3.191-8.51-4.828-15.056-4.828-6.955 0-12.356 1.473-16.447 4.5-4.009 3.028-6.71 6.546-8.183 10.719l-26.348-3.764c2.046-7.282 5.483-13.336 10.31-18.328 4.746-4.909 10.638-8.59 17.511-11.045 6.955-2.455 14.565-3.682 22.912-3.682 5.809 0 11.537.654 17.265 2.045s10.965 3.6 15.711 6.71c4.746 3.109 8.51 7.282 11.455 12.6 2.864 5.318 4.337 11.946 4.337 19.883v80.184h-27.166v-16.446h-.9c-1.719 3.355-4.092 6.464-7.201 9.328-3.109 2.864-6.955 5.237-11.619 6.955-4.828 1.718-10.229 2.536-16.529 2.536Zm7.364-20.701c5.646 0 10.556-1.145 14.729-3.354 4.173-2.291 7.364-5.237 9.655-9.001 2.292-3.763 3.355-7.854 3.355-12.273v-14.155c-.9.737-2.373 1.391-4.5 2.046-2.128.654-4.419 1.145-7.037 1.636-2.619.491-5.155.9-7.692 1.227-2.537.328-4.746.655-6.628.901-4.173.572-8.019 1.472-11.292 2.781-3.355 1.31-5.973 3.11-7.855 5.401-1.964 2.291-2.864 5.318-2.864 8.918 0 5.237 1.882 9.164 5.728 11.782 3.682 2.782 8.51 4.091 14.401 4.091Zm64.643 18.328V71.839h27.412v19.965h1.227c2.21-6.955 5.974-12.274 11.292-16.038 5.319-3.763 11.456-5.645 18.329-5.645 1.555 0 3.355.082 5.237.163 1.964.164 3.601.328 4.91.573v25.938c-1.227-.41-3.109-.819-5.646-1.146a58.814 58.814 0 0 0-7.446-.49c-5.155 0-9.738 1.145-13.829 3.354-4.091 2.209-7.282 5.236-9.655 9.164-2.373 3.927-3.519 8.427-3.519 13.5v70.448h-28.312ZM222.077 39.192l-8.019 125.923L137.387 0l84.69 39.192Zm-53.105 162.825-57.933 33.056-57.934-33.056 11.783-28.556h92.301l11.783 28.556ZM111.039 62.675l30.357 73.803H80.681l30.358-73.803ZM7.937 165.115 0 39.192 84.69 0 7.937 165.115Z"
+          />
+        </g>
+        <defs>
+          <radialGradient
+            id="c"
+            cx="0"
+            cy="0"
+            r="1"
+            gradientTransform="rotate(118.122 171.182 60.81) scale(205.794)"
+            gradientUnits="userSpaceOnUse"
+          >
+            <stop stop-color="#FF41F8" />
+            <stop offset=".707" stop-color="#FF41F8" stop-opacity=".5" />
+            <stop offset="1" stop-color="#FF41F8" stop-opacity="0" />
+          </radialGradient>
+          <linearGradient
+            id="b"
+            x1="0"
+            x2="982"
+            y1="192"
+            y2="192"
+            gradientUnits="userSpaceOnUse"
+          >
+            <stop stop-color="#F0060B" />
+            <stop offset="0" stop-color="#F0070C" />
+            <stop offset=".526" stop-color="#CC26D5" />
+            <stop offset="1" stop-color="#7702FF" />
+          </linearGradient>
+          <clipPath id="a"><path fill="#fff" d="M0 0h982v239H0z" /></clipPath>
+        </defs>
+      </svg>
+      <h1>Hello, {{ title() }}</h1>
+      <p>Congratulations! Your app is running. 🎉</p>
+    </div>
+    <div class="divider" role="separator" aria-label="Divider"></div>
+    <div class="right-side">
+      <div class="pill-group">
+        @for (item of [
+          { title: 'Explore the Docs', link: 'https://angular.dev' },
+          { title: 'Learn with Tutorials', link: 'https://angular.dev/tutorials' },
+          { title: 'Prompt and best practices for AI', link: 'https://angular.dev/ai/develop-with-ai'},
+          { title: 'CLI Docs', link: 'https://angular.dev/tools/cli' },
+          { title: 'Angular Language Service', link: 'https://angular.dev/tools/language-service' },
+          { title: 'Angular DevTools', link: 'https://angular.dev/tools/devtools' },
+        ]; track item.title) {
+          <a
+            class="pill"
+            [href]="item.link"
+            target="_blank"
+            rel="noopener"
+          >
+            <span>{{ item.title }}</span>
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              height="14"
+              viewBox="0 -960 960 960"
+              width="14"
+              fill="currentColor"
+            >
+              <path
+                d="M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h280v80H200v560h560v-280h80v280q0 33-23.5 56.5T760-120H200Zm188-212-56-56 372-372H560v-80h280v280h-80v-144L388-332Z"
+              />
+            </svg>
+          </a>
+        }
+      </div>
+      <div class="social-links">
+        <a
+          href="https://github.com/angular/angular"
+          aria-label="Github"
+          target="_blank"
+          rel="noopener"
+        >
+          <svg
+            width="25"
+            height="24"
+            viewBox="0 0 25 24"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+            alt="Github"
+          >
+            <path
+              d="M12.3047 0C5.50634 0 0 5.50942 0 12.3047C0 17.7423 3.52529 22.3535 8.41332 23.9787C9.02856 24.0946 9.25414 23.7142 9.25414 23.3871C9.25414 23.0949 9.24389 22.3207 9.23876 21.2953C5.81601 22.0377 5.09414 19.6444 5.09414 19.6444C4.53427 18.2243 3.72524 17.8449 3.72524 17.8449C2.61064 17.082 3.81137 17.0973 3.81137 17.0973C5.04697 17.1835 5.69604 18.3647 5.69604 18.3647C6.79321 20.2463 8.57636 19.7029 9.27978 19.3881C9.39052 18.5924 9.70736 18.0499 10.0591 17.7423C7.32641 17.4347 4.45429 16.3765 4.45429 11.6618C4.45429 10.3185 4.9311 9.22133 5.72065 8.36C5.58222 8.04931 5.16694 6.79833 5.82831 5.10337C5.82831 5.10337 6.85883 4.77319 9.2121 6.36459C10.1965 6.09082 11.2424 5.95546 12.2883 5.94931C13.3342 5.95546 14.3801 6.09082 15.3644 6.36459C17.7023 4.77319 18.7328 5.10337 18.7328 5.10337C19.3942 6.79833 18.9789 8.04931 18.8559 8.36C19.6403 9.22133 20.1171 10.3185 20.1171 11.6618C20.1171 16.3888 17.2409 17.4296 14.5031 17.7321C14.9338 18.1012 15.3337 18.8559 15.3337 20.0084C15.3337 21.6552 15.3183 22.978 15.3183 23.3779C15.3183 23.7009 15.5336 24.0854 16.1642 23.9623C21.0871 22.3484 24.6094 17.7341 24.6094 12.3047C24.6094 5.50942 19.0999 0 12.3047 0Z"
+            />
+          </svg>
+        </a>
+        <a
+          href="https://twitter.com/angular"
+          aria-label="Twitter"
+          target="_blank"
+          rel="noopener"
+        >
+          <svg
+            width="24"
+            height="24"
+            viewBox="0 0 24 24"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+            alt="Twitter"
+          >
+            <path
+              d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"
+            />
+          </svg>
+        </a>
+        <a
+          href="https://www.youtube.com/channel/UCbn1OgGei-DV7aSRo_HaAiw"
+          aria-label="Youtube"
+          target="_blank"
+          rel="noopener"
+        >
+          <svg
+            width="29"
+            height="20"
+            viewBox="0 0 29 20"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+            alt="Youtube"
+          >
+            <path
+              fill-rule="evenodd"
+              clip-rule="evenodd"
+              d="M27.4896 1.52422C27.9301 1.96749 28.2463 2.51866 28.4068 3.12258C29.0004 5.35161 29.0004 10 29.0004 10C29.0004 10 29.0004 14.6484 28.4068 16.8774C28.2463 17.4813 27.9301 18.0325 27.4896 18.4758C27.0492 18.9191 26.5 19.2389 25.8972 19.4032C23.6778 20 14.8068 20 14.8068 20C14.8068 20 5.93586 20 3.71651 19.4032C3.11363 19.2389 2.56449 18.9191 2.12405 18.4758C1.68361 18.0325 1.36732 17.4813 1.20683 16.8774C0.613281 14.6484 0.613281 10 0.613281 10C0.613281 10 0.613281 5.35161 1.20683 3.12258C1.36732 2.51866 1.68361 1.96749 2.12405 1.52422C2.56449 1.08095 3.11363 0.76113 3.71651 0.596774C5.93586 0 14.8068 0 14.8068 0C14.8068 0 23.6778 0 25.8972 0.596774C26.5 0.76113 27.0492 1.08095 27.4896 1.52422ZM19.3229 10L11.9036 5.77905V14.221L19.3229 10Z"
+            />
+          </svg>
+        </a>
+      </div>
+    </div>
+  </div>
+</main>
+
+<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
+<!-- * * * * * * * * * * * The content above * * * * * * * * * * * * -->
+<!-- * * * * * * * * * * is only a placeholder * * * * * * * * * * * -->
+<!-- * * * * * * * * * * and can be replaced.  * * * * * * * * * * * -->
+<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
+<!-- * * * * * * * * * * End of Placeholder  * * * * * * * * * * * * -->
+<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
+
+
+<router-outlet />
diff --git a/projects/code-samples-mfe/src/app/app.routes.ts b/projects/code-samples-mfe/src/app/app.routes.ts
new file mode 100644
index 0000000..dc39edb
--- /dev/null
+++ b/projects/code-samples-mfe/src/app/app.routes.ts
@@ -0,0 +1,3 @@
+import { Routes } from '@angular/router';
+
+export const routes: Routes = [];
diff --git a/projects/code-samples-mfe/src/app/app.spec.ts b/projects/code-samples-mfe/src/app/app.spec.ts
new file mode 100644
index 0000000..435afc3
--- /dev/null
+++ b/projects/code-samples-mfe/src/app/app.spec.ts
@@ -0,0 +1,25 @@
+import { provideZonelessChangeDetection } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
+import { App } from './app';
+
+describe('App', () => {
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [App],
+      providers: [provideZonelessChangeDetection()]
+    }).compileComponents();
+  });
+
+  it('should create the app', () => {
+    const fixture = TestBed.createComponent(App);
+    const app = fixture.componentInstance;
+    expect(app).toBeTruthy();
+  });
+
+  it('should render title', () => {
+    const fixture = TestBed.createComponent(App);
+    fixture.detectChanges();
+    const compiled = fixture.nativeElement as HTMLElement;
+    expect(compiled.querySelector('h1')?.textContent).toContain('Hello, code-samples-mfe');
+  });
+});
diff --git a/projects/code-samples-mfe/src/app/app.ts b/projects/code-samples-mfe/src/app/app.ts
new file mode 100644
index 0000000..f89ebcf
--- /dev/null
+++ b/projects/code-samples-mfe/src/app/app.ts
@@ -0,0 +1,12 @@
+import { Component, signal } from '@angular/core';
+import { RouterOutlet } from '@angular/router';
+
+@Component({
+  selector: 'mfe-root',
+  imports: [RouterOutlet],
+  templateUrl: './app.html',
+  styleUrl: './app.scss'
+})
+export class App {
+  protected readonly title = signal('code-samples-mfe');
+}
diff --git a/projects/code-samples-mfe/src/app/core/mfe-setup/README.md b/projects/code-samples-mfe/src/app/core/mfe-setup/README.md
new file mode 100644
index 0000000..a4f5dc7
--- /dev/null
+++ b/projects/code-samples-mfe/src/app/core/mfe-setup/README.md
@@ -0,0 +1,13 @@
+# MFE Setup - Code Samples
+
+Module federation configuration and bootstrap logic.
+
+## Contents
+- Federation manifest
+- Remote entry configuration
+- Shared dependency setup
+- Bootstrap orchestration
+- Error boundary setup
+
+## Usage
+Handles micro-frontend initialization and federation.
\ No newline at end of file
diff --git a/projects/code-samples-mfe/src/app/core/utils/README.md b/projects/code-samples-mfe/src/app/core/utils/README.md
new file mode 100644
index 0000000..1291645
--- /dev/null
+++ b/projects/code-samples-mfe/src/app/core/utils/README.md
@@ -0,0 +1,14 @@
+# MFE Core Utils
+
+Utilities specific to code sample micro-frontend.
+
+## Contents
+- Code syntax highlighting utilities
+- Sample execution helpers
+- Federation communication utils
+- Performance optimization helpers
+
+## Rules
+- Pure functions only
+- MFE-specific utilities
+- Minimal external dependencies
\ No newline at end of file
diff --git a/projects/code-samples-mfe/src/app/ui/README.md b/projects/code-samples-mfe/src/app/ui/README.md
new file mode 100644
index 0000000..7759fc7
--- /dev/null
+++ b/projects/code-samples-mfe/src/app/ui/README.md
@@ -0,0 +1,16 @@
+# Code Samples UI Layer
+
+UI components specific to code sample display and interaction.
+
+## Contents
+- Code block components
+- Syntax highlighting
+- Copy-to-clipboard functionality
+- Code execution buttons
+- Sample navigation
+- Interactive demos
+
+## Rules
+- Pure presentation components
+- Code sample focused UI
+- Can import from: `@shared/ui`, `@shared/models`
\ No newline at end of file
diff --git a/projects/code-samples-mfe/src/index.html b/projects/code-samples-mfe/src/index.html
new file mode 100644
index 0000000..44dc89f
--- /dev/null
+++ b/projects/code-samples-mfe/src/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <title>CodeSamplesMfe</title>
+  <base href="/">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="icon" type="image/x-icon" href="favicon.ico">
+</head>
+<body>
+  <mfe-root></mfe-root>
+</body>
+</html>
diff --git a/projects/code-samples-mfe/src/main.ts b/projects/code-samples-mfe/src/main.ts
new file mode 100644
index 0000000..5df75f9
--- /dev/null
+++ b/projects/code-samples-mfe/src/main.ts
@@ -0,0 +1,6 @@
+import { bootstrapApplication } from '@angular/platform-browser';
+import { appConfig } from './app/app.config';
+import { App } from './app/app';
+
+bootstrapApplication(App, appConfig)
+  .catch((err) => console.error(err));
diff --git a/projects/code-samples-mfe/src/styles.scss b/projects/code-samples-mfe/src/styles.scss
new file mode 100644
index 0000000..a0b2115
--- /dev/null
+++ b/projects/code-samples-mfe/src/styles.scss
@@ -0,0 +1,9 @@
+/* Order */
+@layer reset, primeng;
+
+
+/* You can add global styles to this file, and also import other style files */
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
diff --git a/projects/code-samples-mfe/tsconfig.app.json b/projects/code-samples-mfe/tsconfig.app.json
new file mode 100644
index 0000000..742c488
--- /dev/null
+++ b/projects/code-samples-mfe/tsconfig.app.json
@@ -0,0 +1,15 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/app",
+    "types": []
+  },
+  "include": [
+    "src/**/*.ts"
+  ],
+  "exclude": [
+    "src/**/*.spec.ts"
+  ]
+}
diff --git a/projects/code-samples-mfe/tsconfig.spec.json b/projects/code-samples-mfe/tsconfig.spec.json
new file mode 100644
index 0000000..0feea88
--- /dev/null
+++ b/projects/code-samples-mfe/tsconfig.spec.json
@@ -0,0 +1,14 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": [
+      "jasmine"
+    ]
+  },
+  "include": [
+    "src/**/*.ts"
+  ]
+}
diff --git a/projects/shared/README.md b/projects/shared/README.md
new file mode 100644
index 0000000..8d5917d
--- /dev/null
+++ b/projects/shared/README.md
@@ -0,0 +1,63 @@
+# Shared
+
+This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 20.1.0.
+
+## Code scaffolding
+
+Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
+
+```bash
+ng generate component component-name
+```
+
+For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
+
+```bash
+ng generate --help
+```
+
+## Building
+
+To build the library, run:
+
+```bash
+ng build shared
+```
+
+This command will compile your project, and the build artifacts will be placed in the `dist/` directory.
+
+### Publishing the Library
+
+Once the project is built, you can publish your library by following these steps:
+
+1. Navigate to the `dist` directory:
+   ```bash
+   cd dist/shared
+   ```
+
+2. Run the `npm publish` command to publish your library to the npm registry:
+   ```bash
+   npm publish
+   ```
+
+## Running unit tests
+
+To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
+
+```bash
+ng test
+```
+
+## Running end-to-end tests
+
+For end-to-end (e2e) testing, run:
+
+```bash
+ng e2e
+```
+
+Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
+
+## Additional Resources
+
+For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
diff --git a/projects/shared/eslint.config.js b/projects/shared/eslint.config.js
new file mode 100644
index 0000000..5bf2b81
--- /dev/null
+++ b/projects/shared/eslint.config.js
@@ -0,0 +1,5 @@
+// @ts-check
+const tseslint = require("typescript-eslint");
+const rootConfig = require("../../eslint.config.js");
+
+module.exports = tseslint.config(...rootConfig);
\ No newline at end of file
diff --git a/projects/shared/models/public-api.ts b/projects/shared/models/public-api.ts
new file mode 100644
index 0000000..4189dd8
--- /dev/null
+++ b/projects/shared/models/public-api.ts
@@ -0,0 +1 @@
+export * from '../src/models';
\ No newline at end of file
diff --git a/projects/shared/ng-package.json b/projects/shared/ng-package.json
new file mode 100644
index 0000000..6391ae3
--- /dev/null
+++ b/projects/shared/ng-package.json
@@ -0,0 +1,7 @@
+{
+  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
+  "dest": "../../dist/shared",
+  "lib": {
+    "entryFile": "src/public-api.ts"
+  }
+}
\ No newline at end of file
diff --git a/projects/shared/package.json b/projects/shared/package.json
new file mode 100644
index 0000000..590aa3e
--- /dev/null
+++ b/projects/shared/package.json
@@ -0,0 +1,12 @@
+{
+  "name": "shared",
+  "version": "0.0.1",
+  "peerDependencies": {
+    "@angular/common": "^20.1.0",
+    "@angular/core": "^20.1.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "sideEffects": false
+}
diff --git a/projects/shared/src/data-access/README.md b/projects/shared/src/data-access/README.md
new file mode 100644
index 0000000..5bc68c6
--- /dev/null
+++ b/projects/shared/src/data-access/README.md
@@ -0,0 +1,20 @@
+# Shared Data Access Layer
+
+API clients, repositories, and data access services shared across applications.
+
+## Structure
+- `supabase/` - Supabase client configuration and services
+- `api/` - REST API clients
+- `repositories/` - Data repository patterns
+- `stores/` - NgRx SignalStore implementations
+
+## Rules
+- No UI dependencies
+- Pure data operations
+- Environment-aware (PostgREST vs supabase-js)
+- Export via public-api.ts
+
+## Architecture
+- Repository pattern for data access
+- NgRx SignalStore for state management
+- Environment-specific clients
\ No newline at end of file
diff --git a/src/app/admin/admin.component.scss b/projects/shared/src/data-access/api/index.ts
old mode 100755
new mode 100644
similarity index 100%
rename from src/app/admin/admin.component.scss
rename to projects/shared/src/data-access/api/index.ts
diff --git a/projects/shared/src/data-access/index.ts b/projects/shared/src/data-access/index.ts
new file mode 100644
index 0000000..f8ff49d
--- /dev/null
+++ b/projects/shared/src/data-access/index.ts
@@ -0,0 +1,7 @@
+// export * from './supabase';
+
+// API Services
+
+// Stores
+
+// Tokens
diff --git a/projects/shared/src/data-access/repositories/README.md b/projects/shared/src/data-access/repositories/README.md
new file mode 100644
index 0000000..78e19fa
--- /dev/null
+++ b/projects/shared/src/data-access/repositories/README.md
@@ -0,0 +1,17 @@
+# Data Repositories
+
+Repository pattern implementations for data access abstraction.
+
+## Contents
+- Blog post repository
+- Comment repository
+- User repository
+- Media repository
+- Tag repository
+- Configuration repository
+
+## Benefits
+- Abstraction over data sources
+- Testable data access
+- Consistent API across features
+- Environment-agnostic access
\ No newline at end of file
diff --git a/projects/shared/src/lib/shared.ts b/projects/shared/src/lib/shared.ts
new file mode 100644
index 0000000..cfcb562
--- /dev/null
+++ b/projects/shared/src/lib/shared.ts
@@ -0,0 +1,6 @@
+// Main exports for the shared library
+export * from '../models';
+export * from '../services';
+export * from '../ui';
+export * from '../pattern';
+export * from '../utils';
diff --git a/projects/shared/src/models/README.md b/projects/shared/src/models/README.md
new file mode 100644
index 0000000..8edefc3
--- /dev/null
+++ b/projects/shared/src/models/README.md
@@ -0,0 +1,22 @@
+# Shared Models Library
+
+TypeScript types, interfaces, and data models shared across all applications.
+
+## Structure
+- `blog/` - Blog-related types and interfaces
+- `user/` - User and authentication types
+- `api/` - API request/response types
+- `ui/` - UI-specific types
+- `supabase/` - Supabase-generated types
+
+## Rules
+- Pure TypeScript types only
+- No runtime code
+- Comprehensive documentation
+- Backward compatibility considerations
+- Export via public-api.ts
+
+## Architecture
+- Domain-driven type organization
+- Generated types from Supabase
+- Strict typing for all data
\ No newline at end of file
diff --git a/projects/shared/src/models/api/README.md b/projects/shared/src/models/api/README.md
new file mode 100644
index 0000000..c87756e
--- /dev/null
+++ b/projects/shared/src/models/api/README.md
@@ -0,0 +1,14 @@
+# API Models
+
+Request and response types for API communication.
+
+## Contents
+- HTTP request interfaces
+- Response wrapper types
+- Error response models
+- Pagination types
+- Filter and sort interfaces
+- API versioning types
+
+## Usage
+Type-safe API communication across all applications.
\ No newline at end of file
diff --git a/projects/shared/src/models/api/index.ts b/projects/shared/src/models/api/index.ts
new file mode 100644
index 0000000..06d2e54
--- /dev/null
+++ b/projects/shared/src/models/api/index.ts
@@ -0,0 +1 @@
+export * from './query-operators';
\ No newline at end of file
diff --git a/src/app/shared/_enums/query-operators.ts b/projects/shared/src/models/api/query-operators.ts
similarity index 100%
rename from src/app/shared/_enums/query-operators.ts
rename to projects/shared/src/models/api/query-operators.ts
diff --git a/src/app/shared/_models/credentials-controlls.interface.ts b/projects/shared/src/models/auth/credentials-controls.ts
similarity index 100%
rename from src/app/shared/_models/credentials-controlls.interface.ts
rename to projects/shared/src/models/auth/credentials-controls.ts
diff --git a/src/app/shared/_models/credentials.interface.ts b/projects/shared/src/models/auth/credentials.ts
similarity index 100%
rename from src/app/shared/_models/credentials.interface.ts
rename to projects/shared/src/models/auth/credentials.ts
diff --git a/projects/shared/src/models/auth/index.ts b/projects/shared/src/models/auth/index.ts
new file mode 100644
index 0000000..be8aa2d
--- /dev/null
+++ b/projects/shared/src/models/auth/index.ts
@@ -0,0 +1,3 @@
+export * from './roles';
+export * from './credentials';
+export * from './credentials-controls';
\ No newline at end of file
diff --git a/src/app/shared/_enums/roles.ts b/projects/shared/src/models/auth/roles.ts
similarity index 100%
rename from src/app/shared/_enums/roles.ts
rename to projects/shared/src/models/auth/roles.ts
diff --git a/projects/shared/src/models/blog/README.md b/projects/shared/src/models/blog/README.md
new file mode 100644
index 0000000..04562e8
--- /dev/null
+++ b/projects/shared/src/models/blog/README.md
@@ -0,0 +1,14 @@
+# Blog Models
+
+Types and interfaces for blog-related data structures.
+
+## Contents
+- Blog post interfaces
+- Comment types
+- Tag definitions
+- Category models
+- SEO metadata types
+- Content structure types
+
+## Usage
+Shared types for blog functionality across all apps.
\ No newline at end of file
diff --git a/src/app/shared/_models/blog.interface.ts b/projects/shared/src/models/blog/blog.ts
similarity index 100%
rename from src/app/shared/_models/blog.interface.ts
rename to projects/shared/src/models/blog/blog.ts
diff --git a/projects/shared/src/models/blog/index.ts b/projects/shared/src/models/blog/index.ts
new file mode 100644
index 0000000..bb1d9ec
--- /dev/null
+++ b/projects/shared/src/models/blog/index.ts
@@ -0,0 +1,3 @@
+export * from './blog';
+export * from './post-fields';
+export * from './table-of-contents';
\ No newline at end of file
diff --git a/src/app/shared/_enums/post-fields.enum.ts b/projects/shared/src/models/blog/post-fields.ts
similarity index 100%
rename from src/app/shared/_enums/post-fields.enum.ts
rename to projects/shared/src/models/blog/post-fields.ts
diff --git a/src/app/shared/_models/tableOfContents.interface.ts b/projects/shared/src/models/blog/table-of-contents.ts
similarity index 100%
rename from src/app/shared/_models/tableOfContents.interface.ts
rename to projects/shared/src/models/blog/table-of-contents.ts
diff --git a/projects/shared/src/models/browser/index.ts b/projects/shared/src/models/browser/index.ts
new file mode 100644
index 0000000..e6e2cac
--- /dev/null
+++ b/projects/shared/src/models/browser/index.ts
@@ -0,0 +1 @@
+export * from './local-storage';
\ No newline at end of file
diff --git a/src/app/shared/_enums/local-storage.ts b/projects/shared/src/models/browser/local-storage.ts
similarity index 100%
rename from src/app/shared/_enums/local-storage.ts
rename to projects/shared/src/models/browser/local-storage.ts
diff --git a/projects/shared/src/models/index.ts b/projects/shared/src/models/index.ts
new file mode 100644
index 0000000..ba05faa
--- /dev/null
+++ b/projects/shared/src/models/index.ts
@@ -0,0 +1,7 @@
+// Central barrel export for all model types
+export * from './auth';
+export * from './blog'; 
+export * from './supabase';
+export * from './api';
+export * from './browser';
+export * from './ui';
\ No newline at end of file
diff --git a/projects/shared/src/models/supabase/README.md b/projects/shared/src/models/supabase/README.md
new file mode 100644
index 0000000..459c9b8
--- /dev/null
+++ b/projects/shared/src/models/supabase/README.md
@@ -0,0 +1,14 @@
+# Supabase Models
+
+Generated and custom types for Supabase database schema.
+
+## Contents
+- Database table types (generated)
+- Row Level Security types
+- Function return types
+- Real-time subscription types
+- Storage bucket types
+- Custom database types
+
+## Generation
+Types are generated from Supabase CLI and enhanced with custom types.
\ No newline at end of file
diff --git a/src/app/types/supabase/base-types.ts b/projects/shared/src/models/supabase/base-types.ts
similarity index 100%
rename from src/app/types/supabase/base-types.ts
rename to projects/shared/src/models/supabase/base-types.ts
diff --git a/src/app/shared/_enums/collections.ts b/projects/shared/src/models/supabase/collections.ts
similarity index 100%
rename from src/app/shared/_enums/collections.ts
rename to projects/shared/src/models/supabase/collections.ts
diff --git a/src/app/types/supabase/comments.ts b/projects/shared/src/models/supabase/comments.ts
similarity index 90%
rename from src/app/types/supabase/comments.ts
rename to projects/shared/src/models/supabase/comments.ts
index ce175c9..4af25df 100644
--- a/src/app/types/supabase/comments.ts
+++ b/projects/shared/src/models/supabase/comments.ts
@@ -1,6 +1,6 @@
 import { Profile } from './profiles';
 
-export type Comment = {
+export interface Comment {
   content: string;
   created_at: string | null;
   id: string;
@@ -9,9 +9,9 @@ export type Comment = {
   post_id: string;
   user_id: string | null;
   author: Profile | null;
-};
+}
 
-export type CommentInsert = {
+export interface CommentInsert {
   content: string;
   created_at?: string | null;
   id?: string;
@@ -19,9 +19,9 @@ export type CommentInsert = {
   is_reported?: boolean | null;
   post_id: string;
   user_id?: string | null;
-};
+}
 
-export type CommentUpdate = {
+export interface CommentUpdate {
   content?: string;
   created_at?: string | null;
   id?: string;
@@ -29,7 +29,7 @@ export type CommentUpdate = {
   is_reported?: boolean | null;
   post_id?: string;
   user_id?: string | null;
-};
+}
 
 export type CommentRelationships = [
   {
diff --git a/src/app/supabase-types.ts b/projects/shared/src/models/supabase/database.ts
similarity index 97%
rename from src/app/supabase-types.ts
rename to projects/shared/src/models/supabase/database.ts
index 6815646..7e5f027 100644
--- a/src/app/supabase-types.ts
+++ b/projects/shared/src/models/supabase/database.ts
@@ -6,7 +6,7 @@ export type Json =
   | { [key: string]: Json | undefined }
   | Json[]
 
-export type Database = {
+export interface Database {
   public: {
     Tables: {
       comments: {
@@ -165,18 +165,10 @@ export type Database = {
         Relationships: []
       }
     }
-    Views: {
-      [_ in never]: never
-    }
-    Functions: {
-      [_ in never]: never
-    }
-    Enums: {
-      [_ in never]: never
-    }
-    CompositeTypes: {
-      [_ in never]: never
-    }
+    Views: Record<never, never>
+    Functions: Record<never, never>
+    Enums: Record<never, never>
+    CompositeTypes: Record<never, never>
   }
 }
 
diff --git a/src/app/types/supabase-helper.ts b/projects/shared/src/models/supabase/helpers.ts
similarity index 83%
rename from src/app/types/supabase-helper.ts
rename to projects/shared/src/models/supabase/helpers.ts
index a66a14b..299d89e 100644
--- a/src/app/types/supabase-helper.ts
+++ b/projects/shared/src/models/supabase/helpers.ts
@@ -1,4 +1,4 @@
-import { Database } from '../supabase-types';
+import { Database } from './database';
 
 type Tables = Database['public']['Tables'];
 
diff --git a/src/app/types/supabase/index.ts b/projects/shared/src/models/supabase/index.ts
similarity index 68%
rename from src/app/types/supabase/index.ts
rename to projects/shared/src/models/supabase/index.ts
index 26fa270..e65ebeb 100644
--- a/src/app/types/supabase/index.ts
+++ b/projects/shared/src/models/supabase/index.ts
@@ -1,8 +1,9 @@
 // Re-export all types from the individual files
-// export * from './base-types';
+export * from './database';
+export * from './helpers';
+export * from './collections';
 export * from './comments';
-export * from './post-tags';
 export * from './posts';
 export * from './profiles';
 export * from './tags';
-// export * from './utility-types';
+export * from './post-tags';
diff --git a/src/app/types/supabase/post-tags.ts b/projects/shared/src/models/supabase/post-tags.ts
similarity index 80%
rename from src/app/types/supabase/post-tags.ts
rename to projects/shared/src/models/supabase/post-tags.ts
index aa1dcf5..8cf9984 100644
--- a/src/app/types/supabase/post-tags.ts
+++ b/projects/shared/src/models/supabase/post-tags.ts
@@ -1,23 +1,23 @@
 import { Tag } from './tags';
 
-export type PostTag = {
+export interface PostTag {
   post_id: string;
   tag_id: number;
-};
+}
 
-export type PostTagList = {
+export interface PostTagList {
   tags: Tag;
-};
+}
 
-export type PostTagInsert = {
+export interface PostTagInsert {
   post_id: string;
   tag_id: number;
-};
+}
 
-export type PostTagUpdate = {
+export interface PostTagUpdate {
   post_id?: string;
   tag_id?: number;
-};
+}
 
 export type PostTagRelationships = [
   {
diff --git a/src/app/types/supabase/posts.ts b/projects/shared/src/models/supabase/posts.ts
similarity index 91%
rename from src/app/types/supabase/posts.ts
rename to projects/shared/src/models/supabase/posts.ts
index b4e75df..7201fa6 100644
--- a/src/app/types/supabase/posts.ts
+++ b/projects/shared/src/models/supabase/posts.ts
@@ -2,7 +2,7 @@ import { Profile } from './profiles';
 import { PostTagList } from './post-tags';
 import { Comment } from './comments';
 
-export type Post = {
+export interface Post {
   content: string;
   created_at: Date | null;
   description: string;
@@ -17,9 +17,9 @@ export type Post = {
   updated: string | null;
   readingTime: number | null;
   tableOfContents: [];
-};
+}
 
-export type PostInsert = {
+export interface PostInsert {
   content: string;
   created_at?: string | null;
   description: string;
@@ -27,9 +27,9 @@ export type PostInsert = {
   is_draft?: boolean;
   title: string;
   user_id: string;
-};
+}
 
-export type PostUpdate = {
+export interface PostUpdate {
   content?: string;
   created_at?: string | null;
   description?: string;
@@ -37,7 +37,7 @@ export type PostUpdate = {
   is_draft?: boolean;
   title?: string;
   user_id?: string;
-};
+}
 
 export type PostRelationships = [
   {
diff --git a/src/app/types/supabase/profiles.ts b/projects/shared/src/models/supabase/profiles.ts
similarity index 77%
rename from src/app/types/supabase/profiles.ts
rename to projects/shared/src/models/supabase/profiles.ts
index 970d260..16a980c 100644
--- a/src/app/types/supabase/profiles.ts
+++ b/projects/shared/src/models/supabase/profiles.ts
@@ -1,18 +1,18 @@
-export type Profile = {
+export interface Profile {
   avatar_url: string | null
   created_at: string | null
   id: string
   username: string
 }
 
-export type ProfileInsert = {
+export interface ProfileInsert {
   avatar_url?: string | null
   created_at?: string | null
   id: string
   username: string
 }
 
-export type ProfileUpdate = {
+export interface ProfileUpdate {
   avatar_url?: string | null
   created_at?: string | null
   id?: string
diff --git a/src/app/types/supabase/tags.ts b/projects/shared/src/models/supabase/tags.ts
similarity index 72%
rename from src/app/types/supabase/tags.ts
rename to projects/shared/src/models/supabase/tags.ts
index 513a109..7bb6686 100644
--- a/src/app/types/supabase/tags.ts
+++ b/projects/shared/src/models/supabase/tags.ts
@@ -1,22 +1,22 @@
-export type Tag = {
+export interface Tag {
   color: string;
   icon: string;
   id: number;
   name: string;
-};
+}
 
-export type TagInsert = {
+export interface TagInsert {
   color: string;
   icon: string;
   id?: number;
   name: string;
-};
+}
 
-export type TagUpdate = {
+export interface TagUpdate {
   color?: string;
   icon?: string;
   id?: number;
   name?: string;
-};
+}
 
 export type TagRelationships = [];
diff --git a/src/app/types/supabase/utility-types.ts b/projects/shared/src/models/supabase/utility-types.ts
similarity index 100%
rename from src/app/types/supabase/utility-types.ts
rename to projects/shared/src/models/supabase/utility-types.ts
diff --git a/projects/shared/src/models/ui/README.md b/projects/shared/src/models/ui/README.md
new file mode 100644
index 0000000..d5c0b46
--- /dev/null
+++ b/projects/shared/src/models/ui/README.md
@@ -0,0 +1,14 @@
+# UI Models
+
+User interface specific types and configurations.
+
+## Contents
+- Component configuration interfaces
+- Theme and styling types
+- Navigation structure types
+- Form validation types
+- Modal and dialog configurations
+- Layout and responsive types
+
+## Usage
+UI component configuration and interaction types.
\ No newline at end of file
diff --git a/projects/shared/src/models/ui/index.ts b/projects/shared/src/models/ui/index.ts
new file mode 100644
index 0000000..235b1b4
--- /dev/null
+++ b/projects/shared/src/models/ui/index.ts
@@ -0,0 +1,2 @@
+export * from './modal-config';
+export * from './modal-status';
\ No newline at end of file
diff --git a/src/app/shared/_models/modal-config.intreface.ts b/projects/shared/src/models/ui/modal-config.ts
similarity index 100%
rename from src/app/shared/_models/modal-config.intreface.ts
rename to projects/shared/src/models/ui/modal-config.ts
diff --git a/src/app/shared/_models/modal-status.interface.ts b/projects/shared/src/models/ui/modal-status.ts
similarity index 100%
rename from src/app/shared/_models/modal-status.interface.ts
rename to projects/shared/src/models/ui/modal-status.ts
diff --git a/projects/shared/src/models/user/README.md b/projects/shared/src/models/user/README.md
new file mode 100644
index 0000000..cbfa2f3
--- /dev/null
+++ b/projects/shared/src/models/user/README.md
@@ -0,0 +1,14 @@
+# User Models
+
+User and authentication related types.
+
+## Contents
+- User profile interfaces
+- Authentication types
+- Role and permission models
+- Session types
+- User preference interfaces
+- Social profile types
+
+## Usage
+User-related types for authentication and profile management.
\ No newline at end of file
diff --git a/projects/shared/src/pattern/README.md b/projects/shared/src/pattern/README.md
new file mode 100644
index 0000000..d086a63
--- /dev/null
+++ b/projects/shared/src/pattern/README.md
@@ -0,0 +1,20 @@
+# Shared Pattern Library
+
+Composable building blocks combining components and services for common workflows.
+
+## Structure
+- `form-controls/` - Enhanced form control patterns
+- `data-display/` - Complex data display patterns
+- `navigation/` - Navigation and routing patterns
+
+## Rules
+- Self-contained functionality
+- Combines UI + services
+- Configurable and reusable
+- Used by all applications
+- Can import from: `@shared/ui`, `@shared/models`, `@shared/utils`
+
+## Architecture
+- Drop-in patterns
+- Service + component combinations
+- Configurable via providers
\ No newline at end of file
diff --git a/src/app/shared/_directives/has-role.directive.ts b/projects/shared/src/pattern/auth/has-role.directive.ts
similarity index 75%
rename from src/app/shared/_directives/has-role.directive.ts
rename to projects/shared/src/pattern/auth/has-role.directive.ts
index 03a7b18..277aac4 100644
--- a/src/app/shared/_directives/has-role.directive.ts
+++ b/projects/shared/src/pattern/auth/has-role.directive.ts
@@ -1,18 +1,12 @@
-import {
-  Directive,
-  Input,
-  TemplateRef,
-  ViewContainerRef,
-  inject,
-} from '@angular/core';
-import { SupabaseService } from '../../services/supabase.service';
+import { Directive, Input, TemplateRef, ViewContainerRef, inject } from '@angular/core';
+import { SupabaseService } from 'shared';
 
 @Directive({
-  selector: '[hasRole]',
+  selector: '[sharedHasRole]',
   standalone: true,
 })
 export class HasRoleDirective {
-  @Input() set hasRole(role: string) {
+  @Input() set sharedHasRole(role: string) {
     this.updateView(role);
   }
 
diff --git a/projects/shared/src/pattern/auth/index.ts b/projects/shared/src/pattern/auth/index.ts
new file mode 100644
index 0000000..3039a14
--- /dev/null
+++ b/projects/shared/src/pattern/auth/index.ts
@@ -0,0 +1 @@
+export * from './has-role.directive';
\ No newline at end of file
diff --git a/projects/shared/src/pattern/data-display/README.md b/projects/shared/src/pattern/data-display/README.md
new file mode 100644
index 0000000..4d6b443
--- /dev/null
+++ b/projects/shared/src/pattern/data-display/README.md
@@ -0,0 +1,14 @@
+# Data Display Patterns
+
+Complex data display patterns with sorting, filtering, and pagination.
+
+## Contents
+- Data table with server-side operations
+- Card grid with infinite scroll
+- List with virtual scrolling
+- Chart integration patterns
+- Export functionality
+- Search and filter combinations
+
+## Usage
+Advanced data display patterns for complex datasets.
\ No newline at end of file
diff --git a/src/app/shared/dynamic-dialog/dialog-data.token.ts b/projects/shared/src/pattern/dynamic-dialog/dialog-data.token.ts
similarity index 100%
rename from src/app/shared/dynamic-dialog/dialog-data.token.ts
rename to projects/shared/src/pattern/dynamic-dialog/dialog-data.token.ts
diff --git a/src/app/shared/dynamic-dialog/dynamic-dialog.component.html b/projects/shared/src/pattern/dynamic-dialog/dynamic-dialog.component.html
similarity index 89%
rename from src/app/shared/dynamic-dialog/dynamic-dialog.component.html
rename to projects/shared/src/pattern/dynamic-dialog/dynamic-dialog.component.html
index 7c71e02..a5ef519 100644
--- a/src/app/shared/dynamic-dialog/dynamic-dialog.component.html
+++ b/projects/shared/src/pattern/dynamic-dialog/dynamic-dialog.component.html
@@ -35,35 +35,35 @@
               class="text-base font-semibold leading-6 text-gray-900"
               id="modal-title"
             >
-              {{ modalConfig?.title || "" }}
+              {{ modalConfig()?.title || "" }}
             </h3>
             <hr class="h-px w-100 my-1 bg-gray-100 border-0"/>
             <div class="mt-2 min-h-24 max-h-[65vh] overflow-auto">
-              {{ modalConfig?.content || "" }}
+              {{ modalConfig()?.content || "" }}
               <ng-template #dynamicComponentContainer></ng-template>
             </div>
           </div>
         </div>
         <div class="bg-gray-50 px-4 py-3 sm:px-6 btn--group justify-between">
           <div>
-            @if (modalConfig?.primaryButton) {
+            @if (modalConfig()?.primaryButton) {
               <button
                 (click)="closeDialog(ModalCloseStatusEnum.ACCEPTED)"
                 type="button"
                 class="btn btn--primary"
               >
-                {{ modalConfig?.primaryButton }}
+                {{ modalConfig()?.primaryButton }}
               </button>
             }
           </div>
           <div>
-            @if (modalConfig?.secondaryButton) {
+            @if (modalConfig()?.secondaryButton) {
               <button
                 (click)="closeDialog(ModalCloseStatusEnum.REJECTED)"
                 type="button"
                 class="btn btn--secondary"
               >
-                {{ modalConfig?.secondaryButton }}
+                {{ modalConfig()?.secondaryButton }}
               </button>
             }
           </div>
diff --git a/src/app/shared/dynamic-dialog/dynamic-dialog.component.scss b/projects/shared/src/pattern/dynamic-dialog/dynamic-dialog.component.scss
similarity index 100%
rename from src/app/shared/dynamic-dialog/dynamic-dialog.component.scss
rename to projects/shared/src/pattern/dynamic-dialog/dynamic-dialog.component.scss
diff --git a/src/app/shared/dynamic-dialog/dynamic-dialog.component.ts b/projects/shared/src/pattern/dynamic-dialog/dynamic-dialog.component.ts
similarity index 79%
rename from src/app/shared/dynamic-dialog/dynamic-dialog.component.ts
rename to projects/shared/src/pattern/dynamic-dialog/dynamic-dialog.component.ts
index c4de4a5..5d1353d 100644
--- a/src/app/shared/dynamic-dialog/dynamic-dialog.component.ts
+++ b/projects/shared/src/pattern/dynamic-dialog/dynamic-dialog.component.ts
@@ -2,19 +2,19 @@ import {
   ChangeDetectionStrategy,
   Component,
   ComponentRef,
-  Input,
   OnInit,
   Type,
   ViewContainerRef,
   inject,
+  input,
   viewChild,
 } from '@angular/core';
 import { DynamicDialogService } from './dynamic-dialog.service';
-import { ModalConfig } from '../_models/modal-config.intreface';
-import {
-  ModalCloseStatusEnum,
-  ModalStatus,
-} from '../_models/modal-status.interface';
+import { 
+  ModalConfig, 
+  ModalCloseStatusEnum, 
+  ModalStatus 
+} from '../../models';
 
 @Component({
   selector: 'app-dynamic-dialog',
@@ -26,8 +26,8 @@ import {
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class DynamicDialogComponent<C = unknown> implements OnInit {
-  @Input() component?: Type<C>;
-  @Input() modalConfig?: ModalConfig;
+  component = input<Type<C>>();
+  modalConfig = input<ModalConfig>();
 
   divEl = viewChild.required('dynamicComponentContainer', {
     read: ViewContainerRef,
@@ -53,12 +53,12 @@ export class DynamicDialogComponent<C = unknown> implements OnInit {
   }
 
   onOverlayClick($event: MouseEvent) {
-    console.log('Overlay clicked', $event);
+    // Handle overlay click if needed
   }
 
   private createDynamicComponent(): void {
-    if (this.divEl() && this.component) {
-      this.componentRef = this.divEl().createComponent(this.component);
+    if (this.divEl() && this.component()) {
+      this.componentRef = this.divEl().createComponent(this.component()!);
     }
   }
 }
diff --git a/src/app/shared/dynamic-dialog/dynamic-dialog.service.ts b/projects/shared/src/pattern/dynamic-dialog/dynamic-dialog.service.ts
similarity index 64%
rename from src/app/shared/dynamic-dialog/dynamic-dialog.service.ts
rename to projects/shared/src/pattern/dynamic-dialog/dynamic-dialog.service.ts
index 0058830..42b2c1b 100644
--- a/src/app/shared/dynamic-dialog/dynamic-dialog.service.ts
+++ b/projects/shared/src/pattern/dynamic-dialog/dynamic-dialog.service.ts
@@ -6,11 +6,10 @@ import {
   Type,
   Injector,
 } from '@angular/core';
-import { DynamicDialogComponent } from './dynamic-dialog.component';
 import { ViewContainerRef } from '@angular/core';
 import { Subject } from 'rxjs';
-import { ModalConfig } from '../_models/modal-config.intreface';
-import { ModalStatus } from '../_models/modal-status.interface';
+import { DynamicDialogComponent } from './dynamic-dialog.component';
+import { ModalConfig, ModalStatus } from '../../models';
 import { DYNAMIC_DIALOG_DATA } from './dialog-data.token';
 
 @Injectable({ providedIn: 'root' })
@@ -23,23 +22,23 @@ export class DynamicDialogService<T> {
   openDialog<C>(
     viewContainerRef: ViewContainerRef,
     modalConfig?: ModalConfig,
-    component?: Type<C>,
+    component?: Type<C>
   ): Subject<ModalStatus<T>> {
     const dialogInjector = Injector.create({
-      providers: [
-        { provide: DYNAMIC_DIALOG_DATA, useValue: modalConfig?.data },
-      ],
+      providers: [{ provide: DYNAMIC_DIALOG_DATA, useValue: modalConfig?.data }],
       parent: this.injector,
     });
 
-    this.componentRef = viewContainerRef.createComponent(
-      DynamicDialogComponent,
-      { environmentInjector: this.envInjector, injector: dialogInjector },
-    );
+    this.componentRef = viewContainerRef.createComponent(DynamicDialogComponent, {
+      environmentInjector: this.envInjector,
+      injector: dialogInjector,
+    });
     if (component) {
-      this.componentRef.instance.component = component;
+      this.componentRef.setInput('component', component);
+    }
+    if (modalConfig) {
+      this.componentRef.setInput('modalConfig', modalConfig);
     }
-    this.componentRef.instance.modalConfig = modalConfig;
     return this.closeRef$;
   }
 
diff --git a/projects/shared/src/pattern/form-controls/README.md b/projects/shared/src/pattern/form-controls/README.md
new file mode 100644
index 0000000..e96c634
--- /dev/null
+++ b/projects/shared/src/pattern/form-controls/README.md
@@ -0,0 +1,14 @@
+# Form Control Patterns
+
+Enhanced form controls with validation and UX patterns.
+
+## Contents
+- Rich text editor wrapper
+- File upload with progress
+- Multi-select with search
+- Date/time pickers
+- Validation patterns
+- Form state management
+
+## Usage
+Drop-in form controls with built-in validation and UX.
\ No newline at end of file
diff --git a/projects/shared/src/pattern/index.ts b/projects/shared/src/pattern/index.ts
new file mode 100644
index 0000000..17228ef
--- /dev/null
+++ b/projects/shared/src/pattern/index.ts
@@ -0,0 +1,5 @@
+// Patterns
+export * from './dynamic-dialog/dynamic-dialog.service';
+export * from './dynamic-dialog/dynamic-dialog.component';
+export * from './dynamic-dialog/dialog-data.token';
+export * from './auth';
\ No newline at end of file
diff --git a/projects/shared/src/pattern/navigation/README.md b/projects/shared/src/pattern/navigation/README.md
new file mode 100644
index 0000000..e7814d1
--- /dev/null
+++ b/projects/shared/src/pattern/navigation/README.md
@@ -0,0 +1,14 @@
+# Navigation Patterns
+
+Routing and navigation patterns for consistent UX.
+
+## Contents
+- Breadcrumb navigation
+- Tab navigation with routing
+- Sidebar navigation
+- Mobile menu patterns
+- Step indicators
+- Back navigation handling
+
+## Usage
+Consistent navigation experiences across applications.
\ No newline at end of file
diff --git a/projects/shared/src/public-api.ts b/projects/shared/src/public-api.ts
new file mode 100644
index 0000000..898b976
--- /dev/null
+++ b/projects/shared/src/public-api.ts
@@ -0,0 +1,9 @@
+/*
+ * Public API Surface of shared
+ */
+
+export * from './models';
+export * from './utils';
+export * from './services';
+export * from './ui';
+export * from './pattern';
diff --git a/projects/shared/src/services/index.ts b/projects/shared/src/services/index.ts
new file mode 100644
index 0000000..b32e8f0
--- /dev/null
+++ b/projects/shared/src/services/index.ts
@@ -0,0 +1 @@
+export * from './supabase.service';
\ No newline at end of file
diff --git a/src/app/services/supabase.service.ts b/projects/shared/src/services/supabase.service.ts
similarity index 89%
rename from src/app/services/supabase.service.ts
rename to projects/shared/src/services/supabase.service.ts
index fee96e9..0bda9ad 100644
--- a/src/app/services/supabase.service.ts
+++ b/projects/shared/src/services/supabase.service.ts
@@ -7,7 +7,7 @@ import {
   Session,
   SupabaseClient,
 } from '@supabase/supabase-js';
-import { environment } from '../../environments/environment';
+import { environment } from '../../../../environments/environment';
 
 @Injectable({
   providedIn: 'root',
@@ -19,7 +19,7 @@ export class SupabaseService {
 
   constructor() {
     this.supabase = this.ngZone.runOutsideAngular(() =>
-      createClient(environment.supabaseUrl, environment.supabaseKey),
+      createClient(environment.supabaseUrl, environment.supabaseKey)
     );
   }
 
@@ -27,9 +27,7 @@ export class SupabaseService {
     return this.session;
   }
 
-  authChanges(
-    callback: (event: AuthChangeEvent, session: Session | null) => void,
-  ) {
+  authChanges(callback: (event: AuthChangeEvent, session: Session | null) => void) {
     return this.supabase.auth.onAuthStateChange(callback);
   }
 
diff --git a/projects/shared/src/styles.scss b/projects/shared/src/styles.scss
new file mode 100755
index 0000000..7f841a4
--- /dev/null
+++ b/projects/shared/src/styles.scss
@@ -0,0 +1,108 @@
+
+/* Order */
+@layer reset, primeng;
+
+
+/* You can add global styles to this file, and also import other style files */
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+h1 {
+  @apply text-3xl font-bold mt-4 mb-1;
+}
+
+h2 {
+  @apply text-2xl font-bold mt-4 mb-1;
+}
+
+h3 {
+  @apply text-xl font-bold mt-4 mb-1;
+}
+
+h4 {
+  @apply text-lg font-bold mt-2 mb-1;
+}
+
+.tittle {
+  @apply text-4xl font-bold my-2;
+}
+
+/* Base button */
+.btn {
+  @apply text-base font-medium rounded-md p-3 min-w-16;
+}
+
+.btn--rounded {
+  @apply rounded-full;
+}
+
+/* Button group */
+.btn--group {
+  @apply flex space-x-4;
+}
+
+/* Button primary */
+.btn--primary {
+  @apply bg-primary text-white;
+}
+
+/* Button secondary */
+.btn--secondary {
+  @apply bg-white text-secondary border border-secondary;
+}
+
+/* Hover effects */
+.btn--primary:hover, .btn--secondary:hover {
+  @apply shadow-lg -translate-y-0.5;
+}
+
+/* Disabled state */
+.btn--primary:disabled, .btn--secondary:disabled {
+  @apply bg-gray-300 text-gray-500 cursor-not-allowed;
+}
+
+/* Import TailwindCSS */
+@import 'tailwindcss/utilities';
+
+/* Additional styles for the card component */
+.post-card {
+  @apply bg-white rounded-lg shadow-md overflow-hidden transition-transform transform hover:scale-105;
+}
+
+.card-default {
+  @apply p-4;
+  width: 100%;
+}
+
+.card-main {
+  @apply lg:p-6 lg:col-span-3 lg:row-span-1;
+  width: 100%;
+}
+
+.post-image {
+  @apply w-full h-48 object-cover;
+}
+
+.post-content {
+  @apply p-4;
+}
+
+.post-title {
+  @apply text-xl font-bold text-gray-900 mt-0 pt-0;
+}
+
+.post-summary {
+  @apply text-gray-700;
+}
+
+.read-more {
+  @apply text-primary hover:underline;
+}
+
+
+html, body {
+  margin: 0;
+  padding: 0;
+}
+
diff --git a/projects/shared/src/ui/README.md b/projects/shared/src/ui/README.md
new file mode 100644
index 0000000..c99f83a
--- /dev/null
+++ b/projects/shared/src/ui/README.md
@@ -0,0 +1,21 @@
+# Shared UI Library
+
+Pure presentational components shared across all applications.
+
+## Structure
+- `components/` - Reusable UI components
+- `directives/` - Custom directives
+- `pipes/` - Pure transformation pipes
+
+## Rules
+- Only @Input/@Output, no services
+- No business logic
+- Pure presentation only
+- Used by all applications
+- Export via public-api.ts
+
+## Architecture
+- Standalone components only
+- Design system compliance
+- Accessibility first
+- Themeable with CSS custom properties
\ No newline at end of file
diff --git a/projects/shared/src/ui/components/README.md b/projects/shared/src/ui/components/README.md
new file mode 100644
index 0000000..1a170f8
--- /dev/null
+++ b/projects/shared/src/ui/components/README.md
@@ -0,0 +1,18 @@
+# Shared UI Components
+
+Reusable UI components for all applications.
+
+## Contents
+- Button variations
+- Form controls
+- Card layouts
+- Modal dialogs
+- Loading indicators
+- Navigation components
+- Data display components
+
+## Standards
+- Follow DaisyUI design system
+- Accessible (WCAG 2.1 AA)
+- Responsive design
+- Theme support
\ No newline at end of file
diff --git a/src/app/shared/card/card.component.html b/projects/shared/src/ui/components/card/card.component.html
similarity index 100%
rename from src/app/shared/card/card.component.html
rename to projects/shared/src/ui/components/card/card.component.html
diff --git a/src/app/shared/card/card.component.ts b/projects/shared/src/ui/components/card/card.component.ts
similarity index 100%
rename from src/app/shared/card/card.component.ts
rename to projects/shared/src/ui/components/card/card.component.ts
diff --git a/projects/shared/src/ui/directives/README.md b/projects/shared/src/ui/directives/README.md
new file mode 100644
index 0000000..b4f0964
--- /dev/null
+++ b/projects/shared/src/ui/directives/README.md
@@ -0,0 +1,14 @@
+# Shared UI Directives
+
+Custom directives for common UI behaviors.
+
+## Contents
+- Click outside directive
+- Tooltip directive
+- Intersection observer
+- Lazy loading directive
+- Focus management
+- Accessibility enhancements
+
+## Usage
+Behavioral enhancements for UI components.
\ No newline at end of file
diff --git a/projects/shared/src/ui/index.ts b/projects/shared/src/ui/index.ts
new file mode 100644
index 0000000..2d0d5ad
--- /dev/null
+++ b/projects/shared/src/ui/index.ts
@@ -0,0 +1,2 @@
+// Components
+export * from './components/card/card.component';
diff --git a/projects/shared/src/ui/pipes/README.md b/projects/shared/src/ui/pipes/README.md
new file mode 100644
index 0000000..0a7af2c
--- /dev/null
+++ b/projects/shared/src/ui/pipes/README.md
@@ -0,0 +1,16 @@
+# Shared UI Pipes
+
+Pure transformation pipes for data display.
+
+## Contents
+- Date formatting pipes
+- Text transformation
+- Number formatting
+- Truncation pipes
+- Sanitization pipes
+- Array manipulation
+
+## Rules
+- Pure functions only
+- No side effects
+- Stateless transformations
\ No newline at end of file
diff --git a/projects/shared/src/utils/api/index.ts b/projects/shared/src/utils/api/index.ts
new file mode 100644
index 0000000..2816232
--- /dev/null
+++ b/projects/shared/src/utils/api/index.ts
@@ -0,0 +1 @@
+export * from './url-builder';
\ No newline at end of file
diff --git a/src/app/helpers/api-url-builder.ts b/projects/shared/src/utils/api/url-builder.ts
similarity index 95%
rename from src/app/helpers/api-url-builder.ts
rename to projects/shared/src/utils/api/url-builder.ts
index b6e6e74..edddffc 100644
--- a/src/app/helpers/api-url-builder.ts
+++ b/projects/shared/src/utils/api/url-builder.ts
@@ -1,4 +1,4 @@
-import { ColumnName, RowOf, TableName } from '../types/supabase-helper';
+import { ColumnName, RowOf, TableName } from '../../models/supabase/helpers';
 
 //https://postgrest.org/en/stable/references/api/tables_views.html#operators
 type Op =
diff --git a/src/app/utlis/date-utils.ts b/projects/shared/src/utils/date/date-utils.ts
similarity index 100%
rename from src/app/utlis/date-utils.ts
rename to projects/shared/src/utils/date/date-utils.ts
diff --git a/projects/shared/src/utils/date/index.ts b/projects/shared/src/utils/date/index.ts
new file mode 100644
index 0000000..777edd6
--- /dev/null
+++ b/projects/shared/src/utils/date/index.ts
@@ -0,0 +1 @@
+export * from './date-utils';
\ No newline at end of file
diff --git a/projects/shared/src/utils/index.ts b/projects/shared/src/utils/index.ts
new file mode 100644
index 0000000..2c9cd9c
--- /dev/null
+++ b/projects/shared/src/utils/index.ts
@@ -0,0 +1,3 @@
+export * from './date';
+export * from './api';
+export * from './supabase/initialize-supabase';
diff --git a/src/app/utlis/initialize-supabase.ts b/projects/shared/src/utils/supabase/initialize-supabase.ts
similarity index 73%
rename from src/app/utlis/initialize-supabase.ts
rename to projects/shared/src/utils/supabase/initialize-supabase.ts
index b8cebd9..7894254 100644
--- a/src/app/utlis/initialize-supabase.ts
+++ b/projects/shared/src/utils/supabase/initialize-supabase.ts
@@ -1,4 +1,4 @@
-import { SupabaseService } from '../services/supabase.service';
+import { SupabaseService } from '../../services';
 
 export function supabaseInitializer(supabase: SupabaseService): () => void {
   return () => {
diff --git a/projects/shared/tsconfig.lib.json b/projects/shared/tsconfig.lib.json
new file mode 100644
index 0000000..edb0551
--- /dev/null
+++ b/projects/shared/tsconfig.lib.json
@@ -0,0 +1,18 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/lib",
+    "declaration": true,
+    "declarationMap": true,
+    "inlineSources": true,
+    "types": []
+  },
+  "include": [
+    "src/**/*.ts"
+  ],
+  "exclude": [
+    "**/*.spec.ts"
+  ]
+}
diff --git a/projects/shared/tsconfig.lib.prod.json b/projects/shared/tsconfig.lib.prod.json
new file mode 100644
index 0000000..9215caa
--- /dev/null
+++ b/projects/shared/tsconfig.lib.prod.json
@@ -0,0 +1,11 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "./tsconfig.lib.json",
+  "compilerOptions": {
+    "declarationMap": false
+  },
+  "angularCompilerOptions": {
+    "compilationMode": "partial"
+  }
+}
diff --git a/projects/shared/tsconfig.spec.json b/projects/shared/tsconfig.spec.json
new file mode 100644
index 0000000..0feea88
--- /dev/null
+++ b/projects/shared/tsconfig.spec.json
@@ -0,0 +1,14 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": [
+      "jasmine"
+    ]
+  },
+  "include": [
+    "src/**/*.ts"
+  ]
+}
diff --git a/projects/shared/utils/public-api.ts b/projects/shared/utils/public-api.ts
new file mode 100644
index 0000000..fc1e97c
--- /dev/null
+++ b/projects/shared/utils/public-api.ts
@@ -0,0 +1 @@
+export * from '../src/utils';
\ No newline at end of file
diff --git a/projects/web/eslint.config.js b/projects/web/eslint.config.js
new file mode 100644
index 0000000..4df3649
--- /dev/null
+++ b/projects/web/eslint.config.js
@@ -0,0 +1,32 @@
+// @ts-check
+const tseslint = require("typescript-eslint");
+const rootConfig = require("../../eslint.config.js");
+
+module.exports = tseslint.config(
+  ...rootConfig,
+  {
+    files: ["**/*.ts"],
+    rules: {
+      "@angular-eslint/directive-selector": [
+        "error",
+        {
+          type: "attribute",
+          prefix: "web",
+          style: "camelCase",
+        },
+      ],
+      "@angular-eslint/component-selector": [
+        "error",
+        {
+          type: "element",
+          prefix: "web",
+          style: "kebab-case",
+        },
+      ],
+    },
+  },
+  {
+    files: ["**/*.html"],
+    rules: {},
+  }
+);
diff --git a/projects/web/public/favicon.ico b/projects/web/public/favicon.ico
new file mode 100644
index 0000000..57614f9
Binary files /dev/null and b/projects/web/public/favicon.ico differ
diff --git a/public/logo.png b/projects/web/public/logo.png
similarity index 100%
rename from public/logo.png
rename to projects/web/public/logo.png
diff --git a/public/logo_white_A.png b/projects/web/public/logo_white_A.png
similarity index 100%
rename from public/logo_white_A.png
rename to projects/web/public/logo_white_A.png
diff --git a/public/my/photo.webp b/projects/web/public/my/photo.webp
similarity index 100%
rename from public/my/photo.webp
rename to projects/web/public/my/photo.webp
diff --git a/public/tags/angular.svg b/projects/web/public/tags/angular.svg
similarity index 100%
rename from public/tags/angular.svg
rename to projects/web/public/tags/angular.svg
diff --git a/public/tags/best-practices.svg b/projects/web/public/tags/best-practices.svg
similarity index 99%
rename from public/tags/best-practices.svg
rename to projects/web/public/tags/best-practices.svg
index c3508b2..06dbc90 100644
--- a/public/tags/best-practices.svg
+++ b/projects/web/public/tags/best-practices.svg
@@ -1,7 +1,7 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
-<svg fill="#ffffff" width="800px" height="800px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg">
-  <title>checkmark1</title>
-  <path
-    d="M21.82 13.030l-1.002-1.002c-0.185-0.185-0.484-0.185-0.668 0l-6.014 6.013-2.859-2.882c-0.186-0.185-0.484-0.185-0.67 0l-1.002 1.003c-0.185 0.185-0.185 0.484 0 0.668l4.193 4.223c0.185 0.184 0.484 0.184 0.668 0l7.354-7.354c0.186-0.185 0.186-0.484 0-0.669zM16 3c-7.18 0-13 5.82-13 13s5.82 13 13 13 13-5.82 13-13-5.82-13-13-13zM16 26c-5.522 0-10-4.478-10-10 0-5.523 4.478-10 10-10 5.523 0 10 4.477 10 10 0 5.522-4.477 10-10 10z"></path>
-</svg>
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg fill="#ffffff" width="800px" height="800px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg">
+  <title>checkmark1</title>
+  <path
+    d="M21.82 13.030l-1.002-1.002c-0.185-0.185-0.484-0.185-0.668 0l-6.014 6.013-2.859-2.882c-0.186-0.185-0.484-0.185-0.67 0l-1.002 1.003c-0.185 0.185-0.185 0.484 0 0.668l4.193 4.223c0.185 0.184 0.484 0.184 0.668 0l7.354-7.354c0.186-0.185 0.186-0.484 0-0.669zM16 3c-7.18 0-13 5.82-13 13s5.82 13 13 13 13-5.82 13-13-5.82-13-13-13zM16 26c-5.522 0-10-4.478-10-10 0-5.523 4.478-10 10-10 5.523 0 10 4.477 10 10 0 5.522-4.477 10-10 10z"></path>
+</svg>
diff --git a/public/tags/cloud-computing.svg b/projects/web/public/tags/cloud-computing.svg
similarity index 100%
rename from public/tags/cloud-computing.svg
rename to projects/web/public/tags/cloud-computing.svg
diff --git a/public/tags/css.svg b/projects/web/public/tags/css.svg
similarity index 98%
rename from public/tags/css.svg
rename to projects/web/public/tags/css.svg
index 35ea297..4fa8fc2 100644
--- a/public/tags/css.svg
+++ b/projects/web/public/tags/css.svg
@@ -1,23 +1,23 @@
-<?xml version="1.0" encoding="iso-8859-1"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
-<svg fill="#ffffff" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
-     width="800px"
-     height="800px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve">
-
-<g id="c133de6af664cd4f011a55de6b001a2b">
-
-<path display="inline" d="M204.064,46.682v22.018h-56.302V0.501h56.302v24.13h-32.172v22.051H204.064z M261.941,24.631h22.492
-		V0.501h-56.308c0,0,0,12.112,0,24.13c7.533,7.533,11.461,11.139,22.356,22.034c-6.369,0-22.356,0.022-22.356,0.021v22.014h56.308
-		V46.682L261.941,24.631z M341.746,24.631h22.49V0.501H307.93c0,0,0,12.112,0,24.13c7.531,7.533,11.461,11.139,22.355,22.034
-		c-6.365,0-22.355,0.022-22.355,0.021v22.014h56.307V46.682L341.746,24.631z M438.395,101.112l-34.203,370.486l-148.193,39.9
-		l-148.196-39.9L73.605,101.112H438.395z M369.477,176.444H255.865h-115.62l5.529,44.739h110.091h6.184l-6.184,2.574
-		l-106.067,44.177l3.518,43.73l102.549,0.333l54.963,0.175l-3.521,58.311l-51.442,14.484v-0.046l-0.422,0.116l-49.684-12.542
-		l-3.015-36.195h-0.164h-46.085h-0.162l6.032,69.876l93.5,27.649v-0.05l0.168,0.05l93-27.146L361.1,267.935H255.865h-0.26
-		l0.26-0.112l109.086-46.639L369.477,176.444z">
-
-</path>
-
-</g>
-
-</svg>
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg fill="#ffffff" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+     width="800px"
+     height="800px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve">
+
+<g id="c133de6af664cd4f011a55de6b001a2b">
+
+<path display="inline" d="M204.064,46.682v22.018h-56.302V0.501h56.302v24.13h-32.172v22.051H204.064z M261.941,24.631h22.492
+		V0.501h-56.308c0,0,0,12.112,0,24.13c7.533,7.533,11.461,11.139,22.356,22.034c-6.369,0-22.356,0.022-22.356,0.021v22.014h56.308
+		V46.682L261.941,24.631z M341.746,24.631h22.49V0.501H307.93c0,0,0,12.112,0,24.13c7.531,7.533,11.461,11.139,22.355,22.034
+		c-6.365,0-22.355,0.022-22.355,0.021v22.014h56.307V46.682L341.746,24.631z M438.395,101.112l-34.203,370.486l-148.193,39.9
+		l-148.196-39.9L73.605,101.112H438.395z M369.477,176.444H255.865h-115.62l5.529,44.739h110.091h6.184l-6.184,2.574
+		l-106.067,44.177l3.518,43.73l102.549,0.333l54.963,0.175l-3.521,58.311l-51.442,14.484v-0.046l-0.422,0.116l-49.684-12.542
+		l-3.015-36.195h-0.164h-46.085h-0.162l6.032,69.876l93.5,27.649v-0.05l0.168,0.05l93-27.146L361.1,267.935H255.865h-0.26
+		l0.26-0.112l109.086-46.639L369.477,176.444z">
+
+</path>
+
+</g>
+
+</svg>
diff --git a/public/tags/deployment.svg b/projects/web/public/tags/deployment.svg
similarity index 100%
rename from public/tags/deployment.svg
rename to projects/web/public/tags/deployment.svg
diff --git a/public/tags/firebase.svg b/projects/web/public/tags/firebase.svg
similarity index 100%
rename from public/tags/firebase.svg
rename to projects/web/public/tags/firebase.svg
diff --git a/public/tags/firestore.svg b/projects/web/public/tags/firestore.svg
similarity index 100%
rename from public/tags/firestore.svg
rename to projects/web/public/tags/firestore.svg
diff --git a/public/tags/html.svg b/projects/web/public/tags/html.svg
similarity index 98%
rename from public/tags/html.svg
rename to projects/web/public/tags/html.svg
index 4efdd7f..60ebfad 100644
--- a/public/tags/html.svg
+++ b/projects/web/public/tags/html.svg
@@ -1,22 +1,22 @@
-<?xml version="1.0" encoding="iso-8859-1"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
-<svg fill="#ffffff" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
-     width="800px"
-     height="800px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve">
-
-<g id="c133de6af664cd4f011a55de6b000d0b">
-
-<path display="inline" d="M108.669,0.501h23.032v22.756h21.069V0.501h23.034V69.41h-23.032V46.334h-21.069V69.41h-23.032V0.501
-		H108.669z M206.091,23.353h-20.275V0.501h63.594v22.852h-20.285V69.41h-23.032V23.353H206.091z M259.502,0.501h24.02l14.771,24.213
-		l14.759-24.213h24.023V69.41h-22.938V35.256l-15.845,24.5h-0.395l-15.856-24.5V69.41h-22.539V0.501z M348.54,0.501h23.038v46.133
-		h32.391V69.41H348.54V0.501z M74.987,100.926l32.946,369.533l147.844,41.04L404.031,470.4l32.981-369.475H74.987z M368.289,188.62
-		l-2.063,22.977l-0.906,10.188h-0.149H256h-0.158h-63.956l4.142,46.407h59.814H256h92.98h12.214l-1.106,12.172l-10.65,119.32
-		l-0.682,7.652L256,433.045v0.008l-0.208,0.059l-92.839-25.774l-6.351-71.161h20.97h24.527l3.227,36.146l50.474,13.632l0.042-0.013
-		v-0.004l50.551-13.64l5.257-58.781H256h-0.158H154.578L143.439,188.62l-1.085-12.157h113.488H256h113.374L368.289,188.62z">
-
-</path>
-
-</g>
-
-</svg>
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg fill="#ffffff" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+     width="800px"
+     height="800px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve">
+
+<g id="c133de6af664cd4f011a55de6b000d0b">
+
+<path display="inline" d="M108.669,0.501h23.032v22.756h21.069V0.501h23.034V69.41h-23.032V46.334h-21.069V69.41h-23.032V0.501
+		H108.669z M206.091,23.353h-20.275V0.501h63.594v22.852h-20.285V69.41h-23.032V23.353H206.091z M259.502,0.501h24.02l14.771,24.213
+		l14.759-24.213h24.023V69.41h-22.938V35.256l-15.845,24.5h-0.395l-15.856-24.5V69.41h-22.539V0.501z M348.54,0.501h23.038v46.133
+		h32.391V69.41H348.54V0.501z M74.987,100.926l32.946,369.533l147.844,41.04L404.031,470.4l32.981-369.475H74.987z M368.289,188.62
+		l-2.063,22.977l-0.906,10.188h-0.149H256h-0.158h-63.956l4.142,46.407h59.814H256h92.98h12.214l-1.106,12.172l-10.65,119.32
+		l-0.682,7.652L256,433.045v0.008l-0.208,0.059l-92.839-25.774l-6.351-71.161h20.97h24.527l3.227,36.146l50.474,13.632l0.042-0.013
+		v-0.004l50.551-13.64l5.257-58.781H256h-0.158H154.578L143.439,188.62l-1.085-12.157h113.488H256h113.374L368.289,188.62z">
+
+</path>
+
+</g>
+
+</svg>
diff --git a/public/tags/javascript.svg b/projects/web/public/tags/javascript.svg
similarity index 100%
rename from public/tags/javascript.svg
rename to projects/web/public/tags/javascript.svg
diff --git a/public/tags/nodejs.svg b/projects/web/public/tags/nodejs.svg
similarity index 100%
rename from public/tags/nodejs.svg
rename to projects/web/public/tags/nodejs.svg
diff --git a/public/tags/performance.svg b/projects/web/public/tags/performance.svg
similarity index 100%
rename from public/tags/performance.svg
rename to projects/web/public/tags/performance.svg
diff --git a/public/tags/security.svg b/projects/web/public/tags/security.svg
similarity index 100%
rename from public/tags/security.svg
rename to projects/web/public/tags/security.svg
diff --git a/public/tags/ssg.svg b/projects/web/public/tags/ssg.svg
similarity index 100%
rename from public/tags/ssg.svg
rename to projects/web/public/tags/ssg.svg
diff --git a/public/tags/testing.svg b/projects/web/public/tags/testing.svg
similarity index 100%
rename from public/tags/testing.svg
rename to projects/web/public/tags/testing.svg
diff --git a/public/tags/tutorials.svg b/projects/web/public/tags/tutorials.svg
similarity index 100%
rename from public/tags/tutorials.svg
rename to projects/web/public/tags/tutorials.svg
diff --git a/public/tags/typescript.svg b/projects/web/public/tags/typescript.svg
similarity index 100%
rename from public/tags/typescript.svg
rename to projects/web/public/tags/typescript.svg
diff --git a/public/tags/web-development.svg b/projects/web/public/tags/web-development.svg
similarity index 100%
rename from public/tags/web-development.svg
rename to projects/web/public/tags/web-development.svg
diff --git a/src/app/reader/reader.component.spec.ts b/projects/web/src/app/app.component.spec.ts
old mode 100755
new mode 100644
similarity index 50%
rename from src/app/reader/reader.component.spec.ts
rename to projects/web/src/app/app.component.spec.ts
index 82075c1..096617b
--- a/src/app/reader/reader.component.spec.ts
+++ b/projects/web/src/app/app.component.spec.ts
@@ -1,18 +1,19 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
 
-import { ReaderComponent } from './reader.component';
+import { AppComponent } from './app.component';
 
-describe('ReaderComponent', () => {
-  let component: ReaderComponent;
-  let fixture: ComponentFixture<ReaderComponent>;
+describe('AppComponent', () => {
+  let component: AppComponent;
+  let fixture: ComponentFixture<AppComponent>;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [ReaderComponent]
+      imports: [AppComponent, RouterTestingModule]
     })
     .compileComponents();
-    
-    fixture = TestBed.createComponent(ReaderComponent);
+
+    fixture = TestBed.createComponent(AppComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });
diff --git a/projects/web/src/app/app.component.ts b/projects/web/src/app/app.component.ts
new file mode 100644
index 0000000..638acb8
--- /dev/null
+++ b/projects/web/src/app/app.component.ts
@@ -0,0 +1,10 @@
+import { Component } from '@angular/core';
+import { MainLayoutComponent } from './layout';
+
+@Component({
+  selector: 'web-root',
+  standalone: true,
+  imports: [MainLayoutComponent],
+  template: '<web-main-layout/>',
+})
+export class AppComponent {}
diff --git a/src/app/app.config.server.ts b/projects/web/src/app/app.config.server.ts
old mode 100755
new mode 100644
similarity index 53%
rename from src/app/app.config.server.ts
rename to projects/web/src/app/app.config.server.ts
index 9356c0f..41031f1
--- a/src/app/app.config.server.ts
+++ b/projects/web/src/app/app.config.server.ts
@@ -1,12 +1,11 @@
 import { mergeApplicationConfig, ApplicationConfig } from '@angular/core';
-import { provideServerRendering } from '@angular/platform-server';
+import { provideServerRendering, withRoutes } from '@angular/ssr';
 import { appConfig } from './app.config';
-import { provideClientHydration, withEventReplay } from '@angular/platform-browser';
+import { serverRoutes } from './app.routes.server';
 
 const serverConfig: ApplicationConfig = {
   providers: [
-    provideServerRendering(),
-    provideClientHydration(withEventReplay()),
+    provideServerRendering(withRoutes(serverRoutes))
   ]
 };
 
diff --git a/projects/web/src/app/app.config.ts b/projects/web/src/app/app.config.ts
new file mode 100644
index 0000000..c2644d3
--- /dev/null
+++ b/projects/web/src/app/app.config.ts
@@ -0,0 +1,27 @@
+import {
+  ApplicationConfig,
+  provideBrowserGlobalErrorListeners,
+  provideZoneChangeDetection,
+  inject,
+  provideAppInitializer,
+} from '@angular/core';
+import { provideRouter, withComponentInputBinding } from '@angular/router';
+import { provideClientHydration, withEventReplay } from '@angular/platform-browser';
+import { provideHttpClient, withFetch } from '@angular/common/http';
+import { routes } from './app.routes';
+import { SupabaseService } from 'shared';
+import { supabaseInitializer } from 'shared';
+
+export const appConfig: ApplicationConfig = {
+  providers: [
+    provideBrowserGlobalErrorListeners(),
+    provideHttpClient(withFetch()),
+    provideZoneChangeDetection({ eventCoalescing: true }),
+    provideRouter(routes, withComponentInputBinding()),
+    provideClientHydration(withEventReplay()),
+    provideAppInitializer(() => {
+      const supabaseService = inject(SupabaseService);
+      return supabaseInitializer(supabaseService)();
+    }),
+  ],
+};
diff --git a/projects/web/src/app/app.routes.server.ts b/projects/web/src/app/app.routes.server.ts
new file mode 100644
index 0000000..722405e
--- /dev/null
+++ b/projects/web/src/app/app.routes.server.ts
@@ -0,0 +1,18 @@
+import { RenderMode, ServerRoute } from '@angular/ssr';
+import { getPrerenderParams } from './core/utils/prerender-params';
+
+export const serverRoutes: ServerRoute[] = [
+  {
+    path: '',
+    renderMode: RenderMode.Server,
+  },
+  {
+    path: 'post/:id',
+    renderMode: RenderMode.Prerender,
+    getPrerenderParams,
+  },
+  {
+    path: '**',
+    renderMode: RenderMode.Server,
+  },
+];
diff --git a/projects/web/src/app/app.routes.ts b/projects/web/src/app/app.routes.ts
new file mode 100644
index 0000000..11f98f1
--- /dev/null
+++ b/projects/web/src/app/app.routes.ts
@@ -0,0 +1,16 @@
+import { Routes } from '@angular/router';
+
+export const routes: Routes = [
+  {
+    path: '',
+    loadChildren: () => import('./features/main-page.routes'),
+  },
+  {
+    path: 'post',
+    loadChildren: () => import('./features/post/post.routes'),
+  },
+  {
+    path: '**',
+    redirectTo: '',
+  },
+];
diff --git a/src/app/auth/login/login.component.scss b/projects/web/src/app/app.scss
similarity index 100%
rename from src/app/auth/login/login.component.scss
rename to projects/web/src/app/app.scss
diff --git a/projects/web/src/app/core/auth/README.md b/projects/web/src/app/core/auth/README.md
new file mode 100644
index 0000000..35058e5
--- /dev/null
+++ b/projects/web/src/app/core/auth/README.md
@@ -0,0 +1,14 @@
+# Authentication Domain - Web
+
+Authentication state, services, tokens, and functional guards for the web application.
+
+## Contents
+- Authentication services
+- JWT token handling  
+- Route guards
+- Auth state management
+- Role-based access control
+
+## Dependencies
+- Can use shared data-access services
+- Should provide functional guards for routes
\ No newline at end of file
diff --git a/projects/web/src/app/core/http/README.md b/projects/web/src/app/core/http/README.md
new file mode 100644
index 0000000..19a2bea
--- /dev/null
+++ b/projects/web/src/app/core/http/README.md
@@ -0,0 +1,13 @@
+# HTTP Layer - Web
+
+Cross-cutting HTTP interceptors and global request/response handling.
+
+## Contents
+- Authentication interceptors
+- Error handling interceptors
+- Loading indicators
+- Request/response transformation
+
+## Pattern
+- Use functional interceptors via `provideHttpClient()`
+- Configure through core providers
\ No newline at end of file
diff --git a/src/app/reader/_services/reader-api.service.ts b/projects/web/src/app/core/services/reader-api.service.ts
similarity index 78%
rename from src/app/reader/_services/reader-api.service.ts
rename to projects/web/src/app/core/services/reader-api.service.ts
index 03c335e..3f83635 100755
--- a/src/app/reader/_services/reader-api.service.ts
+++ b/projects/web/src/app/core/services/reader-api.service.ts
@@ -1,10 +1,10 @@
 import { inject, Injectable } from '@angular/core';
-import { SupabaseService } from '../../services/supabase.service';
-import { Comment, Post, Profile, Tag, PostTag } from '../../types/supabase';
 import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
 import { map, Observable } from 'rxjs';
-import { environment } from '../../../environments/environment';
-import { createApiUrl } from '../../helpers/api-url-builder';
+import { SupabaseService } from 'shared';
+import { Comment, Post, Profile, Tag, PostTag } from 'shared';
+import { createApiUrl } from 'shared';
+import { environment } from '../../../../../../environments/environment';
 
 @Injectable({ providedIn: 'root' })
 export class ReaderApiService {
@@ -28,9 +28,7 @@ export class ReaderApiService {
       .replace(/\s+/g, ' ')
       .trim();
 
-    const params = new HttpParams()
-      .set('select', selectQuery)
-      .set('id', `eq.${id}`);
+    const params = new HttpParams().set('select', selectQuery).set('id', `eq.${id}`);
 
     const headers = new HttpHeaders({
       apikey: this.apiKey,
@@ -40,7 +38,7 @@ export class ReaderApiService {
 
     return this.http
       .get<Post[]>(`${this.baseUrl}posts`, { headers, params })
-      .pipe(map((results) => results[0] ?? null));
+      .pipe(map(results => results[0] ?? null));
   }
 
   async getComments(postId: string): Promise<Comment[]> {
@@ -53,13 +51,11 @@ export class ReaderApiService {
   }
 
   async addComment(postId: string, comment: Comment): Promise<void> {
-    const { error } = await this.supabaseService.getClient
-      .from('comments')
-      .insert({ ...comment, post_id: postId });
+    await this.supabaseService.getClient.from('comments').insert({ ...comment, post_id: postId });
   }
 
   async deleteComment(commentId: string, postId: string): Promise<void> {
-    const { error } = await this.supabaseService.getClient
+    await this.supabaseService.getClient
       .from('comments')
       .delete()
       .eq('id', commentId)
@@ -68,11 +64,7 @@ export class ReaderApiService {
 
   getPosts(): Observable<Post[]> {
     const query = createApiUrl('posts')
-      .select(
-        '*',
-        'author:profiles(id,username,avatar_url)',
-        'post_tags(tags(id,name,color,icon))',
-      )
+      .select('*', 'author:profiles(id,username,avatar_url)', 'post_tags(tags(id,name,color,icon))')
       .where('is_draft', 'eq', false)
       .orderBy('created_at', 'desc')
       .build();
diff --git a/projects/web/src/app/core/utils/prerender-params.ts b/projects/web/src/app/core/utils/prerender-params.ts
new file mode 100644
index 0000000..cbaf44f
--- /dev/null
+++ b/projects/web/src/app/core/utils/prerender-params.ts
@@ -0,0 +1,32 @@
+/**
+ * Prerender Parameters Generator
+ * 
+ * Fetches published post IDs from Supabase for Angular SSR prerendering.
+ * Used by app.routes.server.ts to generate static routes.
+ */
+
+export async function getPrerenderParams(): Promise<{ id: string }[]> {
+  try {
+    const supabaseUrl = 'https://aqdbdmepncxxuanlymwr.supabase.co';
+    const supabaseKey = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6ImFxZGJkbWVwbmN4eHVhbmx5bXdyIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NDUwNTA0MjYsImV4cCI6MjA2MDYyNjQyNn0.RNtZZ4Of4LIP3XuS9lumHYdjRLVUGXARtAxaTJmF7lc';
+    
+    const response = await fetch(`${supabaseUrl}/rest/v1/posts?select=id&is_draft=eq.false&order=created_at.desc`, {
+      headers: {
+        'apikey': supabaseKey,
+        'Authorization': `Bearer ${supabaseKey}`,
+        'Content-Type': 'application/json'
+      }
+    });
+
+    if (!response.ok) {
+      console.error('Failed to fetch posts for prerendering:', response.statusText);
+      return [];
+    }
+
+    const posts = await response.json();
+    return posts.map((post: { id: string }) => ({ id: post.id }));
+  } catch (error) {
+    console.error('Error fetching posts for prerendering:', error);
+    return [];
+  }
+}
\ No newline at end of file
diff --git a/projects/web/src/app/features/README.md b/projects/web/src/app/features/README.md
new file mode 100644
index 0000000..79dc63f
--- /dev/null
+++ b/projects/web/src/app/features/README.md
@@ -0,0 +1,16 @@
+# Features Layer - Web
+
+Lazy-loaded business capabilities, fully isolated. Each feature is a black box exposed only through routes.
+
+## Structure
+- `home/` - Landing page feature
+- `blog/` - Blog listing and post features
+- `about/` - About page feature
+- `contact/` - Contact form feature
+
+## Rules
+- All features are lazy-loaded
+- No cross-feature TypeScript imports
+- Can import from: `core`, `layout`, `ui`, `pattern`, `@shared/*`
+- Feature-scoped services via route providers
+- Each has its own routes file
\ No newline at end of file
diff --git a/projects/web/src/app/features/main-page.routes.ts b/projects/web/src/app/features/main-page.routes.ts
new file mode 100644
index 0000000..d58bb61
--- /dev/null
+++ b/projects/web/src/app/features/main-page.routes.ts
@@ -0,0 +1,8 @@
+import { Routes } from '@angular/router';
+
+export default [
+  {
+    path: '',
+    loadComponent: () => import('./main-page/main-page.component').then(m => m.MainPageComponent)
+  }
+] as Routes;
\ No newline at end of file
diff --git a/projects/web/src/app/features/main-page/main-page.component.html b/projects/web/src/app/features/main-page/main-page.component.html
new file mode 100755
index 0000000..fe2bce0
--- /dev/null
+++ b/projects/web/src/app/features/main-page/main-page.component.html
@@ -0,0 +1,3 @@
+<div class="main-page">
+  <web-posts-list />
+</div>
diff --git a/projects/web/src/app/features/main-page/main-page.component.scss b/projects/web/src/app/features/main-page/main-page.component.scss
new file mode 100755
index 0000000..fed6e4a
--- /dev/null
+++ b/projects/web/src/app/features/main-page/main-page.component.scss
@@ -0,0 +1,12 @@
+// Main page styling for enhanced layout
+.main-page {
+  @apply space-y-8;
+  
+  // Ensure smooth scrolling and proper spacing
+  min-height: calc(100vh - 200px);
+}
+
+// Additional breathing room for content
+web-posts-list {
+  @apply block w-full;
+}
\ No newline at end of file
diff --git a/projects/web/src/app/features/main-page/main-page.component.ts b/projects/web/src/app/features/main-page/main-page.component.ts
new file mode 100755
index 0000000..c639918
--- /dev/null
+++ b/projects/web/src/app/features/main-page/main-page.component.ts
@@ -0,0 +1,12 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { PostsListComponent } from './posts-list/posts-list.component';
+
+@Component({
+  selector: 'web-main-page',
+  standalone: true,
+  imports: [PostsListComponent],
+  templateUrl: './main-page.component.html',
+  styleUrl: './main-page.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class MainPageComponent {}
diff --git a/src/app/shared/about-me/about-me.component.html b/projects/web/src/app/features/main-page/posts-list/about-me/about-me.component.html
similarity index 88%
rename from src/app/shared/about-me/about-me.component.html
rename to projects/web/src/app/features/main-page/posts-list/about-me/about-me.component.html
index 3d67d6b..8c01c0e 100644
--- a/src/app/shared/about-me/about-me.component.html
+++ b/projects/web/src/app/features/main-page/posts-list/about-me/about-me.component.html
@@ -13,5 +13,6 @@ <h2 class="text-sm mt-8 w-full md:w-1/2">
       new challenges.
     </h2>
   </div>
-  <img class="object-cover object-top hidden sm:block" ngSrc="my/photo.webp" priority width="250" height="250">
+  <img class="object-cover object-top hidden sm:block" ngSrc="my/photo.webp" priority width="250" height="250"
+       alt="lukasz-jablonski">
 </div>
diff --git a/src/app/shared/about-me/about-me.component.scss b/projects/web/src/app/features/main-page/posts-list/about-me/about-me.component.scss
similarity index 100%
rename from src/app/shared/about-me/about-me.component.scss
rename to projects/web/src/app/features/main-page/posts-list/about-me/about-me.component.scss
diff --git a/projects/web/src/app/features/main-page/posts-list/about-me/about-me.component.ts b/projects/web/src/app/features/main-page/posts-list/about-me/about-me.component.ts
new file mode 100644
index 0000000..c67ad56
--- /dev/null
+++ b/projects/web/src/app/features/main-page/posts-list/about-me/about-me.component.ts
@@ -0,0 +1,12 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { NgOptimizedImage } from '@angular/common';
+
+@Component({
+  selector: 'web-about-me',
+  standalone: true,
+  imports: [NgOptimizedImage],
+  templateUrl: './about-me.component.html',
+  styleUrl: './about-me.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class AboutMeComponent {}
diff --git a/projects/web/src/app/features/main-page/posts-list/posts-list.component.html b/projects/web/src/app/features/main-page/posts-list/posts-list.component.html
new file mode 100755
index 0000000..ef72f5d
--- /dev/null
+++ b/projects/web/src/app/features/main-page/posts-list/posts-list.component.html
@@ -0,0 +1,76 @@
+<web-about-me/>
+<div class="relative mt-4 pb-4" data-testid="tags-container">
+  <div class="relative shadow-lg bg-white p-4 sm:p-6 sm:px-14 rounded-[32px] sm:rounded-[64px] overflow-hidden">
+    <div
+      #scrollContainer
+      data-testid="tags-scroll-container"
+      class="overflow-x-scroll overflow-y-hidden hide-scrollbar whitespace-nowrap scroll-smooth"
+    >
+      <div class="inline-flex space-x-4 gap-x-0 md:gap-x-6" data-testid="tags-list">
+        @for (tag of tags(); track tag.id) {
+          <div class="flex flex-col items-center min-w-24 group" data-testid="tag-item" [attr.data-tag-name]="tag.name">
+            <div
+              [ngStyle]="{ 'background-color': tag.color }"
+              class="font-bold text-gray-700 rounded-full flex items-center justify-center font-mono p-3 md:p-5 min-w-18 transform transition-all duration-300 hover:scale-110 hover:shadow-lg relative cursor-pointer"
+              data-testid="tag-button"
+            >
+              <img
+                ngSrc="tags/{{ tag.icon }}"
+                [alt]="tag.name"
+                class="w-8 h-8 sm:w-10 sm:h-10 transition-transform duration-300 group-hover:scale-110"
+                width="32"
+                height="32"
+                data-testid="tag-icon"
+              />
+            </div>
+            <span
+              class="mt-1 sm:mt-2 text-center text-gray-600 text-sm sm:text-base"
+              data-testid="tag-name"
+            >{{ tag.name }}</span>
+          </div>
+        }
+      </div>
+    </div>
+
+    <button
+      (click)="scrollContainer.scrollLeft = scrollContainer.scrollLeft - 135"
+      class="btn btn-circle rounded-none absolute inset-y-0 left-0 h-full bg-base-100 bg-opacity-70 hover:bg-base-200 hidden md:flex rounded-tl-full rounded-bl-full"
+      data-testid="scroll-left-button"
+    >
+      <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 transform" viewBox="0 0 24 24" stroke="currentColor">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/>
+      </svg>
+    </button>
+
+    <button
+      (click)="scrollContainer.scrollLeft = scrollContainer.scrollLeft + 135"
+      class="btn btn-circle rounded-none absolute inset-y-0 right-0 h-full bg-base-100 bg-opacity-70 hover:bg-base-200 hidden md:flex rounded-tr-full rounded-br-full"
+      data-testid="scroll-right-button"
+    >
+      <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 transform rotate-180" viewBox="0 0 24 24"
+           stroke="currentColor">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/>
+      </svg>
+    </button>
+  </div>
+
+  <div class="relative -top-4 mt-2 md:hidden w-full flex justify-center" data-testid="mobile-progress-container">
+    <div class="w-10/12 bg-tertiary h-1 rounded-full">
+      <div
+        class="bg-primary h-1 rounded-full transition-all duration-300"
+        [style.width.%]="scrollProgress()"
+        data-testid="mobile-progress-bar"
+      ></div>
+    </div>
+  </div>
+</div>
+
+<div class="flex justify-center mt-5">
+  <div class="w-full">
+    <div class="grid">
+      @for (post of posts(); track post.id) {
+        <web-post-card [post]="post"/>
+      }
+    </div>
+  </div>
+</div>
diff --git a/src/app/reader/_components/main-page/posts-list/posts-list.component.scss b/projects/web/src/app/features/main-page/posts-list/posts-list.component.scss
similarity index 100%
rename from src/app/reader/_components/main-page/posts-list/posts-list.component.scss
rename to projects/web/src/app/features/main-page/posts-list/posts-list.component.scss
diff --git a/src/app/reader/_components/main-page/posts-list/posts-list.component.ts b/projects/web/src/app/features/main-page/posts-list/posts-list.component.ts
similarity index 59%
rename from src/app/reader/_components/main-page/posts-list/posts-list.component.ts
rename to projects/web/src/app/features/main-page/posts-list/posts-list.component.ts
index e820acd..923113e 100755
--- a/src/app/reader/_components/main-page/posts-list/posts-list.component.ts
+++ b/projects/web/src/app/features/main-page/posts-list/posts-list.component.ts
@@ -9,35 +9,31 @@ import {
   ElementRef,
   signal,
   WritableSignal,
+  DestroyRef,
 } from '@angular/core';
 import { RouterModule } from '@angular/router';
-import { AboutMeComponent } from '../../../../shared/about-me/about-me.component';
-import { PostCardComponent } from './post-card/post-card.component';
+import { PostCardComponent } from '../../../ui/components/post-card/post-card.component';
 import { PostsStore } from './posts.store';
-import { TagsStore } from '../../../../shared/stores/tags.store';
+import { TagsStore } from './tags.store';
+import { AboutMeComponent } from './about-me/about-me.component';
 
 @Component({
-  selector: 'app-posts-list',
+  selector: 'web-posts-list',
   standalone: true,
-  imports: [
-    RouterModule,
-    AboutMeComponent,
-    PostCardComponent,
-    NgOptimizedImage,
-    NgStyle,
-  ],
+  imports: [RouterModule, AboutMeComponent, PostCardComponent, NgOptimizedImage, NgStyle],
   templateUrl: './posts-list.component.html',
   styleUrl: './posts-list.component.scss',
   changeDetection: ChangeDetectionStrategy.Default,
   schemas: [CUSTOM_ELEMENTS_SCHEMA],
 })
 export class PostsListComponent {
-  scroll = viewChild<ElementRef<HTMLElement>>('scrollContainer');
+  readonly scroll = viewChild<ElementRef<HTMLElement>>('scrollContainer');
+  private destroyRef = inject(DestroyRef);
 
   postStore = inject(PostsStore);
   tagsStore = inject(TagsStore);
 
-  scrollProgress: WritableSignal<number> = signal(0);
+  readonly scrollProgress: WritableSignal<number> = signal(0);
   posts = this.postStore.posts;
   tags = this.tagsStore.tags;
   initialTagScrollProgressBarForMobile = 2;
@@ -60,10 +56,17 @@ export class PostsListComponent {
   private initializeScrollingForMobileView(): void {
     this.scrollProgress.set(this.initialTagScrollProgressBarForMobile);
     afterNextRender(() => {
-      this.scroll()?.nativeElement.addEventListener(
-        'scroll',
-        this.onScroll.bind(this),
-      );
+      const scrollHandler = this.onScroll.bind(this);
+      const element = this.scroll()?.nativeElement;
+      
+      if (element) {
+        element.addEventListener('scroll', scrollHandler);
+        
+        // Clean up event listener when component is destroyed
+        this.destroyRef.onDestroy(() => {
+          element.removeEventListener('scroll', scrollHandler);
+        });
+      }
     });
   }
 }
diff --git a/src/app/reader/_components/main-page/posts-list/posts.store.ts b/projects/web/src/app/features/main-page/posts-list/posts.store.ts
similarity index 74%
rename from src/app/reader/_components/main-page/posts-list/posts.store.ts
rename to projects/web/src/app/features/main-page/posts-list/posts.store.ts
index 66739f0..3f0a08d 100644
--- a/src/app/reader/_components/main-page/posts-list/posts.store.ts
+++ b/projects/web/src/app/features/main-page/posts-list/posts.store.ts
@@ -10,15 +10,14 @@ import {
 } from '@ngrx/signals';
 import { rxMethod } from '@ngrx/signals/rxjs-interop';
 import { pipe, switchMap, tap } from 'rxjs';
+import { Post } from 'shared';
+import { ReaderApiService } from '../../../core/services/reader-api.service';
 
-import { Post } from '../../../../types/supabase';
-import { ReaderApiService } from '../../../_services/reader-api.service';
-
-type PostsState = {
+interface PostsState {
   posts: Post[] | null;
   loading: boolean;
   error: string | null;
-};
+}
 
 const initialState: PostsState = {
   posts: [],
@@ -36,16 +35,16 @@ export const PostsStore = signalStore(
         switchMap(() =>
           api.getPosts().pipe(
             tapResponse({
-              next: (posts) => patchState(store, { posts, loading: false }),
-              error: (err) =>
+              next: posts => patchState(store, { posts, loading: false }),
+              error: (err: unknown) =>
                 patchState(store, {
-                  error: 'Failed to fetch posts',
+                  error: typeof err === 'string' ? err : 'Failed to fetch posts',
                   loading: false,
                 }),
-            }),
-          ),
-        ),
-      ),
+            })
+          )
+        )
+      )
     ),
   })),
 
@@ -57,5 +56,5 @@ export const PostsStore = signalStore(
 
   withComputed(({ posts }) => ({
     total: computed(() => posts()!.length),
-  })),
+  }))
 );
diff --git a/src/app/shared/stores/tags.store.ts b/projects/web/src/app/features/main-page/posts-list/tags.store.ts
similarity index 64%
rename from src/app/shared/stores/tags.store.ts
rename to projects/web/src/app/features/main-page/posts-list/tags.store.ts
index 4506f6d..d373465 100644
--- a/src/app/shared/stores/tags.store.ts
+++ b/projects/web/src/app/features/main-page/posts-list/tags.store.ts
@@ -1,23 +1,16 @@
 import { inject } from '@angular/core';
 import { tapResponse } from '@ngrx/operators';
-import {
-  patchState,
-  signalStore,
-  withState,
-  withMethods,
-  withHooks,
-} from '@ngrx/signals';
+import { patchState, signalStore, withState, withMethods, withHooks } from '@ngrx/signals';
 import { rxMethod } from '@ngrx/signals/rxjs-interop';
 import { pipe, switchMap, tap } from 'rxjs';
+import { ReaderApiService } from '../../../core/services/reader-api.service';
+import { Tag } from 'shared';
 
-import { Tag } from '../../types/supabase';
-import { ReaderApiService } from '../../reader/_services/reader-api.service';
-
-type TagsState = {
+interface TagsState {
   tags: Tag[] | null;
   loading: boolean;
   error: string | null;
-};
+}
 
 const initialState: TagsState = {
   tags: [],
@@ -36,16 +29,16 @@ export const TagsStore = signalStore(
         switchMap(() =>
           api.getTags().pipe(
             tapResponse({
-              next: (tags) => patchState(store, { tags, loading: false }),
-              error: (err) =>
+              next: tags => patchState(store, { tags: tags || [], loading: false }),
+              error: (err: unknown) =>
                 patchState(store, {
-                  error: 'Failed to fetch tags',
+                  error: 'Failed to fetch tags: ' + (typeof err === 'string' ? err : 'Unknown error'),
                   loading: false,
                 }),
-            }),
-          ),
-        ),
-      ),
+            })
+          )
+        )
+      )
     ),
   })),
 
@@ -53,5 +46,5 @@ export const TagsStore = signalStore(
     onInit() {
       loadTags();
     },
-  })),
+  }))
 );
diff --git a/src/app/reader/_components/main-page/post/add-comment/add-comment.component.html b/projects/web/src/app/features/post/details/add-comment/add-comment.component.html
similarity index 100%
rename from src/app/reader/_components/main-page/post/add-comment/add-comment.component.html
rename to projects/web/src/app/features/post/details/add-comment/add-comment.component.html
diff --git a/src/app/reader/_components/main-page/post/add-comment/add-comment.component.scss b/projects/web/src/app/features/post/details/add-comment/add-comment.component.scss
similarity index 100%
rename from src/app/reader/_components/main-page/post/add-comment/add-comment.component.scss
rename to projects/web/src/app/features/post/details/add-comment/add-comment.component.scss
diff --git a/src/app/reader/_components/main-page/post/add-comment/add-comment.component.ts b/projects/web/src/app/features/post/details/add-comment/add-comment.component.ts
similarity index 66%
rename from src/app/reader/_components/main-page/post/add-comment/add-comment.component.ts
rename to projects/web/src/app/features/post/details/add-comment/add-comment.component.ts
index 5df5521..ed63dfd 100755
--- a/src/app/reader/_components/main-page/post/add-comment/add-comment.component.ts
+++ b/projects/web/src/app/features/post/details/add-comment/add-comment.component.ts
@@ -1,22 +1,11 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  Input,
-  inject,
-} from '@angular/core';
-import {
-  FormGroup,
-  FormBuilder,
-  Validators,
-  ReactiveFormsModule,
-  FormControl,
-} from '@angular/forms';
-import { ReaderApiService } from '../../../../_services/reader-api.service';
+import { ChangeDetectionStrategy, Component, inject, input } from '@angular/core';
+import { FormGroup, Validators, ReactiveFormsModule, FormControl } from '@angular/forms';
+import { ReaderApiService } from '../../../../core/services/reader-api.service';
 import { CommentsStore } from '../comments/comments.store';
-import { Comment } from '../../../../../types/supabase';
+import { Comment } from 'shared';
 
 @Component({
-  selector: 'add-comment',
+  selector: 'web-add-comment',
   standalone: true,
   imports: [ReactiveFormsModule],
   providers: [ReaderApiService, CommentsStore],
@@ -25,7 +14,7 @@ import { Comment } from '../../../../../types/supabase';
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class AddCommentComponent {
-  @Input() postId!: string;
+  public readonly postId = input.required<string>();
 
   commentForm: FormGroup = new FormGroup({
     content: new FormControl<string>('', {
@@ -44,10 +33,10 @@ export class AddCommentComponent {
         created_at: new Date().toISOString(),
         is_deleted: false,
         is_reported: false,
-        post_id: this.postId,
+        post_id: this.postId(),
         user_id: null, // In a real app, this would be the current user's ID
       };
-      this.commentsStore.addComment(this.postId, comment);
+      this.commentsStore.addComment(this.postId(), comment);
       this.commentForm.reset();
     }
   }
diff --git a/src/app/reader/_components/main-page/post/code-block-modal-component/code-block-modal-component.component.ts b/projects/web/src/app/features/post/details/code-block-modal-component/code-block-modal-component.component.ts
similarity index 70%
rename from src/app/reader/_components/main-page/post/code-block-modal-component/code-block-modal-component.component.ts
rename to projects/web/src/app/features/post/details/code-block-modal-component/code-block-modal-component.component.ts
index 02c6e32..b9ea1e2 100644
--- a/src/app/reader/_components/main-page/post/code-block-modal-component/code-block-modal-component.component.ts
+++ b/projects/web/src/app/features/post/details/code-block-modal-component/code-block-modal-component.component.ts
@@ -1,12 +1,10 @@
 import { Component, inject } from '@angular/core';
-import { DYNAMIC_DIALOG_DATA } from '../../../../../shared/dynamic-dialog/dialog-data.token';
+import { DYNAMIC_DIALOG_DATA } from 'shared';
 
 @Component({
-  selector: 'app-code-block-modal',
+  selector: 'web-code-block-modal',
   standalone: true,
-  template: ` <pre
-    [class]="data.language"
-  ><code [innerHTML]="data.code"></code></pre>`,
+  template: ` <pre [class]="data.language"><code [innerHTML]="data.code"></code></pre>`,
   styles: [
     `
       :host {
diff --git a/src/app/reader/_components/main-page/post/comments/comments.component.html b/projects/web/src/app/features/post/details/comments/comments.component.html
similarity index 87%
rename from src/app/reader/_components/main-page/post/comments/comments.component.html
rename to projects/web/src/app/features/post/details/comments/comments.component.html
index 159336c..7f5cdce 100755
--- a/src/app/reader/_components/main-page/post/comments/comments.component.html
+++ b/projects/web/src/app/features/post/details/comments/comments.component.html
@@ -7,7 +7,7 @@ <h2 class="text-xl font-semibold mb-4">Comments</h2>
         <p class="text-gray-800 mb-2">{{ comment.content }}</p>
         <p class="text-sm text-gray-600">- {{ comment.author?.username }}</p>
       </div>
-      <button *hasRole="'Admin'" (click)="deleteComment(comment.id!)" class="text-red-500 hover:text-red-700">
+      <button *sharedHasRole="'Admin'" (click)="deleteComment(comment.id!)" class="text-red-500 hover:text-red-700">
         <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
           <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
         </svg>
diff --git a/src/app/reader/_components/main-page/post/comments/comments.component.scss b/projects/web/src/app/features/post/details/comments/comments.component.scss
similarity index 100%
rename from src/app/reader/_components/main-page/post/comments/comments.component.scss
rename to projects/web/src/app/features/post/details/comments/comments.component.scss
diff --git a/projects/web/src/app/features/post/details/comments/comments.component.ts b/projects/web/src/app/features/post/details/comments/comments.component.ts
new file mode 100755
index 0000000..8eec663
--- /dev/null
+++ b/projects/web/src/app/features/post/details/comments/comments.component.ts
@@ -0,0 +1,25 @@
+import { ChangeDetectionStrategy, Component, inject, input } from '@angular/core';
+import { ReaderApiService } from '../../../../core/services/reader-api.service';
+import { CommentsStore } from './comments.store';
+import { HasRoleDirective } from 'shared';
+import { Comment } from 'shared';
+
+@Component({
+  selector: 'web-comments',
+  standalone: true,
+  providers: [ReaderApiService, CommentsStore],
+  templateUrl: './comments.component.html',
+  styleUrl: './comments.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  imports: [HasRoleDirective],
+})
+export class CommentsComponent {
+  public readonly comments = input<Comment[]>();
+  public readonly postId = input.required<string>();
+
+  private commentsStore = inject(CommentsStore);
+
+  deleteComment(commentId: string): void {
+    this.commentsStore.deleteComment(commentId, this.postId());
+  }
+}
diff --git a/src/app/reader/_components/main-page/post/comments/comments.store.ts b/projects/web/src/app/features/post/details/comments/comments.store.ts
similarity index 82%
rename from src/app/reader/_components/main-page/post/comments/comments.store.ts
rename to projects/web/src/app/features/post/details/comments/comments.store.ts
index 55faf93..1074554 100644
--- a/src/app/reader/_components/main-page/post/comments/comments.store.ts
+++ b/projects/web/src/app/features/post/details/comments/comments.store.ts
@@ -1,13 +1,13 @@
 import { patchState, signalStore, withMethods, withState } from '@ngrx/signals';
 import { inject } from '@angular/core';
-import { ReaderApiService } from '../../../../_services/reader-api.service';
-import { Comment } from '../../../../../types/supabase';
+import { ReaderApiService } from '../../../../core/services/reader-api.service';
+import { Comment } from 'shared';
 
-type CommentsState = {
+interface CommentsState {
   comments: Comment[];
   loading: boolean;
   error: string | null;
-};
+}
 
 const initialState: CommentsState = {
   comments: [],
@@ -16,7 +16,6 @@ const initialState: CommentsState = {
 };
 
 export const CommentsStore = signalStore(
-  { providedIn: 'root' },
   withState(initialState),
 
   withMethods((state, commentsService = inject(ReaderApiService)) => ({
@@ -31,7 +30,7 @@ export const CommentsStore = signalStore(
         }
       } catch (error) {
         patchState(state, {
-          error: 'Failed to fetch comments',
+          error: 'Failed to fetch comments' + error,
           loading: false,
         });
       }
@@ -46,7 +45,7 @@ export const CommentsStore = signalStore(
           patchState(state, { comments, loading: false });
         }
       } catch (error) {
-        patchState(state, { error: 'Failed to add comment', loading: false });
+        patchState(state, { error: 'Failed to add comment' + error, loading: false });
       }
     },
 
@@ -60,10 +59,10 @@ export const CommentsStore = signalStore(
         }
       } catch (error) {
         patchState(state, {
-          error: 'Failed to delete comment',
+          error: 'Failed to delete comment' + error,
           loading: false,
         });
       }
     },
-  })),
+  }))
 );
diff --git a/src/app/reader/_components/main-page/post/post.component.html b/projects/web/src/app/features/post/details/post.component.html
similarity index 83%
rename from src/app/reader/_components/main-page/post/post.component.html
rename to projects/web/src/app/features/post/details/post.component.html
index bca446c..311c2de 100755
--- a/src/app/reader/_components/main-page/post/post.component.html
+++ b/projects/web/src/app/features/post/details/post.component.html
@@ -3,7 +3,7 @@
   <div class="flex justify-center -mx-2 xl:-mx-48">
     <img
       class="w-full h-80 object-cover mt-10 rounded-2xl"
-      src="{{ date()  }}-post.webp"
+      src="{{ date() }}-post.webp"
       alt="{{ post()?.title }}"
     />
   </div>
@@ -51,9 +51,7 @@ <h2 class="text-xl font-bold mt-6 mb-4">📖 Table of Contents</h2>
         </p>
         <!-- TODO: Add social share buttons -->
 
-        <div
-          class="relative mt-4 leading-8 bg-gray-50 text-gray-900 p-6 rounded-2xl shadow-2xl"
-        >
+        <div class="relative mt-4 leading-8 bg-gray-50 text-gray-900 p-6 rounded-2xl shadow-2xl">
           <div
             class="absolute shadow-2xl inset-0 blur-2xl opacity-100 rounded-3xl -z-10 bg-gradient-to-br from-quaternary/90 via-[#7A9E7E]/50 to-primary"
           ></div>
@@ -61,10 +59,17 @@ <h2 class="text-xl font-bold mt-6 mb-4">📖 Table of Contents</h2>
         </div>
 
         <hr class="border-gray-300 my-4"/>
-        <add-comment [postId]="id()"></add-comment>
+        <web-add-comment [postId]="id()"/>
+
         <hr class="border-gray-300 my-4"/>
-        @defer {
-          <comments [postId]="id()!" [comments]="post()?.comments"></comments>
+        @defer (on viewport) {
+          <web-comments [postId]="id()!" [comments]="post()?.comments"/>
+        } @placeholder {
+          <div
+            class="mx-auto p-4 bg-gray-50 border-2 border-dashed border-gray-300 rounded-lg text-center"
+          >
+            <p class="text-gray-600">Comments loading...</p>
+          </div>
         }
       } @else {
         <p class="text-gray-800 text-center">Post not found.</p>
diff --git a/src/app/reader/_components/main-page/post/post.component.scss b/projects/web/src/app/features/post/details/post.component.scss
similarity index 100%
rename from src/app/reader/_components/main-page/post/post.component.scss
rename to projects/web/src/app/features/post/details/post.component.scss
diff --git a/src/app/reader/_components/main-page/post/post.component.ts b/projects/web/src/app/features/post/details/post.component.ts
similarity index 72%
rename from src/app/reader/_components/main-page/post/post.component.ts
rename to projects/web/src/app/features/post/details/post.component.ts
index 69da7ee..68488a3 100755
--- a/src/app/reader/_components/main-page/post/post.component.ts
+++ b/projects/web/src/app/features/post/details/post.component.ts
@@ -7,20 +7,21 @@ import {
   afterNextRender,
   Signal,
   input,
+  DestroyRef,
 } from '@angular/core';
-import { ReaderApiService } from '../../../_services/reader-api.service';
 import { DatePipe } from '@angular/common';
+import { Router } from '@angular/router';
+import { ReaderApiService } from '../../../core/services/reader-api.service';
 import { CommentsComponent } from './comments/comments.component';
 import { AddCommentComponent } from './add-comment/add-comment.component';
-import { Router } from '@angular/router';
-import { DynamicDialogService } from '../../../../shared/dynamic-dialog/dynamic-dialog.service';
 import { CodeBlockModalComponent } from './code-block-modal-component/code-block-modal-component.component';
 import { PostStore } from './post.store';
 import { CommentsStore } from './comments/comments.store';
-import { Post } from '../../../../types/supabase';
+import { Post } from 'shared';
+import { DynamicDialogService } from 'shared';
 
 @Component({
-  selector: 'app-post',
+  selector: 'web-post',
   standalone: true,
   providers: [ReaderApiService, DatePipe, PostStore, CommentsStore],
   templateUrl: './post.component.html',
@@ -29,13 +30,14 @@ import { Post } from '../../../../types/supabase';
   imports: [CommentsComponent, AddCommentComponent, DatePipe],
 })
 export class PostComponent implements OnInit {
-  id = input.required<string>();
+  readonly id = input.required<string>();
+  private destroyRef = inject(DestroyRef);
 
   router = inject(Router);
   postStore = inject(PostStore);
 
-  post: Signal<Post | null> = this.postStore.post;
-  date: Signal<string | null> = this.postStore.formattedDate;
+  readonly post: Signal<Post | null> = this.postStore.post;
+  readonly date: Signal<string | null> = this.postStore.formattedDate;
 
   private dialogService = inject(DynamicDialogService);
   private viewContainerRef = inject(ViewContainerRef);
@@ -70,20 +72,19 @@ export class PostComponent implements OnInit {
         primaryButton: 'Close',
         data: { code, language },
       },
-      CodeBlockModalComponent,
+      CodeBlockModalComponent
     );
   }
 
   private addEventsForOpenModalWithCode() {
     afterNextRender(() => {
-      //TODO: Move to the service
       const processedNodes = new Set<Node>();
 
-      const observer = new MutationObserver((mutations) => {
+      const observer = new MutationObserver(mutations => {
         let found = false;
 
-        mutations.forEach((mutation) => {
-          mutation.addedNodes.forEach((node) => {
+        mutations.forEach(mutation => {
+          mutation.addedNodes.forEach(node => {
             if (processedNodes.has(node)) {
               return;
             }
@@ -93,13 +94,9 @@ export class PostComponent implements OnInit {
               const preElements = node.querySelectorAll('pre[data-language]');
               if (preElements.length > 0) {
                 found = true;
-                preElements.forEach((pre) => {
-                  pre.classList.add(
-                    'cursor-pointer',
-                    'hover:opacity-80',
-                    'transition-opacity',
-                  );
-                  pre.addEventListener('click', (e) => this.showCodeModal(e));
+                preElements.forEach(pre => {
+                  pre.classList.add('cursor-pointer', 'hover:opacity-80', 'transition-opacity');
+                  pre.addEventListener('click', e => this.showCodeModal(e));
                 });
               }
             }
@@ -116,6 +113,12 @@ export class PostComponent implements OnInit {
         childList: true,
         subtree: true,
       });
+
+      // Clean up observer when component is destroyed
+      this.destroyRef.onDestroy(() => {
+        observer.disconnect();
+        processedNodes.clear();
+      });
     });
   }
 }
diff --git a/src/app/reader/_components/main-page/post/post.store.ts b/projects/web/src/app/features/post/details/post.store.ts
similarity index 58%
rename from src/app/reader/_components/main-page/post/post.store.ts
rename to projects/web/src/app/features/post/details/post.store.ts
index 52cf665..b04f041 100644
--- a/src/app/reader/_components/main-page/post/post.store.ts
+++ b/projects/web/src/app/features/post/details/post.store.ts
@@ -1,26 +1,19 @@
 import { inject } from '@angular/core';
 import { computed } from '@angular/core';
-import {
-  patchState,
-  signalStore,
-  withMethods,
-  withState,
-  withComputed,
-} from '@ngrx/signals';
+import { patchState, signalStore, withMethods, withState, withComputed } from '@ngrx/signals';
 import { rxMethod } from '@ngrx/signals/rxjs-interop';
 import { pipe, switchMap, tap } from 'rxjs';
 import { tapResponse } from '@ngrx/operators';
+import { ReaderApiService } from '../../../core/services/reader-api.service';
+import { formatDateToDDMMYYYY } from 'shared';
+import { Post } from 'shared';
 
-import { Post } from '../../../../types/supabase';
-import { ReaderApiService } from '../../../_services/reader-api.service';
-import { formatDateToDDMMYYYY } from '../../../../utlis/date-utils';
-
-type PostState = {
+interface PostState {
   post: Post | null;
   date: string | null;
   loading: boolean;
   error: string | null;
-};
+}
 
 const initialState: PostState = {
   post: null,
@@ -30,30 +23,27 @@ const initialState: PostState = {
 };
 
 export const PostStore = signalStore(
-  { providedIn: 'root' },
   withState(initialState),
-  withComputed((store) => ({
-    formattedDate: computed(() =>
-      formatDateToDDMMYYYY(store.post()?.created_at),
-    ),
+  withComputed(store => ({
+    formattedDate: computed(() => formatDateToDDMMYYYY(store.post()?.created_at)),
   })),
   withMethods((store, postService = inject(ReaderApiService)) => ({
     getPost: rxMethod<string>(
       pipe(
         tap(() => patchState(store, { loading: true, error: null })),
-        switchMap((id) =>
+        switchMap(id =>
           postService.getPost(id).pipe(
             tapResponse({
               next: (post: Post) => patchState(store, { post, loading: false }),
-              error: (err: string) =>
+              error: (err: unknown) =>
                 patchState(store, {
-                  error: err ?? 'Failed to fetch post',
+                  error: typeof err === 'string' ? err : 'Failed to fetch post',
                   loading: false,
                 }),
-            }),
-          ),
-        ),
-      ),
+            })
+          )
+        )
+      )
     ),
-  })),
+  }))
 );
diff --git a/projects/web/src/app/features/post/post.routes.ts b/projects/web/src/app/features/post/post.routes.ts
new file mode 100644
index 0000000..2266d5c
--- /dev/null
+++ b/projects/web/src/app/features/post/post.routes.ts
@@ -0,0 +1,8 @@
+import { Routes } from '@angular/router';
+
+export default [
+  {
+    path: ':id',
+    loadComponent: () => import('./details/post.component').then(m => m.PostComponent)
+  }
+] as Routes;
\ No newline at end of file
diff --git a/projects/web/src/app/layout/index.ts b/projects/web/src/app/layout/index.ts
new file mode 100644
index 0000000..a841403
--- /dev/null
+++ b/projects/web/src/app/layout/index.ts
@@ -0,0 +1 @@
+export { MainLayoutComponent } from './main-layout';
\ No newline at end of file
diff --git a/src/app/auth/login/login.component.html b/projects/web/src/app/layout/login/login.component.html
similarity index 100%
rename from src/app/auth/login/login.component.html
rename to projects/web/src/app/layout/login/login.component.html
diff --git a/src/app/auth/register/register.component.scss b/projects/web/src/app/layout/login/login.component.scss
similarity index 100%
rename from src/app/auth/register/register.component.scss
rename to projects/web/src/app/layout/login/login.component.scss
diff --git a/src/app/auth/login/login.component.ts b/projects/web/src/app/layout/login/login.component.ts
similarity index 51%
rename from src/app/auth/login/login.component.ts
rename to projects/web/src/app/layout/login/login.component.ts
index 12ce4ce..dc6d769 100644
--- a/src/app/auth/login/login.component.ts
+++ b/projects/web/src/app/layout/login/login.component.ts
@@ -1,22 +1,13 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  WritableSignal,
-  inject,
-  signal,
-} from '@angular/core';
+import { ChangeDetectionStrategy, Component, WritableSignal, inject, signal } from '@angular/core';
 import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
-import { DynamicDialogService } from '../../shared/dynamic-dialog/dynamic-dialog.service';
-import { SupabaseService } from '../../services/supabase.service';
-import { Credentials } from '../../shared/_models/credentials.interface';
-import {
-  ModalCloseStatusEnum,
-  ModalStatus,
-} from '../../shared/_models/modal-status.interface';
+import { DynamicDialogService } from 'shared';
+import { SupabaseService } from 'shared';
+import { Credentials } from 'shared';
+import { ModalCloseStatusEnum, ModalStatus } from 'shared';
 import { LoginFormControls } from './login.interface';
 
 @Component({
-  selector: 'blog-login',
+  selector: 'web-login',
   standalone: true,
   imports: [ReactiveFormsModule],
   providers: [],
@@ -24,13 +15,13 @@ import { LoginFormControls } from './login.interface';
   styleUrl: './login.component.scss',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class LoginCompontent {
+export class LoginComponent {
   form = new FormGroup<LoginFormControls>({
     email: new FormControl<string>('', { nonNullable: true }),
     password: new FormControl<string>('', { nonNullable: true }),
   });
   isSubmitted = false;
-  loginError: WritableSignal<boolean> = signal(false);
+  readonly loginError: WritableSignal<boolean> = signal(false);
 
   private dynamicDialogService = inject(DynamicDialogService);
   private supabaseService = inject(SupabaseService);
@@ -39,8 +30,9 @@ export class LoginCompontent {
     this.isSubmitted = true;
     const credentials = this.form.value as Credentials;
 
-    this.supabaseService.signInWithPassword(credentials.email, credentials.password)
-      .then(({ data, error }) => {
+    this.supabaseService
+      .signInWithPassword(credentials.email, credentials.password)
+      .then(({ error }) => {
         if (error) {
           this.loginError.set(true);
           return;
@@ -48,7 +40,7 @@ export class LoginCompontent {
 
         this.loginError.set(false);
         const status = {
-          closeStatus: ModalCloseStatusEnum.ACCEPTED
+          closeStatus: ModalCloseStatusEnum.ACCEPTED,
         } as ModalStatus;
         this.dynamicDialogService.closeDialog(status);
       })
@@ -58,14 +50,13 @@ export class LoginCompontent {
   }
 
   onGoogleLogin() {
-    this.supabaseService.signInWithProvider('google')
-      .then(({ data, error }) => {
-        if (!error) {
-          const status = {
-            closeStatus: ModalCloseStatusEnum.ACCEPTED
-          } as ModalStatus;
-          this.dynamicDialogService.closeDialog(status);
-        }
-      });
+    this.supabaseService.signInWithProvider('google').then(({ error }) => {
+      if (!error) {
+        const status = {
+          closeStatus: ModalCloseStatusEnum.ACCEPTED,
+        } as ModalStatus;
+        this.dynamicDialogService.closeDialog(status);
+      }
+    });
   }
 }
diff --git a/src/app/auth/login/login.interface.ts b/projects/web/src/app/layout/login/login.interface.ts
similarity index 100%
rename from src/app/auth/login/login.interface.ts
rename to projects/web/src/app/layout/login/login.interface.ts
diff --git a/projects/web/src/app/layout/main-layout/index.ts b/projects/web/src/app/layout/main-layout/index.ts
new file mode 100644
index 0000000..0e4afc8
--- /dev/null
+++ b/projects/web/src/app/layout/main-layout/index.ts
@@ -0,0 +1 @@
+export { MainLayoutComponent } from './main-layout.component';
\ No newline at end of file
diff --git a/projects/web/src/app/layout/main-layout/main-layout.component.ts b/projects/web/src/app/layout/main-layout/main-layout.component.ts
new file mode 100644
index 0000000..529c917
--- /dev/null
+++ b/projects/web/src/app/layout/main-layout/main-layout.component.ts
@@ -0,0 +1,18 @@
+import { Component } from '@angular/core';
+import { RouterOutlet } from '@angular/router';
+import { NavbarComponent } from '../navbar/navbar.component';
+
+@Component({
+  selector: 'web-main-layout',
+  standalone: true,
+  imports: [RouterOutlet, NavbarComponent],
+  template: `
+    <div class="min-h-screen bg-gradient-to-br from-quaternary via-tertiary/20 to-secondary/10">
+      <web-navbar />
+      <main class="container mx-auto w-11/12 lg:w-10/12 xl:w-8/12 py-8">
+        <router-outlet />
+      </main>
+    </div>
+  `,
+})
+export class MainLayoutComponent {}
diff --git a/src/app/shared/navbar/navbar.component.html b/projects/web/src/app/layout/navbar/navbar.component.html
similarity index 98%
rename from src/app/shared/navbar/navbar.component.html
rename to projects/web/src/app/layout/navbar/navbar.component.html
index 797c083..e48473e 100644
--- a/src/app/shared/navbar/navbar.component.html
+++ b/projects/web/src/app/layout/navbar/navbar.component.html
@@ -2,7 +2,7 @@
   #navbar
   id="navbar"
   class="fixed top-0 left-0 right-0 z-10 flex items-center justify-center px-4 py-2 bg-white/70 backdrop-blur-md shadow-lg transition-all duration-500 ease-in-out <!-- Mobile styles (default) --> w-full rounded-none <!-- Medium+ styles --> md:top-5 md:w-[90%] md:mx-auto md:rounded-[2rem] lg:w-[80%] xl:w-[68%]"
-  [class.scrolled]="isScrolled"
+  [class.scrolled]="isScrolled()"
 >
   <div class="flex-1 flex items-center justify-between">
     <div class="flex items-center">
diff --git a/src/app/shared/navbar/navbar.component.scss b/projects/web/src/app/layout/navbar/navbar.component.scss
similarity index 100%
rename from src/app/shared/navbar/navbar.component.scss
rename to projects/web/src/app/layout/navbar/navbar.component.scss
diff --git a/projects/web/src/app/layout/navbar/navbar.component.ts b/projects/web/src/app/layout/navbar/navbar.component.ts
new file mode 100644
index 0000000..5dee24f
--- /dev/null
+++ b/projects/web/src/app/layout/navbar/navbar.component.ts
@@ -0,0 +1,80 @@
+import {
+  ChangeDetectionStrategy,
+  Component,
+  ViewContainerRef,
+  inject,
+  signal,
+  WritableSignal,
+  viewChild,
+  afterNextRender,
+  ElementRef,
+  DestroyRef,
+} from '@angular/core';
+import { RouterLink } from '@angular/router';
+import { DynamicDialogService } from 'shared';
+import { LoginComponent } from '../login/login.component';
+
+@Component({
+  selector: 'web-navbar',
+  standalone: true,
+  imports: [RouterLink],
+  providers: [],
+  templateUrl: './navbar.component.html',
+  styleUrl: './navbar.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class NavbarComponent {
+  public readonly navbar = viewChild<ElementRef<HTMLElement>>('navbar');
+  public readonly mobileMenu = viewChild<ElementRef<HTMLElement>>('mobileMenu');
+  public readonly isScrolled: WritableSignal<boolean> = signal(false);
+  public readonly isMenuOpen: WritableSignal<boolean> = signal(false);
+  public readonly navHeight: WritableSignal<number> = signal(0);
+
+  private dynamicDialogService = inject(DynamicDialogService);
+  private viewContainerRef = inject(ViewContainerRef);
+  private destroyRef = inject(DestroyRef);
+
+  constructor() {
+    this.initializeNavHeight();
+    this.initializeScrollDetection();
+  }
+
+  signIn() {
+    this.dynamicDialogService.openDialog<LoginComponent>(
+      this.viewContainerRef,
+      { title: 'Sign In' },
+      LoginComponent
+    );
+  }
+
+  toggleMenu() {
+    this.isMenuOpen.set(!this.isMenuOpen());
+
+    if (this.isMenuOpen()) {
+      setTimeout(() => {
+        this.mobileMenu()?.nativeElement.style.setProperty('top', `${this.navHeight()}px`);
+      }, 1);
+    }
+  }
+
+  private initializeNavHeight(): void {
+    afterNextRender(() => {
+      this.navHeight.set(this.navbar()?.nativeElement.scrollHeight ?? 0);
+    });
+  }
+
+  private initializeScrollDetection(): void {
+    afterNextRender(() => {
+      const scrollHandler = () => {
+        this.isScrolled.set(window.scrollY > 0);
+      };
+
+      window.addEventListener('scroll', scrollHandler, { passive: true });
+
+      // Clean up event listener when component is destroyed
+      this.destroyRef.onDestroy(() => {
+        window.removeEventListener('scroll', scrollHandler);
+      });
+    });
+  }
+}
diff --git a/src/app/auth/register/register.component.html b/projects/web/src/app/layout/register/register.component.html
similarity index 100%
rename from src/app/auth/register/register.component.html
rename to projects/web/src/app/layout/register/register.component.html
diff --git a/src/app/reader/_components/main-page/main-page.component.scss b/projects/web/src/app/layout/register/register.component.scss
old mode 100755
new mode 100644
similarity index 100%
rename from src/app/reader/_components/main-page/main-page.component.scss
rename to projects/web/src/app/layout/register/register.component.scss
diff --git a/src/app/auth/register/register.component.ts b/projects/web/src/app/layout/register/register.component.ts
similarity index 100%
rename from src/app/auth/register/register.component.ts
rename to projects/web/src/app/layout/register/register.component.ts
diff --git a/src/app/shared/cookie-consent/cookie-consent.component.html b/projects/web/src/app/pattern/cookie-consent/cookie-consent.component.html
similarity index 100%
rename from src/app/shared/cookie-consent/cookie-consent.component.html
rename to projects/web/src/app/pattern/cookie-consent/cookie-consent.component.html
diff --git a/src/app/shared/cookie-consent/cookie-consent.component.scss b/projects/web/src/app/pattern/cookie-consent/cookie-consent.component.scss
similarity index 100%
rename from src/app/shared/cookie-consent/cookie-consent.component.scss
rename to projects/web/src/app/pattern/cookie-consent/cookie-consent.component.scss
diff --git a/src/app/shared/cookie-consent/cookie-consent.component.ts b/projects/web/src/app/pattern/cookie-consent/cookie-consent.component.ts
similarity index 50%
rename from src/app/shared/cookie-consent/cookie-consent.component.ts
rename to projects/web/src/app/pattern/cookie-consent/cookie-consent.component.ts
index 9ef1a6e..49864a2 100644
--- a/src/app/shared/cookie-consent/cookie-consent.component.ts
+++ b/projects/web/src/app/pattern/cookie-consent/cookie-consent.component.ts
@@ -1,28 +1,25 @@
 import { CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy, Component, inject } from '@angular/core';
-import { DynamicDialogService } from '../dynamic-dialog/dynamic-dialog.service';
-import { CardComponent } from '../card/card.component';
 import { NgClass } from '@angular/common';
+import { DynamicDialogService } from 'shared';
 
 @Component({
-  selector: 'app-cookie-consent',
+  selector: 'web-cookie-consent',
   standalone: true,
-  imports: [CardComponent, NgClass],
+  imports: [NgClass],
   templateUrl: './cookie-consent.component.html',
   styleUrl: './cookie-consent.component.scss',
   schemas: [CUSTOM_ELEMENTS_SCHEMA],
-  changeDetection: ChangeDetectionStrategy.OnPush
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class CookieConsentComponent  {
+export class CookieConsentComponent {
   activeTab: 'consent' | 'details' | 'about' = 'consent';
   dialogService = inject(DynamicDialogService);
-  cookieGroups = [{
-    name: 'Authentication (Mandatory can\'t be dennied)',
-    cookies: [
-     'cookies-consent',
-     'firebase-heartbeat-database',
-     'firebaseLocalStorageDb'
-    ]
-  }];
+  cookieGroups = [
+    {
+      name: "Authentication (Mandatory can't be dennied)",
+      cookies: ['cookies-consent', 'firebase-heartbeat-database', 'firebaseLocalStorageDb'],
+    },
+  ];
   setActiveTab(tab: 'consent' | 'details' | 'about') {
     this.activeTab = tab;
   }
diff --git a/projects/web/src/app/pattern/cookie-consent/cookie-consent.service.ts b/projects/web/src/app/pattern/cookie-consent/cookie-consent.service.ts
new file mode 100644
index 0000000..363a89d
--- /dev/null
+++ b/projects/web/src/app/pattern/cookie-consent/cookie-consent.service.ts
@@ -0,0 +1,50 @@
+import { Injectable, ViewContainerRef, inject } from '@angular/core';
+import { CookieConsentComponent } from './cookie-consent.component';
+import { DynamicDialogService } from 'shared';
+import { LocalStorageEnum, ModalCloseStatusEnum, ModalStatus } from 'shared';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class CookieConsentService {
+  dialogService = inject(DynamicDialogService);
+
+  showCookieConsent(viewContainerRef: ViewContainerRef): void {
+    if (!localStorage.getItem(LocalStorageEnum.COOKIES_CONSENT)) {
+      this.dialogService
+        .openDialog(
+          viewContainerRef,
+          {
+            primaryButton: 'Allow All',
+            secondaryButton: 'Deny',
+            title: 'Cookie Consent',
+          },
+          CookieConsentComponent
+        )
+        .subscribe(status => {
+          if (status.closeStatus === ModalCloseStatusEnum.ACCEPTED) {
+            this.acceptCookies();
+          }
+          if (status.closeStatus === ModalCloseStatusEnum.REJECTED) {
+            this.denyCookies();
+          }
+          this.closePopup(status.closeStatus);
+        });
+    }
+  }
+
+  acceptCookies() {
+    localStorage.setItem(LocalStorageEnum.COOKIES_CONSENT, 'true');
+  }
+
+  denyCookies() {
+    localStorage.setItem(LocalStorageEnum.COOKIES_CONSENT, 'false');
+  }
+
+  closePopup(closeStatus: ModalCloseStatusEnum) {
+    const status = {
+      closeStatus: closeStatus,
+    } as ModalStatus;
+    this.dialogService.closeDialog(status);
+  }
+}
diff --git a/src/app/reader/_components/main-page/posts-list/label/label.component.html b/projects/web/src/app/ui/components/label/label.component.html
similarity index 79%
rename from src/app/reader/_components/main-page/posts-list/label/label.component.html
rename to projects/web/src/app/ui/components/label/label.component.html
index 2843c84..d53f138 100644
--- a/src/app/reader/_components/main-page/posts-list/label/label.component.html
+++ b/projects/web/src/app/ui/components/label/label.component.html
@@ -1,7 +1,7 @@
 <div
-  [ngStyle]="{ 'background-color': color }"
+  [ngStyle]="{ 'background-color': color() }"
   class="text-white px-2 py-1 md:px-4 md:py-2 mb-3 md:mb-4 text-xs md:text-sm drop-shadow-md
          rounded-full md:rounded-none md:rounded-tr-2xl md:rounded-br-2xl
          hover:pl-6 transition-[padding] duration-300">
-  {{ text }}
+  {{ text() }}
 </div>
diff --git a/src/app/reader/_components/main-page/posts-list/label/label.component.scss b/projects/web/src/app/ui/components/label/label.component.scss
similarity index 100%
rename from src/app/reader/_components/main-page/posts-list/label/label.component.scss
rename to projects/web/src/app/ui/components/label/label.component.scss
diff --git a/src/app/reader/_components/main-page/posts-list/label/label.component.ts b/projects/web/src/app/ui/components/label/label.component.ts
similarity index 56%
rename from src/app/reader/_components/main-page/posts-list/label/label.component.ts
rename to projects/web/src/app/ui/components/label/label.component.ts
index 49f61dc..2cc15c6 100644
--- a/src/app/reader/_components/main-page/posts-list/label/label.component.ts
+++ b/projects/web/src/app/ui/components/label/label.component.ts
@@ -1,14 +1,14 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, input } from '@angular/core';
 import { NgStyle } from '@angular/common';
 
 @Component({
-  selector: 'app-label',
+  selector: 'web-label',
   standalone: true,
   imports: [NgStyle],
   templateUrl: './label.component.html',
   styleUrl: './label.component.scss',
 })
 export class LabelComponent {
-  @Input() text: string = 'Label';
-  @Input() color: string = '#000000';
+  readonly text = input<string>('Label');
+  readonly color = input<string>('#000000');
 }
diff --git a/src/app/reader/_components/main-page/posts-list/post-card/post-card.component.html b/projects/web/src/app/ui/components/post-card/post-card.component.html
similarity index 91%
rename from src/app/reader/_components/main-page/posts-list/post-card/post-card.component.html
rename to projects/web/src/app/ui/components/post-card/post-card.component.html
index 880032f..8ad42e0 100644
--- a/src/app/reader/_components/main-page/posts-list/post-card/post-card.component.html
+++ b/projects/web/src/app/ui/components/post-card/post-card.component.html
@@ -1,5 +1,5 @@
 <article
-  [routerLink]="['/details', post().id]"
+  [routerLink]="['/post', post().id]"
   class="bg-white shadow-md w-full rounded-lg py-4 md:py-8 overflow-hidden mb-6
          transform transition-all duration-300 hover:-translate-y-1 hover:shadow-xl
          cursor-pointer"
@@ -9,10 +9,10 @@
       class="flex flex-wrap md:flex-col items-start md:basis-2/12 gap-2 px-4 md:px-0">
       @for (tag of post().post_tags; track tag.tags.id; let i = $index) {
         @if (i < 4) {
-          <app-label
+          <web-label
             [text]="tag.tags.name"
             [color]="tag.tags.color"
-          ></app-label>
+          />
         }
       }
     </div>
diff --git a/src/app/reader/_components/main-page/posts-list/post-card/post-card.component.scss b/projects/web/src/app/ui/components/post-card/post-card.component.scss
similarity index 100%
rename from src/app/reader/_components/main-page/posts-list/post-card/post-card.component.scss
rename to projects/web/src/app/ui/components/post-card/post-card.component.scss
diff --git a/src/app/reader/_components/main-page/posts-list/post-card/post-card.component.ts b/projects/web/src/app/ui/components/post-card/post-card.component.ts
similarity index 75%
rename from src/app/reader/_components/main-page/posts-list/post-card/post-card.component.ts
rename to projects/web/src/app/ui/components/post-card/post-card.component.ts
index bee4e87..a91cf63 100644
--- a/src/app/reader/_components/main-page/posts-list/post-card/post-card.component.ts
+++ b/projects/web/src/app/ui/components/post-card/post-card.component.ts
@@ -1,15 +1,15 @@
 import { Component, input } from '@angular/core';
-import { LabelComponent } from '../label/label.component';
 import { RouterLink } from '@angular/router';
-import { Post } from '../../../../../types/supabase';
+import { LabelComponent } from '../label/label.component';
+import { Post } from 'shared/models';
 
 @Component({
-  selector: 'app-post-card',
+  selector: 'web-post-card',
   standalone: true,
   imports: [LabelComponent, RouterLink],
   templateUrl: './post-card.component.html',
   styleUrl: './post-card.component.scss',
 })
 export class PostCardComponent {
-  post = input.required<Post>();
+  public readonly post = input.required<Post>();
 }
diff --git a/projects/web/src/index.html b/projects/web/src/index.html
new file mode 100644
index 0000000..51fab79
--- /dev/null
+++ b/projects/web/src/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <title>Web</title>
+  <base href="/">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="icon" type="image/x-icon" href="favicon.ico">
+</head>
+<body>
+  <web-root></web-root>
+</body>
+</html>
diff --git a/src/main.server.ts b/projects/web/src/main.server.ts
old mode 100755
new mode 100644
similarity index 100%
rename from src/main.server.ts
rename to projects/web/src/main.server.ts
diff --git a/src/main.ts b/projects/web/src/main.ts
old mode 100755
new mode 100644
similarity index 100%
rename from src/main.ts
rename to projects/web/src/main.ts
diff --git a/projects/web/src/server.ts b/projects/web/src/server.ts
new file mode 100644
index 0000000..70cc0b0
--- /dev/null
+++ b/projects/web/src/server.ts
@@ -0,0 +1,68 @@
+import { join } from 'node:path';
+import {
+  AngularNodeAppEngine,
+  createNodeRequestHandler,
+  isMainModule,
+  writeResponseToNodeResponse,
+} from '@angular/ssr/node';
+import express from 'express';
+
+const browserDistFolder = join(import.meta.dirname, '../browser');
+
+const app = express();
+const angularApp = new AngularNodeAppEngine();
+
+/**
+ * Example Express Rest API endpoints can be defined here.
+ * Uncomment and define endpoints as necessary.
+ *
+ * Example:
+ * ```ts
+ * app.get('/api/{*splat}', (req, res) => {
+ *   // Handle API request
+ * });
+ * ```
+ */
+
+/**
+ * Serve static files from /browser
+ */
+app.use(
+  express.static(browserDistFolder, {
+    maxAge: '1y',
+    index: false,
+    redirect: false,
+  }),
+);
+
+/**
+ * Handle all other requests by rendering the Angular application.
+ */
+app.use((req, res, next) => {
+  angularApp
+    .handle(req)
+    .then((response) =>
+      response ? writeResponseToNodeResponse(response, res) : next(),
+    )
+    .catch(next);
+});
+
+/**
+ * Start the server if this module is the main entry point.
+ * The server listens on the port defined by the `PORT` environment variable, or defaults to 4000.
+ */
+if (isMainModule(import.meta.url)) {
+  const port = process.env['PORT'] || 4000;
+  app.listen(port, (error) => {
+    if (error) {
+      throw error;
+    }
+
+    console.log(`Node Express server listening on http://localhost:${port}`);
+  });
+}
+
+/**
+ * Request handler used by the Angular CLI (for dev-server and during build) or Firebase Cloud Functions.
+ */
+export const reqHandler = createNodeRequestHandler(app);
diff --git a/projects/web/src/styles.scss b/projects/web/src/styles.scss
new file mode 100644
index 0000000..e12ad9e
--- /dev/null
+++ b/projects/web/src/styles.scss
@@ -0,0 +1,123 @@
+@use 'tailwindcss/utilities';
+
+/* Order */
+@layer reset, primeng;
+
+
+/* You can add global styles to this file, and also import other style files */
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+h1 {
+  @apply text-3xl font-bold mt-4 mb-1;
+}
+
+h2 {
+  @apply text-2xl font-bold mt-4 mb-1;
+}
+
+h3 {
+  @apply text-xl font-bold mt-4 mb-1;
+}
+
+h4 {
+  @apply text-lg font-bold mt-2 mb-1;
+}
+
+.tittle {
+  @apply text-4xl font-bold my-2;
+}
+
+/* Base button */
+.btn {
+  @apply text-base font-medium rounded-md p-3 min-w-16;
+}
+
+.btn--rounded {
+  @apply rounded-full;
+}
+
+/* Button group */
+.btn--group {
+  @apply flex space-x-4;
+}
+
+/* Button primary */
+.btn--primary {
+  @apply bg-primary text-white;
+}
+
+/* Button secondary */
+.btn--secondary {
+  @apply bg-white text-secondary border border-secondary;
+}
+
+/* Hover effects */
+.btn--primary:hover, .btn--secondary:hover {
+  @apply shadow-lg -translate-y-0.5;
+}
+
+/* Disabled state */
+.btn--primary:disabled, .btn--secondary:disabled {
+  @apply bg-gray-300 text-gray-500 cursor-not-allowed;
+}
+
+
+body {
+  @apply bg-gradient-to-br from-quaternary/40 via-[#7A9E7E]/50 to-primary min-h-screen;
+}
+
+* {
+  @apply transition-colors duration-200 ease-in-out;
+}
+
+.blog-container {
+  @apply container mx-auto px-4 sm:px-6 lg:px-8;
+}
+
+
+.blog-section {
+  @apply py-12 sm:py-16 lg:py-20;
+}
+
+.post-card {
+  @apply bg-white rounded-lg shadow-md overflow-hidden transition-transform transform hover:scale-105;
+}
+
+.card-default {
+  @apply p-4;
+  width: 100%;
+}
+
+.card-main {
+  @apply lg:p-6 lg:col-span-3 lg:row-span-1;
+  width: 100%;
+}
+
+.post-image {
+  @apply w-full h-48 object-cover;
+}
+
+.post-content {
+  @apply p-4;
+}
+
+.post-title {
+  @apply text-xl font-bold text-gray-900 mt-0 pt-0;
+}
+
+.post-summary {
+  @apply text-gray-700;
+}
+
+.read-more {
+  @apply text-primary hover:underline;
+}
+
+
+html, body {
+  margin: 0;
+  padding: 0;
+}
+
diff --git a/projects/web/tsconfig.app.json b/projects/web/tsconfig.app.json
new file mode 100644
index 0000000..3175e5a
--- /dev/null
+++ b/projects/web/tsconfig.app.json
@@ -0,0 +1,17 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/app",
+    "types": [
+      "node"
+    ]
+  },
+  "include": [
+    "src/**/*.ts"
+  ],
+  "exclude": [
+    "src/**/*.spec.ts"
+  ]
+}
diff --git a/projects/web/tsconfig.spec.json b/projects/web/tsconfig.spec.json
new file mode 100644
index 0000000..0feea88
--- /dev/null
+++ b/projects/web/tsconfig.spec.json
@@ -0,0 +1,14 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": [
+      "jasmine"
+    ]
+  },
+  "include": [
+    "src/**/*.ts"
+  ]
+}
diff --git a/routes.txt b/routes.txt
index b498fd4..0cc062d 100644
--- a/routes.txt
+++ b/routes.txt
@@ -1 +1,9 @@
 /
+/details/dbfcd015-390f-4cd6-bb62-f0218354da3e
+/details/9468a494-0197-420a-bea1-fa7bfe16d2fb
+/details/9a3cf18d-d670-4954-beb6-53e3a21c9ee6
+/details/14452f6d-247c-4be6-858e-9412da9a7a5a
+/details/6ec57e91-6d1a-4509-ad28-984cbed63d17
+/details/86a90108-f845-4879-8c88-17653e4b39fb
+/details/fa2c00ed-7cb6-409c-8e37-3b4c0236b8c1
+/details/7b285776-0364-496d-806a-2c2848b42cf2
diff --git a/scripts/generate-routes.js b/scripts/generate-routes.js
new file mode 100755
index 0000000..ab63f6e
--- /dev/null
+++ b/scripts/generate-routes.js
@@ -0,0 +1,125 @@
+#!/usr/bin/env node
+
+const { createClient } = require('@supabase/supabase-js');
+const fs = require('fs').promises;
+const path = require('path');
+
+// Load environment configuration
+const loadEnvironment = () => {
+  const env = process.env.NODE_ENV || 'production';
+  
+  try {
+    let envConfig;
+    
+    if (env === 'local') {
+      envConfig = require('../environments/environment.local.ts');
+    } else if (env === 'development') {
+      envConfig = require('../environments/environment.development.ts');
+    } else {
+      envConfig = require('../environments/environment.ts');
+    }
+    
+    return envConfig.environment;
+  } catch (error) {
+    console.error('Failed to load environment config:', error.message);
+    console.log('Falling back to environment variables...');
+    
+    return {
+      supabaseUrl: process.env.SUPABASE_URL || 'https://aqdbdmepncxxuanlymwr.supabase.co',
+      supabaseKey: process.env.SUPABASE_ANON_KEY || 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6ImFxZGJkbWVwbmN4eHVhbmx5bXdyIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NDUwNTA0MjYsImV4cCI6MjA2MDYyNjQyNn0.RNtZZ4Of4LIP3XuS9lumHYdjRLVUGXARtAxaTJmF7lc'
+    };
+  }
+};
+
+async function generateRoutes() {
+  try {
+    console.log('🚀 Starting route generation...');
+    
+    // Load environment configuration
+    const config = loadEnvironment();
+    console.log(`📡 Using Supabase URL: ${config.supabaseUrl}`);
+    
+    // Initialize Supabase client
+    const supabase = createClient(config.supabaseUrl, config.supabaseKey);
+    
+    // Fetch all published post IDs
+    console.log('📄 Fetching published posts...');
+    const { data: posts, error } = await supabase
+      .from('posts')
+      .select('id')
+      .eq('is_draft', false)
+      .order('created_at', { ascending: false });
+    
+    if (error) {
+      throw new Error(`Supabase query failed: ${error.message}`);
+    }
+    
+    if (!posts || posts.length === 0) {
+      console.warn('⚠️  No published posts found in database');
+      return;
+    }
+    
+    console.log(`✅ Found ${posts.length} published posts`);
+    
+    // Generate routes
+    const routes = [
+      '/', // Home page
+      ...posts.map(post => `/details/${post.id}`) // Individual post pages
+    ];
+    
+    // Create routes.txt content
+    const routesContent = routes.join('\n') + '\n';
+    
+    // Write to routes.txt
+    const routesPath = path.join(__dirname, '..', 'routes.txt');
+    await fs.writeFile(routesPath, routesContent, 'utf8');
+    
+    console.log('📝 Generated routes.txt with the following routes:');
+    routes.forEach(route => console.log(`   ${route}`));
+    console.log(`💾 Routes saved to: ${routesPath}`);
+    
+    console.log('✨ Route generation completed successfully!');
+    
+  } catch (error) {
+    console.error('❌ Error generating routes:', error.message);
+    process.exit(1);
+  }
+}
+
+// Handle command line arguments
+const args = process.argv.slice(2);
+if (args.includes('--help') || args.includes('-h')) {
+  console.log(`
+📚 Generate Routes Script
+
+This script fetches all published post IDs from Supabase and generates a routes.txt file
+for Angular prerendering.
+
+Usage:
+  node scripts/generate-routes.js [options]
+
+Options:
+  --help, -h    Show this help message
+  --env <env>   Set environment (local, development, production)
+
+Environment Variables:
+  NODE_ENV           Environment mode (defaults to 'production')
+  SUPABASE_URL       Supabase project URL (optional, uses config if not set)
+  SUPABASE_ANON_KEY  Supabase anonymous key (optional, uses config if not set)
+
+Examples:
+  node scripts/generate-routes.js
+  NODE_ENV=local node scripts/generate-routes.js
+  node scripts/generate-routes.js --env development
+  `);
+  process.exit(0);
+}
+
+// Set environment from command line argument
+const envIndex = args.indexOf('--env');
+if (envIndex !== -1 && args[envIndex + 1]) {
+  process.env.NODE_ENV = args[envIndex + 1];
+}
+
+// Run the script
+generateRoutes();
\ No newline at end of file
diff --git a/scripts/generate-routes.ts b/scripts/generate-routes.ts
new file mode 100755
index 0000000..e268171
--- /dev/null
+++ b/scripts/generate-routes.ts
@@ -0,0 +1,140 @@
+#!/usr/bin/env tsx
+
+import { createClient } from '@supabase/supabase-js';
+import { writeFile } from 'fs/promises';
+import { join, dirname } from 'path';
+import { fileURLToPath } from 'url';
+
+// Get current directory for ES modules
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+
+interface EnvironmentConfig {
+  supabaseUrl: string;
+  supabaseKey: string;
+}
+
+interface Post {
+  id: string;
+}
+
+// Load environment configuration
+const loadEnvironment = (): EnvironmentConfig => {
+  const env = process.env.NODE_ENV || 'production';
+  
+  try {
+    let envConfig: { environment: EnvironmentConfig };
+    
+    if (env === 'local') {
+      envConfig = require('../environments/environment.local.ts');
+    } else if (env === 'development') {
+      envConfig = require('../environments/environment.development.ts');
+    } else {
+      envConfig = require('../environments/environment.ts');
+    }
+    
+    return envConfig.environment;
+  } catch (error: any) {
+    console.error('Failed to load environment config:', error.message);
+    console.log('Falling back to environment variables...');
+    
+    return {
+      supabaseUrl: process.env.SUPABASE_URL || 'https://aqdbdmepncxxuanlymwr.supabase.co',
+      supabaseKey: process.env.SUPABASE_ANON_KEY || 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6ImFxZGJkbWVwbmN4eHVhbmx5bXdyIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NDUwNTA0MjYsImV4cCI6MjA2MDYyNjQyNn0.RNtZZ4Of4LIP3XuS9lumHYdjRLVUGXARtAxaTJmF7lc'
+    };
+  }
+};
+
+async function generateRoutes(): Promise<void> {
+  try {
+    console.log('🚀 Starting route generation...');
+    
+    // Load environment configuration
+    const config = loadEnvironment();
+    console.log(`📡 Using Supabase URL: ${config.supabaseUrl}`);
+    
+    // Initialize Supabase client
+    const supabase = createClient(config.supabaseUrl, config.supabaseKey);
+    
+    // Fetch all published post IDs
+    console.log('📄 Fetching published posts...');
+    const { data: posts, error } = await supabase
+      .from('posts')
+      .select('id')
+      .eq('is_draft', false)
+      .order('created_at', { ascending: false });
+    
+    if (error) {
+      throw new Error(`Supabase query failed: ${error.message}`);
+    }
+    
+    if (!posts || posts.length === 0) {
+      console.warn('⚠️  No published posts found in database');
+      return;
+    }
+    
+    console.log(`✅ Found ${posts.length} published posts`);
+    
+    // Generate routes
+    const routes: string[] = [
+      '/', // Home page
+      ...posts.map((post: Post) => `/details/${post.id}`) // Individual post pages
+    ];
+    
+    // Create routes.txt content
+    const routesContent = routes.join('\n') + '\n';
+    
+    // Write to routes.txt
+    const routesPath = join(__dirname, '..', 'routes.txt');
+    await writeFile(routesPath, routesContent, 'utf8');
+    
+    console.log('📝 Generated routes.txt with the following routes:');
+    routes.forEach(route => console.log(`   ${route}`));
+    console.log(`💾 Routes saved to: ${routesPath}`);
+    
+    console.log('✨ Route generation completed successfully!');
+    
+  } catch (error: any) {
+    console.error('❌ Error generating routes:', error.message);
+    process.exit(1);
+  }
+}
+
+// Handle command line arguments
+const args = process.argv.slice(2);
+if (args.includes('--help') || args.includes('-h')) {
+  console.log(`
+📚 Generate Routes Script (TypeScript)
+
+This script fetches all published post IDs from Supabase and generates a routes.txt file
+for Angular prerendering.
+
+Usage:
+  tsx scripts/generate-routes.ts [options]
+  npm run routes:generate
+
+Options:
+  --help, -h    Show this help message
+  --env <env>   Set environment (local, development, production)
+
+Environment Variables:
+  NODE_ENV           Environment mode (defaults to 'production')
+  SUPABASE_URL       Supabase project URL (optional, uses config if not set)
+  SUPABASE_ANON_KEY  Supabase anonymous key (optional, uses config if not set)
+
+Examples:
+  tsx scripts/generate-routes.ts
+  NODE_ENV=local tsx scripts/generate-routes.ts
+  tsx scripts/generate-routes.ts --env development
+  `);
+  process.exit(0);
+}
+
+// Set environment from command line argument
+const envIndex = args.indexOf('--env');
+if (envIndex !== -1 && args[envIndex + 1]) {
+  process.env.NODE_ENV = args[envIndex + 1];
+}
+
+// Run the script
+generateRoutes();
\ No newline at end of file
diff --git a/scripts/reset-password.ts b/scripts/reset-password.ts
index e2860c6..19de7ef 100644
--- a/scripts/reset-password.ts
+++ b/scripts/reset-password.ts
@@ -25,8 +25,7 @@ if (!SUPABASE_URL || !SERVICE_ROLE_KEY) {
   console.error('Set SUPABASE_URL and SERVICE_ROLE_KEY environment variables.');
   process.exit(1);
 }
-
-(async () => {
+Ś(async () => {
   const admin = createClient(SUPABASE_URL, SERVICE_ROLE_KEY, {
     auth: { autoRefreshToken: false, persistSession: false },
   });
diff --git a/server.ts b/server.ts
index 05876f8..f44354f 100755
--- a/server.ts
+++ b/server.ts
@@ -2,8 +2,8 @@ import { APP_BASE_HREF } from '@angular/common';
 import express from 'express';
 import { fileURLToPath } from 'node:url';
 import { dirname, join, resolve } from 'node:path';
-import bootstrap from './src/main.server';
 import { CommonEngine } from '@angular/ssr/node';
+import bootstrap from './projects/web/src/main.server';
 
 // The Express app is exported so that it can be used by serverless Functions.
 export function app(): express.Express {
@@ -25,7 +25,7 @@ export function app(): express.Express {
     express.static(browserDistFolder, {
       maxAge: '1y',
       index: 'index.html',
-    }),
+    })
   );
 
   // All regular routes use the Angular engine
@@ -40,8 +40,8 @@ export function app(): express.Express {
         publicPath: browserDistFolder,
         providers: [{ provide: APP_BASE_HREF, useValue: baseUrl }],
       })
-      .then((html: any) => res.send(html))
-      .catch((err: any) => next(err));
+      .then((html: unknown) => res.send(html))
+      .catch((err: unknown) => next(err));
   });
 
   return server;
diff --git a/src/app/admin/_components/add-post/add-post.component.html b/src/app/admin/_components/add-post/add-post.component.html
deleted file mode 100755
index 3771711..0000000
--- a/src/app/admin/_components/add-post/add-post.component.html
+++ /dev/null
@@ -1,28 +0,0 @@
-@defer {
-  <form class="p-12 flex flex-col gap-2" [formGroup]="blogForm" (ngSubmit)="onSubmit()">
-    <div class="w-full flex">
-      <input type="text" formControlName="title" placeholder="Title" class="input input-bordered w-full" required/>
-    </div>
-    @if (blogForm.controls.title.invalid && (blogForm.controls.title.dirty || blogForm.controls.title.touched)) {
-      @if (blogForm.controls.title.errors?.['required']) {
-        <div>Title is required.</div>
-      }
-    }
-
-    <!-- Tags Selection -->
-    <div class="w-full">
-      <label class="label">
-        <span class="label-text">Tags</span>
-      </label>
-      <blog-tag-multi-select formControlName="tags"></blog-tag-multi-select>
-    </div>
-
-    <button class="btn btn--secondary" type="button" (click)="insertImage()">Insert Image</button>
-    <quill-editor #quill formControlName="content" class="h-screen w-full"></quill-editor>
-    <div class="mt-12 btn--group">
-      <button class="btn btn--primary" type="submit">Submit</button>
-      <button class="btn btn--secondary" type="button" (click)="onSubmit(true)">Save as a draft</button>
-    </div>
-    <button type="submit" [disabled]="blogForm.invalid">Submit</button>
-  </form>
-}
diff --git a/src/app/admin/_guards/unsaved-changes.guard.ts b/src/app/admin/_guards/unsaved-changes.guard.ts
deleted file mode 100644
index 5417da0..0000000
--- a/src/app/admin/_guards/unsaved-changes.guard.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import { CanDeactivateFn } from '@angular/router';
-import { AddPostComponent } from '../_components/add-post/add-post.component';
-import { DynamicDialogService } from '../../shared/dynamic-dialog/dynamic-dialog.service';
-import { inject } from '@angular/core';
-import { ModalCloseStatusEnum } from '../../shared/_models/modal-status.interface';
-import { map, of } from 'rxjs';
-
-export const unsavedChangesGuard: CanDeactivateFn<AddPostComponent> = (component: AddPostComponent) => {
-  const dynamicDialogService = inject(DynamicDialogService);
-  if (component.blogForm.dirty) {
-    return dynamicDialogService
-      .openDialog(component.viewContainerRef,
-        {
-          primaryButton: 'Yes',
-          secondaryButton: 'No',
-          title: 'You have unsaved changes',
-          content: 'Are you sure you want to leave this page?',
-        })
-      .pipe(
-        map((status) => {
-          if (status.closeStatus === ModalCloseStatusEnum.ACCEPTED) {
-            return true;
-          } else {
-            return false;
-          }
-        })
-      );
-  } else {
-    return of(true);
-  }
-};
-
diff --git a/src/app/admin/admin.component.html b/src/app/admin/admin.component.html
deleted file mode 100755
index 67e7bd4..0000000
--- a/src/app/admin/admin.component.html
+++ /dev/null
@@ -1 +0,0 @@
-<router-outlet />
diff --git a/src/app/admin/admin.component.ts b/src/app/admin/admin.component.ts
deleted file mode 100755
index 8facfeb..0000000
--- a/src/app/admin/admin.component.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { ChangeDetectionStrategy, Component } from '@angular/core';
-import { RouterOutlet } from '@angular/router';
-
-@Component({
-  selector: 'app-admin',
-  standalone: true,
-  imports: [RouterOutlet],
-  templateUrl: './admin.component.html',
-  styleUrl: './admin.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class AdminComponent {
-
-}
diff --git a/src/app/app.component.html b/src/app/app.component.html
deleted file mode 100755
index 72fa668..0000000
--- a/src/app/app.component.html
+++ /dev/null
@@ -1,3 +0,0 @@
-<div>
-  <router-outlet/>
-</div>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
deleted file mode 100755
index 8c36025..0000000
--- a/src/app/app.component.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-import {
-  Component,
-  ViewContainerRef,
-  afterNextRender,
-  inject,
-} from '@angular/core';
-import { RouterOutlet } from '@angular/router';
-import { CookieConsentService } from './shared/cookie-consent/cookie-consent.service';
-
-@Component({
-  selector: 'app-root',
-  standalone: true,
-  imports: [RouterOutlet],
-  templateUrl: './app.component.html',
-  styleUrl: './app.component.scss',
-})
-export class AppComponent {
-  cookieConsentService = inject(CookieConsentService);
-  viewContainerRef = inject(ViewContainerRef);
-
-  constructor() {
-    this.showCookieConsent();
-  }
-
-  private showCookieConsent() {
-    afterNextRender(() =>
-      this.cookieConsentService.showCookieConsent(this.viewContainerRef),
-    );
-  }
-}
diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
deleted file mode 100755
index f3d19ac..0000000
--- a/src/app/app.routes.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Routes } from '@angular/router';
-import { readerRoutes } from './reader/reader.routes';
-import { authAdminGuard } from './auth/_guards/authAdminGuard';
-
-export const routes: Routes = [
-  {
-    path: '',
-    children: readerRoutes,
-  },
-  {
-    path: 'admin',
-    loadChildren: () =>
-      import('./admin/admin.routes').then((r) => r.adminRoutes),
-    title: 'Admin',
-    canActivate: [authAdminGuard],
-  },
-  {
-    path: '**',
-    redirectTo: '',
-  },
-];
diff --git a/src/app/auth/_guards/auth.guard.spec.ts b/src/app/auth/_guards/auth.guard.spec.ts
deleted file mode 100644
index a9bb36d..0000000
--- a/src/app/auth/_guards/auth.guard.spec.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-import { CanMatchFn } from '@angular/router';
-import { authAdminGuard } from './authAdminGuard';
-
-describe('authGuard', () => {
-  const executeGuard: CanMatchFn = (...guardParameters) =>
-    TestBed.runInInjectionContext(() => authAdminGuard(...guardParameters));
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({});
-  });
-
-  it('should be created', () => {
-    expect(executeGuard).toBeTruthy();
-  });
-});
diff --git a/src/app/reader/_components/main-page/main-page.component.html b/src/app/reader/_components/main-page/main-page.component.html
deleted file mode 100755
index 3f86221..0000000
--- a/src/app/reader/_components/main-page/main-page.component.html
+++ /dev/null
@@ -1,4 +0,0 @@
-<blog-navbar/>
-<div class="container mx-auto w-11/12 lg:w-10/12 xl:w-8/12">
-  <router-outlet/>
-</div>
diff --git a/src/app/reader/_components/main-page/main-page.component.ts b/src/app/reader/_components/main-page/main-page.component.ts
deleted file mode 100755
index 355bd3d..0000000
--- a/src/app/reader/_components/main-page/main-page.component.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  HostListener,
-} from '@angular/core';
-import { RouterModule } from '@angular/router';
-import { NavbarComponent } from '../../../shared/navbar/navbar.component';
-import { NgClass } from '@angular/common';
-import { AboutMeComponent } from '../../../shared/about-me/about-me.component';
-
-@Component({
-  selector: 'app-main-page',
-  standalone: true,
-  imports: [RouterModule, NavbarComponent],
-  templateUrl: './main-page.component.html',
-  styleUrl: './main-page.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class MainPageComponent {}
diff --git a/src/app/reader/_components/main-page/post/comments/comments.component.ts b/src/app/reader/_components/main-page/post/comments/comments.component.ts
deleted file mode 100755
index 16b3130..0000000
--- a/src/app/reader/_components/main-page/post/comments/comments.component.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  Input,
-  inject,
-  input,
-} from '@angular/core';
-import { ReaderApiService } from '../../../../_services/reader-api.service';
-import { Comment } from '../../../../../types/supabase';
-import { CommentsStore } from './comments.store';
-import { HasRoleDirective } from '../../../../../shared/_directives/has-role.directive';
-
-@Component({
-  selector: 'comments',
-  standalone: true,
-  providers: [ReaderApiService, CommentsStore],
-  templateUrl: './comments.component.html',
-  styleUrl: './comments.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  imports: [HasRoleDirective],
-})
-export class CommentsComponent {
-  @Input() postId!: string;
-  comments = input<Comment[]>();
-
-  private commentsStore = inject(CommentsStore);
-
-  deleteComment(commentId: string): void {
-    this.commentsStore.deleteComment(commentId, this.postId);
-  }
-}
diff --git a/src/app/reader/_components/main-page/posts-list/posts-list.component.html b/src/app/reader/_components/main-page/posts-list/posts-list.component.html
deleted file mode 100755
index e7caa4a..0000000
--- a/src/app/reader/_components/main-page/posts-list/posts-list.component.html
+++ /dev/null
@@ -1,96 +0,0 @@
-<app-about-me></app-about-me>
-<div class="relative mt-4 pb-4" data-testid="tags-container">
-  <div
-    #scrollContainer
-    data-testid="tags-scroll-container"
-    class="shadow-lg bg-white p-4 sm:p-6 sm:px-14 rounded-[32px] sm:rounded-[64px] overflow-x-scroll hide-scrollbar whitespace-nowrap scroll-smooth"
-  >
-    <div class="inline-flex space-x-4 gap-x-0 md:gap-x-6" data-testid="tags-list">
-      @for (tag of tags(); track tag.id) {
-        <div class="flex flex-col items-center min-w-24 group" data-testid="tag-item" [attr.data-tag-name]="tag.name">
-          <div
-            [ngStyle]="{ 'background-color': tag.color }"
-            class="font-bold text-gray-700 rounded-full flex items-center justify-center font-mono p-3 md:p-5 min-w-18 transform transition-all duration-300 hover:scale-110 hover:shadow-lg relative cursor-pointer"
-            data-testid="tag-button"
-          >
-            <img
-              ngSrc="tags/{{ tag.icon }}"
-              [alt]="tag.name"
-              class="w-8 h-8 sm:w-10 sm:h-10 transition-transform duration-300 group-hover:scale-110"
-              width="32"
-              height="32"
-              data-testid="tag-icon"
-            />
-          </div>
-          <span
-            class="mt-1 sm:mt-2 text-center text-gray-600 text-sm sm:text-base"
-            data-testid="tag-name"
-          >{{ tag.name }}</span
-          >
-        </div>
-      }
-    </div>
-  </div>
-
-  <div class="relative -top-4 mt-2 md:hidden w-full flex justify-center" data-testid="mobile-progress-container">
-    <div class="w-10/12 bg-tertiary h-1 rounded-full">
-      <div
-        class="bg-primary h-1 rounded-full transition-all duration-300"
-        [style.width.%]="scrollProgress()"
-        data-testid="mobile-progress-bar"
-      ></div>
-    </div>
-  </div>
-
-  <button
-    (click)="scrollContainer.scrollLeft = scrollContainer.scrollLeft - 135"
-    class="btn btn-circle rounded-none absolute top-0 left-0 h-40 bg-base-100 bg-opacity-70 hover:bg-base-200 hidden md:flex rounded-tl-full rounded-bl-full"
-    data-testid="scroll-left-button"
-  >
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      class="h-5 w-5 transform"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-    >
-      <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        stroke-width="2"
-        d="M15 19l-7-7 7-7"
-      />
-    </svg>
-  </button>
-
-  <button
-    (click)="scrollContainer.scrollLeft = scrollContainer.scrollLeft + 135"
-    class="btn btn-circle rounded-none absolute top-0 right-0 h-40 bg-base-100 bg-opacity-70 hover:bg-base-200 hidden md:flex rounded-tr-full rounded-br-full"
-    data-testid="scroll-right-button"
-  >
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      class="h-5 w-5 transform rotate-180"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-    >
-      <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        stroke-width="2"
-        d="M15 19l-7-7 7-7"
-      />
-    </svg>
-  </button>
-</div>
-
-<div class="flex justify-center mt-5">
-  <div class="w-full">
-    <div class="grid">
-      @for (post of posts(); track post.id) {
-        <app-post-card [post]="post"></app-post-card>
-      }
-    </div>
-  </div>
-</div>
diff --git a/src/app/reader/reader.component.html b/src/app/reader/reader.component.html
deleted file mode 100755
index 67e7bd4..0000000
--- a/src/app/reader/reader.component.html
+++ /dev/null
@@ -1 +0,0 @@
-<router-outlet />
diff --git a/src/app/reader/reader.component.scss b/src/app/reader/reader.component.scss
deleted file mode 100755
index e69de29..0000000
diff --git a/src/app/reader/reader.component.ts b/src/app/reader/reader.component.ts
deleted file mode 100755
index 571e14e..0000000
--- a/src/app/reader/reader.component.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { ChangeDetectionStrategy, Component } from '@angular/core';
-import { RouterOutlet } from '@angular/router';
-
-@Component({
-  selector: 'app-reader',
-  standalone: true,
-  imports: [RouterOutlet],
-  templateUrl: './reader.component.html',
-  styleUrl: './reader.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class ReaderComponent {
-
-}
diff --git a/src/app/reader/reader.routes.ts b/src/app/reader/reader.routes.ts
deleted file mode 100755
index ee07787..0000000
--- a/src/app/reader/reader.routes.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import { Routes } from '@angular/router';
-import { MainPageComponent } from './_components/main-page/main-page.component';
-import { PostComponent } from './_components/main-page/post/post.component';
-import { PostsListComponent } from './_components/main-page/posts-list/posts-list.component';
-
-export const readerRoutes: Routes = [
-  {
-    path: '',
-    component: MainPageComponent,
-    children: [
-      {
-        path: '',
-        component: PostsListComponent,
-      },
-      {
-        path: 'details/:id',
-        component: PostComponent,
-        pathMatch: 'full',
-      },
-    ],
-  },
-];
diff --git a/src/app/shared/about-me/about-me.component.ts b/src/app/shared/about-me/about-me.component.ts
deleted file mode 100644
index 3db8046..0000000
--- a/src/app/shared/about-me/about-me.component.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import {ChangeDetectionStrategy, Component} from '@angular/core';
-import {NgOptimizedImage} from "@angular/common";
-
-@Component({
-  selector: 'app-about-me',
-  standalone: true,
-  imports: [
-    NgOptimizedImage
-  ],
-  templateUrl: './about-me.component.html',
-  styleUrl: './about-me.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class AboutMeComponent {
-
-}
diff --git a/src/app/shared/cookie-consent/cookie-consent.service.ts b/src/app/shared/cookie-consent/cookie-consent.service.ts
deleted file mode 100644
index 30aa384..0000000
--- a/src/app/shared/cookie-consent/cookie-consent.service.ts
+++ /dev/null
@@ -1,49 +0,0 @@
-import { Injectable, ViewContainerRef, inject } from '@angular/core';
-import { ModalCloseStatusEnum, ModalStatus } from '../_models/modal-status.interface';
-import { DynamicDialogService } from '../dynamic-dialog/dynamic-dialog.service';
-import { CookieConsentComponent } from './cookie-consent.component';
-import { LocalStorageEnum } from '../_enums/local-storage';
-
-@Injectable({
-  providedIn: 'root'
-})
-export class CookieConsentService {
-  dialogService = inject(DynamicDialogService);
-
-  showCookieConsent(viewContainerRef: ViewContainerRef): void {
-    if (!localStorage.getItem(LocalStorageEnum.COOKIES_CONSENT)) {
-      this.dialogService.openDialog(
-        viewContainerRef,
-        {
-          primaryButton: 'Allow All',
-          secondaryButton: 'Deny',
-          title: 'Cookie Consent'
-        },
-        CookieConsentComponent,
-      ).subscribe((status) => {
-        if (status.closeStatus === ModalCloseStatusEnum.ACCEPTED) {
-          this.acceptCookies();
-        }
-        if (status.closeStatus === ModalCloseStatusEnum.REJECTED) {
-          this.denyCookies();
-        }
-        this.closePopup(status.closeStatus);
-      });
-    }
-  }
-
-  acceptCookies() {
-    localStorage.setItem(LocalStorageEnum.COOKIES_CONSENT, 'true');
-  }
-
-  denyCookies() {
-    localStorage.setItem(LocalStorageEnum.COOKIES_CONSENT, 'false');
-  }
-
-  closePopup(closeStatus: ModalCloseStatusEnum) {
-    const status = {
-      closeStatus: closeStatus
-    } as ModalStatus;
-    this.dialogService.closeDialog(status);
-  }
-}
diff --git a/src/app/shared/navbar/navbar.component.ts b/src/app/shared/navbar/navbar.component.ts
deleted file mode 100644
index 38d3807..0000000
--- a/src/app/shared/navbar/navbar.component.ts
+++ /dev/null
@@ -1,75 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  ViewContainerRef,
-  inject,
-  HostListener,
-  signal,
-  WritableSignal,
-  viewChild,
-  AfterViewInit,
-  afterNextRender,
-  ElementRef,
-} from '@angular/core';
-import { DynamicDialogService } from '../dynamic-dialog/dynamic-dialog.service';
-import { LoginCompontent } from '../../auth/login/login.component';
-import { RouterLink } from '@angular/router';
-
-@Component({
-  selector: 'blog-navbar',
-  standalone: true,
-  imports: [RouterLink],
-  providers: [],
-  templateUrl: './navbar.component.html',
-  styleUrl: './navbar.component.scss',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class NavbarComponent implements AfterViewInit {
-  public navbar = viewChild<ElementRef<HTMLElement>>('navbar');
-  public mobileMenu = viewChild<ElementRef<HTMLElement>>('mobileMenu');
-  public isScrolled = false;
-  public isMenuOpen: WritableSignal<boolean> = signal(false);
-  public navHeight: WritableSignal<number> = signal(0);
-
-  private dynamicDialogService = inject(DynamicDialogService);
-  private viewContainerRef = inject(ViewContainerRef);
-
-  constructor() {
-    this.initializeNavHeight();
-  }
-
-  ngAfterViewInit() {}
-
-  signIn() {
-    this.dynamicDialogService.openDialog<LoginCompontent>(
-      this.viewContainerRef,
-      { title: 'Sign In' },
-      LoginCompontent,
-    );
-  }
-
-  toggleMenu() {
-    this.isMenuOpen.set(!this.isMenuOpen());
-
-    if (this.isMenuOpen()) {
-      setTimeout(() => {
-        console.log(this.mobileMenu()?.nativeElement);
-        this.mobileMenu()?.nativeElement.style.setProperty(
-          'top',
-          `${this.navHeight()}px`,
-        );
-      }, 1);
-    }
-  }
-
-  private initializeNavHeight(): void {
-    afterNextRender(() => {
-      this.navHeight.set(this.navbar()?.nativeElement.scrollHeight ?? 0);
-    });
-  }
-
-  @HostListener('window:scroll', [])
-  onWindowScroll() {
-    this.isScrolled = window.scrollY > 0;
-  }
-}
diff --git a/src/app/shared/stores/post-tags.store.ts b/src/app/shared/stores/post-tags.store.ts
deleted file mode 100644
index 8006856..0000000
--- a/src/app/shared/stores/post-tags.store.ts
+++ /dev/null
@@ -1,40 +0,0 @@
-import { PostTag } from '../../types/supabase';
-import { patchState, signalStore, withMethods, withState } from '@ngrx/signals';
-import { computed, inject } from '@angular/core';
-import { ReaderApiService } from '../../reader/_services/reader-api.service';
-
-type PostTagsState = {
-  postTags: PostTag[];
-  loading: boolean;
-  error: string | null;
-};
-
-const initialState: PostTagsState = {
-  postTags: [],
-  loading: false,
-  error: null,
-};
-
-export const PostTagsStore = signalStore(
-  { providedIn: 'root' },
-  withState(initialState),
-
-  withMethods((state, postTagsService = inject(ReaderApiService)) => ({
-    async getPostTags(postId: string) {
-      patchState(state, { loading: true, error: null });
-      try {
-        const postTags = await postTagsService.getPostTags(postId);
-        if (postTags) {
-          patchState(state, { postTags, loading: false });
-        } else {
-          patchState(state, { error: 'No post tags found', loading: false });
-        }
-      } catch (error) {
-        patchState(state, {
-          error: 'Failed to fetch post tags',
-          loading: false,
-        });
-      }
-    },
-  })),
-);
diff --git a/src/app/shared/stores/profiles.store.ts b/src/app/shared/stores/profiles.store.ts
deleted file mode 100644
index 27a42a5..0000000
--- a/src/app/shared/stores/profiles.store.ts
+++ /dev/null
@@ -1,52 +0,0 @@
-import { Profile } from '../../types/supabase';
-import {
-  patchState,
-  signalStore,
-  withHooks,
-  withMethods,
-  withState,
-} from '@ngrx/signals';
-import { inject } from '@angular/core';
-import { ReaderApiService } from '../../reader/_services/reader-api.service';
-
-type ProfilesState = {
-  profiles: Profile[];
-  loading: boolean;
-  error: string | null;
-};
-
-const initialState: ProfilesState = {
-  profiles: [],
-  loading: false,
-  error: null,
-};
-
-export const ProfilesStore = signalStore(
-  { providedIn: 'root' },
-  withState(initialState),
-
-  withMethods((state, profilesService = inject(ReaderApiService)) => ({
-    async getProfiles() {
-      patchState(state, { loading: true, error: null });
-      try {
-        const profiles = await profilesService.getProfiles();
-        if (profiles) {
-          patchState(state, { profiles, loading: false });
-        } else {
-          patchState(state, { error: 'No profiles found', loading: false });
-        }
-      } catch (error) {
-        patchState(state, {
-          error: 'Failed to fetch profiles',
-          loading: false,
-        });
-      }
-    },
-  })),
-
-  withHooks({
-    onInit(store) {
-      store.getProfiles();
-    },
-  }),
-);
diff --git a/src/app/shared/tag-multi-select/tag-multi-select.component.html b/src/app/shared/tag-multi-select/tag-multi-select.component.html
deleted file mode 100644
index 4d45f4a..0000000
--- a/src/app/shared/tag-multi-select/tag-multi-select.component.html
+++ /dev/null
@@ -1,88 +0,0 @@
-<div class="relative w-full max-w-md">
-  <!-- Selected Tags Display -->
-  @if (selectedTags().length > 0) {
-    <div class="flex flex-wrap gap-2 mb-2">
-      @for (tag of selectedTags(); track tag.id) {
-        <div
-          class="badge gap-2 cursor-pointer transition-all duration-200 hover:opacity-80 hover:scale-95 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500"
-          [style.background-color]="tag.color || '#12372A'"
-          [style.color]="'#FBFADA'"
-          (click)="removeTag(tag)"
-          [attr.aria-label]="'Remove ' + tag.name"
-          role="button"
-          tabindex="0"
-          (keydown.enter)="removeTag(tag)"
-          (keydown.space)="removeTag(tag)"
-        >
-          {{ tag.name }}
-          <svg
-            xmlns="http://www.w3.org/2000/svg"
-            fill="none"
-            viewBox="0 0 24 24"
-            class="inline-block w-4 h-4 stroke-current"
-          >
-            <path
-              stroke-linecap="round"
-              stroke-linejoin="round"
-              stroke-width="2"
-              d="M6 18L18 6M6 6l12 12"
-            ></path>
-          </svg>
-        </div>
-      }
-    </div>
-  }
-
-  <!-- Search Input -->
-  <div class="relative">
-    <input
-      #searchInput
-      type="text"
-      class="input input-bordered w-full focus:border-green-600 focus:ring-2 focus:ring-green-200 disabled:opacity-50 disabled:cursor-not-allowed"
-      placeholder="Search and select tags..."
-      [value]="searchTerm()"
-      (input)="onSearchChange($event)"
-      (focus)="onInputFocus()"
-      (blur)="onInputBlur()"
-      [disabled]="disabled()"
-      [attr.aria-expanded]="isOpen()"
-      [attr.aria-haspopup]="'listbox'"
-      role="textbox"
-      aria-label="Search tags"
-    />
-
-    <!-- Dropdown -->
-    @if (isOpen() && !disabled()) {
-      <div
-        class="absolute z-50 w-full mt-1 bg-base-100 border border-base-300 rounded-lg shadow-lg max-h-60 overflow-y-auto"
-        role="listbox"
-        [attr.aria-label]="'Available tags'"
-      >
-        @for (tag of filteredTags(); track tag.id) {
-          <div
-            class="px-4 py-2 cursor-pointer hover:bg-base-200 flex items-center justify-between transition-colors duration-150"
-            [class.bg-primary]="tag.id === focusedTagId()"
-            [class.text-quaternary]="tag.id === focusedTagId()"
-            (click)="selectTag(tag)"
-            [attr.aria-selected]="isTagSelected(tag)"
-            role="option"
-            tabindex="-1"
-          >
-            <span>{{ tag.name }}</span>
-            @if (tag.color) {
-              <div
-                class="w-4 h-4 rounded-full border border-gray-200"
-                [style.background-color]="tag.color"
-              ></div>
-            }
-          </div>
-        }
-        @empty {
-          <div class="px-4 py-2 text-base-content/60 text-sm italic">
-            No tags found
-          </div>
-        }
-      </div>
-    }
-  </div>
-</div>
diff --git a/src/index.html b/src/index.html
deleted file mode 100755
index 2d5d429..0000000
--- a/src/index.html
+++ /dev/null
@@ -1,16 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-  <meta charset="utf-8"/>
-  <title>AngularBlogApp</title>
-  <base href="/"/>
-  <meta name="viewport" content="width=device-width, initial-scale=1"/>
-  <link rel="icon" type="image/x-icon" href="favicon.ico"/>
-</head>
-
-<body
-  class="bg-gradient-to-br from-quaternary/40 via-[#7A9E7E]/50 to-primary h-full"
->
-<app-root></app-root>
-</body>
-</html>
diff --git a/supabase-password-script-fix.md b/supabase-password-script-fix.md
deleted file mode 100644
index aedbae7..0000000
--- a/supabase-password-script-fix.md
+++ /dev/null
@@ -1,40 +0,0 @@
-# Supabase Password Script Fix
-
-## Issue Description
-When running the `npm run users:passwords` command, the following error occurred:
-```
-▶ fetching user IDs…
-jq: error (at <stdin>:0): Cannot index object with number
-```
-
-## Cause of the Issue
-The error occurred in the `get_id` function of the `scripts/set-passwords.sh` script. The function was using jq to extract the user ID from the JSON response with the command:
-```bash
-jq -r '.[0].id // empty'
-```
-
-This command assumes that the response from the Supabase Auth API is an array, and it tries to access the first element (`.[0]`). However, the error message "Cannot index object with number" indicates that the response is actually an object, not an array, so the `.[0]` indexing fails.
-
-## Solution
-The solution is to modify the jq command to handle both cases: if the response is an array, it will use the original approach; if it's an object, it will try to access the `id` property directly.
-
-### Changes to set-passwords.sh
-```bash
-# Before:
-get_id () {  # $1=email
-  curl -sS "${HDR[@]:0:2}" "$BASE/users?email=$1" | jq -r '.[0].id // empty'
-}
-
-# After:
-get_id () {  # $1=email
-  curl -sS "${HDR[@]:0:2}" "$BASE/users?email=$1" | jq -r 'if type == "array" then .[0].id // empty else .id // empty end'
-}
-```
-
-The new jq command uses the `type` function to check if the response is an array. If it is, it accesses the first element's id property as before. If it's an object, it tries to access the id property directly. This makes the script more robust and able to handle different response formats from the Supabase Auth API.
-
-## How to Test
-To test this fix:
-1. Make sure your local Supabase instance is running
-2. Run the script: `npm run users:passwords`
-3. Verify that it successfully sets the passwords for the two users without any errors
diff --git a/tailwind.config.js b/tailwind.config.js
index 8493e7f..4f5192a 100755
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,6 +1,9 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-  content: ["./src/**/*.{html,ts}"],
+  content: [
+    "./src/**/*.{html,ts}",
+    "./projects/**/*.{html,ts}"
+  ],
   daisyui: {
     themes: ["light"],
   },
@@ -14,5 +17,5 @@ module.exports = {
       },
     },
   },
-  plugins: [require("daisyui"), require("@tailwindcss/line-clamp")],
+  plugins: [require("daisyui")],
 };
diff --git a/tsconfig.json b/tsconfig.json
index 56b644d..6891e78 100755
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -14,6 +14,17 @@
     "declaration": false,
     "experimentalDecorators": true,
     "moduleResolution": "bundler",
+    "paths": {
+      "shared": [
+        "./projects/shared/src/public-api"
+      ],
+      "shared/models": [
+        "./projects/shared/models/public-api"
+      ],
+      "shared/utils": [
+        "./projects/shared/utils/public-api"
+      ]
+    },
     "importHelpers": true,
     "target": "ES2022",
     "module": "ES2022",
@@ -28,5 +39,31 @@
     "strictInjectionParameters": true,
     "strictInputAccessModifiers": true,
     "strictTemplates": true
-  }
+  },
+  "references": [
+    {
+      "path": "./projects/admin/tsconfig.app.json"
+    },
+    {
+      "path": "./projects/admin/tsconfig.spec.json"
+    },
+    {
+      "path": "./projects/web/tsconfig.app.json"
+    },
+    {
+      "path": "./projects/web/tsconfig.spec.json"
+    },
+    {
+      "path": "./projects/shared/tsconfig.lib.json"
+    },
+    {
+      "path": "./projects/shared/tsconfig.spec.json"
+    },
+    {
+      "path": "./projects/code-samples-mfe/tsconfig.app.json"
+    },
+    {
+      "path": "./projects/code-samples-mfe/tsconfig.spec.json"
+    }
+  ]
 }