fix(chrome): TitleBar drag via explicit window_start_drag (official recipe)

data-tauri-drag-region only fires when the exact element is the event target
and was never runtime-verified; replace it with the official Tauri custom-
titlebar recipe — primary-button mousedown starts an OS drag, detail===2
toggles maximize. Works across the whole region (brand text included, which
already passes pointer events through).

Pairs with cinny-desktop set_custom_chrome Mica fix (clear backdrop before
undecorating; window-state no longer restores the decorated flag).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-07-01 16:42:56 -04:00
parent 258e3ec620
commit e31b84c08e
+15 -6
View File
@@ -66,8 +66,9 @@ function ControlButton({ label, glyph, onClick, close }: ControlButtonProps) {
*
* Renders `null` unless we're inside Tauri **and** the user opted into custom
* window chrome. Otherwise it draws a thin (~32px) folds/TDS-styled titlebar: a
* draggable region (`data-tauri-drag-region`) with the app brand, plus
* minimize / maximize / close controls that call the native window commands.
* draggable region (explicit `window_start_drag` on mousedown, double-press to
* maximize) with the app brand, plus minimize / maximize / close controls that
* call the native window commands.
*
* OS-aware: Windows/Linux put the controls on the right; macOS mirrors them to
* the left (the native traffic-light position) since decorations — and thus the
@@ -80,10 +81,18 @@ export function TitleBar() {
const mac = isMacOS();
const handleDoubleClick = (evt: MouseEvent<HTMLDivElement>): void => {
// Only the drag surface itself toggles maximize, not the brand/children.
if (evt.target !== evt.currentTarget) return;
// Official Tauri custom-titlebar recipe: primary-button mousedown starts an
// OS window drag; a double press (detail === 2) toggles maximize instead. An
// explicit `window_start_drag` invoke is used rather than
// `data-tauri-drag-region` because the attribute only fires when the exact
// element is the event target (children like the brand text wouldn't drag).
const handleDragMouseDown = (evt: MouseEvent<HTMLDivElement>): void => {
if (evt.button !== 0) return;
if (evt.detail === 2) {
invokeTauri('window_toggle_maximize');
} else {
invokeTauri('window_start_drag');
}
};
const controls = (
@@ -108,7 +117,7 @@ export function TitleBar() {
);
const dragRegion = (
<div className={css.DragRegion} data-tauri-drag-region onDoubleClick={handleDoubleClick}>
<div className={css.DragRegion} onMouseDown={handleDragMouseDown}>
<span className={css.Brand}>
<Text as="span" size="T200" truncate>
Lotus Chat