@eui/showcase 21.0.0-next.2 → 21.0.0-next.4

package/fesm2022/eui-showcase.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { signal, Injectable, Input, Component, inject, HostBinding, ViewEncapsulation, ChangeDetectorRef, booleanAttribute, ViewChild, forwardRef, ContentChildren, Directive, HostListener, ContentChild, ElementRef } from '@angular/core';
+import { signal, Injectable, Input, Component, inject, ChangeDetectorRef, HostBinding, ViewEncapsulation, booleanAttribute, ViewChild, forwardRef, ContentChildren, Directive, HostListener, ContentChild, ElementRef } from '@angular/core';
 import * as i2 from '@eui/components/eui-icon';
 import { EUI_ICON } from '@eui/components/eui-icon';
 import * as i2$1 from '@eui/components/eui-button';
@@ -119,6 +119,7 @@ class DocPageDevGuideComponent {
         this.http = inject(HttpClient);
         this.router = inject(Router);
         this.route = inject(ActivatedRoute);
+        this.cdRef = inject((ChangeDetectorRef));
     }
     ngOnInit() {
         this.subscription = this.route.url.subscribe((u) => {
@@ -142,6 +143,24 @@ class DocPageDevGuideComponent {
         //     }
         //     return `<h${depth}>${text}</h${depth}>`;
         // };
+        this.markdownService.renderer.heading = (text, level, raw) => {
+            if (level === 2 || level === 3) {
+                const newHeader = `<h${level} id="${raw}">${text}</h${level}>`;
+                if (text.indexOf('<a ') === -1 && text.indexOf('<em>') === -1) {
+                    this.headers.push({ id: raw, label: raw, level: level });
+                }
+                return newHeader;
+            }
+            return `<h${level}>${text}</h${level}>`;
+        };
+        // this.markdownService.renderer.heading = ({ text, level, raw }: Tokens.Heading) => {
+        //     const escapedText = text.toLowerCase().replace(/[^\w]+/g, '-');
+        //     return '<h' + level + '>' +
+        //             '<a name="' + escapedText + '" class="anchor" href="#' + escapedText + '">' +
+        //                 '<span class="header-link"></span>' +
+        //             '</a>' + text +
+        //             '</h' + level + '>';
+        //     };        
     }
     ngAfterViewInit() {
         this.route.fragment.pipe(take(1)).subscribe((fragment) => {
@@ -180,6 +199,7 @@ class DocPageDevGuideComponent {
         const filePath = `${contextRoot}/assets/${mdPath}.md`;
         this.http.get(filePath, { responseType: 'text' }).pipe(map((md) => md.replace(new RegExp(`assets/${this.rootDocsFolder}`, 'g'), `${contextRoot}/assets/${this.rootDocsFolder}`))).subscribe((md) => {
             this.markdown = md;
+            this.cdRef.detectChanges();
             const top = document.getElementById('top');
             top.scrollIntoView();
         });