From 6bf0a5cb5034a7e684dcc3500e841785237ce2dd Mon Sep 17 00:00:00 2001 From: Daniel Baumann Date: Sun, 7 Apr 2024 19:32:43 +0200 Subject: Adding upstream version 1:115.7.0. Signed-off-by: Daniel Baumann --- .../content/extension-action-button.mjs | 148 +++++++++++++++++++++ 1 file changed, 148 insertions(+) create mode 100644 comm/mail/components/unifiedtoolbar/content/extension-action-button.mjs (limited to 'comm/mail/components/unifiedtoolbar/content/extension-action-button.mjs') diff --git a/comm/mail/components/unifiedtoolbar/content/extension-action-button.mjs b/comm/mail/components/unifiedtoolbar/content/extension-action-button.mjs new file mode 100644 index 0000000000..cc833aae62 --- /dev/null +++ b/comm/mail/components/unifiedtoolbar/content/extension-action-button.mjs @@ -0,0 +1,148 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +import { UnifiedToolbarButton } from "./unified-toolbar-button.mjs"; + +const lazy = {}; +ChromeUtils.defineESModuleGetters(lazy, { + ExtensionParent: "resource://gre/modules/ExtensionParent.sys.mjs", +}); +let browserActionFor = extensionId => { + const extension = + lazy.ExtensionParent.GlobalManager.getExtension(extensionId); + if (!extension) { + return null; + } + return lazy.ExtensionParent.apiManager.global.browserActionFor(extension); +}; + +const BADGE_BACKGROUND_COLOR = "--toolbar-button-badge-bg-color"; + +/** + * Attributes: + * - extension: ID of the extension this button is for. + * - open: true if the popup is currently open. Gets redirected to aria-pressed. + */ +class ExtensionActionButton extends UnifiedToolbarButton { + static get observedAttributes() { + return super.observedAttributes.concat("open"); + } + + /** + * ext-browserAction instance for this button. + * + * @type {?ToolbarButtonAPI} + */ + #action = null; + + connectedCallback() { + if (this.hasConnected) { + super.connectedCallback(); + if (this.#action?.extension?.hasPermission("menus")) { + document.addEventListener("popupshowing", this.#action); + } + return; + } + super.connectedCallback(); + this.#action = browserActionFor(this.getAttribute("extension")); + if (!this.#action) { + return; + } + const contextData = this.#action.getContextData( + this.#action.getTargetFromWindow(window) + ); + this.applyTabData(contextData); + if (this.#action.extension.hasPermission("menus")) { + document.addEventListener("popupshowing", this.#action); + if (this.#action.defaults.type == "menu") { + let menupopup = document.createXULElement("menupopup"); + menupopup.dataset.actionMenu = this.#action.manifestName; + menupopup.dataset.extensionId = this.#action.extension.id; + menupopup.addEventListener("popuphiding", event => { + if (event.target.state === "open") { + return; + } + this.removeAttribute("aria-pressed"); + }); + this.appendChild(menupopup); + } + } + } + + disconnectedCallback() { + if (this.#action?.extension?.hasPermission("menus")) { + document.removeEventListener("popupshowing", this.#action); + } + } + + attributeChangedCallback(attribute) { + super.attributeChangedCallback(attribute); + if (attribute === "open") { + if (this.getAttribute("open") === "true") { + this.setAttribute("aria-pressed", "true"); + } else { + this.removeAttribute("aria-pressed"); + } + } + } + + /** + * Apply the data for the current tab to the extension button. Updates title, + * label, icon, badge, disabled and popup. + * + * @param {object} tabData - Properties for the button in the current tab. See + * ExtensionToolbarButtons.jsm for more details. + */ + applyTabData(tabData) { + if (!this.#action) { + this.#action = browserActionFor(this.getAttribute("extension")); + } + this.title = tabData.title || this.#action.extension.name; + this.setAttribute("label", tabData.label || this.title); + this.classList.toggle("prefer-icon-only", tabData.label == ""); + this.badge = tabData.badgeText; + this.disabled = !tabData.enabled; + const { style } = this.#action.iconData.get(tabData.icon); + for (const [propName, value] of style) { + this.style.setProperty(propName, value); + } + if (tabData.badgeText && tabData.badgeBackgroundColor) { + const bgColor = tabData.badgeBackgroundColor; + this.style.setProperty( + BADGE_BACKGROUND_COLOR, + `rgba(${bgColor[0]}, ${bgColor[1]}, ${bgColor[2]}, ${bgColor[3] / 255})` + ); + } else { + this.style.removeProperty(BADGE_BACKGROUND_COLOR); + } + this.toggleAttribute("popup", tabData.popup || tabData.type == "menu"); + if (!tabData.popup) { + this.removeAttribute("aria-pressed"); + } + } + + handleClick = event => { + // If there is a menupopup associated with this button, open it, instead of + // executing the click action. + const menupopup = this.querySelector("menupopup"); + if (menupopup) { + event.preventDefault(); + event.stopPropagation(); + menupopup.openPopup(this, { + position: "after_start", + triggerEvent: event, + }); + this.setAttribute("aria-pressed", "true"); + return; + } + this.#action?.handleEvent(event); + }; + + handlePopupShowing(event) { + this.#action.handleEvent(event); + } +} +customElements.define("extension-action-button", ExtensionActionButton, { + extends: "button", +}); -- cgit v1.2.3