@3ddv/software-division-components 1.5.0 → 2.0.0

package/dist/fesm2022/3ddv-software-division-components-dvm-map-loader.mjs

@@ -0,0 +1,161 @@
+import { NgOptimizedImage, NgClass, CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { input, viewChild, ChangeDetectionStrategy, Component } from '@angular/core';
+import { createTimeline } from 'animejs';
+import { mergeMap, skip, tap, merge, catchError } from 'rxjs';
+
+class MapLoaderComponent {
+    // INPUTS
+    viewerService = input.required(...(ngDevMode ? [{ debugName: "viewerService" }] : []));
+    logo = input.required(...(ngDevMode ? [{ debugName: "logo" }] : []));
+    color = input('255 165 0', ...(ngDevMode ? [{ debugName: "color" }] : []));
+    duration = input(500, ...(ngDevMode ? [{ debugName: "duration" }] : []));
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    // SIGNALS
+    pill = viewChild('pill', ...(ngDevMode ? [{ debugName: "pill" }] : []));
+    pillContainer = viewChild('pillContainer', ...(ngDevMode ? [{ debugName: "pillContainer" }] : []));
+    container = viewChild('container', ...(ngDevMode ? [{ debugName: "container" }] : []));
+    // CLASS PROPERTIES
+    isFirstLoad = true;
+    varName = '--ripple-color';
+    handlers = [];
+    // GETTERS
+    /**
+     * Retorna la variable CSS para el color del ripple.
+     * Necesitamos setear la variable css --ripple-color con el color accent de la configuración.
+     * Como este valor originalmente viene sin comas para ser usado en Tailwind, debemos reemplazar los espacios por comas.
+     * Finalmente retornamos el valor y lo implementamos en el div contenedor del ripple para ser usado por el scss.
+     */
+    get ripple() {
+        const rgb = this.formatRgb(this.color(), false);
+        return `${this.varName}:${rgb};`;
+    }
+    // LC METHODS
+    ngOnInit() {
+        this.initComponent();
+    }
+    ngOnDestroy() {
+        this.destroyComponent();
+    }
+    // CLASS METHODS
+    /**
+     * Muestra el loader.
+     * Mediante una animación de animejs, mostramos el loader.
+     * Al comenzar, verificará si el contenedor tiene la clase hidden y la removerá si es así.
+     */
+    showLoader() {
+        const pill = this.pill();
+        const container = this.container();
+        const pillContainer = this.pillContainer();
+        if (!container || !pill || !pillContainer) {
+            return console.error('Loader could not be loaded');
+        }
+        const containerClasses = container.nativeElement.classList.value;
+        if (containerClasses.includes('hidden')) {
+            container.nativeElement.classList.remove('hidden');
+        }
+        createTimeline({
+            duration: this.duration,
+        })
+            .add(pillContainer.nativeElement, {
+            opacity: [0, 1],
+            duration: 100,
+        })
+            .add(pill.nativeElement, {
+            scale: [0, 1],
+            opacity: [0, 1],
+        }, '+=10');
+    }
+    /**
+     * Oculta el loader.
+     * Cuando termina aplica la clase hidden al contenedor para ocultarlo.
+     */
+    hideLoader() {
+        const pill = this.pill();
+        const container = this.container();
+        const pillContainer = this.pillContainer();
+        if (!container || !pill || !pillContainer) {
+            return console.error('Loader could not be hidden');
+        }
+        createTimeline({
+            delay: 400,
+            duration: this.duration,
+            playbackEase: 'outQuad',
+            onComplete: () => container.nativeElement.classList.add('hidden'),
+        })
+            .add(pill.nativeElement, {
+            opacity: [1, 0],
+            scale: [1, 0],
+        })
+            .add(pillContainer.nativeElement, {
+            opacity: [1, 0],
+        });
+    }
+    handleLoadSuccess() {
+        if (this.isFirstLoad) {
+            this.hideLoader();
+            return;
+        }
+        setTimeout(() => this.hideLoader(), this.duration());
+    }
+    /**
+     * Inicializa el componente y sus handlers.
+     * Haciendo uso de waitInitialize, esperamos a que el mapa se inicialice para poder suscribirnos a los eventos de carga del mapa.
+     * Excepto en la carga inicial del mapa y para evitar superponer animaciones, skipeamos la primera carga y esperamos a que el mapa se recargue
+     * para futuras ocasiones y delegamos en los handlers start y success para mostrar u ocultar el loader respectivamente.
+     */
+    initComponent() {
+        const subscription = this.viewerService()
+            .waitInitialize()
+            .pipe(mergeMap(() => {
+            // when initialized, we listen to both load_start and load_success
+            const loadStart$ = this.viewerService()
+                .getObservable('load_start')
+                .pipe(skip(1), // skip first emission
+            tap(() => this.showLoader()));
+            const loadSuccess$ = this.viewerService()
+                .getObservable('load_success')
+                .pipe(tap(() => {
+                if (this.isFirstLoad) {
+                    this.isFirstLoad = false;
+                }
+            }), tap(() => this.handleLoadSuccess()));
+            // merge both into one stream
+            return merge(loadStart$, loadSuccess$);
+        }), catchError((error) => {
+            console.error('viewer init error', error);
+            return []; // swallow error or return EMPTY
+        }))
+            .subscribe();
+        this.handlers.push(subscription);
+    }
+    formatRgb(rgbString, wrapped = true) {
+        return wrapped ? 'rgb(' + rgbString.split(' ').join(', ') + ')' : rgbString.split(' ').join(', ');
+    }
+    /**
+     * Destruye el componente y sus handlers.
+     * Recorre el array de handlers y se desuscribe de cada uno de ellos.
+     */
+    destroyComponent() {
+        for (const h of this.handlers) {
+            h.unsubscribe();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: MapLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.4", type: MapLoaderComponent, isStandalone: true, selector: "sdc-map-loader", inputs: { viewerService: { classPropertyName: "viewerService", publicName: "viewerService", isSignal: true, isRequired: true, transformFunction: null }, logo: { classPropertyName: "logo", publicName: "logo", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "pill", first: true, predicate: ["pill"], descendants: true, isSignal: true }, { propertyName: "pillContainer", first: true, predicate: ["pillContainer"], descendants: true, isSignal: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #container class=\"container\" [style]=\"ripple\">\n  <!-- Container -->\n  <div #pillContainer class=\"pill-container\">\n    <!-- PILL -->\n    <div #pill class=\"pill ripple-animation\">\n      <!-- LOGO -->\n      <img\n        [ngClass]=\"size() === 'sm' ? 'block' : 'hidden'\"\n        alt=\"Club logo loader\"\n        height=\"70\"\n        priority\n        width=\"50\"\n        [ngSrc]=\"logo()\" />\n      <img\n        [ngClass]=\"size() === 'md' ? 'block' : 'hidden'\"\n        alt=\"Club logo loader\"\n        height=\"90\"\n        priority\n        width=\"70\"\n        [ngSrc]=\"logo()\" />\n    </div>\n  </div>\n</div>\n", styles: [".ripple-animation{animation:ripple 1s linear infinite}@-webkit-keyframes ripple{0%{box-shadow:0 4px 10px rgba(var(--ripple-color),.1),0 0 rgba(var(--ripple-color),.1),0 0 0 5px rgba(var(--ripple-color),.1),0 0 0 10px rgba(var(--ripple-color),.1),0 0 0 20px rgba(var(--ripple-color),.1),0 0 0 30px rgba(var(--ripple-color),.1),0 0 0 40px rgba(var(--ripple-color),.1)}to{box-shadow:0 4px 10px rgba(var(--ripple-color),.1),0 0 0 5px rgba(var(--ripple-color),.1),0 0 0 10px rgba(var(--ripple-color),.1),0 0 0 20px rgba(var(--ripple-color),.1),0 0 0 30px rgba(var(--ripple-color),.1),0 0 0 40px rgba(var(--ripple-color),.1),0 0 0 50px rgba(var(--ripple-color),0)}}@keyframes ripple{0%{box-shadow:0 4px 10px rgba(var(--ripple-color),.1),0 0 rgba(var(--ripple-color),.1),0 0 0 5px rgba(var(--ripple-color),.1),0 0 0 10px rgba(var(--ripple-color),.1),0 0 0 20px rgba(var(--ripple-color),.1)}to{box-shadow:0 4px 10px rgba(var(--ripple-color),.1),0 0 0 5px rgba(var(--ripple-color),.1),0 0 0 10px rgba(var(--ripple-color),.1),0 0 0 20px rgba(var(--ripple-color),.1),0 0 0 30px rgba(var(--ripple-color),0)}}.container{position:relative;height:100%;width:100%;max-width:100%;overflow:visible}.pill-container{position:absolute;z-index:20;display:flex;align-items:center;justify-content:center;height:100%;width:100%}.pill{display:flex;align-items:center;justify-content:center;width:8rem;height:8rem;border-radius:50%;background-color:#111827e6}@media(min-width:1024px){.pill{width:12rem;height:12rem}}@media(min-width:1920px){.pill{width:13.5rem;height:13.5rem}}\n"], dependencies: [{ kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: MapLoaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sdc-map-loader', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgOptimizedImage, NgClass, CommonModule], template: "<div #container class=\"container\" [style]=\"ripple\">\n  <!-- Container -->\n  <div #pillContainer class=\"pill-container\">\n    <!-- PILL -->\n    <div #pill class=\"pill ripple-animation\">\n      <!-- LOGO -->\n      <img\n        [ngClass]=\"size() === 'sm' ? 'block' : 'hidden'\"\n        alt=\"Club logo loader\"\n        height=\"70\"\n        priority\n        width=\"50\"\n        [ngSrc]=\"logo()\" />\n      <img\n        [ngClass]=\"size() === 'md' ? 'block' : 'hidden'\"\n        alt=\"Club logo loader\"\n        height=\"90\"\n        priority\n        width=\"70\"\n        [ngSrc]=\"logo()\" />\n    </div>\n  </div>\n</div>\n", styles: [".ripple-animation{animation:ripple 1s linear infinite}@-webkit-keyframes ripple{0%{box-shadow:0 4px 10px rgba(var(--ripple-color),.1),0 0 rgba(var(--ripple-color),.1),0 0 0 5px rgba(var(--ripple-color),.1),0 0 0 10px rgba(var(--ripple-color),.1),0 0 0 20px rgba(var(--ripple-color),.1),0 0 0 30px rgba(var(--ripple-color),.1),0 0 0 40px rgba(var(--ripple-color),.1)}to{box-shadow:0 4px 10px rgba(var(--ripple-color),.1),0 0 0 5px rgba(var(--ripple-color),.1),0 0 0 10px rgba(var(--ripple-color),.1),0 0 0 20px rgba(var(--ripple-color),.1),0 0 0 30px rgba(var(--ripple-color),.1),0 0 0 40px rgba(var(--ripple-color),.1),0 0 0 50px rgba(var(--ripple-color),0)}}@keyframes ripple{0%{box-shadow:0 4px 10px rgba(var(--ripple-color),.1),0 0 rgba(var(--ripple-color),.1),0 0 0 5px rgba(var(--ripple-color),.1),0 0 0 10px rgba(var(--ripple-color),.1),0 0 0 20px rgba(var(--ripple-color),.1)}to{box-shadow:0 4px 10px rgba(var(--ripple-color),.1),0 0 0 5px rgba(var(--ripple-color),.1),0 0 0 10px rgba(var(--ripple-color),.1),0 0 0 20px rgba(var(--ripple-color),.1),0 0 0 30px rgba(var(--ripple-color),0)}}.container{position:relative;height:100%;width:100%;max-width:100%;overflow:visible}.pill-container{position:absolute;z-index:20;display:flex;align-items:center;justify-content:center;height:100%;width:100%}.pill{display:flex;align-items:center;justify-content:center;width:8rem;height:8rem;border-radius:50%;background-color:#111827e6}@media(min-width:1024px){.pill{width:12rem;height:12rem}}@media(min-width:1920px){.pill{width:13.5rem;height:13.5rem}}\n"] }]
+        }], propDecorators: { viewerService: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewerService", required: true }] }], logo: [{ type: i0.Input, args: [{ isSignal: true, alias: "logo", required: true }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], duration: [{ type: i0.Input, args: [{ isSignal: true, alias: "duration", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], pill: [{ type: i0.ViewChild, args: ['pill', { isSignal: true }] }], pillContainer: [{ type: i0.ViewChild, args: ['pillContainer', { isSignal: true }] }], container: [{ type: i0.ViewChild, args: ['container', { isSignal: true }] }] } });
+
+/*
+ * Public API Surface of software-division-components
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { MapLoaderComponent };
+//# sourceMappingURL=3ddv-software-division-components-dvm-map-loader.mjs.map

package/dist/fesm2022/3ddv-software-division-components-dvm-map-loader.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"3ddv-software-division-components-dvm-map-loader.mjs","sources":["../../dvm/map-loader/map-loader.component.ts","../../dvm/map-loader/map-loader.component.html","../../dvm/map-loader/public-api.ts","../../dvm/map-loader/3ddv-software-division-components-dvm-map-loader.ts"],"sourcesContent":["import { CommonModule, NgClass, NgOptimizedImage } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, ElementRef, input, OnDestroy, OnInit, viewChild } from '@angular/core';\nimport { createTimeline } from 'animejs';\nimport { catchError, merge, mergeMap, Observable, skip, Subscription, tap } from 'rxjs';\n\n@Component({\n  selector: 'sdc-map-loader',\n  templateUrl: './map-loader.component.html',\n  styleUrl: './map-loader.component.css',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [NgOptimizedImage, NgClass, CommonModule],\n})\nexport class MapLoaderComponent implements OnInit, OnDestroy {\n  // INPUTS\n  public viewerService = input.required<{\n    waitInitialize: () => Observable<any>;\n    getObservable: (value: 'load_success' | 'load_start') => Observable<any>;\n  }>();\n  public logo = input.required<string>();\n  public color = input<string>('255 165 0');\n  public duration = input<number>(500);\n  public size = input<'sm' | 'md'>('md');\n\n  // SIGNALS\n  public pill = viewChild<ElementRef>('pill');\n  public pillContainer = viewChild<ElementRef>('pillContainer');\n  public container = viewChild<ElementRef>('container');\n\n  // CLASS PROPERTIES\n  private isFirstLoad = true;\n  private varName = '--ripple-color';\n  private readonly handlers: Subscription[] = [];\n\n  // GETTERS\n  /**\n   * Retorna la variable CSS para el color del ripple.\n   * Necesitamos setear la variable css --ripple-color con el color accent de la configuración.\n   * Como este valor originalmente viene sin comas para ser usado en Tailwind, debemos reemplazar los espacios por comas.\n   * Finalmente retornamos el valor y lo implementamos en el div contenedor del ripple para ser usado por el scss.\n   */\n  public get ripple(): string {\n    const rgb = this.formatRgb(this.color(), false);\n\n    return `${this.varName}:${rgb};`;\n  }\n\n  // LC METHODS\n  public ngOnInit(): void {\n    this.initComponent();\n  }\n\n  public ngOnDestroy(): void {\n    this.destroyComponent();\n  }\n\n  // CLASS METHODS\n\n  /**\n   * Muestra el loader.\n   * Mediante una animación de animejs, mostramos el loader.\n   * Al comenzar, verificará si el contenedor tiene la clase hidden y la removerá si es así.\n   */\n  private showLoader(): void {\n    const pill = this.pill();\n    const container = this.container();\n    const pillContainer = this.pillContainer();\n\n    if (!container || !pill || !pillContainer) {\n      return console.error('Loader could not be loaded');\n    }\n\n    const containerClasses: string = container.nativeElement.classList.value;\n\n    if (containerClasses.includes('hidden')) {\n      container.nativeElement.classList.remove('hidden');\n    }\n\n    createTimeline({\n      duration: this.duration,\n    })\n      .add(pillContainer.nativeElement, {\n        opacity: [0, 1],\n        duration: 100,\n      })\n      .add(\n        pill.nativeElement,\n        {\n          scale: [0, 1],\n          opacity: [0, 1],\n        },\n        '+=10'\n      );\n  }\n\n  /**\n   * Oculta el loader.\n   * Cuando termina aplica la clase hidden al contenedor para ocultarlo.\n   */\n  private hideLoader(): void {\n    const pill = this.pill();\n    const container = this.container();\n    const pillContainer = this.pillContainer();\n\n    if (!container || !pill || !pillContainer) {\n      return console.error('Loader could not be hidden');\n    }\n    createTimeline({\n      delay: 400,\n      duration: this.duration,\n      playbackEase: 'outQuad',\n      onComplete: () => container.nativeElement.classList.add('hidden'),\n    })\n      .add(pill.nativeElement, {\n        opacity: [1, 0],\n        scale: [1, 0],\n      })\n      .add(pillContainer.nativeElement, {\n        opacity: [1, 0],\n      });\n  }\n\n  private handleLoadSuccess(): void {\n    if (this.isFirstLoad) {\n      this.hideLoader();\n      return;\n    }\n\n    setTimeout(() => this.hideLoader(), this.duration());\n  }\n\n  /**\n   * Inicializa el componente y sus handlers.\n   * Haciendo uso de waitInitialize, esperamos a que el mapa se inicialice para poder suscribirnos a los eventos de carga del mapa.\n   * Excepto en la carga inicial del mapa y para evitar superponer animaciones, skipeamos la primera carga y esperamos a que el mapa se recargue\n   * para futuras ocasiones y delegamos en los handlers start y success para mostrar u ocultar el loader respectivamente.\n   */\n  private initComponent(): void {\n    const subscription = this.viewerService()\n      .waitInitialize()\n      .pipe(\n        mergeMap(() => {\n          // when initialized, we listen to both load_start and load_success\n          const loadStart$ = this.viewerService()\n            .getObservable('load_start')\n            .pipe(\n              skip(1), // skip first emission\n              tap(() => this.showLoader())\n            );\n\n          const loadSuccess$ = this.viewerService()\n            .getObservable('load_success')\n            .pipe(\n              tap(() => {\n                if (this.isFirstLoad) {\n                  this.isFirstLoad = false;\n                }\n              }),\n              tap(() => this.handleLoadSuccess())\n            );\n\n          // merge both into one stream\n          return merge(loadStart$, loadSuccess$);\n        }),\n        catchError((error: unknown) => {\n          console.error('viewer init error', error);\n          return []; // swallow error or return EMPTY\n        })\n      )\n      .subscribe();\n\n    this.handlers.push(subscription);\n  }\n\n  private formatRgb(rgbString: string, wrapped = true): string {\n    return wrapped ? 'rgb(' + rgbString.split(' ').join(', ') + ')' : rgbString.split(' ').join(', ');\n  }\n\n  /**\n   * Destruye el componente y sus handlers.\n   * Recorre el array de handlers y se desuscribe de cada uno de ellos.\n   */\n  private destroyComponent(): void {\n    for (const h of this.handlers) {\n      h.unsubscribe();\n    }\n  }\n}\n","<div #container class=\"container\" [style]=\"ripple\">\n  <!-- Container -->\n  <div #pillContainer class=\"pill-container\">\n    <!-- PILL -->\n    <div #pill class=\"pill ripple-animation\">\n      <!-- LOGO -->\n      <img\n        [ngClass]=\"size() === 'sm' ? 'block' : 'hidden'\"\n        alt=\"Club logo loader\"\n        height=\"70\"\n        priority\n        width=\"50\"\n        [ngSrc]=\"logo()\" />\n      <img\n        [ngClass]=\"size() === 'md' ? 'block' : 'hidden'\"\n        alt=\"Club logo loader\"\n        height=\"90\"\n        priority\n        width=\"70\"\n        [ngSrc]=\"logo()\" />\n    </div>\n  </div>\n</div>\n","/*\n * Public API Surface of software-division-components\n */\n\nexport * from './map-loader.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/dist/fesm2022/3ddv-software-division-components-dvm-neighbors.mjs

@@ -0,0 +1,204 @@
+import * as i0 from '@angular/core';
+import { inject, ChangeDetectorRef, input, EventEmitter, computed, Output, ViewChild, ChangeDetectionStrategy, Component } from '@angular/core';
+
+class NeighborsComponent {
+    // VIEWCHILD
+    neighborsContainer;
+    currentSection;
+    currentSection3d;
+    leftSectionElement;
+    rightSectionElement;
+    // SERVICES
+    cdr = inject(ChangeDetectorRef);
+    // REQUIRED INPUTS
+    neighborsData = input.required(...(ngDevMode ? [{ debugName: "neighborsData" }] : []));
+    currentSectionId = input.required(...(ngDevMode ? [{ debugName: "currentSectionId" }] : []));
+    translateTdcToMmc = input.required(...(ngDevMode ? [{ debugName: "translateTdcToMmc" }] : []));
+    translateMmcToTdc = input.required(...(ngDevMode ? [{ debugName: "translateMmcToTdc" }] : []));
+    hasAvailability = input.required(...(ngDevMode ? [{ debugName: "hasAvailability" }] : []));
+    // OPTIONAL INPUTS
+    isLoading = input(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
+    showElement = input(true, ...(ngDevMode ? [{ debugName: "showElement" }] : []));
+    modeLr = input(false, ...(ngDevMode ? [{ debugName: "modeLr" }] : []));
+    className = input('', ...(ngDevMode ? [{ debugName: "className" }] : []));
+    theme = input('theme-sdc', ...(ngDevMode ? [{ debugName: "theme" }] : []));
+    // OUTPUTS
+    sectionChange = new EventEmitter();
+    /**
+     * Computed class string that combines theme and user classes.
+     */
+    computedClass = computed(() => {
+        const themeClass = this.theme();
+        const className = this.className();
+        return Array.from(new Set(['sdc-neighbors', themeClass, className]))
+            .filter(Boolean)
+            .join(' ');
+    }, ...(ngDevMode ? [{ debugName: "computedClass" }] : []));
+    // COMPONENT STATE
+    subscriptions = [];
+    // COMPUTED STATE
+    leftSectionId = computed(() => {
+        try {
+            const currentId = this.currentSectionId();
+            if (!currentId)
+                return null;
+            return this.findAvailableNeighbor('prev', currentId);
+        }
+        catch (error) {
+            return null;
+        }
+    }, ...(ngDevMode ? [{ debugName: "leftSectionId" }] : []));
+    rightSectionId = computed(() => {
+        try {
+            const currentId = this.currentSectionId();
+            if (!currentId)
+                return null;
+            return this.findAvailableNeighbor('next', currentId);
+        }
+        catch (error) {
+            return null;
+        }
+    }, ...(ngDevMode ? [{ debugName: "rightSectionId" }] : []));
+    currentSectionLabel = computed(() => {
+        try {
+            const currentId = this.currentSectionId();
+            if (!currentId)
+                return 'Loading';
+            // Translate TDC ID to MMC ID for display
+            const mmcId = this.translateTdcToMmc()(currentId);
+            if (!mmcId)
+                return currentId; // Fallback to TDC ID if translation fails
+            // Extract section number from MMC ID (assuming format like "S_31" or similar)
+            return mmcId.replace(/^S_/, '');
+        }
+        catch (error) {
+            return 'Loading';
+        }
+    }, ...(ngDevMode ? [{ debugName: "currentSectionLabel" }] : []));
+    leftSectionLabel = computed(() => {
+        try {
+            const leftId = this.leftSectionId();
+            if (!leftId)
+                return null;
+            // Translate TDC ID to MMC ID for display
+            const mmcId = this.translateTdcToMmc()(leftId);
+            if (!mmcId)
+                return leftId; // Fallback to TDC ID if translation fails
+            // Extract section number from MMC ID
+            return mmcId.replace(/^S_/, '');
+        }
+        catch (error) {
+            return null;
+        }
+    }, ...(ngDevMode ? [{ debugName: "leftSectionLabel" }] : []));
+    rightSectionLabel = computed(() => {
+        try {
+            const rightId = this.rightSectionId();
+            if (!rightId)
+                return null;
+            // Translate TDC ID to MMC ID for display
+            const mmcId = this.translateTdcToMmc()(rightId);
+            if (!mmcId)
+                return rightId; // Fallback to TDC ID if translation fails
+            // Extract section number from MMC ID
+            return mmcId.replace(/^S_/, '');
+        }
+        catch (error) {
+            return null;
+        }
+    }, ...(ngDevMode ? [{ debugName: "rightSectionLabel" }] : []));
+    // NEIGHBOR RESOLUTION ALGORITHM
+    findAvailableNeighbor(type, currentSectionTdcId) {
+        try {
+            const neighborKey = type === 'prev' ? 'l' : 'r';
+            const noNeighborValue = 'none';
+            // 1. Translate TDC → MMC
+            const currentSectionMmcId = this.translateTdcToMmc()(currentSectionTdcId);
+            if (!currentSectionMmcId)
+                return null;
+            // 2. Look up neighbor in data
+            const neighbors = this.neighborsData();
+            const neighbor = neighbors[currentSectionMmcId];
+            const neighborSectionMmcId = neighbor ? neighbor[neighborKey] : noNeighborValue;
+            // 3. Handle 'none' boundary
+            if (neighborSectionMmcId === noNeighborValue) {
+                return null;
+            }
+            // 4. Translate MMC → TDC
+            const neighborSectionTdcId = this.translateMmcToTdc()(neighborSectionMmcId);
+            if (!neighborSectionTdcId)
+                return null;
+            // 5. Check availability
+            if (this.hasAvailability()(neighborSectionTdcId)) {
+                return neighborSectionTdcId;
+            }
+            // 6. Recursively find next available (skip unavailable sections)
+            return this.findAvailableNeighbor(type, neighborSectionTdcId);
+        }
+        catch (error) {
+            return null;
+        }
+    }
+    // GETTERS
+    get leftSection() {
+        return this.leftSectionId();
+    }
+    get rightSection() {
+        return this.rightSectionId();
+    }
+    get section() {
+        return this.currentSectionLabel();
+    }
+    ngOnDestroy() {
+        this.subscriptions.forEach((sub) => sub.unsubscribe());
+    }
+    // METHODS
+    navigateToSection(section) {
+        if (section === 'none' || !section) {
+            return;
+        }
+        const leftId = this.leftSectionId();
+        const rightId = this.rightSectionId();
+        let direction;
+        if (section === leftId) {
+            direction = 'prev';
+        }
+        else if (section === rightId) {
+            direction = 'next';
+        }
+        else {
+            return;
+        }
+        this.sectionChange.emit({ direction, sectionId: section });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: NeighborsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.4", type: NeighborsComponent, isStandalone: true, selector: "sdc-neighbors", inputs: { neighborsData: { classPropertyName: "neighborsData", publicName: "neighborsData", isSignal: true, isRequired: true, transformFunction: null }, currentSectionId: { classPropertyName: "currentSectionId", publicName: "currentSectionId", isSignal: true, isRequired: true, transformFunction: null }, translateTdcToMmc: { classPropertyName: "translateTdcToMmc", publicName: "translateTdcToMmc", isSignal: true, isRequired: true, transformFunction: null }, translateMmcToTdc: { classPropertyName: "translateMmcToTdc", publicName: "translateMmcToTdc", isSignal: true, isRequired: true, transformFunction: null }, hasAvailability: { classPropertyName: "hasAvailability", publicName: "hasAvailability", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, showElement: { classPropertyName: "showElement", publicName: "showElement", isSignal: true, isRequired: false, transformFunction: null }, modeLr: { classPropertyName: "modeLr", publicName: "modeLr", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sectionChange: "sectionChange" }, viewQueries: [{ propertyName: "neighborsContainer", first: true, predicate: ["neighborsContainer"], descendants: true }, { propertyName: "currentSection", first: true, predicate: ["currentSection"], descendants: true }, { propertyName: "currentSection3d", first: true, predicate: ["currentSection3d"], descendants: true }, { propertyName: "leftSectionElement", first: true, predicate: ["leftSectionNumber"], descendants: true }, { propertyName: "rightSectionElement", first: true, predicate: ["rightSectionNumber"], descendants: true }], ngImport: i0, template: "<div #neighborsContainer class=\"neighbors-container\" [class]=\"computedClass()\" [class.hidden]=\"!showElement()\">\n  <!-- LEFT SECTION BUTTON -->\n  @if (leftSection) {\n    <div\n      class=\"neighbor-button-left neighbor-button\"\n      tabindex=\"0\"\n      (click)=\"navigateToSection(leftSection!)\"\n      (keypress.enter)=\"navigateToSection(leftSection!)\">\n      <i class=\"neighbor-button-icon\">\n        <svg fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M15.75 19.5 8.25 12l7.5-7.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        </svg>\n      </i>\n    </div>\n  }\n  <div class=\"current-section-wrapper\">\n    @if (isLoading()) {\n      <p class=\"current-section-loading\">\n        <span>Loading</span>\n      </p>\n    } @else {\n      @if (section) {\n        <h3 class=\"current-section-text\">\n          <span class=\"prefix\">Section </span>\n          <span #currentSection class=\"section-number\">{{ section }}</span>\n        </h3>\n      }\n    }\n  </div>\n\n  <!-- RIGHT SECTION BUTTON -->\n  @if (rightSection) {\n    <div\n      class=\"neighbor-button-right neighbor-button\"\n      tabindex=\"1\"\n      (click)=\"navigateToSection(rightSection!)\"\n      (keypress.enter)=\"navigateToSection(rightSection!)\">\n      <i class=\"neighbor-button-icon\">\n        <svg fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"m8.25 4.5 7.5 7.5-7.5 7.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        </svg>\n      </i>\n    </div>\n  }\n</div>\n", styles: [".sdc-neighbors{--sdc-neighbors-background-color: transparent;--sdc-neighbors-text-color: var(--color-pure-black);--sdc-neighbors-border-radius: 1rem;--sdc-neighbors-padding-x: var(--space-3);--sdc-neighbors-padding-y: var(--space-2_5);--sdc-neighbors-height: var(--space-6);--sdc-neighbors-max-width: 25rem;--sdc-neighbors-button-width: 8rem;--sdc-neighbors-button-height: var(--space-6);--sdc-neighbors-button-icon-color: var(--color-pure-black);--sdc-neighbors-button-hover-background-color: #f5f5f5;--sdc-neighbors-button-text-font-weight: var(--font-medium);--sdc-neighbors-button-text-font-size: var(--text-sm);--sdc-neighbors-button-text-transform: none;--sdc-neighbors-prefix-opacity: 1;--sdc-neighbors-current-section-min-width: 6rem;--sdc-neighbors-current-section-loading-font-weight: var(--font-semibold);--sdc-neighbors-current-section-loading-font-size: var(--text-sm);--sdc-neighbors-current-section-text-font-weight: var(--font-semibold);--sdc-neighbors-current-section-text-font-size: var(--text-sm);--sdc-neighbors-current-section-text-transform: none}.neighbors-container{position:relative;display:flex;justify-content:center;align-items:center;background-color:var(--sdc-neighbors-background-color);margin-left:auto;margin-right:auto;padding-left:var(--sdc-neighbors-padding-x);padding-right:var(--sdc-neighbors-padding-x);padding-top:var(--sdc-neighbors-padding-y);padding-bottom:var(--sdc-neighbors-padding-y);border-radius:var(--sdc-neighbors-border-radius);height:var(--sdc-neighbors-height);max-width:var(--sdc-neighbors-max-width);pointer-events:auto}@media(min-width:640px){.neighbors-container{--sdc-neighbors-height: var(--space-8)}}.neighbor-button{position:relative;display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;background-color:#fff;border-radius:50%;transition-property:opacity,background-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;cursor:pointer;box-shadow:0 1px 3px #0000001a}@media(min-width:640px){.neighbor-button{width:3rem;height:3rem}}.neighbor-button-left{margin-right:.75rem}.neighbor-button-right{margin-left:.75rem}.neighbor-button:hover{background-color:var(--sdc-neighbors-button-hover-background-color)}.neighbor-button-icon{display:flex;align-items:center;justify-content:center;color:var(--sdc-neighbors-button-icon-color)}.neighbor-button-icon svg{width:1rem;height:1rem}.current-section-text .section-number{font-weight:var(--font-bold);white-space:nowrap}.current-section-wrapper{display:flex;justify-content:center;align-items:center;margin-left:auto;margin-right:auto;min-width:var(--sdc-neighbors-current-section-min-width);background-color:#fff;border-radius:var(--sdc-neighbors-border-radius);padding:.75rem 1rem;cursor:default;box-shadow:0 1px 3px #0000001a}@media(min-width:640px){.current-section-wrapper{--sdc-neighbors-current-section-min-width: 14rem}}.current-section-loading{font-weight:var(--sdc-neighbors-current-section-loading-font-weight);color:var(--sdc-neighbors-text-color);font-size:var(--sdc-neighbors-current-section-loading-font-size)}.current-section-text{display:flex;font-weight:var(--sdc-neighbors-current-section-text-font-weight);color:var(--sdc-neighbors-text-color);font-size:var(--sdc-neighbors-current-section-text-font-size);text-transform:var(--sdc-neighbors-current-section-text-transform)}.current-section-text .prefix{opacity:var(--sdc-neighbors-prefix-opacity);margin-right:.35rem}.current-section-text .sm-prefix{display:none}@media(min-width:640px){.current-section-text .sm-prefix{display:block}}.current-section-text .xs-prefix{display:block}@media(min-width:640px){.current-section-text .xs-prefix{display:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: NeighborsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sdc-neighbors', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #neighborsContainer class=\"neighbors-container\" [class]=\"computedClass()\" [class.hidden]=\"!showElement()\">\n  <!-- LEFT SECTION BUTTON -->\n  @if (leftSection) {\n    <div\n      class=\"neighbor-button-left neighbor-button\"\n      tabindex=\"0\"\n      (click)=\"navigateToSection(leftSection!)\"\n      (keypress.enter)=\"navigateToSection(leftSection!)\">\n      <i class=\"neighbor-button-icon\">\n        <svg fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M15.75 19.5 8.25 12l7.5-7.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        </svg>\n      </i>\n    </div>\n  }\n  <div class=\"current-section-wrapper\">\n    @if (isLoading()) {\n      <p class=\"current-section-loading\">\n        <span>Loading</span>\n      </p>\n    } @else {\n      @if (section) {\n        <h3 class=\"current-section-text\">\n          <span class=\"prefix\">Section </span>\n          <span #currentSection class=\"section-number\">{{ section }}</span>\n        </h3>\n      }\n    }\n  </div>\n\n  <!-- RIGHT SECTION BUTTON -->\n  @if (rightSection) {\n    <div\n      class=\"neighbor-button-right neighbor-button\"\n      tabindex=\"1\"\n      (click)=\"navigateToSection(rightSection!)\"\n      (keypress.enter)=\"navigateToSection(rightSection!)\">\n      <i class=\"neighbor-button-icon\">\n        <svg fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"m8.25 4.5 7.5 7.5-7.5 7.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        </svg>\n      </i>\n    </div>\n  }\n</div>\n", styles: [".sdc-neighbors{--sdc-neighbors-background-color: transparent;--sdc-neighbors-text-color: var(--color-pure-black);--sdc-neighbors-border-radius: 1rem;--sdc-neighbors-padding-x: var(--space-3);--sdc-neighbors-padding-y: var(--space-2_5);--sdc-neighbors-height: var(--space-6);--sdc-neighbors-max-width: 25rem;--sdc-neighbors-button-width: 8rem;--sdc-neighbors-button-height: var(--space-6);--sdc-neighbors-button-icon-color: var(--color-pure-black);--sdc-neighbors-button-hover-background-color: #f5f5f5;--sdc-neighbors-button-text-font-weight: var(--font-medium);--sdc-neighbors-button-text-font-size: var(--text-sm);--sdc-neighbors-button-text-transform: none;--sdc-neighbors-prefix-opacity: 1;--sdc-neighbors-current-section-min-width: 6rem;--sdc-neighbors-current-section-loading-font-weight: var(--font-semibold);--sdc-neighbors-current-section-loading-font-size: var(--text-sm);--sdc-neighbors-current-section-text-font-weight: var(--font-semibold);--sdc-neighbors-current-section-text-font-size: var(--text-sm);--sdc-neighbors-current-section-text-transform: none}.neighbors-container{position:relative;display:flex;justify-content:center;align-items:center;background-color:var(--sdc-neighbors-background-color);margin-left:auto;margin-right:auto;padding-left:var(--sdc-neighbors-padding-x);padding-right:var(--sdc-neighbors-padding-x);padding-top:var(--sdc-neighbors-padding-y);padding-bottom:var(--sdc-neighbors-padding-y);border-radius:var(--sdc-neighbors-border-radius);height:var(--sdc-neighbors-height);max-width:var(--sdc-neighbors-max-width);pointer-events:auto}@media(min-width:640px){.neighbors-container{--sdc-neighbors-height: var(--space-8)}}.neighbor-button{position:relative;display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;background-color:#fff;border-radius:50%;transition-property:opacity,background-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;cursor:pointer;box-shadow:0 1px 3px #0000001a}@media(min-width:640px){.neighbor-button{width:3rem;height:3rem}}.neighbor-button-left{margin-right:.75rem}.neighbor-button-right{margin-left:.75rem}.neighbor-button:hover{background-color:var(--sdc-neighbors-button-hover-background-color)}.neighbor-button-icon{display:flex;align-items:center;justify-content:center;color:var(--sdc-neighbors-button-icon-color)}.neighbor-button-icon svg{width:1rem;height:1rem}.current-section-text .section-number{font-weight:var(--font-bold);white-space:nowrap}.current-section-wrapper{display:flex;justify-content:center;align-items:center;margin-left:auto;margin-right:auto;min-width:var(--sdc-neighbors-current-section-min-width);background-color:#fff;border-radius:var(--sdc-neighbors-border-radius);padding:.75rem 1rem;cursor:default;box-shadow:0 1px 3px #0000001a}@media(min-width:640px){.current-section-wrapper{--sdc-neighbors-current-section-min-width: 14rem}}.current-section-loading{font-weight:var(--sdc-neighbors-current-section-loading-font-weight);color:var(--sdc-neighbors-text-color);font-size:var(--sdc-neighbors-current-section-loading-font-size)}.current-section-text{display:flex;font-weight:var(--sdc-neighbors-current-section-text-font-weight);color:var(--sdc-neighbors-text-color);font-size:var(--sdc-neighbors-current-section-text-font-size);text-transform:var(--sdc-neighbors-current-section-text-transform)}.current-section-text .prefix{opacity:var(--sdc-neighbors-prefix-opacity);margin-right:.35rem}.current-section-text .sm-prefix{display:none}@media(min-width:640px){.current-section-text .sm-prefix{display:block}}.current-section-text .xs-prefix{display:block}@media(min-width:640px){.current-section-text .xs-prefix{display:none}}\n"] }]
+        }], propDecorators: { neighborsContainer: [{
+                type: ViewChild,
+                args: ['neighborsContainer']
+            }], currentSection: [{
+                type: ViewChild,
+                args: ['currentSection', { static: false }]
+            }], currentSection3d: [{
+                type: ViewChild,
+                args: ['currentSection3d', { static: false }]
+            }], leftSectionElement: [{
+                type: ViewChild,
+                args: ['leftSectionNumber', { static: false }]
+            }], rightSectionElement: [{
+                type: ViewChild,
+                args: ['rightSectionNumber', { static: false }]
+            }], neighborsData: [{ type: i0.Input, args: [{ isSignal: true, alias: "neighborsData", required: true }] }], currentSectionId: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentSectionId", required: true }] }], translateTdcToMmc: [{ type: i0.Input, args: [{ isSignal: true, alias: "translateTdcToMmc", required: true }] }], translateMmcToTdc: [{ type: i0.Input, args: [{ isSignal: true, alias: "translateMmcToTdc", required: true }] }], hasAvailability: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasAvailability", required: true }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], showElement: [{ type: i0.Input, args: [{ isSignal: true, alias: "showElement", required: false }] }], modeLr: [{ type: i0.Input, args: [{ isSignal: true, alias: "modeLr", required: false }] }], className: [{ type: i0.Input, args: [{ isSignal: true, alias: "className", required: false }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], sectionChange: [{
+                type: Output
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { NeighborsComponent };
+//# sourceMappingURL=3ddv-software-division-components-dvm-neighbors.mjs.map

package/dist/fesm2022/3ddv-software-division-components-dvm-neighbors.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"3ddv-software-division-components-dvm-neighbors.mjs","sources":["../../dvm/neighbors/neighbors.component.ts","../../dvm/neighbors/neighbors.component.html","../../dvm/neighbors/3ddv-software-division-components-dvm-neighbors.ts"],"sourcesContent":["import { ThemeClass } from '@3ddv/software-division-components/shared';\r\nimport {\r\n  ChangeDetectionStrategy,\r\n  ChangeDetectorRef,\r\n  Component,\r\n  computed,\r\n  ElementRef,\r\n  EventEmitter,\r\n  inject,\r\n  input,\r\n  OnDestroy,\r\n  Output,\r\n  ViewChild,\r\n} from '@angular/core';\r\nimport { Subscription } from 'rxjs';\r\nimport { Direction, HasAvailabilityFn, NeighborsData, SectionChangeEvent, TranslateSectionIdFn } from './types';\r\n\r\n@Component({\r\n  selector: 'sdc-neighbors',\r\n  standalone: true,\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  templateUrl: './neighbors.component.html',\r\n  styleUrl: './neighbors.component.css',\r\n})\r\nexport class NeighborsComponent implements OnDestroy {\r\n  // VIEWCHILD\r\n  @ViewChild('neighborsContainer')\r\n  public readonly neighborsContainer!: ElementRef<HTMLDivElement>;\r\n\r\n  @ViewChild('currentSection', { static: false })\r\n  public readonly currentSection!: ElementRef<HTMLSpanElement>;\r\n\r\n  @ViewChild('currentSection3d', { static: false })\r\n  public readonly currentSection3d!: ElementRef<HTMLSpanElement>;\r\n\r\n  @ViewChild('leftSectionNumber', { static: false })\r\n  public readonly leftSectionElement!: ElementRef<HTMLSpanElement>;\r\n\r\n  @ViewChild('rightSectionNumber', { static: false })\r\n  public readonly rightSectionElement!: ElementRef<HTMLSpanElement>;\r\n\r\n  // SERVICES\r\n  private readonly cdr: ChangeDetectorRef = inject(ChangeDetectorRef);\r\n\r\n  // REQUIRED INPUTS\r\n  public readonly neighborsData = input.required<NeighborsData>();\r\n  public readonly currentSectionId = input.required<string | null>();\r\n  public readonly translateTdcToMmc = input.required<TranslateSectionIdFn>();\r\n  public readonly translateMmcToTdc = input.required<TranslateSectionIdFn>();\r\n  public readonly hasAvailability = input.required<HasAvailabilityFn>();\r\n\r\n  // OPTIONAL INPUTS\r\n  public readonly isLoading = input<boolean>(false);\r\n  public readonly showElement = input<boolean>(true);\r\n  public readonly modeLr = input<boolean>(false);\r\n  public readonly className = input<string>('');\r\n  public readonly theme = input<ThemeClass>('theme-sdc');\r\n\r\n  // OUTPUTS\r\n  @Output() sectionChange = new EventEmitter<SectionChangeEvent>();\r\n\r\n  /**\r\n   * Computed class string that combines theme and user classes.\r\n   */\r\n  protected readonly computedClass = computed(() => {\r\n    const themeClass = this.theme();\r\n    const className = this.className();\r\n    return Array.from(new Set(['sdc-neighbors', themeClass, className]))\r\n      .filter(Boolean)\r\n      .join(' ');\r\n  });\r\n\r\n  // COMPONENT STATE\r\n  private readonly subscriptions: Subscription[] = [];\r\n\r\n  // COMPUTED STATE\r\n  protected readonly leftSectionId = computed(() => {\r\n    try {\r\n      const currentId = this.currentSectionId();\r\n      if (!currentId) return null;\r\n      return this.findAvailableNeighbor('prev', currentId);\r\n    } catch (error) {\r\n      return null;\r\n    }\r\n  });\r\n\r\n  protected readonly rightSectionId = computed(() => {\r\n    try {\r\n      const currentId = this.currentSectionId();\r\n      if (!currentId) return null;\r\n      return this.findAvailableNeighbor('next', currentId);\r\n    } catch (error) {\r\n      return null;\r\n    }\r\n  });\r\n\r\n  protected readonly currentSectionLabel = computed(() => {\r\n    try {\r\n      const currentId = this.currentSectionId();\r\n      if (!currentId) return 'Loading';\r\n\r\n      // Translate TDC ID to MMC ID for display\r\n      const mmcId = this.translateTdcToMmc()(currentId);\r\n      if (!mmcId) return currentId; // Fallback to TDC ID if translation fails\r\n\r\n      // Extract section number from MMC ID (assuming format like \"S_31\" or similar)\r\n      return mmcId.replace(/^S_/, '');\r\n    } catch (error) {\r\n      return 'Loading';\r\n    }\r\n  });\r\n\r\n  protected readonly leftSectionLabel = computed(() => {\r\n    try {\r\n      const leftId = this.leftSectionId();\r\n      if (!leftId) return null;\r\n\r\n      // Translate TDC ID to MMC ID for display\r\n      const mmcId = this.translateTdcToMmc()(leftId);\r\n      if (!mmcId) return leftId; // Fallback to TDC ID if translation fails\r\n\r\n      // Extract section number from MMC ID\r\n      return mmcId.replace(/^S_/, '');\r\n    } catch (error) {\r\n      return null;\r\n    }\r\n  });\r\n\r\n  protected readonly rightSectionLabel = computed(() => {\r\n    try {\r\n      const rightId = this.rightSectionId();\r\n      if (!rightId) return null;\r\n\r\n      // Translate TDC ID to MMC ID for display\r\n      const mmcId = this.translateTdcToMmc()(rightId);\r\n      if (!mmcId) return rightId; // Fallback to TDC ID if translation fails\r\n\r\n      // Extract section number from MMC ID\r\n      return mmcId.replace(/^S_/, '');\r\n    } catch (error) {\r\n      return null;\r\n    }\r\n  });\r\n\r\n  // NEIGHBOR RESOLUTION ALGORITHM\r\n  private findAvailableNeighbor(type: Direction, currentSectionTdcId: string): string | null {\r\n    try {\r\n      const neighborKey = type === 'prev' ? 'l' : 'r';\r\n      const noNeighborValue = 'none';\r\n\r\n      // 1. Translate TDC → MMC\r\n      const currentSectionMmcId = this.translateTdcToMmc()(currentSectionTdcId);\r\n      if (!currentSectionMmcId) return null;\r\n\r\n      // 2. Look up neighbor in data\r\n      const neighbors = this.neighborsData();\r\n      const neighbor = neighbors[currentSectionMmcId];\r\n      const neighborSectionMmcId = neighbor ? neighbor[neighborKey] : noNeighborValue;\r\n\r\n      // 3. Handle 'none' boundary\r\n      if (neighborSectionMmcId === noNeighborValue) {\r\n        return null;\r\n      }\r\n\r\n      // 4. Translate MMC → TDC\r\n      const neighborSectionTdcId = this.translateMmcToTdc()(neighborSectionMmcId);\r\n      if (!neighborSectionTdcId) return null;\r\n\r\n      // 5. Check availability\r\n      if (this.hasAvailability()(neighborSectionTdcId)) {\r\n        return neighborSectionTdcId;\r\n      }\r\n\r\n      // 6. Recursively find next available (skip unavailable sections)\r\n      return this.findAvailableNeighbor(type, neighborSectionTdcId);\r\n    } catch (error) {\r\n      return null;\r\n    }\r\n  }\r\n\r\n  // GETTERS\r\n  public get leftSection(): string | null {\r\n    return this.leftSectionId();\r\n  }\r\n\r\n  public get rightSection(): string | null {\r\n    return this.rightSectionId();\r\n  }\r\n\r\n  public get section(): string | null {\r\n    return this.currentSectionLabel();\r\n  }\r\n\r\n  ngOnDestroy(): void {\r\n    this.subscriptions.forEach((sub: Subscription): void => sub.unsubscribe());\r\n  }\r\n\r\n  // METHODS\r\n  public navigateToSection(section: string): void {\r\n    if (section === 'none' || !section) {\r\n      return;\r\n    }\r\n\r\n    const leftId = this.leftSectionId();\r\n    const rightId = this.rightSectionId();\r\n\r\n    let direction: Direction;\r\n    if (section === leftId) {\r\n      direction = 'prev';\r\n    } else if (section === rightId) {\r\n      direction = 'next';\r\n    } else {\r\n      return;\r\n    }\r\n\r\n    this.sectionChange.emit({ direction, sectionId: section });\r\n  }\r\n}\r\n","<div #neighborsContainer class=\"neighbors-container\" [class]=\"computedClass()\" [class.hidden]=\"!showElement()\">\n  <!-- LEFT SECTION BUTTON -->\n  @if (leftSection) {\n    <div\n      class=\"neighbor-button-left neighbor-button\"\n      tabindex=\"0\"\n      (click)=\"navigateToSection(leftSection!)\"\n      (keypress.enter)=\"navigateToSection(leftSection!)\">\n      <i class=\"neighbor-button-icon\">\n        <svg fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M15.75 19.5 8.25 12l7.5-7.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        </svg>\n      </i>\n    </div>\n  }\n  <div class=\"current-section-wrapper\">\n    @if (isLoading()) {\n      <p class=\"current-section-loading\">\n        <span>Loading</span>\n      </p>\n    } @else {\n      @if (section) {\n        <h3 class=\"current-section-text\">\n          <span class=\"prefix\">Section </span>\n          <span #currentSection class=\"section-number\">{{ section }}</span>\n        </h3>\n      }\n    }\n  </div>\n\n  <!-- RIGHT SECTION BUTTON -->\n  @if (rightSection) {\n    <div\n      class=\"neighbor-button-right neighbor-button\"\n      tabindex=\"1\"\n      (click)=\"navigateToSection(rightSection!)\"\n      (keypress.enter)=\"navigateToSection(rightSection!)\">\n      <i class=\"neighbor-button-icon\">\n        <svg fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"m8.25 4.5 7.5 7.5-7.5 7.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n        </svg>\n      </i>\n    </div>\n  }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}