@dodona/papyros/dist/frontend/components/Debugger.js

Scratchpad for multiple programming languages in the browser.

var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { css, html } from "lit";
import "@dodona/trace-component";
import { customElement } from "lit/decorators.js";
import { PapyrosElement } from "./PapyrosElement";
let Debugger = class Debugger extends PapyrosElement {
    static get styles() {
        return css `
            :host {
                display: block;
                height: 100%;

                /* Base / surface */
                --tc-surface-color: var(--md-sys-color-surface-container);
                --tc-on-surface-color: var(--md-sys-color-on-surface);
                --tc-surface-container-color: var(--md-sys-color-surface-container-highest);
                --tc-outline-color: var(--md-sys-color-outline);
                --tc-outline-variant-color: var(--md-sys-color-outline-variant);
                --tc-primary-color: var(--md-sys-color-primary);

                /* Secondary */
                --tc-secondary-surface-color: var(
                    --md-sys-color-secondary-surface,
                    var(--md-sys-color-secondary-container)
                );
                --tc-secondary-on-surface-color: var(
                    --md-sys-color-on-secondary-surface,
                    var(--md-sys-color-on-secondary-container)
                );
                --tc-secondary-surface-container-color: var(--md-sys-color-secondary-container);
                --tc-secondary-outline-color: var(--md-sys-color-secondary-outline, var(--md-sys-color-outline));
                --tc-secondary-color: var(--md-sys-color-secondary);

                /* Tertiary */
                --tc-tertiary-surface-color: var(
                    --md-sys-color-tertiary-surface,
                    var(--md-sys-color-tertiary-container)
                );
                --tc-tertiary-on-surface-color: var(
                    --md-sys-color-on-tertiary-surface,
                    var(--md-sys-color-on-tertiary-container)
                );
                --tc-tertiary-surface-container-color: var(--md-sys-color-tertiary-container);
                --tc-tertiary-outline-color: var(--md-sys-color-tertiary-outline, var(--md-sys-color-outline));
                --tc-tertiary-color: var(--md-sys-color-tertiary);
            }

            .place-holder {
                color: var(--md-sys-color-on-surface);
                opacity: 0.5;
            }
        `;
    }
    render() {
        var _a;
        if (!this.papyros.debugger.active || this.papyros.debugger.trace.length === 0) {
            return html `<div class="place-holder">${this.t("Papyros.debug_placeholder")}</div>`;
        }
        return html `<tc-trace
            .trace=${this.papyros.debugger.trace}
            .translations=${this.papyros.i18n.getTranslations("Papyros.debugger")}
            .selectedFrame=${(_a = this.papyros.debugger.activeFrame) !== null && _a !== void 0 ? _a : 0}
            @frame-change=${(e) => {
            this.papyros.debugger.activeFrame = e.detail.frame;
        }}
        ></tc-trace>`;
    }
};
Debugger = __decorate([
    customElement("p-debugger")
], Debugger);
export { Debugger };
//# sourceMappingURL=Debugger.js.map