// Copyright 2026 The Chromium Authors
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import { assert } from 'chrome://resources/js/assert.js';
import { CrLitElement } from 'chrome://resources/lit/v3_0/lit.rollup.js';
import { getCss } from './text_overlay.css.js';
import { getHtml } from './text_overlay.html.js';
const STEP_INTERVAL_MS = 3000;
const TOTAL_STEPS = 3;
const TEXT_ENTRY_DELAY_MS = 800;
export class IndigoTextOverlayElement extends CrLitElement {
    static get is() {
        return 'indigo-text-overlay';
    }
    static get styles() {
        return getCss();
    }
    render() {
        return getHtml.bind(this)();
    }
    static get properties() {
        return {
            currentStep_: { type: Number },
            showIcon_: { type: Boolean },
        };
    }
    connectedCallback() {
        super.connectedCallback();
        this.style.setProperty('--indigo-text-entry-delay', `${TEXT_ENTRY_DELAY_MS}ms`);
    }
    disconnectedCallback() {
        super.disconnectedCallback();
        this.stopSequence();
    }
    #currentStep__accessor_storage = 0;
    get currentStep_() { return this.#currentStep__accessor_storage; }
    set currentStep_(value) { this.#currentStep__accessor_storage = value; }
    #showIcon__accessor_storage = false;
    get showIcon_() { return this.#showIcon__accessor_storage; }
    set showIcon_(value) { this.#showIcon__accessor_storage = value; }
    stepTimer_ = null;
    entryTimeout_ = null;
    startSequence() {
        this.stopSequence();
        this.showIcon_ = true;
        this.entryTimeout_ = window.setTimeout(() => {
            this.currentStep_ = 1;
            this.entryTimeout_ = null;
            this.stepTimer_ = window.setInterval(() => {
                if (this.currentStep_ < TOTAL_STEPS) {
                    this.currentStep_++;
                }
                else {
                    this.clearStepTimer_();
                }
            }, STEP_INTERVAL_MS);
        }, TEXT_ENTRY_DELAY_MS);
    }
    stopSequence() {
        this.clearStepTimer_();
        if (this.entryTimeout_ !== null) {
            window.clearTimeout(this.entryTimeout_);
            this.entryTimeout_ = null;
        }
        this.currentStep_ = 0;
        this.showIcon_ = false;
    }
    clearStepTimer_() {
        if (this.stepTimer_ !== null) {
            window.clearInterval(this.stepTimer_);
            this.stepTimer_ = null;
        }
    }
    getStepClass_(step) {
        assert(step > 0);
        const previousStep = this.currentStep_ - 1;
        if (step === previousStep) {
            return 'wipe-out';
        }
        if (step === this.currentStep_) {
            return 'wipe-in';
        }
        return 'hidden';
    }
}
customElements.define(IndigoTextOverlayElement.is, IndigoTextOverlayElement);
