e9fcd8401e
All previous approaches failed because they initiated resize from JS (too late, wrong timestamp, WebKit steals grab). The correct approach (proven by Tauri/tao) is to connect button-press-event DIRECTLY on the GtkWindow at the GTK level, BEFORE WebKitGTK processes events. New: gtk-resize.ts - JSCallback for button-press-event + motion-notify-event - Hit-test in 8px border zone (same as tao's 5*scale_factor) - begin_resize_drag with REAL event timestamp (not GDK_CURRENT_TIME) - Returns TRUE to STOP propagation (WebKit never sees the press) - Cursor updates on motion-notify in border zone Removed: all JS resize handles (divs, mousemove, mouseup, RPC calls) |
||
|---|---|---|
| .. | ||
| locales | ||
| scripts | ||
| src | ||
| tests | ||
| bun.lock | ||
| CONTRIBUTING_I18N.md | ||
| electrobun.config.ts | ||
| llms.txt | ||
| package-lock.json | ||
| package.json | ||
| README.md | ||
| svelte.config.js | ||
| tsconfig.json | ||
| vite.config.ts | ||
Svelte Electrobun Template
A fast Electrobun desktop app template with Svelte 5 and Vite for hot module replacement (HMR).
Getting Started
# Install dependencies
bun install
# Development without HMR (uses bundled assets)
bun run dev
# Development with HMR (recommended)
bun run dev:hmr
# Build for production
bun run build
# Build for production release
bun run build:prod
How HMR Works
When you run bun run dev:hmr:
- Vite dev server starts on
http://localhost:5173with HMR enabled - Electrobun starts and detects the running Vite server
- The app loads from the Vite dev server instead of bundled assets
- Changes to Svelte components update instantly without full page reload
When you run bun run dev (without HMR):
- Electrobun starts and loads from
views://mainview/index.html - You need to rebuild (
bun run build) to see changes
Project Structure
├── src/
│ ├── bun/
│ │ └── index.ts # Main process (Electrobun/Bun)
│ └── mainview/
│ ├── App.svelte # Svelte app component
│ ├── main.ts # Svelte entry point
│ ├── index.html # HTML template
│ └── app.css # Global styles
├── electrobun.config.ts # Electrobun configuration
├── vite.config.ts # Vite configuration
├── svelte.config.js # Svelte configuration
└── package.json
Svelte 5 Features
This template uses Svelte 5 with the new runes syntax:
$state()- reactive state$derived()- computed values$effect()- side effects
Customizing
- Svelte components: Edit files in
src/mainview/ - Global styles: Edit
src/mainview/app.css - Vite settings: Edit
vite.config.ts - Window settings: Edit
src/bun/index.ts - App metadata: Edit
electrobun.config.ts