@analogjs/router/fesm2022/analogjs-router-debug.page-C7mEWSZu.mjs

Filesystem-based routing for Angular

import * as i0 from '@angular/core';
import { Component } from '@angular/core';
import { injectDebugRoutes } from './analogjs-router.mjs';

class DebugRoutesComponent {
    constructor() {
        this.collectedRoutes = [];
        this.debugRoutes = injectDebugRoutes();
    }
    ngOnInit() {
        this.traverseRoutes(this.debugRoutes);
    }
    traverseRoutes(routes, parent) {
        routes.forEach((route) => {
            this.collectedRoutes.push({
                path: route.isLayout
                    ? `${parent ? `/${parent}` : ''}${route.path ? `/${route.path}` : ''}`
                    : `${parent ? `/${parent}` : ''}${route.path ? `/${route.path}` : '/'}`,
                filename: route.filename,
                file: route.filename?.replace(/(^.*)pages\//, '') || '',
                isLayout: route.isLayout,
            });
            if (route.children) {
                const parentSegments = [parent, route.path];
                const fullParentPath = parentSegments.filter((s) => !!s).join('/');
                this.traverseRoutes(route.children, fullParentPath);
            }
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: DebugRoutesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.0", type: DebugRoutesComponent, isStandalone: true, selector: "analogjs-debug-routes-page", ngImport: i0, template: `
    <h2>Routes</h2>

    <div class="table-container">
      <div class="table-header">
        <div class="header-cell">Route Path</div>
        <div class="header-cell">File</div>
        <div class="header-cell">Type</div>
      </div>
      <div class="table-body">
        @for (
          collectedRoute of collectedRoutes;
          track collectedRoute.filename
        ) {
          <div class="table-row">
            <div class="table-cell">{{ collectedRoute.path }}</div>
            <div class="table-cell" [title]="collectedRoute.filename">
              {{ collectedRoute.file }}
            </div>
            <div class="table-cell">
              {{ collectedRoute.isLayout ? 'Layout' : 'Page' }}
            </div>
          </div>
        }
      </div>
    </div>
  `, isInline: true, styles: [":host{width:100%}.table-container{width:100%;max-width:900px;margin:0 auto;background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;overflow:hidden}.table-header{display:grid;grid-template-columns:repeat(3,1fr);background:gray;border-bottom:2px solid #e5e7eb}.header-cell{padding:16px 24px;font-weight:600;text-transform:uppercase;font-size:14px;letter-spacing:.05em;color:#fff}.table-body{display:flex;flex-direction:column}.table-row{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid #e5e7eb;transition:background-color .2s ease}.table-row:last-child{border-bottom:none}.table-row:hover{background-color:#f9fafb}.table-cell{padding:16px 24px;font-size:16px;color:#4b5563}@media (max-width: 640px){.table-container{border-radius:0;margin:0}.header-cell,.table-cell{padding:12px 16px}}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: DebugRoutesComponent, decorators: [{
            type: Component,
            args: [{ selector: 'analogjs-debug-routes-page', standalone: true, template: `
    <h2>Routes</h2>

    <div class="table-container">
      <div class="table-header">
        <div class="header-cell">Route Path</div>
        <div class="header-cell">File</div>
        <div class="header-cell">Type</div>
      </div>
      <div class="table-body">
        @for (
          collectedRoute of collectedRoutes;
          track collectedRoute.filename
        ) {
          <div class="table-row">
            <div class="table-cell">{{ collectedRoute.path }}</div>
            <div class="table-cell" [title]="collectedRoute.filename">
              {{ collectedRoute.file }}
            </div>
            <div class="table-cell">
              {{ collectedRoute.isLayout ? 'Layout' : 'Page' }}
            </div>
          </div>
        }
      </div>
    </div>
  `, styles: [":host{width:100%}.table-container{width:100%;max-width:900px;margin:0 auto;background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;overflow:hidden}.table-header{display:grid;grid-template-columns:repeat(3,1fr);background:gray;border-bottom:2px solid #e5e7eb}.header-cell{padding:16px 24px;font-weight:600;text-transform:uppercase;font-size:14px;letter-spacing:.05em;color:#fff}.table-body{display:flex;flex-direction:column}.table-row{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid #e5e7eb;transition:background-color .2s ease}.table-row:last-child{border-bottom:none}.table-row:hover{background-color:#f9fafb}.table-cell{padding:16px 24px;font-size:16px;color:#4b5563}@media (max-width: 640px){.table-container{border-radius:0;margin:0}.header-cell,.table-cell{padding:12px 16px}}\n"] }]
        }] });

export { DebugRoutesComponent as default };
//# sourceMappingURL=analogjs-router-debug.page-C7mEWSZu.mjs.map