@koobiq/components 20.4.1 → 21.0.0

package/fesm2022/koobiq-components-markdown.mjs

@@ -1,10 +1,13 @@
-import { FocusMonitor } from '@angular/cdk/a11y';
+import { ContentObserver } from '@angular/cdk/observers';
 import * as i0 from '@angular/core';
-import { Injectable, InjectionToken, inject, viewChild, signal, afterNextRender, effect, Input, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
+import { Injectable, InjectionToken, inject, DestroyRef, viewChild, signal, input, computed, afterNextRender, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { DomSanitizer } from '@angular/platform-browser';
+import * as i1 from '@koobiq/components/scrollbar';
+import { kbqNativeScrollbarOptionsProvider, KbqNativeScrollbar } from '@koobiq/components/scrollbar';
 import { marked } from 'marked';
 
-/** @docs-private */
+/** @internal */
 const MARKDOWN_TAGS_TO_CLASS_ALIAS = [
     'a',
     'blockquote',
@@ -28,9 +31,9 @@ const MARKDOWN_TAGS_TO_CLASS_ALIAS = [
     'img'
 ];
 /**
- * separating `th` and `p` to prevent it's conflict with `thead` and `pre`
+ * separating `th` and `p` to prevent its conflict with `thead` and `pre`
  *
- * @docs-private
+ * @internal
  */
 const MARKDOWN_WHOLE_TAGS_TO_CLASS_ALIAS = [
     'th',
@@ -59,12 +62,9 @@ class KbqMarkdownService {
     transform(htmlContent) {
         let transformed = htmlContent;
         MARKDOWN_TAGS_TO_CLASS_ALIAS.forEach((tag) => {
-            transformed = transformed.replace(new RegExp(`<${tag}`, 'g'), (_match) => {
-                if (tag === 'a') {
-                    return `<${tag} class="${CLASS_PREFIX}__${tag} kbq-link kbq-text-only kbq-link_use-visited"`;
-                }
-                return `<${tag} class="${CLASS_PREFIX}__${tag}"`;
-            });
+            transformed = transformed.replace(
+            // The whole tag name: `<a` must not take `<abbr>` or `<aside>` for a link
+            new RegExp(`<${tag}(?=[\\s/>])`, 'g'), () => `<${tag} class="${CLASS_PREFIX}__${tag}"`);
         });
         MARKDOWN_WHOLE_TAGS_TO_CLASS_ALIAS.forEach((tag) => {
             transformed = transformed.replace(
@@ -74,11 +74,12 @@ class KbqMarkdownService {
         });
         return transformed;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqMarkdownService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqMarkdownService }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqMarkdownService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqMarkdownService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqMarkdownService, decorators: [{
-            type: Injectable
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqMarkdownService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
         }] });
 
 /** List of options for `marked` library. */
@@ -90,95 +91,71 @@ const kbqMarkdownMarkedOptionsProvider = (options) => ({
 });
 /** Component which allows to convert `Markdown` into `HTML` */
 class KbqMarkdown {
-    /** `Markdown` text. */
-    // TODO: Skipped for migration because:
-    //  Accessor inputs cannot be migrated as they are too complex.
-    get markdownText() {
-        return this._markdownText;
-    }
-    set markdownText(value) {
-        if (value && this.markdownText !== value) {
-            this.resultHtml.set(this.getResultHTML(value));
-        }
-        this._markdownText = value;
-    }
     constructor() {
         this.markdownService = inject(KbqMarkdownService);
         this.sanitizer = inject(DomSanitizer);
         this.markedOptions = inject(KBQ_MARKDOWN_MARKED_OPTIONS, { optional: true }) ?? undefined;
+        this.contentObserver = inject(ContentObserver);
+        this.destroyRef = inject(DestroyRef);
         this.contentWrapper = viewChild.required('contentWrapper');
-        this.outputWrapper = viewChild.required('outputWrapper');
-        this.resultHtml = signal(null, ...(ngDevMode ? [{ debugName: "resultHtml" }] : []));
-        this._markdownText = null;
-        this.focusMonitor = inject(FocusMonitor);
-        this.links = [];
+        /** Text content projected into the component, re-read after every render that changes it. */
+        this.projectedText = signal(null, ...(ngDevMode ? [{ debugName: "projectedText" }] : /* istanbul ignore next */ []));
+        /** `Markdown` text. Falls back to the projected content while it is empty. */
+        this.markdownText = input(null, ...(ngDevMode ? [{ debugName: "markdownText" }] : /* istanbul ignore next */ []));
+        /** @docs-private */
+        this.resultHtml = computed(() => {
+            const markdown = this.markdownText() || this.projectedText();
+            return markdown ? this.getResultHTML(markdown) : null;
+        }, ...(ngDevMode ? [{ debugName: "resultHtml" }] : /* istanbul ignore next */ []));
         afterNextRender(() => {
-            const contentWrapper = this.contentWrapper();
-            if (!this.markdownText && contentWrapper?.nativeElement.textContent) {
-                this.resultHtml.set(this.getResultHTML(contentWrapper?.nativeElement.textContent));
-            }
-        });
-        effect(() => {
-            if (this.resultHtml()) {
-                Promise.resolve().then(() => this.startMonitoringLinks());
-            }
-            else {
-                this.stopMonitoringLinks();
-            }
+            const host = this.contentWrapper().nativeElement;
+            this.readProjectedText(host);
+            // The projected content is a standing fallback, not a one-off snapshot: a `@if` that has not
+            // resolved by the first render would otherwise freeze it at '' for the life of the component.
+            this.contentObserver
+                .observe(host)
+                .pipe(takeUntilDestroyed(this.destroyRef))
+                .subscribe(() => this.readProjectedText(host));
         });
     }
-    ngOnDestroy() {
-        this.stopMonitoringLinks();
+    /** The content observer fires on any mutation, so only a real text change is worth a re-render. */
+    readProjectedText(host) {
+        const text = host.textContent;
+        if (text !== this.projectedText()) {
+            this.projectedText.set(text);
+        }
     }
     getResultHTML(markdown) {
         return this.sanitizer.bypassSecurityTrustHtml(this.markdownService.parseToHtml(markdown, this.markedOptions));
     }
-    startMonitoringLinks() {
-        this.stopMonitoringLinks();
-        this.outputWrapper()
-            .nativeElement.querySelectorAll('.kbq-markdown__a')
-            .forEach((link) => {
-            this.links.push(link);
-            this.focusMonitor.monitor(link, true);
-        });
-    }
-    stopMonitoringLinks() {
-        this.links.forEach((link) => this.focusMonitor.stopMonitoring(link));
-        this.links.length = 0;
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqMarkdown, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.30", type: KbqMarkdown, isStandalone: true, selector: "kbq-markdown", inputs: { markdownText: "markdownText" }, host: { classAttribute: "kbq-markdown kbq-scrollbar" }, viewQueries: [{ propertyName: "contentWrapper", first: true, predicate: ["contentWrapper"], descendants: true, isSignal: true }, { propertyName: "outputWrapper", first: true, predicate: ["outputWrapper"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqMarkdown, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.25", type: KbqMarkdown, isStandalone: true, selector: "kbq-markdown", inputs: { markdownText: { classPropertyName: "markdownText", publicName: "markdownText", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "kbq-markdown" }, providers: [kbqNativeScrollbarOptionsProvider({ descendants: true })], viewQueries: [{ propertyName: "contentWrapper", first: true, predicate: ["contentWrapper"], descendants: true, isSignal: true }], hostDirectives: [{ directive: i1.KbqNativeScrollbar }], ngImport: i0, template: `
         <pre #contentWrapper class="kbq-markdown__input" ngPreserveWhitespaces><ng-content /></pre>
-        <div #outputWrapper class="kbq-markdown__output" [innerHtml]="resultHtml()"></div>
-    `, isInline: true, styles: ["@charset \"UTF-8\";.kbq-markdown{display:block}.kbq-markdown .kbq-markdown__input{display:none}.kbq-markdown .kbq-markdown__output{flex:1}.kbq-markdown .kbq-markdown__output>:first-child{margin-top:0}.kbq-markdown .kbq-markdown__output>:last-child{margin-bottom:0}.kbq-markdown .kbq-markdown__h1{margin-top:var(--kbq-markdown-h1-size-margin-top);margin-bottom:var(--kbq-markdown-h1-size-margin-bottom)}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h2{margin-top:var(--kbq-markdown-h2-size-margin-top);margin-bottom:var(--kbq-markdown-h2-size-margin-bottom)}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h3{margin-top:var(--kbq-markdown-h3-size-margin-top);margin-bottom:var(--kbq-markdown-h3-size-margin-bottom)}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h4{margin-top:var(--kbq-markdown-h4-size-margin-top);margin-bottom:var(--kbq-markdown-h4-size-margin-bottom)}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h5{margin-top:var(--kbq-markdown-h5-size-margin-top);margin-bottom:var(--kbq-markdown-h5-size-margin-bottom)}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h6{margin-top:var(--kbq-markdown-h6-size-margin-top);margin-bottom:var(--kbq-markdown-h6-size-margin-bottom)}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__p{margin-top:var(--kbq-markdown-p-size-margin-top);margin-bottom:var(--kbq-markdown-p-size-margin-bottom)}.kbq-markdown .kbq-markdown__ul,.kbq-markdown .kbq-markdown__ol{margin-top:var(--kbq-markdown-list-size-margin-top);margin-bottom:var(--kbq-markdown-list-size-margin-bottom)}.kbq-markdown .kbq-markdown__ul>li,.kbq-markdown .kbq-markdown__ol>li{margin-bottom:var(--kbq-markdown-list-size-item-margin-bottom)}.kbq-markdown .kbq-markdown__ul{position:relative;list-style:none;padding:var(--kbq-markdown-list-size-ul-padding)}.kbq-markdown .kbq-markdown__ul>li:before{content:\"\\2014\";display:block;position:absolute;width:24px;text-align:left;left:0}.kbq-markdown .kbq-markdown__ol{list-style:none;padding:0;counter-reset:li}.kbq-markdown .kbq-markdown__ol>li:before{content:counter(li) \".\";counter-increment:li;padding-right:var(--kbq-markdown-list-size-ol-number-padding-right)}.kbq-markdown .kbq-markdown__ol>li>*{display:inline-block}.kbq-markdown .kbq-markdown__p+.kbq-markdown__ul,.kbq-markdown .kbq-markdown__p+.kbq-markdown__ol{margin-top:var(--kbq-markdown-list-size-margin-top-after-paragraph)}.kbq-markdown .kbq-markdown__blockquote{margin-top:var(--kbq-markdown-blockquote-size-margin-top);margin-left:0;margin-bottom:var(--kbq-markdown-blockquote-size-margin-bottom);margin-right:0;border-left-width:var(--kbq-markdown-blockquote-size-line-width);border-left-style:solid;padding:var(--kbq-markdown-blockquote-size-padding)}.kbq-markdown .kbq-markdown__blockquote>.kbq-markdown__p{margin-top:0;margin-bottom:0}.kbq-markdown .kbq-markdown__pre{position:relative;overflow-x:auto;margin-top:var(--kbq-markdown-code-size-multiline-margin-top);margin-bottom:var(--kbq-markdown-code-size-multiline-margin-bottom);padding:var(--kbq-markdown-code-size-multiline-padding)}.kbq-markdown .kbq-markdown__pre,.kbq-markdown .kbq-markdown__code{border-radius:var(--kbq-markdown-code-size-border-radius)}.kbq-markdown .kbq-markdown__code:not(.kbq-markdown__pre>.kbq-markdown__code){white-space:nowrap;padding:var(--kbq-markdown-code-size-inline-padding)}.kbq-markdown .kbq-markdown__img{max-width:100%;margin-top:var(--kbq-markdown-image-size-margin-top);margin-bottom:var(--kbq-markdown-image-size-margin-bottom)}.kbq-markdown .kbq-markdown__img+em{display:block;margin-top:var(--kbq-markdown-image-size-caption-margin-top);margin-bottom:var(--kbq-markdown-image-size-caption-margin-bottom)}.kbq-markdown .kbq-markdown__hr{border-top:none;border-left:none;border-right:none;border-bottom-style:solid;border-bottom-width:var(--kbq-markdown-hr-size-width);margin:var(--kbq-markdown-hr-size-margin-vertical) 0}.kbq-markdown .kbq-markdown__table{max-width:100%;overflow-x:auto;display:table;border-collapse:collapse;margin-bottom:var(--kbq-markdown-table-size-margin-bottom)}.kbq-markdown .kbq-markdown__table td{vertical-align:top}.kbq-markdown .kbq-markdown__table th,.kbq-markdown .kbq-markdown__table td{padding:var(--kbq-markdown-table-size-padding);font-weight:400}.kbq-markdown .kbq-markdown__table>.kbq-markdown__thead{border-bottom-style:solid;border-bottom-width:var(--kbq-markdown-table-size-border-width);text-align:left}.kbq-markdown .kbq-markdown__table>.kbq-markdown__thead th:first-child{padding-left:0}.kbq-markdown .kbq-markdown__table>.kbq-markdown__thead th:last-child{padding-right:0}.kbq-markdown .kbq-markdown__table>.kbq-markdown__tbody td:first-child{padding-left:0}.kbq-markdown .kbq-markdown__table>.kbq-markdown__tbody td:last-child{padding-right:0}\n", ".kbq-markdown{--kbq-markdown-bg: transparent;--kbq-markdown-h1-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h1-size-margin-top: 0;--kbq-markdown-h1-size-margin-bottom: var(--kbq-size-l);--kbq-markdown-h2-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h2-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h2-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-h3-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h3-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h3-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-h4-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h4-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h4-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-h5-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h5-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h5-size-margin-bottom: var(--kbq-size-s);--kbq-markdown-h6-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h6-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h6-size-margin-bottom: var(--kbq-size-s);--kbq-markdown-p-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-p-size-margin-top: var(--kbq-size-m);--kbq-markdown-p-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-list-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-list-size-margin-top: var(--kbq-size-m);--kbq-markdown-list-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-list-size-margin-top-after-paragraph: calc(-1 * var(--kbq-size-s));--kbq-markdown-list-size-ol-number-padding-right: var(--kbq-size-xxs);--kbq-markdown-list-size-ul-padding: 0 0 0 var(--kbq-size-xxl);--kbq-markdown-list-size-item-margin-bottom: var(--kbq-size-xxs);--kbq-markdown-blockquote-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-blockquote-size-margin-top: var(--kbq-size-m);--kbq-markdown-blockquote-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-blockquote-size-padding: var(--kbq-size-3xs) var(--kbq-size-m);--kbq-markdown-blockquote-size-line-width: var(--kbq-size-xxs);--kbq-markdown-blockquote-size-border-radius: 0;--kbq-markdown-blockquote-size-border-width: 0;--kbq-markdown-code-size-multiline-margin-top: var(--kbq-size-m);--kbq-markdown-code-size-multiline-margin-bottom: var(--kbq-size-xxl);--kbq-markdown-code-size-inline-padding: var(--kbq-size-3xs) var(--kbq-size-xs);--kbq-markdown-code-size-multiline-padding: var(--kbq-size-m) var(--kbq-size-l);--kbq-markdown-code-size-border-radius: var(--kbq-size-border-radius);--kbq-markdown-code-size-border-width: var(--kbq-size-border-width);--kbq-markdown-image-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-image-size-margin-top: var(--kbq-size-m);--kbq-markdown-image-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-image-size-caption-margin-top: calc(-1 * var(--kbq-size-s));--kbq-markdown-image-size-caption-margin-bottom: var(--kbq-size-xxl);--kbq-markdown-hr-size-width: 1px;--kbq-markdown-hr-size-margin-vertical: var(--kbq-size-xxl);--kbq-markdown-table-size-border-width: var(--kbq-size-border-width);--kbq-markdown-table-size-padding: var(--kbq-size-s);--kbq-markdown-table-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-size-max-width: 650px;--kbq-markdown-h1-color: var(--kbq-foreground-contrast);--kbq-markdown-h2-color: var(--kbq-foreground-contrast);--kbq-markdown-h3-color: var(--kbq-foreground-contrast);--kbq-markdown-h4-color: var(--kbq-foreground-contrast);--kbq-markdown-h5-color: var(--kbq-foreground-contrast);--kbq-markdown-h6-color: var(--kbq-foreground-contrast);--kbq-markdown-p-color: var(--kbq-foreground-contrast);--kbq-markdown-list-color: var(--kbq-foreground-contrast);--kbq-markdown-blockquote-text: var(--kbq-foreground-contrast);--kbq-markdown-blockquote-line: var(--kbq-line-contrast-less);--kbq-markdown-blockquote-background: var(--kbq-background-contrast-fade);--kbq-markdown-blockquote-border: transparent;--kbq-markdown-code-text: var(--kbq-foreground-contrast);--kbq-markdown-code-background: var(--kbq-background-contrast-fade);--kbq-markdown-code-border: var(--kbq-line-contrast-less);--kbq-markdown-image-caption-text: var(--kbq-foreground-contrast-secondary);--kbq-markdown-hr-color: var(--kbq-line-contrast-less);--kbq-markdown-table-header: var(--kbq-foreground-contrast-secondary);--kbq-markdown-table-body: var(--kbq-foreground-contrast);--kbq-markdown-table-border: var(--kbq-line-contrast-less)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        <div class="kbq-markdown__output" [innerHtml]="resultHtml()"></div>
+    `, isInline: true, styles: ["@charset \"UTF-8\";.kbq-markdown{display:block}.kbq-markdown .kbq-markdown__input{display:none}.kbq-markdown .kbq-markdown__output{flex:1}.kbq-markdown .kbq-markdown__output>:first-child{margin-top:0}.kbq-markdown .kbq-markdown__output>:last-child{margin-bottom:0}.kbq-markdown .kbq-markdown__h1{margin-top:var(--kbq-markdown-h1-size-margin-top);margin-bottom:var(--kbq-markdown-h1-size-margin-bottom)}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h2{margin-top:var(--kbq-markdown-h2-size-margin-top);margin-bottom:var(--kbq-markdown-h2-size-margin-bottom)}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h3{margin-top:var(--kbq-markdown-h3-size-margin-top);margin-bottom:var(--kbq-markdown-h3-size-margin-bottom)}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h4{margin-top:var(--kbq-markdown-h4-size-margin-top);margin-bottom:var(--kbq-markdown-h4-size-margin-bottom)}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h5{margin-top:var(--kbq-markdown-h5-size-margin-top);margin-bottom:var(--kbq-markdown-h5-size-margin-bottom)}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h6{margin-top:var(--kbq-markdown-h6-size-margin-top);margin-bottom:var(--kbq-markdown-h6-size-margin-bottom)}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__p{margin-top:var(--kbq-markdown-p-size-margin-top);margin-bottom:var(--kbq-markdown-p-size-margin-bottom)}.kbq-markdown .kbq-markdown__ul,.kbq-markdown .kbq-markdown__ol{margin-top:var(--kbq-markdown-list-size-margin-top);margin-bottom:var(--kbq-markdown-list-size-margin-bottom)}.kbq-markdown .kbq-markdown__ul>li,.kbq-markdown .kbq-markdown__ol>li{margin-bottom:var(--kbq-markdown-list-size-item-margin-bottom)}.kbq-markdown .kbq-markdown__ul{position:relative;list-style:none;padding:var(--kbq-markdown-list-size-ul-padding)}.kbq-markdown .kbq-markdown__ul>li:before{content:\"\\2014\";display:block;position:absolute;width:24px;text-align:left;left:0}.kbq-markdown .kbq-markdown__ol{list-style:none;padding:0;counter-reset:li}.kbq-markdown .kbq-markdown__ol>li:before{content:counter(li) \".\";counter-increment:li;padding-right:var(--kbq-markdown-list-size-ol-number-padding-right)}.kbq-markdown .kbq-markdown__ol>li>*{display:inline-block}.kbq-markdown .kbq-markdown__p+.kbq-markdown__ul,.kbq-markdown .kbq-markdown__p+.kbq-markdown__ol{margin-top:var(--kbq-markdown-list-size-margin-top-after-paragraph)}.kbq-markdown .kbq-markdown__blockquote{margin-top:var(--kbq-markdown-blockquote-size-margin-top);margin-left:0;margin-bottom:var(--kbq-markdown-blockquote-size-margin-bottom);margin-right:0;border-left-width:var(--kbq-markdown-blockquote-size-line-width);border-left-style:solid;padding:var(--kbq-markdown-blockquote-size-padding)}.kbq-markdown .kbq-markdown__blockquote>.kbq-markdown__p{margin-top:0;margin-bottom:0}.kbq-markdown .kbq-markdown__pre{position:relative;overflow-x:auto;margin-top:var(--kbq-markdown-code-size-multiline-margin-top);margin-bottom:var(--kbq-markdown-code-size-multiline-margin-bottom);padding:var(--kbq-markdown-code-size-multiline-padding)}.kbq-markdown .kbq-markdown__pre,.kbq-markdown .kbq-markdown__code{border-radius:var(--kbq-markdown-code-size-border-radius)}@supports (corner-shape: squircle){.kbq-markdown .kbq-markdown__pre,.kbq-markdown .kbq-markdown__code{corner-shape:squircle;border-radius:clamp(var(--kbq-markdown-code-size-border-radius) * 1.85,var(--kbq-markdown-code-size-border-radius) * 2.3 - 3.6px,var(--kbq-markdown-code-size-border-radius) * 2)}}.kbq-markdown .kbq-markdown__code:not(.kbq-markdown__pre>.kbq-markdown__code){white-space:nowrap;padding:var(--kbq-markdown-code-size-inline-padding)}.kbq-markdown .kbq-markdown__img{max-width:100%;margin-top:var(--kbq-markdown-image-size-margin-top);margin-bottom:var(--kbq-markdown-image-size-margin-bottom)}.kbq-markdown .kbq-markdown__img+em{display:block;margin-top:var(--kbq-markdown-image-size-caption-margin-top);margin-bottom:var(--kbq-markdown-image-size-caption-margin-bottom)}.kbq-markdown .kbq-markdown__hr{border-top:none;border-left:none;border-right:none;border-bottom-style:solid;border-bottom-width:var(--kbq-markdown-hr-size-width);margin:var(--kbq-markdown-hr-size-margin-vertical) 0}.kbq-markdown .kbq-markdown__table{max-width:100%;overflow-x:auto;display:table;border-collapse:collapse;margin-bottom:var(--kbq-markdown-table-size-margin-bottom)}.kbq-markdown .kbq-markdown__table td{vertical-align:top}.kbq-markdown .kbq-markdown__table th,.kbq-markdown .kbq-markdown__table td{padding:var(--kbq-markdown-table-size-padding);font-weight:400}.kbq-markdown .kbq-markdown__table>.kbq-markdown__thead{border-bottom-style:solid;border-bottom-width:var(--kbq-markdown-table-size-border-width);text-align:left}.kbq-markdown .kbq-markdown__table>.kbq-markdown__thead th:first-child{padding-left:0}.kbq-markdown .kbq-markdown__table>.kbq-markdown__thead th:last-child{padding-right:0}.kbq-markdown .kbq-markdown__table>.kbq-markdown__tbody td:first-child{padding-left:0}.kbq-markdown .kbq-markdown__table>.kbq-markdown__tbody td:last-child{padding-right:0}\n", ".kbq-markdown{--kbq-link-size-state-focused-outline-offset: 0px;--kbq-link-size-state-focused-outline-width: 2px;--kbq-link-size-multiline-hit-area-gap: calc((1lh - 1em)/2) ;--kbq-link-size-compact-content-padding: var(--kbq-size-xxs);--kbq-link-size-normal-content-padding: var(--kbq-size-xxs);--kbq-link-size-big-content-padding: var(--kbq-size-xxs);--kbq-link-underline-width: 1px;--kbq-link-text: var(--kbq-foreground-theme);--kbq-link-border-bottom: var(--kbq-line-theme-fade);--kbq-link-state-visited-text: var(--kbq-foreground-visited);--kbq-link-state-visited-border-bottom: var(--kbq-line-visited-fade, var(--kbq-line-visited));--kbq-link-state-visited-hover-text: var(--kbq-states-foreground-visited-hover);--kbq-link-state-visited-hover-border-bottom: var(--kbq-line-visited-fade, var(--kbq-line-visited));--kbq-link-state-visited-active-text: var(--kbq-states-foreground-visited-active);--kbq-link-state-visited-active-border-bottom: var(--kbq-line-visited-fade, var(--kbq-line-visited));--kbq-link-state-hover-text: var(--kbq-states-foreground-theme-hover);--kbq-link-state-hover-border-bottom: var(--kbq-line-theme-fade);--kbq-link-state-active-text: var(--kbq-states-foreground-theme-active);--kbq-link-state-active-border-bottom: var(--kbq-line-theme-fade);--kbq-link-state-focused-outline: var(--kbq-states-line-focus-theme);--kbq-link-state-disabled-text: var(--kbq-states-foreground-disabled);--kbq-link-state-disabled-border-bottom: var(--kbq-states-line-disabled);--kbq-markdown-bg: transparent;--kbq-markdown-h1-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h1-size-margin-top: 0;--kbq-markdown-h1-size-margin-bottom: var(--kbq-size-l);--kbq-markdown-h2-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h2-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h2-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-h3-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h3-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h3-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-h4-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h4-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h4-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-h5-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h5-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h5-size-margin-bottom: var(--kbq-size-s);--kbq-markdown-h6-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h6-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h6-size-margin-bottom: var(--kbq-size-s);--kbq-markdown-p-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-p-size-margin-top: var(--kbq-size-m);--kbq-markdown-p-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-list-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-list-size-margin-top: var(--kbq-size-m);--kbq-markdown-list-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-list-size-margin-top-after-paragraph: calc(-1 * var(--kbq-size-s));--kbq-markdown-list-size-ol-number-padding-right: var(--kbq-size-xxs);--kbq-markdown-list-size-ul-padding: 0 0 0 var(--kbq-size-xxl);--kbq-markdown-list-size-item-margin-bottom: var(--kbq-size-xxs);--kbq-markdown-blockquote-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-blockquote-size-margin-top: var(--kbq-size-m);--kbq-markdown-blockquote-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-blockquote-size-padding: var(--kbq-size-3xs) var(--kbq-size-m);--kbq-markdown-blockquote-size-line-width: var(--kbq-size-xxs);--kbq-markdown-blockquote-size-border-radius: 0;--kbq-markdown-blockquote-size-border-width: 0;--kbq-markdown-code-size-multiline-margin-top: var(--kbq-size-m);--kbq-markdown-code-size-multiline-margin-bottom: var(--kbq-size-xxl);--kbq-markdown-code-size-inline-padding: var(--kbq-size-3xs) var(--kbq-size-xs);--kbq-markdown-code-size-multiline-padding: var(--kbq-size-m) var(--kbq-size-l);--kbq-markdown-code-size-border-radius: var(--kbq-size-border-radius);--kbq-markdown-code-size-border-width: var(--kbq-size-border-width);--kbq-markdown-image-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-image-size-margin-top: var(--kbq-size-m);--kbq-markdown-image-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-image-size-caption-margin-top: calc(-1 * var(--kbq-size-s));--kbq-markdown-image-size-caption-margin-bottom: var(--kbq-size-xxl);--kbq-markdown-hr-size-width: 1px;--kbq-markdown-hr-size-margin-vertical: var(--kbq-size-xxl);--kbq-markdown-table-size-border-width: var(--kbq-size-border-width);--kbq-markdown-table-size-padding: var(--kbq-size-s);--kbq-markdown-table-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-size-max-width: 650px;--kbq-markdown-h1-color: var(--kbq-foreground-contrast);--kbq-markdown-h2-color: var(--kbq-foreground-contrast);--kbq-markdown-h3-color: var(--kbq-foreground-contrast);--kbq-markdown-h4-color: var(--kbq-foreground-contrast);--kbq-markdown-h5-color: var(--kbq-foreground-contrast);--kbq-markdown-h6-color: var(--kbq-foreground-contrast);--kbq-markdown-p-color: var(--kbq-foreground-contrast);--kbq-markdown-list-color: var(--kbq-foreground-contrast);--kbq-markdown-blockquote-text: var(--kbq-foreground-contrast);--kbq-markdown-blockquote-line: var(--kbq-line-contrast-less);--kbq-markdown-blockquote-background: var(--kbq-background-contrast-fade);--kbq-markdown-blockquote-border: transparent;--kbq-markdown-code-text: var(--kbq-foreground-contrast);--kbq-markdown-code-background: var(--kbq-background-contrast-fade);--kbq-markdown-code-border: var(--kbq-line-contrast-less);--kbq-markdown-image-caption-text: var(--kbq-foreground-contrast-secondary);--kbq-markdown-hr-color: var(--kbq-line-contrast-less);--kbq-markdown-table-header: var(--kbq-foreground-contrast-secondary);--kbq-markdown-table-body: var(--kbq-foreground-contrast);--kbq-markdown-table-border: var(--kbq-line-contrast-less)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqMarkdown, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqMarkdown, decorators: [{
             type: Component,
             args: [{ selector: 'kbq-markdown', template: `
         <pre #contentWrapper class="kbq-markdown__input" ngPreserveWhitespaces><ng-content /></pre>
-        <div #outputWrapper class="kbq-markdown__output" [innerHtml]="resultHtml()"></div>
-    `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
-                        // The rendered content comes from `[innerHtml]`, so its scrollbars can only be customized from the host:
-                        // `kbq-scrollbar` styles the element's own and its descendants' scrollbars.
-                        class: 'kbq-markdown kbq-scrollbar'
-                    }, styles: ["@charset \"UTF-8\";.kbq-markdown{display:block}.kbq-markdown .kbq-markdown__input{display:none}.kbq-markdown .kbq-markdown__output{flex:1}.kbq-markdown .kbq-markdown__output>:first-child{margin-top:0}.kbq-markdown .kbq-markdown__output>:last-child{margin-bottom:0}.kbq-markdown .kbq-markdown__h1{margin-top:var(--kbq-markdown-h1-size-margin-top);margin-bottom:var(--kbq-markdown-h1-size-margin-bottom)}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h2{margin-top:var(--kbq-markdown-h2-size-margin-top);margin-bottom:var(--kbq-markdown-h2-size-margin-bottom)}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h3{margin-top:var(--kbq-markdown-h3-size-margin-top);margin-bottom:var(--kbq-markdown-h3-size-margin-bottom)}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h4{margin-top:var(--kbq-markdown-h4-size-margin-top);margin-bottom:var(--kbq-markdown-h4-size-margin-bottom)}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h5{margin-top:var(--kbq-markdown-h5-size-margin-top);margin-bottom:var(--kbq-markdown-h5-size-margin-bottom)}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h6{margin-top:var(--kbq-markdown-h6-size-margin-top);margin-bottom:var(--kbq-markdown-h6-size-margin-bottom)}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__p{margin-top:var(--kbq-markdown-p-size-margin-top);margin-bottom:var(--kbq-markdown-p-size-margin-bottom)}.kbq-markdown .kbq-markdown__ul,.kbq-markdown .kbq-markdown__ol{margin-top:var(--kbq-markdown-list-size-margin-top);margin-bottom:var(--kbq-markdown-list-size-margin-bottom)}.kbq-markdown .kbq-markdown__ul>li,.kbq-markdown .kbq-markdown__ol>li{margin-bottom:var(--kbq-markdown-list-size-item-margin-bottom)}.kbq-markdown .kbq-markdown__ul{position:relative;list-style:none;padding:var(--kbq-markdown-list-size-ul-padding)}.kbq-markdown .kbq-markdown__ul>li:before{content:\"\\2014\";display:block;position:absolute;width:24px;text-align:left;left:0}.kbq-markdown .kbq-markdown__ol{list-style:none;padding:0;counter-reset:li}.kbq-markdown .kbq-markdown__ol>li:before{content:counter(li) \".\";counter-increment:li;padding-right:var(--kbq-markdown-list-size-ol-number-padding-right)}.kbq-markdown .kbq-markdown__ol>li>*{display:inline-block}.kbq-markdown .kbq-markdown__p+.kbq-markdown__ul,.kbq-markdown .kbq-markdown__p+.kbq-markdown__ol{margin-top:var(--kbq-markdown-list-size-margin-top-after-paragraph)}.kbq-markdown .kbq-markdown__blockquote{margin-top:var(--kbq-markdown-blockquote-size-margin-top);margin-left:0;margin-bottom:var(--kbq-markdown-blockquote-size-margin-bottom);margin-right:0;border-left-width:var(--kbq-markdown-blockquote-size-line-width);border-left-style:solid;padding:var(--kbq-markdown-blockquote-size-padding)}.kbq-markdown .kbq-markdown__blockquote>.kbq-markdown__p{margin-top:0;margin-bottom:0}.kbq-markdown .kbq-markdown__pre{position:relative;overflow-x:auto;margin-top:var(--kbq-markdown-code-size-multiline-margin-top);margin-bottom:var(--kbq-markdown-code-size-multiline-margin-bottom);padding:var(--kbq-markdown-code-size-multiline-padding)}.kbq-markdown .kbq-markdown__pre,.kbq-markdown .kbq-markdown__code{border-radius:var(--kbq-markdown-code-size-border-radius)}.kbq-markdown .kbq-markdown__code:not(.kbq-markdown__pre>.kbq-markdown__code){white-space:nowrap;padding:var(--kbq-markdown-code-size-inline-padding)}.kbq-markdown .kbq-markdown__img{max-width:100%;margin-top:var(--kbq-markdown-image-size-margin-top);margin-bottom:var(--kbq-markdown-image-size-margin-bottom)}.kbq-markdown .kbq-markdown__img+em{display:block;margin-top:var(--kbq-markdown-image-size-caption-margin-top);margin-bottom:var(--kbq-markdown-image-size-caption-margin-bottom)}.kbq-markdown .kbq-markdown__hr{border-top:none;border-left:none;border-right:none;border-bottom-style:solid;border-bottom-width:var(--kbq-markdown-hr-size-width);margin:var(--kbq-markdown-hr-size-margin-vertical) 0}.kbq-markdown .kbq-markdown__table{max-width:100%;overflow-x:auto;display:table;border-collapse:collapse;margin-bottom:var(--kbq-markdown-table-size-margin-bottom)}.kbq-markdown .kbq-markdown__table td{vertical-align:top}.kbq-markdown .kbq-markdown__table th,.kbq-markdown .kbq-markdown__table td{padding:var(--kbq-markdown-table-size-padding);font-weight:400}.kbq-markdown .kbq-markdown__table>.kbq-markdown__thead{border-bottom-style:solid;border-bottom-width:var(--kbq-markdown-table-size-border-width);text-align:left}.kbq-markdown .kbq-markdown__table>.kbq-markdown__thead th:first-child{padding-left:0}.kbq-markdown .kbq-markdown__table>.kbq-markdown__thead th:last-child{padding-right:0}.kbq-markdown .kbq-markdown__table>.kbq-markdown__tbody td:first-child{padding-left:0}.kbq-markdown .kbq-markdown__table>.kbq-markdown__tbody td:last-child{padding-right:0}\n", ".kbq-markdown{--kbq-markdown-bg: transparent;--kbq-markdown-h1-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h1-size-margin-top: 0;--kbq-markdown-h1-size-margin-bottom: var(--kbq-size-l);--kbq-markdown-h2-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h2-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h2-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-h3-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h3-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h3-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-h4-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h4-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h4-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-h5-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h5-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h5-size-margin-bottom: var(--kbq-size-s);--kbq-markdown-h6-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h6-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h6-size-margin-bottom: var(--kbq-size-s);--kbq-markdown-p-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-p-size-margin-top: var(--kbq-size-m);--kbq-markdown-p-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-list-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-list-size-margin-top: var(--kbq-size-m);--kbq-markdown-list-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-list-size-margin-top-after-paragraph: calc(-1 * var(--kbq-size-s));--kbq-markdown-list-size-ol-number-padding-right: var(--kbq-size-xxs);--kbq-markdown-list-size-ul-padding: 0 0 0 var(--kbq-size-xxl);--kbq-markdown-list-size-item-margin-bottom: var(--kbq-size-xxs);--kbq-markdown-blockquote-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-blockquote-size-margin-top: var(--kbq-size-m);--kbq-markdown-blockquote-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-blockquote-size-padding: var(--kbq-size-3xs) var(--kbq-size-m);--kbq-markdown-blockquote-size-line-width: var(--kbq-size-xxs);--kbq-markdown-blockquote-size-border-radius: 0;--kbq-markdown-blockquote-size-border-width: 0;--kbq-markdown-code-size-multiline-margin-top: var(--kbq-size-m);--kbq-markdown-code-size-multiline-margin-bottom: var(--kbq-size-xxl);--kbq-markdown-code-size-inline-padding: var(--kbq-size-3xs) var(--kbq-size-xs);--kbq-markdown-code-size-multiline-padding: var(--kbq-size-m) var(--kbq-size-l);--kbq-markdown-code-size-border-radius: var(--kbq-size-border-radius);--kbq-markdown-code-size-border-width: var(--kbq-size-border-width);--kbq-markdown-image-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-image-size-margin-top: var(--kbq-size-m);--kbq-markdown-image-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-image-size-caption-margin-top: calc(-1 * var(--kbq-size-s));--kbq-markdown-image-size-caption-margin-bottom: var(--kbq-size-xxl);--kbq-markdown-hr-size-width: 1px;--kbq-markdown-hr-size-margin-vertical: var(--kbq-size-xxl);--kbq-markdown-table-size-border-width: var(--kbq-size-border-width);--kbq-markdown-table-size-padding: var(--kbq-size-s);--kbq-markdown-table-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-size-max-width: 650px;--kbq-markdown-h1-color: var(--kbq-foreground-contrast);--kbq-markdown-h2-color: var(--kbq-foreground-contrast);--kbq-markdown-h3-color: var(--kbq-foreground-contrast);--kbq-markdown-h4-color: var(--kbq-foreground-contrast);--kbq-markdown-h5-color: var(--kbq-foreground-contrast);--kbq-markdown-h6-color: var(--kbq-foreground-contrast);--kbq-markdown-p-color: var(--kbq-foreground-contrast);--kbq-markdown-list-color: var(--kbq-foreground-contrast);--kbq-markdown-blockquote-text: var(--kbq-foreground-contrast);--kbq-markdown-blockquote-line: var(--kbq-line-contrast-less);--kbq-markdown-blockquote-background: var(--kbq-background-contrast-fade);--kbq-markdown-blockquote-border: transparent;--kbq-markdown-code-text: var(--kbq-foreground-contrast);--kbq-markdown-code-background: var(--kbq-background-contrast-fade);--kbq-markdown-code-border: var(--kbq-line-contrast-less);--kbq-markdown-image-caption-text: var(--kbq-foreground-contrast-secondary);--kbq-markdown-hr-color: var(--kbq-line-contrast-less);--kbq-markdown-table-header: var(--kbq-foreground-contrast-secondary);--kbq-markdown-table-body: var(--kbq-foreground-contrast);--kbq-markdown-table-border: var(--kbq-line-contrast-less)}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { contentWrapper: [{ type: i0.ViewChild, args: ['contentWrapper', { isSignal: true }] }], outputWrapper: [{ type: i0.ViewChild, args: ['outputWrapper', { isSignal: true }] }], markdownText: [{
-                type: Input
-            }] } });
+        <div class="kbq-markdown__output" [innerHtml]="resultHtml()"></div>
+    `, providers: [kbqNativeScrollbarOptionsProvider({ descendants: true })], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        class: 'kbq-markdown'
+                    }, hostDirectives: [KbqNativeScrollbar], styles: ["@charset \"UTF-8\";.kbq-markdown{display:block}.kbq-markdown .kbq-markdown__input{display:none}.kbq-markdown .kbq-markdown__output{flex:1}.kbq-markdown .kbq-markdown__output>:first-child{margin-top:0}.kbq-markdown .kbq-markdown__output>:last-child{margin-bottom:0}.kbq-markdown .kbq-markdown__h1{margin-top:var(--kbq-markdown-h1-size-margin-top);margin-bottom:var(--kbq-markdown-h1-size-margin-bottom)}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h1+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h2{margin-top:var(--kbq-markdown-h2-size-margin-top);margin-bottom:var(--kbq-markdown-h2-size-margin-bottom)}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h2+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h3{margin-top:var(--kbq-markdown-h3-size-margin-top);margin-bottom:var(--kbq-markdown-h3-size-margin-bottom)}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h3+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h4{margin-top:var(--kbq-markdown-h4-size-margin-top);margin-bottom:var(--kbq-markdown-h4-size-margin-bottom)}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h4+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h5{margin-top:var(--kbq-markdown-h5-size-margin-top);margin-bottom:var(--kbq-markdown-h5-size-margin-bottom)}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h5+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__h6{margin-top:var(--kbq-markdown-h6-size-margin-top);margin-bottom:var(--kbq-markdown-h6-size-margin-bottom)}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h1{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h2{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h3{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h4{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h5{margin-top:0}.kbq-markdown .kbq-markdown__h6+.kbq-markdown__h6{margin-top:0}.kbq-markdown .kbq-markdown__p{margin-top:var(--kbq-markdown-p-size-margin-top);margin-bottom:var(--kbq-markdown-p-size-margin-bottom)}.kbq-markdown .kbq-markdown__ul,.kbq-markdown .kbq-markdown__ol{margin-top:var(--kbq-markdown-list-size-margin-top);margin-bottom:var(--kbq-markdown-list-size-margin-bottom)}.kbq-markdown .kbq-markdown__ul>li,.kbq-markdown .kbq-markdown__ol>li{margin-bottom:var(--kbq-markdown-list-size-item-margin-bottom)}.kbq-markdown .kbq-markdown__ul{position:relative;list-style:none;padding:var(--kbq-markdown-list-size-ul-padding)}.kbq-markdown .kbq-markdown__ul>li:before{content:\"\\2014\";display:block;position:absolute;width:24px;text-align:left;left:0}.kbq-markdown .kbq-markdown__ol{list-style:none;padding:0;counter-reset:li}.kbq-markdown .kbq-markdown__ol>li:before{content:counter(li) \".\";counter-increment:li;padding-right:var(--kbq-markdown-list-size-ol-number-padding-right)}.kbq-markdown .kbq-markdown__ol>li>*{display:inline-block}.kbq-markdown .kbq-markdown__p+.kbq-markdown__ul,.kbq-markdown .kbq-markdown__p+.kbq-markdown__ol{margin-top:var(--kbq-markdown-list-size-margin-top-after-paragraph)}.kbq-markdown .kbq-markdown__blockquote{margin-top:var(--kbq-markdown-blockquote-size-margin-top);margin-left:0;margin-bottom:var(--kbq-markdown-blockquote-size-margin-bottom);margin-right:0;border-left-width:var(--kbq-markdown-blockquote-size-line-width);border-left-style:solid;padding:var(--kbq-markdown-blockquote-size-padding)}.kbq-markdown .kbq-markdown__blockquote>.kbq-markdown__p{margin-top:0;margin-bottom:0}.kbq-markdown .kbq-markdown__pre{position:relative;overflow-x:auto;margin-top:var(--kbq-markdown-code-size-multiline-margin-top);margin-bottom:var(--kbq-markdown-code-size-multiline-margin-bottom);padding:var(--kbq-markdown-code-size-multiline-padding)}.kbq-markdown .kbq-markdown__pre,.kbq-markdown .kbq-markdown__code{border-radius:var(--kbq-markdown-code-size-border-radius)}@supports (corner-shape: squircle){.kbq-markdown .kbq-markdown__pre,.kbq-markdown .kbq-markdown__code{corner-shape:squircle;border-radius:clamp(var(--kbq-markdown-code-size-border-radius) * 1.85,var(--kbq-markdown-code-size-border-radius) * 2.3 - 3.6px,var(--kbq-markdown-code-size-border-radius) * 2)}}.kbq-markdown .kbq-markdown__code:not(.kbq-markdown__pre>.kbq-markdown__code){white-space:nowrap;padding:var(--kbq-markdown-code-size-inline-padding)}.kbq-markdown .kbq-markdown__img{max-width:100%;margin-top:var(--kbq-markdown-image-size-margin-top);margin-bottom:var(--kbq-markdown-image-size-margin-bottom)}.kbq-markdown .kbq-markdown__img+em{display:block;margin-top:var(--kbq-markdown-image-size-caption-margin-top);margin-bottom:var(--kbq-markdown-image-size-caption-margin-bottom)}.kbq-markdown .kbq-markdown__hr{border-top:none;border-left:none;border-right:none;border-bottom-style:solid;border-bottom-width:var(--kbq-markdown-hr-size-width);margin:var(--kbq-markdown-hr-size-margin-vertical) 0}.kbq-markdown .kbq-markdown__table{max-width:100%;overflow-x:auto;display:table;border-collapse:collapse;margin-bottom:var(--kbq-markdown-table-size-margin-bottom)}.kbq-markdown .kbq-markdown__table td{vertical-align:top}.kbq-markdown .kbq-markdown__table th,.kbq-markdown .kbq-markdown__table td{padding:var(--kbq-markdown-table-size-padding);font-weight:400}.kbq-markdown .kbq-markdown__table>.kbq-markdown__thead{border-bottom-style:solid;border-bottom-width:var(--kbq-markdown-table-size-border-width);text-align:left}.kbq-markdown .kbq-markdown__table>.kbq-markdown__thead th:first-child{padding-left:0}.kbq-markdown .kbq-markdown__table>.kbq-markdown__thead th:last-child{padding-right:0}.kbq-markdown .kbq-markdown__table>.kbq-markdown__tbody td:first-child{padding-left:0}.kbq-markdown .kbq-markdown__table>.kbq-markdown__tbody td:last-child{padding-right:0}\n", ".kbq-markdown{--kbq-link-size-state-focused-outline-offset: 0px;--kbq-link-size-state-focused-outline-width: 2px;--kbq-link-size-multiline-hit-area-gap: calc((1lh - 1em)/2) ;--kbq-link-size-compact-content-padding: var(--kbq-size-xxs);--kbq-link-size-normal-content-padding: var(--kbq-size-xxs);--kbq-link-size-big-content-padding: var(--kbq-size-xxs);--kbq-link-underline-width: 1px;--kbq-link-text: var(--kbq-foreground-theme);--kbq-link-border-bottom: var(--kbq-line-theme-fade);--kbq-link-state-visited-text: var(--kbq-foreground-visited);--kbq-link-state-visited-border-bottom: var(--kbq-line-visited-fade, var(--kbq-line-visited));--kbq-link-state-visited-hover-text: var(--kbq-states-foreground-visited-hover);--kbq-link-state-visited-hover-border-bottom: var(--kbq-line-visited-fade, var(--kbq-line-visited));--kbq-link-state-visited-active-text: var(--kbq-states-foreground-visited-active);--kbq-link-state-visited-active-border-bottom: var(--kbq-line-visited-fade, var(--kbq-line-visited));--kbq-link-state-hover-text: var(--kbq-states-foreground-theme-hover);--kbq-link-state-hover-border-bottom: var(--kbq-line-theme-fade);--kbq-link-state-active-text: var(--kbq-states-foreground-theme-active);--kbq-link-state-active-border-bottom: var(--kbq-line-theme-fade);--kbq-link-state-focused-outline: var(--kbq-states-line-focus-theme);--kbq-link-state-disabled-text: var(--kbq-states-foreground-disabled);--kbq-link-state-disabled-border-bottom: var(--kbq-states-line-disabled);--kbq-markdown-bg: transparent;--kbq-markdown-h1-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h1-size-margin-top: 0;--kbq-markdown-h1-size-margin-bottom: var(--kbq-size-l);--kbq-markdown-h2-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h2-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h2-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-h3-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h3-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h3-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-h4-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h4-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h4-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-h5-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h5-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h5-size-margin-bottom: var(--kbq-size-s);--kbq-markdown-h6-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-h6-size-margin-top: var(--kbq-size-xxl);--kbq-markdown-h6-size-margin-bottom: var(--kbq-size-s);--kbq-markdown-p-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-p-size-margin-top: var(--kbq-size-m);--kbq-markdown-p-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-list-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-list-size-margin-top: var(--kbq-size-m);--kbq-markdown-list-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-list-size-margin-top-after-paragraph: calc(-1 * var(--kbq-size-s));--kbq-markdown-list-size-ol-number-padding-right: var(--kbq-size-xxs);--kbq-markdown-list-size-ul-padding: 0 0 0 var(--kbq-size-xxl);--kbq-markdown-list-size-item-margin-bottom: var(--kbq-size-xxs);--kbq-markdown-blockquote-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-blockquote-size-margin-top: var(--kbq-size-m);--kbq-markdown-blockquote-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-blockquote-size-padding: var(--kbq-size-3xs) var(--kbq-size-m);--kbq-markdown-blockquote-size-line-width: var(--kbq-size-xxs);--kbq-markdown-blockquote-size-border-radius: 0;--kbq-markdown-blockquote-size-border-width: 0;--kbq-markdown-code-size-multiline-margin-top: var(--kbq-size-m);--kbq-markdown-code-size-multiline-margin-bottom: var(--kbq-size-xxl);--kbq-markdown-code-size-inline-padding: var(--kbq-size-3xs) var(--kbq-size-xs);--kbq-markdown-code-size-multiline-padding: var(--kbq-size-m) var(--kbq-size-l);--kbq-markdown-code-size-border-radius: var(--kbq-size-border-radius);--kbq-markdown-code-size-border-width: var(--kbq-size-border-width);--kbq-markdown-image-size-max-width: var(--kbq-markdown-size-max-width);--kbq-markdown-image-size-margin-top: var(--kbq-size-m);--kbq-markdown-image-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-image-size-caption-margin-top: calc(-1 * var(--kbq-size-s));--kbq-markdown-image-size-caption-margin-bottom: var(--kbq-size-xxl);--kbq-markdown-hr-size-width: 1px;--kbq-markdown-hr-size-margin-vertical: var(--kbq-size-xxl);--kbq-markdown-table-size-border-width: var(--kbq-size-border-width);--kbq-markdown-table-size-padding: var(--kbq-size-s);--kbq-markdown-table-size-margin-bottom: var(--kbq-size-m);--kbq-markdown-size-max-width: 650px;--kbq-markdown-h1-color: var(--kbq-foreground-contrast);--kbq-markdown-h2-color: var(--kbq-foreground-contrast);--kbq-markdown-h3-color: var(--kbq-foreground-contrast);--kbq-markdown-h4-color: var(--kbq-foreground-contrast);--kbq-markdown-h5-color: var(--kbq-foreground-contrast);--kbq-markdown-h6-color: var(--kbq-foreground-contrast);--kbq-markdown-p-color: var(--kbq-foreground-contrast);--kbq-markdown-list-color: var(--kbq-foreground-contrast);--kbq-markdown-blockquote-text: var(--kbq-foreground-contrast);--kbq-markdown-blockquote-line: var(--kbq-line-contrast-less);--kbq-markdown-blockquote-background: var(--kbq-background-contrast-fade);--kbq-markdown-blockquote-border: transparent;--kbq-markdown-code-text: var(--kbq-foreground-contrast);--kbq-markdown-code-background: var(--kbq-background-contrast-fade);--kbq-markdown-code-border: var(--kbq-line-contrast-less);--kbq-markdown-image-caption-text: var(--kbq-foreground-contrast-secondary);--kbq-markdown-hr-color: var(--kbq-line-contrast-less);--kbq-markdown-table-header: var(--kbq-foreground-contrast-secondary);--kbq-markdown-table-body: var(--kbq-foreground-contrast);--kbq-markdown-table-border: var(--kbq-line-contrast-less)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { contentWrapper: [{ type: i0.ViewChild, args: ['contentWrapper', { isSignal: true }] }], markdownText: [{ type: i0.Input, args: [{ isSignal: true, alias: "markdownText", required: false }] }] } });
 
 const COMPONENTS = [
     KbqMarkdown
 ];
 class KbqMarkdownModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqMarkdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.30", ngImport: i0, type: KbqMarkdownModule, imports: [KbqMarkdown], exports: [KbqMarkdown] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqMarkdownModule, providers: [KbqMarkdownService] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqMarkdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.25", ngImport: i0, type: KbqMarkdownModule, imports: [KbqMarkdown], exports: [KbqMarkdown] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqMarkdownModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqMarkdownModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqMarkdownModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: COMPONENTS,
-                    providers: [KbqMarkdownService],
                     exports: COMPONENTS
                 }]
         }] });

package/fesm2022/koobiq-components-markdown.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"koobiq-components-markdown.mjs","sources":["../../../packages/components/markdown/markdown.values.ts","../../../packages/components/markdown/markdown.service.ts","../../../packages/components/markdown/markdown.component.ts","../../../packages/components/markdown/markdown.module.ts","../../../packages/components/markdown/koobiq-components-markdown.ts"],"sourcesContent":["/** @docs-private */\nexport const MARKDOWN_TAGS_TO_CLASS_ALIAS = [\n    'a',\n    'blockquote',\n    'h1',\n    'h2',\n    'h3',\n    'h4',\n    'h5',\n    'h6',\n    'hr',\n    'li',\n    'ol',\n    'table',\n    'tbody',\n    'thead',\n    'td',\n    'tr',\n    'ul',\n    'pre',\n    'code',\n    'img'\n];\n\n/**\n * separating `th` and `p` to prevent it's conflict with `thead` and `pre`\n *\n * @docs-private\n */\nexport const MARKDOWN_WHOLE_TAGS_TO_CLASS_ALIAS = [\n    'th',\n    'p'\n];\n\n/** @docs-private */\nexport const CLASS_PREFIX: string = 'kbq-markdown';\n","import { Injectable } from '@angular/core';\nimport { marked, MarkedOptions } from 'marked';\nimport { CLASS_PREFIX, MARKDOWN_TAGS_TO_CLASS_ALIAS, MARKDOWN_WHOLE_TAGS_TO_CLASS_ALIAS } from './markdown.values';\n\n/**\n * Service for converting Markdown into HTML.\n *\n * @docs-private\n */\n@Injectable()\nexport class KbqMarkdownService {\n    /**\n     * Converts a given Markdown string into HTML.\n     * NOTE! Method does not sanitize the output HTML string.\n     *\n     * @param markdown - The Markdown string to be converted.\n     * @param options - Optional MarkedOptions to customize the parsing behavior.\n     * @returns The transformed HTML string.\n     */\n    parseToHtml(markdown: string, options?: MarkedOptions): string {\n        return this.transform(<string>marked.parse(markdown, options));\n    }\n\n    private transform(htmlContent: string): string {\n        let transformed = htmlContent;\n\n        MARKDOWN_TAGS_TO_CLASS_ALIAS.forEach((tag) => {\n            transformed = transformed.replace(new RegExp(`<${tag}`, 'g'), (_match: string) => {\n                if (tag === 'a') {\n                    return `<${tag} class=\"${CLASS_PREFIX}__${tag} kbq-link kbq-text-only kbq-link_use-visited\"`;\n                }\n\n                return `<${tag} class=\"${CLASS_PREFIX}__${tag}\"`;\n            });\n        });\n\n        MARKDOWN_WHOLE_TAGS_TO_CLASS_ALIAS.forEach((tag) => {\n            transformed = transformed.replace(\n                // `\\\\s`, because a template literal eats the backslash first: `\\s` would reach the\n                // constructor as a bare `s` and match `<pss>` rather than `<p >`.\n                new RegExp(`<${tag}\\\\s*>`, 'g'),\n                (_match: string) => `<${tag} class=\"${CLASS_PREFIX}__${tag}\">`\n            );\n        });\n\n        return transformed;\n    }\n}\n","import { FocusMonitor } from '@angular/cdk/a11y';\nimport {\n    afterNextRender,\n    ChangeDetectionStrategy,\n    Component,\n    effect,\n    ElementRef,\n    inject,\n    InjectionToken,\n    Input,\n    OnDestroy,\n    Provider,\n    signal,\n    viewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport { DomSanitizer, SafeHtml } from '@angular/platform-browser';\nimport { MarkedOptions } from 'marked';\nimport { KbqMarkdownService } from './markdown.service';\n\n/** List of options for `marked` library. */\nexport const KBQ_MARKDOWN_MARKED_OPTIONS = new InjectionToken<MarkedOptions>('KBQ_MARKDOWN_MARKED_OPTIONS');\n\n/** Utility provider for `KBQ_MARKDOWN_MARKED_OPTIONS`. */\nexport const kbqMarkdownMarkedOptionsProvider = (options: MarkedOptions): Provider => ({\n    provide: KBQ_MARKDOWN_MARKED_OPTIONS,\n    useValue: options\n});\n\n/** Component which allows to convert `Markdown` into `HTML` */\n@Component({\n    selector: 'kbq-markdown',\n    // no need format line with ng-content it's broke textContent for markdownService.parseToHtml()\n    template: `\n        <pre #contentWrapper class=\"kbq-markdown__input\" ngPreserveWhitespaces><ng-content /></pre>\n        <div #outputWrapper class=\"kbq-markdown__output\" [innerHtml]=\"resultHtml()\"></div>\n    `,\n    styleUrls: ['./markdown.scss', 'markdown-tokens.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    host: {\n        // The rendered content comes from `[innerHtml]`, so its scrollbars can only be customized from the host:\n        // `kbq-scrollbar` styles the element's own and its descendants' scrollbars.\n        class: 'kbq-markdown kbq-scrollbar'\n    }\n})\nexport class KbqMarkdown implements OnDestroy {\n    private readonly markdownService = inject(KbqMarkdownService);\n    private sanitizer = inject(DomSanitizer);\n    private readonly markedOptions =\n        inject<MarkedOptions | undefined>(KBQ_MARKDOWN_MARKED_OPTIONS, { optional: true }) ?? undefined;\n\n    private readonly contentWrapper = viewChild.required<ElementRef<HTMLPreElement>>('contentWrapper');\n    private readonly outputWrapper = viewChild.required<ElementRef<HTMLDivElement>>('outputWrapper');\n\n    protected resultHtml = signal<SafeHtml | null>(null);\n\n    /** `Markdown` text. */\n    // TODO: Skipped for migration because:\n    //  Accessor inputs cannot be migrated as they are too complex.\n    @Input()\n    get markdownText(): string | null {\n        return this._markdownText;\n    }\n\n    set markdownText(value: string | null) {\n        if (value && this.markdownText !== value) {\n            this.resultHtml.set(this.getResultHTML(value));\n        }\n\n        this._markdownText = value;\n    }\n\n    private _markdownText: string | null = null;\n    private readonly focusMonitor = inject(FocusMonitor);\n    private readonly links: HTMLAnchorElement[] = [];\n\n    constructor() {\n        afterNextRender(() => {\n            const contentWrapper = this.contentWrapper();\n\n            if (!this.markdownText && contentWrapper?.nativeElement.textContent) {\n                this.resultHtml.set(this.getResultHTML(contentWrapper?.nativeElement.textContent));\n            }\n        });\n\n        effect(() => {\n            if (this.resultHtml()) {\n                Promise.resolve().then(() => this.startMonitoringLinks());\n            } else {\n                this.stopMonitoringLinks();\n            }\n        });\n    }\n\n    ngOnDestroy(): void {\n        this.stopMonitoringLinks();\n    }\n\n    private getResultHTML(markdown: string): SafeHtml {\n        return this.sanitizer.bypassSecurityTrustHtml(this.markdownService.parseToHtml(markdown, this.markedOptions));\n    }\n\n    private startMonitoringLinks(): void {\n        this.stopMonitoringLinks();\n        this.outputWrapper()\n            .nativeElement.querySelectorAll<HTMLAnchorElement>('.kbq-markdown__a')\n            .forEach((link) => {\n                this.links.push(link);\n                this.focusMonitor.monitor(link, true);\n            });\n    }\n\n    private stopMonitoringLinks(): void {\n        this.links.forEach((link) => this.focusMonitor.stopMonitoring(link));\n        this.links.length = 0;\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { KbqMarkdown } from './markdown.component';\nimport { KbqMarkdownService } from './markdown.service';\n\nconst COMPONENTS = [\n    KbqMarkdown\n];\n\n@NgModule({\n    imports: COMPONENTS,\n    providers: [KbqMarkdownService],\n    exports: COMPONENTS\n})\nexport class KbqMarkdownModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"koobiq-components-markdown.mjs","sources":["../../../packages/components/markdown/markdown.values.ts","../../../packages/components/markdown/markdown.service.ts","../../../packages/components/markdown/markdown.component.ts","../../../packages/components/markdown/markdown.module.ts","../../../packages/components/markdown/koobiq-components-markdown.ts"],"sourcesContent":["/** @internal */\nexport const MARKDOWN_TAGS_TO_CLASS_ALIAS = [\n    'a',\n    'blockquote',\n    'h1',\n    'h2',\n    'h3',\n    'h4',\n    'h5',\n    'h6',\n    'hr',\n    'li',\n    'ol',\n    'table',\n    'tbody',\n    'thead',\n    'td',\n    'tr',\n    'ul',\n    'pre',\n    'code',\n    'img'\n];\n\n/**\n * separating `th` and `p` to prevent its conflict with `thead` and `pre`\n *\n * @internal\n */\nexport const MARKDOWN_WHOLE_TAGS_TO_CLASS_ALIAS = [\n    'th',\n    'p'\n];\n\n/** @docs-private */\nexport const CLASS_PREFIX: string = 'kbq-markdown';\n","import { Injectable } from '@angular/core';\nimport { marked, MarkedOptions } from 'marked';\nimport { CLASS_PREFIX, MARKDOWN_TAGS_TO_CLASS_ALIAS, MARKDOWN_WHOLE_TAGS_TO_CLASS_ALIAS } from './markdown.values';\n\n/**\n * Service for converting Markdown into HTML.\n *\n * @docs-private\n */\n@Injectable({ providedIn: 'root' })\nexport class KbqMarkdownService {\n    /**\n     * Converts a given Markdown string into HTML.\n     * NOTE! Method does not sanitize the output HTML string.\n     *\n     * @param markdown - The Markdown string to be converted.\n     * @param options - Optional MarkedOptions to customize the parsing behavior.\n     * @returns The transformed HTML string.\n     */\n    parseToHtml(markdown: string, options?: MarkedOptions): string {\n        return this.transform(<string>marked.parse(markdown, options));\n    }\n\n    private transform(htmlContent: string): string {\n        let transformed = htmlContent;\n\n        MARKDOWN_TAGS_TO_CLASS_ALIAS.forEach((tag) => {\n            transformed = transformed.replace(\n                // The whole tag name: `<a` must not take `<abbr>` or `<aside>` for a link\n                new RegExp(`<${tag}(?=[\\\\s/>])`, 'g'),\n                () => `<${tag} class=\"${CLASS_PREFIX}__${tag}\"`\n            );\n        });\n\n        MARKDOWN_WHOLE_TAGS_TO_CLASS_ALIAS.forEach((tag) => {\n            transformed = transformed.replace(\n                // `\\\\s`, because a template literal eats the backslash first: `\\s` would reach the\n                // constructor as a bare `s` and match `<pss>` rather than `<p >`.\n                new RegExp(`<${tag}\\\\s*>`, 'g'),\n                (_match: string) => `<${tag} class=\"${CLASS_PREFIX}__${tag}\">`\n            );\n        });\n\n        return transformed;\n    }\n}\n","import { ContentObserver } from '@angular/cdk/observers';\nimport {\n    afterNextRender,\n    ChangeDetectionStrategy,\n    Component,\n    computed,\n    DestroyRef,\n    ElementRef,\n    inject,\n    InjectionToken,\n    input,\n    Provider,\n    signal,\n    viewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { DomSanitizer, SafeHtml } from '@angular/platform-browser';\nimport { KbqNativeScrollbar, kbqNativeScrollbarOptionsProvider } from '@koobiq/components/scrollbar';\nimport { MarkedOptions } from 'marked';\nimport { KbqMarkdownService } from './markdown.service';\n\n/** List of options for `marked` library. */\nexport const KBQ_MARKDOWN_MARKED_OPTIONS = new InjectionToken<MarkedOptions>('KBQ_MARKDOWN_MARKED_OPTIONS');\n\n/** Utility provider for `KBQ_MARKDOWN_MARKED_OPTIONS`. */\nexport const kbqMarkdownMarkedOptionsProvider = (options: MarkedOptions): Provider => ({\n    provide: KBQ_MARKDOWN_MARKED_OPTIONS,\n    useValue: options\n});\n\n/** Component which allows to convert `Markdown` into `HTML` */\n@Component({\n    selector: 'kbq-markdown',\n    // no need format line with ng-content it's broke textContent for markdownService.parseToHtml()\n    template: `\n        <pre #contentWrapper class=\"kbq-markdown__input\" ngPreserveWhitespaces><ng-content /></pre>\n        <div class=\"kbq-markdown__output\" [innerHtml]=\"resultHtml()\"></div>\n    `,\n    styleUrls: ['./markdown.scss', 'markdown-tokens.scss'],\n    // The rendered content comes from `[innerHtml]`, so its scrollbars can only be customized from the host.\n    providers: [kbqNativeScrollbarOptionsProvider({ descendants: true })],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    host: {\n        class: 'kbq-markdown'\n    },\n    hostDirectives: [KbqNativeScrollbar]\n})\nexport class KbqMarkdown {\n    private readonly markdownService = inject(KbqMarkdownService);\n    private readonly sanitizer = inject(DomSanitizer);\n    private readonly markedOptions =\n        inject<MarkedOptions | undefined>(KBQ_MARKDOWN_MARKED_OPTIONS, { optional: true }) ?? undefined;\n    private readonly contentObserver = inject(ContentObserver);\n    private readonly destroyRef = inject(DestroyRef);\n\n    private readonly contentWrapper = viewChild.required<ElementRef<HTMLPreElement>>('contentWrapper');\n\n    /** Text content projected into the component, re-read after every render that changes it. */\n    private readonly projectedText = signal<string | null>(null);\n\n    /** `Markdown` text. Falls back to the projected content while it is empty. */\n    readonly markdownText = input<string | null>(null);\n\n    /** @docs-private */\n    protected readonly resultHtml = computed<SafeHtml | null>(() => {\n        const markdown = this.markdownText() || this.projectedText();\n\n        return markdown ? this.getResultHTML(markdown) : null;\n    });\n\n    constructor() {\n        afterNextRender(() => {\n            const host = this.contentWrapper().nativeElement;\n\n            this.readProjectedText(host);\n\n            // The projected content is a standing fallback, not a one-off snapshot: a `@if` that has not\n            // resolved by the first render would otherwise freeze it at '' for the life of the component.\n            this.contentObserver\n                .observe(host)\n                .pipe(takeUntilDestroyed(this.destroyRef))\n                .subscribe(() => this.readProjectedText(host));\n        });\n    }\n\n    /** The content observer fires on any mutation, so only a real text change is worth a re-render. */\n    private readProjectedText(host: HTMLElement): void {\n        const text = host.textContent;\n\n        if (text !== this.projectedText()) {\n            this.projectedText.set(text);\n        }\n    }\n\n    private getResultHTML(markdown: string): SafeHtml {\n        return this.sanitizer.bypassSecurityTrustHtml(this.markdownService.parseToHtml(markdown, this.markedOptions));\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { KbqMarkdown } from './markdown.component';\n\nconst COMPONENTS = [\n    KbqMarkdown\n];\n\n@NgModule({\n    imports: COMPONENTS,\n    exports: COMPONENTS\n})\nexport class KbqMarkdownModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}