import { CommonModule } from '@angular/common';
import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class AnimatedTerminalComponent {
    constructor() {
        this.props = { lines: [] };
    }
    getDelay(index) {
        const delay = this.props.lineDelay ?? 0.45;
        return `${index * delay + 0.2}s`;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AnimatedTerminalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: AnimatedTerminalComponent, isStandalone: true, selector: "val-animated-terminal", inputs: { props: "props" }, ngImport: i0, template: `
    <div
      class="terminal"
      [class.rounded]="props.rounded !== false"
      [ngStyle]="{ background: props.background || '#0c0818' }"
    >
      <div class="terminal-header" [ngStyle]="{ background: props.headerBackground || '#161b22' }">
        <div class="terminal-dot dot-red"></div>
        <div class="terminal-dot dot-yellow"></div>
        <div class="terminal-dot dot-green"></div>
        <span class="terminal-title">{{ props.title || 'bash' }}</span>
      </div>
      <div class="terminal-body">
        @for (line of props.lines; track $index; let i = $index) {
          <div class="line" [style.animation-delay]="getDelay(i)">
            @switch (line.type) {
              @case ('prompt') {
                <span class="prompt-text">{{ props.prompt || '~' }} $ </span
                ><span class="command-text">{{ line.content }}</span>
              }
              @case ('arrow') {
                <span class="arrow-icon">→ </span><span class="arrow-text">{{ line.content }}</span>
              }
              @case ('success') {
                <span class="success-icon">✓ </span><span class="success-text">{{ line.content }}</span>
              }
              @case ('error') {
                <span class="error-text">✗ {{ line.content }}</span>
              }
              @default {
                <span class="output-text">{{ line.content }}</span>
              }
            }
          </div>
        }
        <div class="line" [style.animation-delay]="getDelay(props.lines.length)">
          <span class="prompt-text">{{ props.prompt || '~' }} $ </span><span class="cursor"></span>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [":host{display:block;width:100%}.terminal{width:100%;overflow:hidden;box-shadow:0 24px 60px #00000073}.terminal.rounded{border-radius:16px}.terminal-header{padding:12px 16px;display:flex;align-items:center;gap:8px}.terminal-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}.dot-red{background:#ff5f56}.dot-yellow{background:#ffbd2e}.dot-green{background:#27ca40}.terminal-title{flex:1;text-align:center;color:#8b949e;font-size:.8rem;font-family:ui-monospace,Fira Code,Monaco,Consolas,monospace}.terminal-body{padding:20px 24px 24px;font-family:ui-monospace,Fira Code,Monaco,Consolas,monospace;font-size:.875rem;line-height:1.9}.line{opacity:0;animation:terminalFadeIn .25s ease forwards;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@keyframes terminalFadeIn{to{opacity:1}}.prompt-text{color:#7ee787}.command-text{color:#c9d1d9}.arrow-icon{color:#c8aafd}.arrow-text{color:#8b949e}.success-icon{color:#4ade80;font-weight:700}.success-text{color:#4ade80}.error-text{color:#f85149}.output-text{color:#8b949e}.cursor{display:inline-block;width:9px;height:1em;background:#7ee787;margin-left:2px;vertical-align:text-bottom;animation:terminalBlink 1s step-end infinite}@keyframes terminalBlink{0%,to{opacity:1}50%{opacity:0}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AnimatedTerminalComponent, decorators: [{
            type: Component,
            args: [{ selector: 'val-animated-terminal', standalone: true, imports: [CommonModule], template: `
    <div
      class="terminal"
      [class.rounded]="props.rounded !== false"
      [ngStyle]="{ background: props.background || '#0c0818' }"
    >
      <div class="terminal-header" [ngStyle]="{ background: props.headerBackground || '#161b22' }">
        <div class="terminal-dot dot-red"></div>
        <div class="terminal-dot dot-yellow"></div>
        <div class="terminal-dot dot-green"></div>
        <span class="terminal-title">{{ props.title || 'bash' }}</span>
      </div>
      <div class="terminal-body">
        @for (line of props.lines; track $index; let i = $index) {
          <div class="line" [style.animation-delay]="getDelay(i)">
            @switch (line.type) {
              @case ('prompt') {
                <span class="prompt-text">{{ props.prompt || '~' }} $ </span
                ><span class="command-text">{{ line.content }}</span>
              }
              @case ('arrow') {
                <span class="arrow-icon">→ </span><span class="arrow-text">{{ line.content }}</span>
              }
              @case ('success') {
                <span class="success-icon">✓ </span><span class="success-text">{{ line.content }}</span>
              }
              @case ('error') {
                <span class="error-text">✗ {{ line.content }}</span>
              }
              @default {
                <span class="output-text">{{ line.content }}</span>
              }
            }
          </div>
        }
        <div class="line" [style.animation-delay]="getDelay(props.lines.length)">
          <span class="prompt-text">{{ props.prompt || '~' }} $ </span><span class="cursor"></span>
        </div>
      </div>
    </div>
  `, styles: [":host{display:block;width:100%}.terminal{width:100%;overflow:hidden;box-shadow:0 24px 60px #00000073}.terminal.rounded{border-radius:16px}.terminal-header{padding:12px 16px;display:flex;align-items:center;gap:8px}.terminal-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}.dot-red{background:#ff5f56}.dot-yellow{background:#ffbd2e}.dot-green{background:#27ca40}.terminal-title{flex:1;text-align:center;color:#8b949e;font-size:.8rem;font-family:ui-monospace,Fira Code,Monaco,Consolas,monospace}.terminal-body{padding:20px 24px 24px;font-family:ui-monospace,Fira Code,Monaco,Consolas,monospace;font-size:.875rem;line-height:1.9}.line{opacity:0;animation:terminalFadeIn .25s ease forwards;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@keyframes terminalFadeIn{to{opacity:1}}.prompt-text{color:#7ee787}.command-text{color:#c9d1d9}.arrow-icon{color:#c8aafd}.arrow-text{color:#8b949e}.success-icon{color:#4ade80;font-weight:700}.success-text{color:#4ade80}.error-text{color:#f85149}.output-text{color:#8b949e}.cursor{display:inline-block;width:9px;height:1em;background:#7ee787;margin-left:2px;vertical-align:text-bottom;animation:terminalBlink 1s step-end infinite}@keyframes terminalBlink{0%,to{opacity:1}50%{opacity:0}}\n"] }]
        }], propDecorators: { props: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 