import { CommonModule } from '@angular/common';
import { Component, inject, Input, ViewChild, } from '@angular/core';
import { Clipboard } from '@capacitor/clipboard';
import { ToastController } from '@ionic/angular';
import { IonButton, IonIcon } from '@ionic/angular/standalone';
import * as Prism from 'prismjs';
import { I18nService } from '../../../services/i18n';
import 'prismjs/components/prism-css';
import 'prismjs/components/prism-javascript';
import 'prismjs/components/prism-markup';
import 'prismjs/components/prism-typescript';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class CodeDisplayComponent {
    constructor(cdr) {
        this.cdr = cdr;
        this.toast = inject(ToastController);
        this.i18n = inject(I18nService);
        this.selectedTab = 0;
    }
    ngOnChanges(changes) {
        if (changes['code'] || changes['language'] || changes['tabs']) {
            this.cdr.detectChanges();
            setTimeout(() => this.highlightCode());
        }
    }
    ngAfterViewInit() {
        setTimeout(() => this.highlightCode());
    }
    selectTab(i) {
        this.selectedTab = i;
        this.cdr.detectChanges();
        setTimeout(() => this.highlightCode());
    }
    highlightCode() {
        if (this.codeElement) {
            const code = this.props.tabs.length > 0 ? this.props.tabs[this.selectedTab]?.code : this.props.code;
            this.codeElement.nativeElement.textContent = code || '';
            Prism.highlightElement(this.codeElement.nativeElement);
        }
    }
    async copyToClipboard() {
        try {
            const code = this.props.tabs.length > 0 ? this.props.tabs[this.selectedTab]?.code : this.props.code;
            await Clipboard.write({ string: code || '' });
            this.presentToast(this.i18n.t('copiedToClipboard'));
        }
        catch (error) {
            console.error('Error al copiar al portapapeles:', error);
        }
    }
    async presentToast(message) {
        const toast = await this.toast.create({
            message: message,
            duration: 2000,
            position: 'bottom',
            color: 'dark',
        });
        toast.present();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CodeDisplayComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CodeDisplayComponent, isStandalone: true, selector: "val-code-display", inputs: { props: "props" }, viewQueries: [{ propertyName: "codeElement", first: true, predicate: ["codeElement"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
    <div class="code-viewer-container">
      <div class="tab-bar">
        <div
          class="tab"
          *ngFor="let tab of props.tabs; let i = index"
          [class.active]="i === selectedTab"
          (click)="selectTab(i)"
        >
          <span class="tab-label">{{ tab.label }}</span>
        </div>
      </div>
      <div class="code-content">
        <div class="copy-button-wrapper">
          <ion-button fill="clear" class="copy-button" (click)="copyToClipboard()">
            <ion-icon name="copy-outline"></ion-icon>
          </ion-button>
        </div>
        <pre><code [class]="'language-' + (props.tabs[selectedTab]?.language || props.language)" #codeElement></code></pre>
      </div>
    </div>
  `, isInline: true, styles: ["@charset \"UTF-8\";:root{--val-container-sm: 540px;--val-container-md: 720px;--val-container-lg: 880px;--val-container-xl: 1100px;--val-container-padding: 16px;--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8;--swiper-pagination-color: var(--ion-color-primary);--swiper-navigation-color: var(--ion-color-primary);--swiper-pagination-bullet-inactive-color: var(--ion-color-medium)}body.dark,html.ion-palette-dark,body[data-theme=dark]{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143, 73, 248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.code-viewer-container{background-color:#fff;border-radius:24px;overflow:hidden;box-shadow:0 2px 4px #0000000d;border:1px solid #f2f6f7;position:relative;min-width:320px;max-width:100%}.tab-bar{display:flex;background:#f6f9fa;border-bottom:1px solid #f2f6f7;gap:2px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#e0e0e0 #f6f9fa;-webkit-overflow-scrolling:touch;max-width:100%;font-size:.75rem}.tab-bar::-webkit-scrollbar{height:6px;background:#f6f9fa}.tab-bar::-webkit-scrollbar-thumb{background:#e0e0e0;border-radius:4px}.tab{padding:10px 18px 8px;font-family:Roboto Mono,monospace;font-size:.95em;color:#899396;cursor:pointer;border-radius:8px 8px 0 0;background:transparent;transition:background .2s,color .2s;margin-bottom:-1px;border:1px solid transparent;border-bottom:none}.tab:hover{background:#e8eef2}.tab.active{background:#fff;color:#19422d;border:1px solid #f2f6f7;border-bottom:1px solid #ffffff;z-index:2}.tab-label{font-weight:500}.code-content{overflow-x:auto;overflow-y:auto;max-height:30rem;min-height:5rem;background:#fff;position:relative}.language-badge{position:absolute;top:15px;left:15px;background:#f6f9fa;color:#899396;font-family:Roboto Mono,monospace;font-size:.8em;font-weight:500;border-radius:6px;padding:2px 8px;z-index:3;pointer-events:none;text-transform:uppercase}.copy-button-wrapper{position:sticky;top:10px;float:right;z-index:10;height:0;margin-right:15px}.copy-button{--padding-start: 2px;--padding-end: 2px;--padding-top: 2px;--padding-bottom: 2px;min-width:28px;min-height:28px;height:28px;width:28px;color:var(--ion-color-primary);background:#ffffffb3;border-radius:6px;box-shadow:0 1px 4px #0000000d;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease,background .2s ease}.code-content:hover .copy-button{opacity:1}.copy-button:hover{background:#ffffffe6}.copy-button ion-icon{font-size:1.2em;margin:0}pre{margin:0;padding:0;background-color:transparent;min-width:100%;min-height:100%;white-space:pre;word-break:normal;font-family:Roboto Mono,monospace}code{font-family:Roboto Mono,monospace;font-size:.9em;line-height:1.5;display:block;white-space:inherit;word-break:normal}@media (max-width: 600px){.code-viewer-container{border-radius:24px}.tab-bar{font-size:.6875rem}.language-badge{font-size:.7em;padding:1px 6px;top:10px;left:10px}.copy-button-wrapper{margin-right:10px}.code-content{max-height:20rem}code{font-size:.7em}}@media (min-width: 600px){code{font-size:.8em}}:host-context(.dark) .code-viewer-container,:host-context(.ion-palette-dark) .code-viewer-container,:host-context(html.ion-palette-dark) .code-viewer-container,:host-context(body.dark) .code-viewer-container,:host-context([data-theme=dark]) .code-viewer-container{background-color:#21252b;box-shadow:0 4px 15px #0009;border:1px solid #3b4048}:host-context(.dark) .tab-bar,:host-context(.ion-palette-dark) .tab-bar,:host-context(html.ion-palette-dark) .tab-bar,:host-context(body.dark) .tab-bar,:host-context([data-theme=dark]) .tab-bar{background:#1a1a1a;border-bottom:1px solid #3b4048;scrollbar-color:#3b4048 #1a1a1a}:host-context(.dark) .tab-bar::-webkit-scrollbar,:host-context(.ion-palette-dark) .tab-bar::-webkit-scrollbar,:host-context(html.ion-palette-dark) .tab-bar::-webkit-scrollbar,:host-context(body.dark) .tab-bar::-webkit-scrollbar,:host-context([data-theme=dark]) .tab-bar::-webkit-scrollbar{background:#1a1a1a}:host-context(.dark) .tab-bar::-webkit-scrollbar-thumb,:host-context(.ion-palette-dark) .tab-bar::-webkit-scrollbar-thumb,:host-context(html.ion-palette-dark) .tab-bar::-webkit-scrollbar-thumb,:host-context(body.dark) .tab-bar::-webkit-scrollbar-thumb,:host-context([data-theme=dark]) .tab-bar::-webkit-scrollbar-thumb{background:#3b4048}:host-context(.dark) .tab,:host-context(.ion-palette-dark) .tab,:host-context(html.ion-palette-dark) .tab,:host-context(body.dark) .tab,:host-context([data-theme=dark]) .tab{color:#8b949e}:host-context(.dark) .tab:hover,:host-context(.ion-palette-dark) .tab:hover,:host-context(html.ion-palette-dark) .tab:hover,:host-context(body.dark) .tab:hover,:host-context([data-theme=dark]) .tab:hover{background:#21252b}:host-context(.dark) .tab.active,:host-context(.ion-palette-dark) .tab.active,:host-context(html.ion-palette-dark) .tab.active,:host-context(body.dark) .tab.active,:host-context([data-theme=dark]) .tab.active{background:#282c34;color:#c9d1d9;border:1px solid #3b4048;border-bottom:1px solid #282c34}:host-context(.dark) .code-content,:host-context(.ion-palette-dark) .code-content,:host-context(html.ion-palette-dark) .code-content,:host-context(body.dark) .code-content,:host-context([data-theme=dark]) .code-content{background:#161b22}:host-context(.dark) .language-badge,:host-context(.ion-palette-dark) .language-badge,:host-context(html.ion-palette-dark) .language-badge,:host-context(body.dark) .language-badge,:host-context([data-theme=dark]) .language-badge{background:#3e4451;color:#8b949e}:host-context(.dark) .copy-button,:host-context(.ion-palette-dark) .copy-button,:host-context(html.ion-palette-dark) .copy-button,:host-context(body.dark) .copy-button,:host-context([data-theme=dark]) .copy-button{background:#0006}:host-context(.dark) .copy-button:hover,:host-context(.ion-palette-dark) .copy-button:hover,:host-context(html.ion-palette-dark) .copy-button:hover,:host-context(body.dark) .copy-button:hover,:host-context([data-theme=dark]) .copy-button:hover{background:#0009}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CodeDisplayComponent, decorators: [{
            type: Component,
            args: [{ selector: 'val-code-display', standalone: true, imports: [CommonModule, IonIcon, IonButton], template: `
    <div class="code-viewer-container">
      <div class="tab-bar">
        <div
          class="tab"
          *ngFor="let tab of props.tabs; let i = index"
          [class.active]="i === selectedTab"
          (click)="selectTab(i)"
        >
          <span class="tab-label">{{ tab.label }}</span>
        </div>
      </div>
      <div class="code-content">
        <div class="copy-button-wrapper">
          <ion-button fill="clear" class="copy-button" (click)="copyToClipboard()">
            <ion-icon name="copy-outline"></ion-icon>
          </ion-button>
        </div>
        <pre><code [class]="'language-' + (props.tabs[selectedTab]?.language || props.language)" #codeElement></code></pre>
      </div>
    </div>
  `, styles: ["@charset \"UTF-8\";:root{--val-container-sm: 540px;--val-container-md: 720px;--val-container-lg: 880px;--val-container-xl: 1100px;--val-container-padding: 16px;--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8;--swiper-pagination-color: var(--ion-color-primary);--swiper-navigation-color: var(--ion-color-primary);--swiper-pagination-bullet-inactive-color: var(--ion-color-medium)}body.dark,html.ion-palette-dark,body[data-theme=dark]{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143, 73, 248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.code-viewer-container{background-color:#fff;border-radius:24px;overflow:hidden;box-shadow:0 2px 4px #0000000d;border:1px solid #f2f6f7;position:relative;min-width:320px;max-width:100%}.tab-bar{display:flex;background:#f6f9fa;border-bottom:1px solid #f2f6f7;gap:2px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#e0e0e0 #f6f9fa;-webkit-overflow-scrolling:touch;max-width:100%;font-size:.75rem}.tab-bar::-webkit-scrollbar{height:6px;background:#f6f9fa}.tab-bar::-webkit-scrollbar-thumb{background:#e0e0e0;border-radius:4px}.tab{padding:10px 18px 8px;font-family:Roboto Mono,monospace;font-size:.95em;color:#899396;cursor:pointer;border-radius:8px 8px 0 0;background:transparent;transition:background .2s,color .2s;margin-bottom:-1px;border:1px solid transparent;border-bottom:none}.tab:hover{background:#e8eef2}.tab.active{background:#fff;color:#19422d;border:1px solid #f2f6f7;border-bottom:1px solid #ffffff;z-index:2}.tab-label{font-weight:500}.code-content{overflow-x:auto;overflow-y:auto;max-height:30rem;min-height:5rem;background:#fff;position:relative}.language-badge{position:absolute;top:15px;left:15px;background:#f6f9fa;color:#899396;font-family:Roboto Mono,monospace;font-size:.8em;font-weight:500;border-radius:6px;padding:2px 8px;z-index:3;pointer-events:none;text-transform:uppercase}.copy-button-wrapper{position:sticky;top:10px;float:right;z-index:10;height:0;margin-right:15px}.copy-button{--padding-start: 2px;--padding-end: 2px;--padding-top: 2px;--padding-bottom: 2px;min-width:28px;min-height:28px;height:28px;width:28px;color:var(--ion-color-primary);background:#ffffffb3;border-radius:6px;box-shadow:0 1px 4px #0000000d;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease,background .2s ease}.code-content:hover .copy-button{opacity:1}.copy-button:hover{background:#ffffffe6}.copy-button ion-icon{font-size:1.2em;margin:0}pre{margin:0;padding:0;background-color:transparent;min-width:100%;min-height:100%;white-space:pre;word-break:normal;font-family:Roboto Mono,monospace}code{font-family:Roboto Mono,monospace;font-size:.9em;line-height:1.5;display:block;white-space:inherit;word-break:normal}@media (max-width: 600px){.code-viewer-container{border-radius:24px}.tab-bar{font-size:.6875rem}.language-badge{font-size:.7em;padding:1px 6px;top:10px;left:10px}.copy-button-wrapper{margin-right:10px}.code-content{max-height:20rem}code{font-size:.7em}}@media (min-width: 600px){code{font-size:.8em}}:host-context(.dark) .code-viewer-container,:host-context(.ion-palette-dark) .code-viewer-container,:host-context(html.ion-palette-dark) .code-viewer-container,:host-context(body.dark) .code-viewer-container,:host-context([data-theme=dark]) .code-viewer-container{background-color:#21252b;box-shadow:0 4px 15px #0009;border:1px solid #3b4048}:host-context(.dark) .tab-bar,:host-context(.ion-palette-dark) .tab-bar,:host-context(html.ion-palette-dark) .tab-bar,:host-context(body.dark) .tab-bar,:host-context([data-theme=dark]) .tab-bar{background:#1a1a1a;border-bottom:1px solid #3b4048;scrollbar-color:#3b4048 #1a1a1a}:host-context(.dark) .tab-bar::-webkit-scrollbar,:host-context(.ion-palette-dark) .tab-bar::-webkit-scrollbar,:host-context(html.ion-palette-dark) .tab-bar::-webkit-scrollbar,:host-context(body.dark) .tab-bar::-webkit-scrollbar,:host-context([data-theme=dark]) .tab-bar::-webkit-scrollbar{background:#1a1a1a}:host-context(.dark) .tab-bar::-webkit-scrollbar-thumb,:host-context(.ion-palette-dark) .tab-bar::-webkit-scrollbar-thumb,:host-context(html.ion-palette-dark) .tab-bar::-webkit-scrollbar-thumb,:host-context(body.dark) .tab-bar::-webkit-scrollbar-thumb,:host-context([data-theme=dark]) .tab-bar::-webkit-scrollbar-thumb{background:#3b4048}:host-context(.dark) .tab,:host-context(.ion-palette-dark) .tab,:host-context(html.ion-palette-dark) .tab,:host-context(body.dark) .tab,:host-context([data-theme=dark]) .tab{color:#8b949e}:host-context(.dark) .tab:hover,:host-context(.ion-palette-dark) .tab:hover,:host-context(html.ion-palette-dark) .tab:hover,:host-context(body.dark) .tab:hover,:host-context([data-theme=dark]) .tab:hover{background:#21252b}:host-context(.dark) .tab.active,:host-context(.ion-palette-dark) .tab.active,:host-context(html.ion-palette-dark) .tab.active,:host-context(body.dark) .tab.active,:host-context([data-theme=dark]) .tab.active{background:#282c34;color:#c9d1d9;border:1px solid #3b4048;border-bottom:1px solid #282c34}:host-context(.dark) .code-content,:host-context(.ion-palette-dark) .code-content,:host-context(html.ion-palette-dark) .code-content,:host-context(body.dark) .code-content,:host-context([data-theme=dark]) .code-content{background:#161b22}:host-context(.dark) .language-badge,:host-context(.ion-palette-dark) .language-badge,:host-context(html.ion-palette-dark) .language-badge,:host-context(body.dark) .language-badge,:host-context([data-theme=dark]) .language-badge{background:#3e4451;color:#8b949e}:host-context(.dark) .copy-button,:host-context(.ion-palette-dark) .copy-button,:host-context(html.ion-palette-dark) .copy-button,:host-context(body.dark) .copy-button,:host-context([data-theme=dark]) .copy-button{background:#0006}:host-context(.dark) .copy-button:hover,:host-context(.ion-palette-dark) .copy-button:hover,:host-context(html.ion-palette-dark) .copy-button:hover,:host-context(body.dark) .copy-button:hover,:host-context([data-theme=dark]) .copy-button:hover{background:#0009}\n"] }]
        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { codeElement: [{
                type: ViewChild,
                args: ['codeElement']
            }], props: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 