efcc38c52b
This is the first change to start moving our settings to a config approach. These settings are all checkboxes so only checkbox support is added at this time. In the future, these settings will be regrouped with other settings in the Settings Redesign 2025 project. Moving the settings will involve creating a new config with a different grouping of id/l10n/supportPage values. It should not require moving any code or markup to move the settings or convert them to using moz-checkbox rather than XUL checkbox. Differential Revision: https://phabricator.services.mozilla.com/D240400
63 lines
1.8 KiB
JavaScript
63 lines
1.8 KiB
JavaScript
/* 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";
|
|
|
|
export class SettingGroup extends MozLitElement {
|
|
static properties = {
|
|
config: { type: Object },
|
|
groupId: { type: String },
|
|
};
|
|
|
|
createRenderRoot() {
|
|
return this;
|
|
}
|
|
|
|
xulCheckboxTemplate(item, setting) {
|
|
let result = document.createDocumentFragment();
|
|
let checkbox = document.createXULElement("checkbox");
|
|
checkbox.id = item.id;
|
|
document.l10n.setAttributes(checkbox, item.l10nId);
|
|
if (item.subcategory) {
|
|
checkbox.setAttribute("subcategory", item.subcategory);
|
|
}
|
|
checkbox.addEventListener("command", e =>
|
|
setting.userChange(e.target.checked)
|
|
);
|
|
checkbox.checked = setting.value;
|
|
if (item.supportPage) {
|
|
let container = document.createXULElement("hbox");
|
|
container.setAttribute("align", "center");
|
|
let supportLink = document.createElement("a", { is: "moz-support-link" });
|
|
supportLink.supportPage = item.supportPage;
|
|
checkbox.classList.add("tail-with-learn-more");
|
|
container.append(checkbox, supportLink);
|
|
result.append(container);
|
|
} else {
|
|
result.append(checkbox);
|
|
}
|
|
return result;
|
|
}
|
|
|
|
xulItemTemplate(item) {
|
|
let setting = window.Preferences.getSetting(item.id);
|
|
if (!setting.visible) {
|
|
return "";
|
|
}
|
|
switch (item.control) {
|
|
case "checkbox":
|
|
default:
|
|
return this.xulCheckboxTemplate(item, setting);
|
|
}
|
|
}
|
|
|
|
render() {
|
|
if (!this.config) {
|
|
return "";
|
|
}
|
|
return this.config.items.map(item => this.xulItemTemplate(item));
|
|
}
|
|
}
|
|
customElements.define("setting-group", SettingGroup);
|