Desktop: tab row measures the room inside the sticky bar's padding (the More button was clipped); editor saves skip the in-app preview (their Review step already showed the dry run)

This commit is contained in:
CRTkafa 2026-10-23 10:44:45 +08:00
parent 83bb9a621e
commit 26ebb64458
3 changed files with 13 additions and 6 deletions

View file

@ -295,7 +295,11 @@ export function Tabs<T extends string>({ items, value, onChange, label, panelId
refs.current.forEach((b, i) => { if (b && b.offsetParent !== null) widths.current[i] = b.getBoundingClientRect().width; });
if (widths.current.length < items.length || widths.current.some(w => w === undefined)) { setShown(null); return; }
const cs = getComputedStyle(el);
const avail = (el.parentElement?.clientWidth ?? el.clientWidth) - parseFloat(cs.paddingLeft) - parseFloat(cs.paddingRight) - parseFloat(cs.borderLeftWidth) - parseFloat(cs.borderRightWidth);
// the row's room: the parent's content box (the sticky bar has its own padding) minus the row's padding and border
const par = el.parentElement;
const ps = par ? getComputedStyle(par) : null;
const box = par && ps ? par.clientWidth - parseFloat(ps.paddingLeft) - parseFloat(ps.paddingRight) : el.clientWidth;
const avail = box - parseFloat(cs.paddingLeft) - parseFloat(cs.paddingRight) - parseFloat(cs.borderLeftWidth) - parseFloat(cs.borderRightWidth) - 2;
const next = fitTabs(widths.current, avail, active, parseFloat(cs.columnGap) || 4, 150);
setShown(prev => (prev && prev.join() === next.join() ? prev : next.length === items.length ? null : next));
};