Drop Fomantic tab, checkbox and form patches (#37377)

Clean up the fomantic helpers that nothing inside fomantic depends on.
Manually tested all functionality.

---------

Co-authored-by: Claude (Opus 4.7) <noreply@anthropic.com>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
silverwind
2026-04-24 10:02:37 +02:00
committed by GitHub
parent 0817a405af
commit 3816210c05
28 changed files with 135 additions and 122 deletions
+15 -15
View File
@@ -1,18 +1,18 @@
import {queryElemSiblings} from '../../utils/dom.ts';
export function initFomanticTab() {
$.fn.tab = function (this: any) {
for (const elBtn of this) {
const tabName = elBtn.getAttribute('data-tab');
if (!tabName) continue;
elBtn.addEventListener('click', () => {
const elTab = document.querySelector(`.ui.tab[data-tab="${tabName}"]`)!;
queryElemSiblings(elTab, `.ui.tab`, (el) => el.classList.remove('active'));
queryElemSiblings(elBtn, `[data-tab]`, (el) => el.classList.remove('active'));
elBtn.classList.add('active');
elTab.classList.add('active');
});
}
return this;
};
export function initTabSwitcher(tabItemContainer: Element) {
// Clicking a `.item[data-tab]` menu item activates the matching `.ui.tab[data-tab=...]` panel
// This design is from Fomantic UI, and it has problems like :
// * The panel selector is global, callers should make sure the "data-tab" values don't conflict on the same page
const tabItems = tabItemContainer.querySelectorAll('.item[data-tab]');
for (const elItem of tabItems) {
const tabName = elItem.getAttribute('data-tab')!;
elItem.addEventListener('click', () => {
const elPanel = document.querySelector(`.ui.tab[data-tab="${tabName}"]`)!;
queryElemSiblings(elPanel, '.ui.tab', (el) => el.classList.remove('active'));
queryElemSiblings(elItem, '.item[data-tab]', (el) => el.classList.remove('active'));
elItem.classList.add('active');
elPanel.classList.add('active');
});
}
}