@dodona/papyros/dist/frontend/components/Input.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 { customElement } from "lit/decorators.js";
import { css, html } from "lit";
import "./input/BatchInput";
import "./input/InteractiveInput";
import { PapyrosElement } from "./PapyrosElement";
import "@material/web/switch/switch";
import { InputMode } from "../state/InputOutput";
let Input = class Input extends PapyrosElement {
    static get styles() {
        return css `
            label {
                display: flex;
                align-items: center;
                gap: 0.5rem;
                margin-top: 0.5rem;
            }

            :host {
                width: 100%;
                height: fit-content;
                display: block;
            }

            p-batch-input {
                height: 200px;
            }
        `;
    }
    get mode() {
        return this.papyros.io.inputMode;
    }
    get otherMode() {
        return this.mode === InputMode.batch ? InputMode.interactive : InputMode.batch;
    }
    toggleMode() {
        this.papyros.io.inputMode = this.otherMode;
    }
    render() {
        return html `
            ${this.mode === InputMode.batch
            ? html `<p-batch-input .papyros=${this.papyros}></p-batch-input>`
            : html `<p-interactive-input .papyros=${this.papyros}></p-interactive-input>`}
            <label>
                <md-switch .selected=${this.mode === InputMode.batch} @change=${() => this.toggleMode()}></md-switch>
                ${this.t(`Papyros.switch_input_mode_to.${this.otherMode}`)}
            </label>
        `;
    }
};
Input = __decorate([
    customElement("p-input")
], Input);
export { Input };
//# sourceMappingURL=Input.js.map