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:
@@ -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');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user