Support tooltiptext on ItemPane custom section head buttons
Fix ItemPane custom section head button event listener Update ItemPaneManager document
This commit is contained in:
parent
849ffe0133
commit
4407c24329
2 changed files with 12 additions and 6 deletions
|
@ -176,18 +176,21 @@ class ItemPaneSectionElementBase extends XULElementBase {
|
|||
|
||||
let styles = [];
|
||||
for (let type of Object.keys(this._sectionButtons)) {
|
||||
let { icon, darkIcon, onClick } = this._sectionButtons[type];
|
||||
let { icon, darkIcon, l10nID, onClick } = this._sectionButtons[type];
|
||||
if (!darkIcon) {
|
||||
darkIcon = icon;
|
||||
}
|
||||
let listener = (event) => {
|
||||
let props = this._assembleProps(this._getHookProps());
|
||||
props.event = event;
|
||||
let props = this._assembleProps(
|
||||
this._getHookProps(),
|
||||
{ event },
|
||||
);
|
||||
onClick(props);
|
||||
};
|
||||
this._section.addEventListener(type, listener);
|
||||
this._sectionListeners.push({ type, listener });
|
||||
let button = this._section.querySelector(`.${type}`);
|
||||
button.dataset.l10nId = l10nID;
|
||||
button.style = `--custom-button-icon-light: url('${icon}'); --custom-button-icon-dark: url('${darkIcon}');`;
|
||||
}
|
||||
|
||||
|
@ -234,7 +237,7 @@ class ItemPaneSectionElementBase extends XULElementBase {
|
|||
}
|
||||
|
||||
registerSectionButton(options) {
|
||||
let { type, icon, darkIcon, onClick } = options;
|
||||
let { type, icon, darkIcon, l10nID, onClick } = options;
|
||||
if (!darkIcon) {
|
||||
darkIcon = icon;
|
||||
}
|
||||
|
@ -243,7 +246,7 @@ class ItemPaneSectionElementBase extends XULElementBase {
|
|||
return;
|
||||
}
|
||||
this._sectionButtons[type.replace(/[^a-zA-Z0-9-_]/g, "-")] = {
|
||||
icon, darkIcon, onClick
|
||||
icon, darkIcon, l10nID, onClick
|
||||
};
|
||||
}
|
||||
|
||||
|
|
|
@ -31,11 +31,14 @@
|
|||
* @property {string} [darkIcon] - Icon URI in dark mode. If not set, use `icon`
|
||||
* @typedef SectionL10n
|
||||
* @type {object}
|
||||
* @property {string} l10nID - data-l10n-id for localization
|
||||
* @property {string} l10nID - data-l10n-id for localization of section header label
|
||||
* @property {string} [l10nArgs] - data-l10n-args for localization
|
||||
* @typedef SectionButton
|
||||
* @type {object}
|
||||
* @property {string} type - Button type, must be valid DOMString and without ","
|
||||
* @property {string} icon - Icon URI
|
||||
* @property {string} [darkIcon] - Icon URI in dark mode. If not set, use `icon`
|
||||
* @property {string} [l10nID] - data-l10n-id for localization of button tooltiptext
|
||||
* @property {(props: SectionEventHookArgs) => void} onClick - Button click callback
|
||||
* @typedef SectionBasicHookArgs
|
||||
* @type {object}
|
||||
|
|
Loading…
Reference in a new issue