// 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 './contextual_action_menu.js';
import './contextual_entrypoint_button.js';
import { I18nMixinLit } from '//resources/cr_elements/i18n_mixin_lit.js';
import { loadTimeData } from '//resources/js/load_time_data.js';
import { CrLitElement } from '//resources/lit/v3_0/lit.rollup.js';
import { GlifAnimationState, TabSuggestionsState } from './common.js';
import { getCss } from './contextual_entrypoint_and_menu.css.js';
import { getHtml } from './contextual_entrypoint_and_menu.html.js';
const ContextualEntrypointAndMenuElementBase = I18nMixinLit(CrLitElement);
export class ContextualEntrypointAndMenuElement extends ContextualEntrypointAndMenuElementBase {
    static get is() {
        return 'cr-composebox-contextual-entrypoint-and-menu';
    }
    static get styles() {
        return getCss();
    }
    render() {
        return getHtml.bind(this)();
    }
    static get properties() {
        return {
            // =========================================================================
            // Public properties
            // =========================================================================
            fileNum: { type: Number },
            nonTabFileNum: { type: Number },
            showContextMenuDescription: { type: Boolean },
            smartTabSharingActive: { type: Boolean },
            smartTabSharingVisible: { type: Boolean },
            contextManagementInComposeboxEnabled: { type: Boolean },
            hasImageFiles: {
                reflect: true,
                type: Boolean,
            },
            disabledTabIds: { type: Object },
            aimThreadRestoredTabs: { type: Array },
            tabSuggestions: { type: Array },
            inputState: { type: Object },
            tabSuggestionsState: { type: Number },
            glifAnimationState: { type: String },
            searchboxLayoutMode: { type: String },
            uploadButtonDisabled: { type: Boolean },
            disableAutoReposition: { type: Boolean },
            isSidePanel: { type: Boolean },
            usePecApi: { type: Boolean },
            energyEffectAnimationEnabled: { type: Boolean, reflect: true },
            disableFallbackGlifAnimation: { type: Boolean },
            recentTabId: { type: Number },
            shareTabsFlyoutOpen: { type: Boolean },
            // =========================================================================
            // Protected properties
            // =========================================================================
            enableMultiTabSelection_: {
                reflect: true,
                type: Boolean,
            },
            sharedTabs: { type: Array },
        };
    }
    #fileNum_accessor_storage = 0;
    get fileNum() { return this.#fileNum_accessor_storage; }
    set fileNum(value) { this.#fileNum_accessor_storage = value; }
    #nonTabFileNum_accessor_storage = 0;
    get nonTabFileNum() { return this.#nonTabFileNum_accessor_storage; }
    set nonTabFileNum(value) { this.#nonTabFileNum_accessor_storage = value; }
    #showContextMenuDescription_accessor_storage = false;
    get showContextMenuDescription() { return this.#showContextMenuDescription_accessor_storage; }
    set showContextMenuDescription(value) { this.#showContextMenuDescription_accessor_storage = value; }
    #smartTabSharingActive_accessor_storage = false;
    get smartTabSharingActive() { return this.#smartTabSharingActive_accessor_storage; }
    set smartTabSharingActive(value) { this.#smartTabSharingActive_accessor_storage = value; }
    #smartTabSharingVisible_accessor_storage = false;
    get smartTabSharingVisible() { return this.#smartTabSharingVisible_accessor_storage; }
    set smartTabSharingVisible(value) { this.#smartTabSharingVisible_accessor_storage = value; }
    #contextManagementInComposeboxEnabled_accessor_storage = false;
    get contextManagementInComposeboxEnabled() { return this.#contextManagementInComposeboxEnabled_accessor_storage; }
    set contextManagementInComposeboxEnabled(value) { this.#contextManagementInComposeboxEnabled_accessor_storage = value; }
    #disabledTabIds_accessor_storage = new Map();
    get disabledTabIds() { return this.#disabledTabIds_accessor_storage; }
    set disabledTabIds(value) { this.#disabledTabIds_accessor_storage = value; }
    #aimThreadRestoredTabs_accessor_storage = [];
    get aimThreadRestoredTabs() { return this.#aimThreadRestoredTabs_accessor_storage; }
    set aimThreadRestoredTabs(value) { this.#aimThreadRestoredTabs_accessor_storage = value; }
    #tabSuggestions_accessor_storage = [];
    get tabSuggestions() { return this.#tabSuggestions_accessor_storage; }
    set tabSuggestions(value) { this.#tabSuggestions_accessor_storage = value; }
    #inputState_accessor_storage = null;
    get inputState() { return this.#inputState_accessor_storage; }
    set inputState(value) { this.#inputState_accessor_storage = value; }
    #glifAnimationState_accessor_storage = GlifAnimationState.INELIGIBLE;
    get glifAnimationState() { return this.#glifAnimationState_accessor_storage; }
    set glifAnimationState(value) { this.#glifAnimationState_accessor_storage = value; }
    #uploadButtonDisabled_accessor_storage = false;
    get uploadButtonDisabled() { return this.#uploadButtonDisabled_accessor_storage; }
    set uploadButtonDisabled(value) { this.#uploadButtonDisabled_accessor_storage = value; }
    #sharedTabs_accessor_storage = [];
    get sharedTabs() { return this.#sharedTabs_accessor_storage; }
    set sharedTabs(value) { this.#sharedTabs_accessor_storage = value; }
    #recentTabId_accessor_storage = null;
    get recentTabId() { return this.#recentTabId_accessor_storage; }
    set recentTabId(value) { this.#recentTabId_accessor_storage = value; }
    #shareTabsFlyoutOpen_accessor_storage = false;
    get shareTabsFlyoutOpen() { return this.#shareTabsFlyoutOpen_accessor_storage; }
    set shareTabsFlyoutOpen(value) { this.#shareTabsFlyoutOpen_accessor_storage = value; }
    #tabSuggestionsState_accessor_storage = TabSuggestionsState.NOT_STARTED;
    get tabSuggestionsState() { return this.#tabSuggestionsState_accessor_storage; }
    set tabSuggestionsState(value) { this.#tabSuggestionsState_accessor_storage = value; }
    menuOpenDelayMs = 200;
    openTimeoutId_ = null;
    #hasImageFiles_accessor_storage = false;
    get hasImageFiles() { return this.#hasImageFiles_accessor_storage; }
    set hasImageFiles(value) { this.#hasImageFiles_accessor_storage = value; }
    #searchboxLayoutMode_accessor_storage = '';
    get searchboxLayoutMode() { return this.#searchboxLayoutMode_accessor_storage; }
    set searchboxLayoutMode(value) { this.#searchboxLayoutMode_accessor_storage = value; }
    #disableAutoReposition_accessor_storage = false;
    get disableAutoReposition() { return this.#disableAutoReposition_accessor_storage; }
    set disableAutoReposition(value) { this.#disableAutoReposition_accessor_storage = value; }
    #usePecApi_accessor_storage = false;
    get usePecApi() { return this.#usePecApi_accessor_storage; }
    set usePecApi(value) { this.#usePecApi_accessor_storage = value; }
    #energyEffectAnimationEnabled_accessor_storage = false;
    get energyEffectAnimationEnabled() { return this.#energyEffectAnimationEnabled_accessor_storage; }
    set energyEffectAnimationEnabled(value) { this.#energyEffectAnimationEnabled_accessor_storage = value; }
    #isSidePanel_accessor_storage = false;
    get isSidePanel() { return this.#isSidePanel_accessor_storage; }
    set isSidePanel(value) { this.#isSidePanel_accessor_storage = value; }
    #disableFallbackGlifAnimation_accessor_storage = false;
    get disableFallbackGlifAnimation() { return this.#disableFallbackGlifAnimation_accessor_storage; }
    set disableFallbackGlifAnimation(value) { this.#disableFallbackGlifAnimation_accessor_storage = value; }
    #enableMultiTabSelection__accessor_storage = loadTimeData.getBoolean('composeboxContextMenuEnableMultiTabSelection');
    get enableMultiTabSelection_() { return this.#enableMultiTabSelection__accessor_storage; }
    set enableMultiTabSelection_(value) { this.#enableMultiTabSelection__accessor_storage = value; }
    // TODO(crbug.com/499310611): Explore avoiding/removing this local property.
    shouldOpenMenuForMultiSelection_ = false;
    openMenuForMultiSelection() {
        if (this.enableMultiTabSelection_) {
            this.shouldOpenMenuForMultiSelection_ = true;
            this.requestUpdate();
        }
    }
    getEntrypointElements_() {
        const entrypointButton = this.shadowRoot?.querySelector('#entrypointButton');
        const entrypoint = entrypointButton?.shadowRoot?.querySelector('#entrypoint');
        return { entrypointButton, entrypoint };
    }
    disconnectedCallback() {
        super.disconnectedCallback();
        if (this.openTimeoutId_ !== null) {
            window.clearTimeout(this.openTimeoutId_);
            this.openTimeoutId_ = null;
        }
    }
    updated(changedProperties) {
        super.updated(changedProperties);
        if (changedProperties.has('tabSuggestionsState')) {
            if (this.tabSuggestionsState !== TabSuggestionsState.LOADING &&
                this.openTimeoutId_ !== null) {
                window.clearTimeout(this.openTimeoutId_);
                this.openTimeoutId_ = null;
                this.$.menu.updateComplete.then(() => {
                    this.showMenuAtEntrypoint_();
                });
            }
        }
        if (this.shouldOpenMenuForMultiSelection_) {
            const { entrypointButton, entrypoint } = this.getEntrypointElements_();
            // Clear the flag if the entrypoint is fully or partially rendered, or if
            // inputState is truthy (valid) but the entrypoint is not rendered
            // (ex: because `hasAllowedInputs()` returned false based on
            // `usePecApi` or disabled inputs) to prevent a delayed pop open.
            if (entrypoint || entrypointButton || this.inputState) {
                this.shouldOpenMenuForMultiSelection_ = false;
            }
            if (entrypoint) {
                this.showMenuAtEntrypoint_();
            }
            else if (entrypointButton) {
                // Button is in the DOM but hasn't finished rendering its own shadow
                // root.
                entrypointButton.updateComplete.then(() => {
                    this.showMenuAtEntrypoint_();
                });
            }
        }
    }
    closeMenu() {
        const menu = this.shadowRoot.querySelector('#menu');
        if (menu) {
            menu.close();
        }
    }
    onMenuClose_() {
        const { entrypointButton } = this.getEntrypointElements_();
        if (entrypointButton) {
            entrypointButton.classList.remove('menu-open');
        }
        this.fire('context-menu-closed');
    }
    onContextMenuEntrypointClick_() {
        if (this.openTimeoutId_ !== null) {
            return;
        }
        if (this.tabSuggestionsState === TabSuggestionsState.NOT_STARTED) {
            this.tabSuggestionsState = TabSuggestionsState.LOADING;
            this.fire('request-tab-suggestions-load');
        }
        if (this.tabSuggestionsState === TabSuggestionsState.LOADING) {
            this.openTimeoutId_ = window.setTimeout(() => {
                this.openTimeoutId_ = null;
                this.showMenuAtEntrypoint_();
            }, this.menuOpenDelayMs);
        }
        else {
            this.showMenuAtEntrypoint_();
        }
    }
    onContextMenuEntrypointHover_() {
        this.fire('context-menu-entrypoint-hover');
    }
    async showMenuAtEntrypoint_() {
        const { entrypointButton, entrypoint } = this.getEntrypointElements_();
        if (entrypointButton && entrypoint) {
            entrypointButton.classList.add('menu-open');
            await this.updateComplete;
            await this.$.menu.updateComplete;
            if (!this.$.menu.open) {
                this.$.menu.showAt(entrypoint);
                this.fire('context-menu-opened');
            }
        }
    }
}
customElements.define(ContextualEntrypointAndMenuElement.is, ContextualEntrypointAndMenuElement);
