Source code

Revision control

Copy as Markdown

Other Tools

/* 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 { MozLitElement } from "chrome://global/content/lit-utils.mjs";
import { html } from "chrome://global/content/vendor/lit.all.mjs";
class UpdateInformation extends MozLitElement {
static properties = {
version: { type: String },
distribution: { type: String },
distributionId: { type: String },
releaseNotesURL: { type: String },
};
constructor() {
super();
/** @type {string} */
this.version = "";
/** @type {string} */
this.distribution = "";
/** @type {string} */
this.distributionId = "";
/** @type {string} */
this.releaseNotesURL = "";
}
labelTemplate() {
if (!this.version) {
return "";
}
return html`<div class="label-wrapper">
<span
class="label"
id="label"
data-l10n-id="update-application-version"
data-l10n-args=${JSON.stringify({ version: this.version })}
>
<a
id="releasenotes"
target="_blank"
aria-describedby="label"
data-l10n-name="learn-more"
href=${this.releaseNotesURL}
part="support-link"
?hidden=${!this.releaseNotesURL}
></a>
</span>
</div>`;
}
descriptionTemplate() {
if (!this.distribution && !this.distributionId) {
return "";
}
return html`<div class="description-wrapper text-deemphasized">
<span class="description" id="distribution"> ${this.distribution}</span>
<span class="description" id="distributionId">
${this.distributionId}</span
>
</div>`;
}
render() {
return html`
<link
rel="stylesheet"
href="chrome://browser/content/preferences/widgets/update-information.css"
/>
<link
rel="stylesheet"
href="chrome://global/skin/design-system/text-and-typography.css"
/>
<moz-box-item>
<div class="text-container">
${this.labelTemplate()} ${this.descriptionTemplate()}
</div>
</moz-box-item>
`;
}
}
customElements.define("update-information", UpdateInformation);