5
0
mirror of https://github.com/wailsapp/wails.git synced 2025-05-04 01:31:54 +08:00

Documentation updates.

New `-git` flag for `wails3 init`.
New `wails3 generate webview2bootstrapper` command.
This commit is contained in:
Lea Anthony 2024-12-16 20:00:56 +11:00
parent e75f9c9c7f
commit 7aa6abfefe
No known key found for this signature in database
GPG Key ID: 33DAF7BB90A58405
117 changed files with 2773 additions and 3742 deletions

View File

@ -7,6 +7,8 @@ body:
- type: markdown
attributes:
value: |
***Please note: No bug reports are currently being accepted for Wails v3***
***Please note: No bug reports are currently being accepted for Wails v3***
***Please note: No bug reports are currently being accepted for Wails v3***
Before submitting this issue, please do the following:
- Do a web search for your error. This usually leads to a much better understanding of the issue.

View File

@ -53,19 +53,19 @@ export default defineConfig({
plugins: [
// https://starlight-links-validator.vercel.app/configuration/
starlightLinksValidator({
exclude: [
// TODO: Fix these links in the blog/wails-v2-released file
// "/docs/reference/options#theme",
// "/docs/reference/options#customtheme",
// "/docs/guides/application-development#application-menu",
// "/docs/reference/runtime/dialog",
// "/docs/reference/options#windowistranslucent",
// "/docs/reference/options#windowistranslucent-1",
// "/docs/guides/windows-installer",
// "/docs/reference/runtime/intro",
// "/docs/guides/obfuscated",
// "/docs/howdoesitwork#calling-bound-go-methods",
],
// exclude: [
// // TODO: Fix these links in the blog/wails-v2-released file
// // "/docs/reference/options#theme",
// // "/docs/reference/options#customtheme",
// // "/docs/guides/application-development#application-menu",
// // "/docs/reference/runtime/dialog",
// // "/docs/reference/options#windowistranslucent",
// // "/docs/reference/options#windowistranslucent-1",
// // "/docs/guides/windows-installer",
// // "/docs/reference/runtime/intro",
// // "/docs/guides/obfuscated",
// // "/docs/howdoesitwork#calling-bound-go-methods",
// ],
}),
// https://starlight-image-zoom.vercel.app/configuration/
starlightImageZoom(),
@ -81,7 +81,16 @@ export default defineConfig({
label: "Getting Started",
autogenerate: { directory: "getting-started", collapsed: false },
},
{ label: "Feedback", link: "/getting-started/feedback" },
{
label: "Tutorials",
autogenerate: { directory: "tutorials", collapsed: true },
},
{
label: "What's New",
link: "/whats-new",
badge: { text: "New", variant: "tip" },
},
{ label: "v3 Alpha Feedback", link: "/feedback" },
{
label: "Learn",
collapsed: true,
@ -92,16 +101,11 @@ export default defineConfig({
collapsed: true,
autogenerate: { directory: "guides", collapsed: true },
},
{
label: "What's New",
link: "/whats-new",
badge: { text: "New", variant: "tip" },
},
{
label: "API",
collapsed: true,
autogenerate: { directory: "api", collapsed: true },
},
// {
// label: "API",
// collapsed: true,
// autogenerate: { directory: "api", collapsed: true },
// },
{
label: "Community",
collapsed: true,
@ -117,11 +121,11 @@ export default defineConfig({
},
],
},
{
label: "Development",
collapsed: true,
autogenerate: { directory: "development", collapsed: true },
},
// {
// label: "Development",
// collapsed: true,
// autogenerate: { directory: "development", collapsed: true },
// },
{ label: "Status", link: "/status" },
{ label: "Changelog", link: "/changelog" },
{

725
docs/package-lock.json generated
View File

@ -9,8 +9,15 @@
"version": "0.0.1",
"dependencies": {
"@astrojs/check": "0.9.4",
"@astrojs/react": "4.1.0",
"@astrojs/starlight": "0.29.2",
"@types/react": "19.0.1",
"@types/react-dom": "19.0.2",
"astro": "4.16.17",
"framer-motion": "11.14.4",
"motion": "11.14.4",
"react": "19.0.0",
"react-dom": "19.0.0",
"sharp": "0.33.5",
"starlight-blog": "0.15.0",
"starlight-image-zoom": "0.9.0",
@ -202,6 +209,504 @@
"node": "^18.17.1 || ^20.3.0 || >=21.0.0"
}
},
"node_modules/@astrojs/react": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/@astrojs/react/-/react-4.1.0.tgz",
"integrity": "sha512-8F0ncvcCexVeQZMwPouLSFuzCK1KXUIYQ57lW3ZG2p7B5DGAajXGanb/CGF7MMSpX8Z0t9sELQqLHOCV/+78Ig==",
"license": "MIT",
"dependencies": {
"@vitejs/plugin-react": "^4.3.4",
"ultrahtml": "^1.5.3",
"vite": "^6.0.1"
},
"engines": {
"node": "^18.17.1 || ^20.3.0 || >=22.0.0"
},
"peerDependencies": {
"@types/react": "^17.0.50 || ^18.0.21 || ^19.0.0",
"@types/react-dom": "^17.0.17 || ^18.0.6 || ^19.0.0",
"react": "^17.0.2 || ^18.0.0 || ^19.0.0",
"react-dom": "^17.0.2 || ^18.0.0 || ^19.0.0"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/aix-ppc64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.24.0.tgz",
"integrity": "sha512-WtKdFM7ls47zkKHFVzMz8opM7LkcsIp9amDUBIAWirg70RM71WRSjdILPsY5Uv1D42ZpUfaPILDlfactHgsRkw==",
"cpu": [
"ppc64"
],
"license": "MIT",
"optional": true,
"os": [
"aix"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/android-arm": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.24.0.tgz",
"integrity": "sha512-arAtTPo76fJ/ICkXWetLCc9EwEHKaeya4vMrReVlEIUCAUncH7M4bhMQ+M9Vf+FFOZJdTNMXNBrWwW+OXWpSew==",
"cpu": [
"arm"
],
"license": "MIT",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/android-arm64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.24.0.tgz",
"integrity": "sha512-Vsm497xFM7tTIPYK9bNTYJyF/lsP590Qc1WxJdlB6ljCbdZKU9SY8i7+Iin4kyhV/KV5J2rOKsBQbB77Ab7L/w==",
"cpu": [
"arm64"
],
"license": "MIT",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/android-x64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.24.0.tgz",
"integrity": "sha512-t8GrvnFkiIY7pa7mMgJd7p8p8qqYIz1NYiAoKc75Zyv73L3DZW++oYMSHPRarcotTKuSs6m3hTOa5CKHaS02TQ==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/darwin-arm64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.24.0.tgz",
"integrity": "sha512-CKyDpRbK1hXwv79soeTJNHb5EiG6ct3efd/FTPdzOWdbZZfGhpbcqIpiD0+vwmpu0wTIL97ZRPZu8vUt46nBSw==",
"cpu": [
"arm64"
],
"license": "MIT",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/darwin-x64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.24.0.tgz",
"integrity": "sha512-rgtz6flkVkh58od4PwTRqxbKH9cOjaXCMZgWD905JOzjFKW+7EiUObfd/Kav+A6Gyud6WZk9w+xu6QLytdi2OA==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/freebsd-arm64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.24.0.tgz",
"integrity": "sha512-6Mtdq5nHggwfDNLAHkPlyLBpE5L6hwsuXZX8XNmHno9JuL2+bg2BX5tRkwjyfn6sKbxZTq68suOjgWqCicvPXA==",
"cpu": [
"arm64"
],
"license": "MIT",
"optional": true,
"os": [
"freebsd"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/freebsd-x64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.24.0.tgz",
"integrity": "sha512-D3H+xh3/zphoX8ck4S2RxKR6gHlHDXXzOf6f/9dbFt/NRBDIE33+cVa49Kil4WUjxMGW0ZIYBYtaGCa2+OsQwQ==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"freebsd"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/linux-arm": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.24.0.tgz",
"integrity": "sha512-gJKIi2IjRo5G6Glxb8d3DzYXlxdEj2NlkixPsqePSZMhLudqPhtZ4BUrpIuTjJYXxvF9njql+vRjB2oaC9XpBw==",
"cpu": [
"arm"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/linux-arm64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.24.0.tgz",
"integrity": "sha512-TDijPXTOeE3eaMkRYpcy3LarIg13dS9wWHRdwYRnzlwlA370rNdZqbcp0WTyyV/k2zSxfko52+C7jU5F9Tfj1g==",
"cpu": [
"arm64"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/linux-ia32": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.24.0.tgz",
"integrity": "sha512-K40ip1LAcA0byL05TbCQ4yJ4swvnbzHscRmUilrmP9Am7//0UjPreh4lpYzvThT2Quw66MhjG//20mrufm40mA==",
"cpu": [
"ia32"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/linux-loong64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.24.0.tgz",
"integrity": "sha512-0mswrYP/9ai+CU0BzBfPMZ8RVm3RGAN/lmOMgW4aFUSOQBjA31UP8Mr6DDhWSuMwj7jaWOT0p0WoZ6jeHhrD7g==",
"cpu": [
"loong64"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/linux-mips64el": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.24.0.tgz",
"integrity": "sha512-hIKvXm0/3w/5+RDtCJeXqMZGkI2s4oMUGj3/jM0QzhgIASWrGO5/RlzAzm5nNh/awHE0A19h/CvHQe6FaBNrRA==",
"cpu": [
"mips64el"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/linux-ppc64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.24.0.tgz",
"integrity": "sha512-HcZh5BNq0aC52UoocJxaKORfFODWXZxtBaaZNuN3PUX3MoDsChsZqopzi5UupRhPHSEHotoiptqikjN/B77mYQ==",
"cpu": [
"ppc64"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/linux-riscv64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.24.0.tgz",
"integrity": "sha512-bEh7dMn/h3QxeR2KTy1DUszQjUrIHPZKyO6aN1X4BCnhfYhuQqedHaa5MxSQA/06j3GpiIlFGSsy1c7Gf9padw==",
"cpu": [
"riscv64"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/linux-s390x": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.24.0.tgz",
"integrity": "sha512-ZcQ6+qRkw1UcZGPyrCiHHkmBaj9SiCD8Oqd556HldP+QlpUIe2Wgn3ehQGVoPOvZvtHm8HPx+bH20c9pvbkX3g==",
"cpu": [
"s390x"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/linux-x64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.24.0.tgz",
"integrity": "sha512-vbutsFqQ+foy3wSSbmjBXXIJ6PL3scghJoM8zCL142cGaZKAdCZHyf+Bpu/MmX9zT9Q0zFBVKb36Ma5Fzfa8xA==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/netbsd-x64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.24.0.tgz",
"integrity": "sha512-hjQ0R/ulkO8fCYFsG0FZoH+pWgTTDreqpqY7UnQntnaKv95uP5iW3+dChxnx7C3trQQU40S+OgWhUVwCjVFLvg==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"netbsd"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/openbsd-x64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.24.0.tgz",
"integrity": "sha512-4ir0aY1NGUhIC1hdoCzr1+5b43mw99uNwVzhIq1OY3QcEwPDO3B7WNXBzaKY5Nsf1+N11i1eOfFcq+D/gOS15Q==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"openbsd"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/sunos-x64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.24.0.tgz",
"integrity": "sha512-jVzdzsbM5xrotH+W5f1s+JtUy1UWgjU0Cf4wMvffTB8m6wP5/kx0KiaLHlbJO+dMgtxKV8RQ/JvtlFcdZ1zCPA==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"sunos"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/win32-arm64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.24.0.tgz",
"integrity": "sha512-iKc8GAslzRpBytO2/aN3d2yb2z8XTVfNV0PjGlCxKo5SgWmNXx82I/Q3aG1tFfS+A2igVCY97TJ8tnYwpUWLCA==",
"cpu": [
"arm64"
],
"license": "MIT",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/win32-ia32": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.24.0.tgz",
"integrity": "sha512-vQW36KZolfIudCcTnaTpmLQ24Ha1RjygBo39/aLkM2kmjkWmZGEJ5Gn9l5/7tzXA42QGIoWbICfg6KLLkIw6yw==",
"cpu": [
"ia32"
],
"license": "MIT",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/@esbuild/win32-x64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.24.0.tgz",
"integrity": "sha512-7IAFPrjSQIJrGsK6flwg7NFmwBoSTyF3rl7If0hNUFQU4ilTsEPL6GuMuU9BfIWVVGuRnuIidkSMC+c0Otu8IA==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@astrojs/react/node_modules/esbuild": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.24.0.tgz",
"integrity": "sha512-FuLPevChGDshgSicjisSooU0cemp/sGXR841D5LHMB7mTVOmsEHcAxaH3irL53+8YDIeVNQEySh4DaYU/iuPqQ==",
"hasInstallScript": true,
"license": "MIT",
"bin": {
"esbuild": "bin/esbuild"
},
"engines": {
"node": ">=18"
},
"optionalDependencies": {
"@esbuild/aix-ppc64": "0.24.0",
"@esbuild/android-arm": "0.24.0",
"@esbuild/android-arm64": "0.24.0",
"@esbuild/android-x64": "0.24.0",
"@esbuild/darwin-arm64": "0.24.0",
"@esbuild/darwin-x64": "0.24.0",
"@esbuild/freebsd-arm64": "0.24.0",
"@esbuild/freebsd-x64": "0.24.0",
"@esbuild/linux-arm": "0.24.0",
"@esbuild/linux-arm64": "0.24.0",
"@esbuild/linux-ia32": "0.24.0",
"@esbuild/linux-loong64": "0.24.0",
"@esbuild/linux-mips64el": "0.24.0",
"@esbuild/linux-ppc64": "0.24.0",
"@esbuild/linux-riscv64": "0.24.0",
"@esbuild/linux-s390x": "0.24.0",
"@esbuild/linux-x64": "0.24.0",
"@esbuild/netbsd-x64": "0.24.0",
"@esbuild/openbsd-arm64": "0.24.0",
"@esbuild/openbsd-x64": "0.24.0",
"@esbuild/sunos-x64": "0.24.0",
"@esbuild/win32-arm64": "0.24.0",
"@esbuild/win32-ia32": "0.24.0",
"@esbuild/win32-x64": "0.24.0"
}
},
"node_modules/@astrojs/react/node_modules/vite": {
"version": "6.0.3",
"resolved": "https://registry.npmjs.org/vite/-/vite-6.0.3.tgz",
"integrity": "sha512-Cmuo5P0ENTN6HxLSo6IHsjCLn/81Vgrp81oaiFFMRa8gGDj5xEjIcEpf2ZymZtZR8oU0P2JX5WuUp/rlXcHkAw==",
"license": "MIT",
"dependencies": {
"esbuild": "^0.24.0",
"postcss": "^8.4.49",
"rollup": "^4.23.0"
},
"bin": {
"vite": "bin/vite.js"
},
"engines": {
"node": "^18.0.0 || ^20.0.0 || >=22.0.0"
},
"funding": {
"url": "https://github.com/vitejs/vite?sponsor=1"
},
"optionalDependencies": {
"fsevents": "~2.3.3"
},
"peerDependencies": {
"@types/node": "^18.0.0 || ^20.0.0 || >=22.0.0",
"jiti": ">=1.21.0",
"less": "*",
"lightningcss": "^1.21.0",
"sass": "*",
"sass-embedded": "*",
"stylus": "*",
"sugarss": "*",
"terser": "^5.16.0",
"tsx": "^4.8.1",
"yaml": "^2.4.2"
},
"peerDependenciesMeta": {
"@types/node": {
"optional": true
},
"jiti": {
"optional": true
},
"less": {
"optional": true
},
"lightningcss": {
"optional": true
},
"sass": {
"optional": true
},
"sass-embedded": {
"optional": true
},
"stylus": {
"optional": true
},
"sugarss": {
"optional": true
},
"terser": {
"optional": true
},
"tsx": {
"optional": true
},
"yaml": {
"optional": true
}
}
},
"node_modules/@astrojs/rss": {
"version": "4.0.5",
"resolved": "https://registry.npmjs.org/@astrojs/rss/-/rss-4.0.5.tgz",
@ -527,6 +1032,36 @@
"@babel/core": "^7.0.0-0"
}
},
"node_modules/@babel/plugin-transform-react-jsx-self": {
"version": "7.25.9",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.25.9.tgz",
"integrity": "sha512-y8quW6p0WHkEhmErnfe58r7x0A70uKphQm8Sp8cV7tjNQwK56sNVK0M73LK3WuYmsuyrftut4xAkjjgU0twaMg==",
"license": "MIT",
"dependencies": {
"@babel/helper-plugin-utils": "^7.25.9"
},
"engines": {
"node": ">=6.9.0"
},
"peerDependencies": {
"@babel/core": "^7.0.0-0"
}
},
"node_modules/@babel/plugin-transform-react-jsx-source": {
"version": "7.25.9",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.25.9.tgz",
"integrity": "sha512-+iqjT8xmXhhYv4/uiYd8FNQsraMFZIfxVSqxxVSZP0WbbSAWvBXAul0m/zu+7Vv4O/3WtApy9pmaTMiumEZgfg==",
"license": "MIT",
"dependencies": {
"@babel/helper-plugin-utils": "^7.25.9"
},
"engines": {
"node": ">=6.9.0"
},
"peerDependencies": {
"@babel/core": "^7.0.0-0"
}
},
"node_modules/@babel/runtime": {
"version": "7.26.0",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.26.0.tgz",
@ -946,6 +1481,22 @@
"node": ">=12"
}
},
"node_modules/@esbuild/openbsd-arm64": {
"version": "0.24.0",
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.24.0.tgz",
"integrity": "sha512-MD9uzzkPQbYehwcN583yx3Tu5M8EIoTD+tUgKF982WYL9Pf5rKy9ltgD0eUgs8pvKnmizxjXZyLt0z6DC3rRXg==",
"cpu": [
"arm64"
],
"license": "MIT",
"optional": true,
"os": [
"openbsd"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@esbuild/openbsd-x64": {
"version": "0.21.5",
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.21.5.tgz",
@ -2088,6 +2639,24 @@
"integrity": "sha512-Yll76ZHikRFCyz/pffKGjrCwe/le2CDwOP5F210KQo27kpRE46U2rDnzikNlVn6/ezH3Mhn46bJMTfeVTtcYMg==",
"license": "MIT"
},
"node_modules/@types/react": {
"version": "19.0.1",
"resolved": "https://registry.npmjs.org/@types/react/-/react-19.0.1.tgz",
"integrity": "sha512-YW6614BDhqbpR5KtUYzTA+zlA7nayzJRA9ljz9CQoxthR0sDisYZLuvSMsil36t4EH/uAt8T52Xb4sVw17G+SQ==",
"license": "MIT",
"dependencies": {
"csstype": "^3.0.2"
}
},
"node_modules/@types/react-dom": {
"version": "19.0.2",
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.0.2.tgz",
"integrity": "sha512-c1s+7TKFaDRRxr1TxccIX2u7sfCnc3RxkVyBIUA2lCpyqCF+QoAwQ/CBg7bsMdVwP120HEH143VQezKtef5nCg==",
"license": "MIT",
"peerDependencies": {
"@types/react": "^19.0.0"
}
},
"node_modules/@types/sax": {
"version": "1.2.7",
"resolved": "https://registry.npmjs.org/@types/sax/-/sax-1.2.7.tgz",
@ -2109,6 +2678,25 @@
"integrity": "sha512-fEzPV3hSkSMltkw152tJKNARhOupqbH96MZWyRjNaYZOMIzbrTeQDG+MTc6Mr2pgzFQzFxAfmhGDNP5QK++2ZA==",
"license": "ISC"
},
"node_modules/@vitejs/plugin-react": {
"version": "4.3.4",
"resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.3.4.tgz",
"integrity": "sha512-SCCPBJtYLdE8PX/7ZQAs1QAZ8Jqwih+0VBLum1EGqmCCQal+MIUqLCzj3ZUy8ufbC0cAM4LRlSTm7IQJwWT4ug==",
"license": "MIT",
"dependencies": {
"@babel/core": "^7.26.0",
"@babel/plugin-transform-react-jsx-self": "^7.25.9",
"@babel/plugin-transform-react-jsx-source": "^7.25.9",
"@types/babel__core": "^7.20.5",
"react-refresh": "^0.14.2"
},
"engines": {
"node": "^14.18.0 || >=16.0.0"
},
"peerDependencies": {
"vite": "^4.2.0 || ^5.0.0 || ^6.0.0"
}
},
"node_modules/@volar/kit": {
"version": "2.4.10",
"resolved": "https://registry.npmjs.org/@volar/kit/-/kit-2.4.10.tgz",
@ -2984,6 +3572,12 @@
"integrity": "sha512-iKuQcq+NdHqlAcwUY0o/HL69XQrUaQdMjmStJ8JFmUaiiQErlhrmuigkg/CU4E2J0IyUKUrMAgl36TvN67MqTw==",
"license": "MIT"
},
"node_modules/csstype": {
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
"license": "MIT"
},
"node_modules/debug": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
@ -3553,6 +4147,33 @@
"node": ">=8"
}
},
"node_modules/framer-motion": {
"version": "11.14.4",
"resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.14.4.tgz",
"integrity": "sha512-NQuzr9JbeJDMQmy0FFLhLzk9h1kAjVC1tGE/HY4ubF02B95EBm2lpA21LE3Od/OpXqXgp0zl5Hdqu25hliBRsA==",
"license": "MIT",
"dependencies": {
"motion-dom": "^11.14.3",
"motion-utils": "^11.14.3",
"tslib": "^2.4.0"
},
"peerDependencies": {
"@emotion/is-prop-valid": "*",
"react": "^18.0.0 || ^19.0.0",
"react-dom": "^18.0.0 || ^19.0.0"
},
"peerDependenciesMeta": {
"@emotion/is-prop-valid": {
"optional": true
},
"react": {
"optional": true
},
"react-dom": {
"optional": true
}
}
},
"node_modules/fsevents": {
"version": "2.3.3",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
@ -5714,6 +6335,44 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/motion": {
"version": "11.14.4",
"resolved": "https://registry.npmjs.org/motion/-/motion-11.14.4.tgz",
"integrity": "sha512-ZIaw6ko88B8rSmBEFzqbTCQMbo9xMu8f4PSXSGdb9DTDy8R0sXcbwMEKmTEYkrj9TmZ4n+Ebd0KYjtqHgzRkRQ==",
"license": "MIT",
"dependencies": {
"framer-motion": "^11.14.4",
"tslib": "^2.4.0"
},
"peerDependencies": {
"@emotion/is-prop-valid": "*",
"react": "^18.0.0 || ^19.0.0",
"react-dom": "^18.0.0 || ^19.0.0"
},
"peerDependenciesMeta": {
"@emotion/is-prop-valid": {
"optional": true
},
"react": {
"optional": true
},
"react-dom": {
"optional": true
}
}
},
"node_modules/motion-dom": {
"version": "11.14.3",
"resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-11.14.3.tgz",
"integrity": "sha512-lW+D2wBy5vxLJi6aCP0xyxTxlTfiu+b+zcpVbGVFUxotwThqhdpPRSmX8xztAgtZMPMeU0WGVn/k1w4I+TbPqA==",
"license": "MIT"
},
"node_modules/motion-utils": {
"version": "11.14.3",
"resolved": "https://registry.npmjs.org/motion-utils/-/motion-utils-11.14.3.tgz",
"integrity": "sha512-Xg+8xnqIJTpr0L/cidfTTBFkvRw26ZtGGuIhA94J9PQ2p4mEa06Xx7QVYZH0BP+EpMSaDlu+q0I0mmvwADPsaQ==",
"license": "MIT"
},
"node_modules/mrmime": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.0.tgz",
@ -6128,16 +6787,17 @@
}
},
"node_modules/prettier": {
"version": "2.8.7",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.7.tgz",
"integrity": "sha512-yPngTo3aXUUmyuTjeTUT75txrf+aMh9FiD7q9ZE/i6r0bPb22g4FsE6Y338PQX1bmfy08i9QQCB7/rcUAVntfw==",
"version": "3.4.2",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.4.2.tgz",
"integrity": "sha512-e9MewbtFo+Fevyuxn/4rrcDAaq0IYxPGLvObpQjiZBMAzB9IGmzlnG9RZy3FFas+eBMu2vA0CszMeduow5dIuQ==",
"license": "MIT",
"optional": true,
"peer": true,
"bin": {
"prettier": "bin-prettier.js"
"prettier": "bin/prettier.cjs"
},
"engines": {
"node": ">=10.13.0"
"node": ">=14"
},
"funding": {
"url": "https://github.com/prettier/prettier?sponsor=1"
@ -6204,6 +6864,36 @@
],
"license": "MIT"
},
"node_modules/react": {
"version": "19.0.0",
"resolved": "https://registry.npmjs.org/react/-/react-19.0.0.tgz",
"integrity": "sha512-V8AVnmPIICiWpGfm6GLzCR/W5FXLchHop40W4nXBmdlEceh16rCN8O8LNWm5bh5XUX91fh7KpA+W0TgMKmgTpQ==",
"license": "MIT",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/react-dom": {
"version": "19.0.0",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.0.0.tgz",
"integrity": "sha512-4GV5sHFG0e/0AD4X+ySy6UJd3jVl1iNsNHdpad0qhABJ11twS3TTBnseqsKurKcsNqCEFeGL3uLpVChpIO3QfQ==",
"license": "MIT",
"dependencies": {
"scheduler": "^0.25.0"
},
"peerDependencies": {
"react": "^19.0.0"
}
},
"node_modules/react-refresh": {
"version": "0.14.2",
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz",
"integrity": "sha512-jCvmsr+1IUSMUyzOkRcvnVbX3ZYC6g9TDrDbFuFmRDq7PD4yaGbLKNQL6k2jnArV8hjYxh7hVhAZB6s9HDGpZA==",
"license": "MIT",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/readdirp": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.0.2.tgz",
@ -6699,6 +7389,12 @@
"integrity": "sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg==",
"license": "ISC"
},
"node_modules/scheduler": {
"version": "0.25.0",
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.25.0.tgz",
"integrity": "sha512-xFVuu11jh+xcO7JOAGJNOXld8/TcEHK/4CituBUeUb5hqxJLj9YuemAEuvm9gQ/+pgXYfbQuqAkiYu+u7YEsNA==",
"license": "MIT"
},
"node_modules/section-matter": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/section-matter/-/section-matter-1.0.0.tgz",
@ -7128,8 +7824,7 @@
"version": "2.8.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
"license": "0BSD",
"optional": true
"license": "0BSD"
},
"node_modules/type-fest": {
"version": "4.30.0",
@ -7856,6 +8551,22 @@
"prettier": "2.8.7"
}
},
"node_modules/yaml-language-server/node_modules/prettier": {
"version": "2.8.7",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.7.tgz",
"integrity": "sha512-yPngTo3aXUUmyuTjeTUT75txrf+aMh9FiD7q9ZE/i6r0bPb22g4FsE6Y338PQX1bmfy08i9QQCB7/rcUAVntfw==",
"license": "MIT",
"optional": true,
"bin": {
"prettier": "bin-prettier.js"
},
"engines": {
"node": ">=10.13.0"
},
"funding": {
"url": "https://github.com/prettier/prettier?sponsor=1"
}
},
"node_modules/yaml-language-server/node_modules/request-light": {
"version": "0.5.8",
"resolved": "https://registry.npmjs.org/request-light/-/request-light-0.5.8.tgz",

View File

@ -11,8 +11,15 @@
},
"dependencies": {
"@astrojs/check": "0.9.4",
"@astrojs/react": "4.1.0",
"@astrojs/starlight": "0.29.2",
"@types/react": "19.0.1",
"@types/react-dom": "19.0.2",
"astro": "4.16.17",
"framer-motion": "11.14.4",
"motion": "11.14.4",
"react": "19.0.0",
"react-dom": "19.0.0",
"sharp": "0.33.5",
"starlight-blog": "0.15.0",
"starlight-image-zoom": "0.9.0",

BIN
docs/public/missing.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 498 KiB

View File

@ -0,0 +1 @@
iVBORw0KGgoAAAANSUhEUgAAASwAAAEsCAYAAAB5fY51AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MTIzODU1NjI4RjU1MTFFQjg5QzVCNTY1QjY1NjY1QjYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MTIzODU1NjM4RjU1MTFFQjg5QzVCNTY1QjY1NjY1QjYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoxMjM4NTU2MDhGNTUxMUVCODlDNUI1NjVCNjU2NjVCNiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoxMjM4NTU2MThGNTUxMUVCODlDNUI1NjVCNjU2NjVCNiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PgH//v38+/r5+Pf29fTz8vHw7+7t7Ovq6ejn5uXk4+Lh4N/e3dzb2tnY19bV1NPS0dDPzs3My8rJyMfGxcTDwsHAv769vLu6ubi3trW0s7KxsK+urayrqqmop6alpKOioaCfnp2cm5qZmJeWlZSTkpGQj46NjIuKiYiHhoWEg4KBgH9+fXx7enl4d3Z1dHNycXBvbm1sa2ppaGdmZWRjYmFgX15dXFtaWVhXVlVUU1JRUE9OTUxLSklIR0ZFRENCQUA/Pj08Ozo5ODc2NTQzMjEwLy4tLCsqKSgnJiUkIyIhIB8eHRwbGhkYFxYVFBMSERAPDg0MCwoJCAcGBQQDAgEAACH5BAEAAAAALAAAAAAsASwBAAL/hI+py+0Po5y02ouz3rz7D4biSJbmiabqyrbuC8fyTNf2jef6zvf+DwwKh8Si8YhMKpfMpvMJjUqn1Kr1is1qt9yu9wsOi8fksvmMTqvX7Lb7DY/L5/S6/Y7P6/f8vv8PGCg4SFhoeIiYqLjI2Oj4CBkpOUlZaXmJmam5ydnp+QkaKjpKWmp6ipqqusra6voKGys7S1tre4ubq7vL2+v7CxwsPExcbHyMnKy8zNzs/AwdLT1NXW19jZ2tvc3d7f0NHi4+Tl5ufo6err7O3u7+Dh8vP09fb3+Pn6+/z9/v/w8woMCBBAsaPIgwocKFDBs6fAgxosSJFCtavIgxo8aN/xw7evwIMqTIkSRLmjyJMqXKlSxbunwJM6bMmTRr2ryJM6fOnTx7+vwJNKjQoUSLGj2KNKnSpUybOn0KNarUqVSrWr2KNavWrVy7ev0KNqzYsWTLmj2LNq3atWzbun0LN67cuXTr2r2LN6/evXz7+v0LOLDgwYQLGz6MOLHixYwbO34MObLkyZQrW76MObPmzZw7e/4MOrTo0aRLmz6NOrXq1axbu34NO7bs2bRr276NO7fu3bx7+/4NPLjw4cSLGz+OPLny5cybO38OPbr06dSrW7+OPbv27dy7e/8OPrz48eTLmz+PPr369ezbu38PP778+fTr27+PP7/+/fz7+9OPX7//fwAGKOCABBZo4IEIJqjgggw26OCDEEYo4YQUVmjhhRhmqOGGHHbo4YcghijiiCSWaOKJKKao4oostujiizDGKOOMNNZo44045qjjjjz26OOPQAYp5JBEFmnkkUgmqeSSTDbp5JNQRinllFRWaeWVWGap5ZZcdunll2CGKeaYZJZp5plopqnmmmy26eabcMYp55x01mnnnXjmqeeefPbp55+ABirooIQWauihiCaq6KKMNuroo5BGKumklFZq6aWYZqrpppx26umnoIYq6qiklmrqqaimquqqrLbq6quwxirrqxEAADs=

BIN
docs/src/assets/qr1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

BIN
docs/src/assets/qr2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 74 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 66 KiB

After

Width:  |  Height:  |  Size: 8.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 92 KiB

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 30 KiB

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 135 KiB

After

Width:  |  Height:  |  Size: 50 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 146 KiB

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 89 KiB

After

Width:  |  Height:  |  Size: 79 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 440 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 291 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 188 KiB

After

Width:  |  Height:  |  Size: 66 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 88 KiB

After

Width:  |  Height:  |  Size: 61 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 68 KiB

After

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 38 KiB

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.0 MiB

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 74 KiB

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 31 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 71 KiB

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 114 KiB

After

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 156 KiB

After

Width:  |  Height:  |  Size: 68 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 140 KiB

After

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 119 KiB

After

Width:  |  Height:  |  Size: 110 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 56 KiB

After

Width:  |  Height:  |  Size: 47 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 69 KiB

After

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 51 KiB

After

Width:  |  Height:  |  Size: 50 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 6.9 KiB

After

Width:  |  Height:  |  Size: 12 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 5.4 KiB

After

Width:  |  Height:  |  Size: 2.7 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 5.4 KiB

After

Width:  |  Height:  |  Size: 2.7 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 6.9 KiB

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -0,0 +1,62 @@
---
---
<script is:inline>
function initAnimation() {
console.log('Initializing animation');
// Add Motion One from CDN
const script = document.createElement('script');
script.src = 'https://cdn.jsdelivr.net/npm/motion@10.16.2/dist/motion.min.js';
script.onload = () => {
const { animate, inView } = window.Motion;
inView('.card', (info) => {
const card = info.target;
// Set initial state
card.style.opacity = '0';
card.style.transform = 'translateY(50px) scale(0.9) rotate(-2deg)';
// Create animations
const fadeAnimation = animate(card,
{ opacity: [0, 1] },
{ duration: 1, easing: 'ease-out' }
);
const moveAnimation = animate(card,
{
transform: [
'translateY(50px) scale(0.9) rotate(-2deg)',
'translateY(0) scale(1) rotate(0)'
]
},
{
duration: 0.8,
easing: [0.34, 1.56, 0.64, 1],
delay: 0.1
}
);
return () => {
fadeAnimation.stop();
moveAnimation.stop();
};
}, {
margin: '0px 0px 10% 0px',
borderRadius: 10,
amount: 0.3,
});
};
document.head.appendChild(script);
}
// Try immediately
initAnimation();
// Also try on load in case DOM isn't ready
window.addEventListener('load', initAnimation);
// And on content loaded
document.addEventListener('DOMContentLoaded', initAnimation);
</script>

View File

@ -1,193 +0,0 @@
---
title: Application
sidebar:
order: 10
---
The application API assists in creating an application using the Wails
framework.
### New
API: `New(appOptions Options) *App`
`New(appOptions Options)` creates a new application using the given application
options . It applies default values for unspecified options, merges them with
the provided ones, initializes and returns an instance of the application.
In case of an error during initialization, the application is stopped with the
error message provided.
It should be noted that if a global application instance already exists, that
instance will be returned instead of creating a new one.
```go "main.go" {6-9}
package main
import "github.com/wailsapp/wails/v3/pkg/application"
func main() {
app := application.New(application.Options{
Name: "WebviewWindow Demo",
// Other options
})
// Rest of application
}
```
### Get
`Get()` returns the global application instance. It's useful when you need to
access the application from different parts of your code.
```go
// Get the application instance
app := application.Get()
```
### Capabilities
API: `Capabilities() capabilities.Capabilities`
`Capabilities()` retrieves a map of capabilities that the application currently
has. Capabilities can be about different features the operating system provides,
like webview features.
```go
// Get the application capabilities
capabilities := app.Capabilities()
if capabilities.HasNativeDrag {
// Do something
}
```
### GetPID
API: `GetPID() int`
`GetPID()` returns the Process ID of the application.
```go
pid := app.GetPID()
```
### Run
API: `Run() error`
`Run()` starts the execution of the application and its components.
```go
app := application.New(application.Options{
//options
})
// Run the application
err := app.Run()
if err != nil {
// Handle error
}
```
### Quit
API: `Quit()`
`Quit()` quits the application by destroying windows and potentially other
components.
```go
// Quit the application
app.Quit()
```
### IsDarkMode
API: `IsDarkMode() bool`
`IsDarkMode()` checks if the application is running in dark mode. It returns a
boolean indicating whether dark mode is enabled.
```go
// Check if dark mode is enabled
if app.IsDarkMode() {
// Do something
}
```
### Hide
API: `Hide()`
`Hide()` hides the application window.
```go
// Hide the application window
app.Hide()
```
### Show
API: `Show()`
`Show()` shows the application window.
```go
// Show the application window
app.Show()
```
### Path
API: `Path(selector Path) string`
`Path(selector Path)` returns the full path for the given path type. It provides
a cross-platform way to query common application directories.
The `Path` type is an enum with the following values:
- `PathHome`: Returns the user's home directory
- `PathDataHome`: Returns the path to the user's data directory
- `PathConfigHome`: Returns the path to the user's configuration directory
- `PathStateHome`: Returns the path to the user's state directory
- `PathCacheHome`: Returns the path to the user's cache directory
- `PathRuntimeDir`: Returns the path to the user's runtime directory
- `PathDesktop`: Returns the path to the user's desktop directory
- `PathDownload`: Returns the path to the user's download directory
- `PathDocuments`: Returns the path to the user's documents directory
- `PathMusic`: Returns the path to the user's music directory
- `PathPictures`: Returns the path to the user's pictures directory
- `PathVideos`: Returns the path to the user's videos directory
- `PathTemplates`: Returns the path to the user's templates directory
- `PathPublicShare`: Returns the path to the user's public share directory
```go
// Get the data home directory path
dataHomePath := app.Path(application.PathDataHome)
fmt.Println("DataHome path:", dataHomePath)
// Output: DataHome path: /home/username/.local/share // Linux
// Output: DataHome path: /Users/username/Library/Application Support // macOS
// Output: DataHome path: C:\Users\Username\AppData\Roaming // Windows
// Get the CacheHome directory path
cacheHomePath := app.Path(application.PathCacheHome)
fmt.Println("CacheHome path:", cacheHomePath)
// Output: CacheHome path: /home/username/.cache // Linux
// Output: CacheHome path: /Users/username/Library/Caches // macOS
// Output: CacheHome path: C:\Users\Username\AppData\Local\Temp // Windows
```
## Paths
API: `Paths(selector Paths) []string` `Paths(selector Path)` returns a list of
paths for the given path type. It provides a cross-platform way to query common
directory paths.
The `Paths` type is an enum with the following values:
- `PathsDataDirs`: Returns the list of data directories
- `PathsConfigDirs`: Returns the list of configuration directories
- `PathsCacheDirs`: Returns the list of cache directories
- `PathsRuntimeDirs`: Returns the list of runtime directories

View File

@ -1,107 +0,0 @@
---
title: Application Dialogs
sidebar:
order: 40
---
:::caution[MacOS Dialogs and Application Lifecycle]
If you show dialogs during application startup or file open events, you should
set `ApplicationShouldTerminateAfterLastWindowClosed` to `false` to prevent the
application from terminating when those dialogs close. Otherwise, the
application may quit before your main window appears.
```go
app := application.New(application.Options{
Mac: application.MacOptions{
ApplicationShouldTerminateAfterLastWindowClosed: false,
},
// ... rest of options
})
```
Alternatively, you can show startup dialogs after the main window has been
displayed:
```go
var filename string
app.OnApplicationEvent(events.Common.ApplicationOpenedWithFile, func(event *application.ApplicationEvent) {
filename = event.Context().Filename()
})
window.OnWindowEvent(events.Common.WindowShow, func(event *application.WindowEvent) {
application.InfoDialog().
SetTitle("File Opened").
SetMessage("Application opened with file: " + filename).
Show()
})
```
:::
### ShowAboutDialog
API: `ShowAboutDialog()`
`ShowAboutDialog()` shows an "About" dialog box. It can show the application's
name, description and icon.
```go
// Show the about dialog
app.ShowAboutDialog()
```
### Info
API: `InfoDialog()`
`InfoDialog()` creates and returns a new instance of `MessageDialog` with an
`InfoDialogType`. This dialog is typically used to display informational
messages to the user.
### Question
API: `QuestionDialog()`
`QuestionDialog()` creates and returns a new instance of `MessageDialog` with a
`QuestionDialogType`. This dialog is often used to ask a question to the user
and expect a response.
### Warning
API: `WarningDialog()`
`WarningDialog()` creates and returns a new instance of `MessageDialog` with a
`WarningDialogType`. As the name suggests, this dialog is primarily used to
display warning messages to the user.
### Error
API: `ErrorDialog()`
`ErrorDialog()` creates and returns a new instance of `MessageDialog` with an
`ErrorDialogType`. This dialog is designed to be used when you need to display
an error message to the user.
### OpenFile
API: `OpenFileDialog()`
`OpenFileDialog()` creates and returns a new `OpenFileDialogStruct`. This dialog
prompts the user to select one or more files from their file system.
### SaveFile
API: `SaveFileDialog()`
`SaveFileDialog()` creates and returns a new `SaveFileDialogStruct`. This dialog
prompts the user to choose a location on their file system where a file should
be saved.
### OpenDirectory
API: `OpenDirectoryDialog()`
`OpenDirectoryDialog()` creates and returns a new instance of `MessageDialog`
with an `OpenDirectoryDialogType`. This dialog enables the user to choose a
directory from their file system.

View File

@ -1,60 +0,0 @@
---
title: Application Events
sidebar:
order: 50
---
### OnEvent
API: `OnEvent(name string, callback func(event *CustomEvent)) func()`
`OnEvent()` registers an event listener for specific application events. The
callback function provided will be triggered when the corresponding event
occurs.
### OffEvent
API: `OffEvent(name string)`
`OffEvent()` removes an event listener for a specific named event specified.
### OnMultipleEvent
API:
`OnMultipleEvent(name string, callback func(event *CustomEvent), counter int) func()`
`OnMultipleEvent()` registers an event listener for X number of Events. The
callback function provided will be triggered `counter` times when the
corresponding event occurs.
### ResetEvents
API: `ResetEvents()`
`ResetEvents()` removes all event listeners for all application events.
### OnApplicationEvent
API:
`OnApplicationEvent(eventType events.ApplicationEventType, callback func(event *ApplicationEvent)) func()`
`OnApplicationEvent()` registers an event listener for specific application
events. The `eventType` is based on events.ApplicationEventType. See
[ApplicationEventType](/api/event_types/#applicationevent)
### RegisterApplicationHook
API:
`RegisterApplicationEventHook(eventType events.ApplicationEventType, callback func(event *ApplicationEvent)) func()`
`RegisterApplicationEventHook()` registers a callback to be triggered based on
specific application events.
### RegisterHook
API:
`RegisterHook(eventType events.ApplicationEventType, callback func(event *Event)) func()`
`RegisterHook()` registers a callback to be run as a hook during specific
events. These hooks are run before listeners attached with `On()`. The function
returns a function that can be called to remove the hook.

View File

@ -1,36 +0,0 @@
---
title: Application Menu
sidebar:
order: 30
---
### RegisterContextMenu
API: `RegisterContextMenu(name string, menu *Menu)`
`RegisterContextMenu()` registers a context menu with a given name. This menu
can be used later in the application.
```go
// Create a new menu
ctxmenu := app.NewMenu()
// Register the menu as a context menu
app.RegisterContextMenu("MyContextMenu", ctxmenu)
```
### SetMenu
API: `SetMenu(menu *Menu)`
`SetMenu()` sets the menu for the application. On Mac, this will be the global
menu. For Windows and Linux, this will be the default menu for any new window
created.
```go
// Create a new menu
menu := app.NewMenu()
// Set the menu for the application
app.SetMenu(menu)
```

View File

@ -1,14 +0,0 @@
---
title: Application Options
sidebar:
order: 70
---
import { Code } from "@astrojs/starlight/components";
import application_options from "../../../../../v3/pkg/application/application_options.go?raw";
<Code
code={application_options}
lang="go"
title="pkg/application/application_options.go"
/>

View File

@ -1,21 +0,0 @@
---
title: Application Screens
sidebar:
order: 60
---
### GetPrimaryScreen
API: `GetPrimaryScreen() (*Screen, error)`
`GetPrimaryScreen()` returns the primary screen of the system.
### GetScreens
API: `GetScreens() ([]*Screen, error)`
`GetScreens()` returns information about all screens attached to the system.
This is a brief summary of the exported methods in the provided `App` struct. Do
note that for more detailed functionality or considerations, refer to the actual
Go code or further internal documentation.

View File

@ -1,73 +0,0 @@
---
title: Application Window
sidebar:
order: 20
---
### NewWebviewWindow
API: `NewWebviewWindow() *WebviewWindow`
`NewWebviewWindow()` creates a new Webview window with default options, and
returns it.
```go
// Create a new webview window
window := app.NewWebviewWindow()
```
### NewWebviewWindowWithOptions
API:
`NewWebviewWindowWithOptions(windowOptions WebviewWindowOptions) *WebviewWindow`
`NewWebviewWindowWithOptions()` creates a new webview window with custom
options. The newly created window is added to a map of windows managed by the
application.
```go
// Create a new webview window with custom options
window := app.NewWebviewWindowWithOptions(WebviewWindowOptions{
Name: "Main",
Title: "My Window",
Width: 800,
Height: 600,
})
```
### OnWindowCreation
API: `OnWindowCreation(callback func(window *WebviewWindow))`
`OnWindowCreation()` registers a callback function to be called when a window is
created.
```go
// Register a callback to be called when a window is created
app.OnWindowCreation(func(window *WebviewWindow) {
// Do something
})
```
### GetWindowByName
API: `GetWindowByName(name string) *WebviewWindow`
`GetWindowByName()` fetches and returns a window with a specific name.
```go
// Get a window by name
window := app.GetWindowByName("Main")
```
### CurrentWindow
API: `CurrentWindow() *WebviewWindow`
`CurrentWindow()` fetches and returns a pointer to the currently active window
in the application. If there is no window, it returns nil.
```go
// Get the current window
window := app.CurrentWindow()
```

View File

@ -1,152 +0,0 @@
---
title: Event Hooks
tableOfContents:
maxHeadingLevel: 4
sidebar:
order: 90
---
wails3 provides an event system that allows for hooking into application and
window events
```go
// Notification of application start
application.RegisterApplicationEventHook(events.Common.ApplicationStarted, func(event *application.ApplicationEvent) {
app.Logger.Info("Application started!")
})
```
```go
// Notification of system theme change
application.OnApplicationEvent(events.Common.ThemeChanged, func(event *application.ApplicationEvent) {
app.Logger.Info("System theme changed!")
if event.Context().IsDarkMode() {
app.Logger.Info("System is now using dark mode!")
} else {
app.Logger.Info("System is now using light mode!")
}
})
```
```go
// Disable window closing by canceling the event
window.RegisterHook(events.Common.WindowClosing, func(e *application.WindowEvent) {
app.Logger.Info("Window 1 Closing? Nope! Not closing!")
e.Cancel()
})
```
```go
// Notification of window focus
window.OnWindowEvent(events.Common.WindowFocus, func(e *application.WindowEvent) {
app.Logger.Info("[ApplicationEvent] Window focus!")
})
```
### Application Events
Application events are hookable events that can be registered with
`application.RegisterApplicationEventHook()` and
`application.OnApplicationEvent()`.
These events are based on `events.ApplicationEventType`.
#### `events.Common.ApplicationStarted`
Triggered when the application starts
#### `events.Common.ThemeChanged`
Triggered when the application theme changes
### Window Events
#### `events.Common.WindowMaximised`
Triggered when the window is maximised
#### `events.Common.WindowUnmaximised`
Triggered when the window is unmaximised
#### `events.Common.WindowMinimised`
Triggered when the window is minimised
#### `events.Common.WindowUnminimised`
Triggered when the window is unminimised
#### `events.Common.WindowFullscreen`
Triggered when the window is set to fullscreen
#### `events.Common.WindowUnfullscreen`
Triggered when the window is unfullscreened
#### `events.Common.WindowRestored`
Triggered when the window is restored
#### `events.Common.WindowClosing`
Triggered before the window closes
#### `events.Common.WindowZoom`
Triggered when the window is zoomed
#### `events.Common.WindowZoomOut`
Triggered when the window is zoomed out
#### `events.Common.WindowZoomIn`
Triggered when the window is zoomed in
#### `events.Common.WindowZoomReset`
Triggered when the window zoom is reset
#### `events.Common.WindowFocus`
Triggered when the window gains focus
#### `events.Common.WindowLostFocus`
Triggered when the window loses focus
#### `events.Common.WindowShow`
Triggered when the window is shown
#### `events.Common.WindowHide`
Triggered when the window is hidden
#### `events.Common.WindowDPIChanged`
Triggered when the window DPI changes
#### `events.Common.WindowFilesDropped`
Triggered when files are dropped on the window
#### `events.Common.WindowRuntimeReady`
Triggered when the window runtime is ready
#### `events.Common.WindowDidMove`
Triggered when the window is moved
#### `events.Common.WindowDidResize`
Triggered when the window is resized
### OS Specific Events
- [Mac Events](/api/events_mac)
- [Windows Events](/api/events_windows)
- [Linux Events](/api/events_linux)

View File

@ -1,55 +0,0 @@
---
title: Event Types
sidebar:
order: 140
---
### ApplicationEvent
Returned when an application hook event is triggered. The event can be cancelled
by calling the `Cancel()` method on the event.
```go
type ApplicationEvent struct {
Id uint
ctx *ApplicationEventContext
Cancelled bool
}
// Cancel the event
func (a *ApplicationEvent) Cancel() {}
```
### WindowEvent
Returned when a window hook event is triggered. The event can be cancelled by
calling the `Cancel()` method on the event.
```go
type WindowEvent struct {
ctx *WindowEventContext
Cancelled bool
}
// Cancel the event
func (w *WindowEvent) Cancel() {}
```
### CustomEvent
CustomEvent is returned when an event is being received it includes the name of
the event, the data that was sent with the event, the sender of the event,
application or a specific window. The event can be cancelled by calling the
`Cancel()` method on the event.
```go
type CustomEvent struct {
Name string `json:"name"`
Data any `json:"data"`
Sender string `json:"sender"`
Cancelled bool
}
// Cancel the event
func (c *CustomEvent) Cancel() {}
```

View File

@ -1,147 +0,0 @@
---
title: Events (Custom)
tableOfContents:
maxHeadingLevel: 4
sidebar:
order: 130
---
import { Tabs, TabItem } from "@astrojs/starlight/components";
## Custom Events
You can create your own custom events that can be emitted and received on both
the frontend and backend. Events are able to emitted at both the application and
the window level. The receiver of the event gets data of where the event was
emitted from along with the data that was sent with the event. Events can be
cancelled by the receiver.
<Tabs syncKey="language">
<TabItem label="Go" icon="seti:go">
```go
app.OnEvent("event1", func(e \*application.CustomEvent) {
app.Logger.Info("[Go] CustomEvent received", "name", e.Name, "data", e.Data,
"sender", e.Sender, "cancelled", e.Cancelled) app.Logger.Info("[Go]",
e.Data[0].(string)) // Logs "Hello from JS" to the terminal })
window.EmitEvent("event2", "Hello from Go")
}
```
</TabItem>
<TabItem label="JS" icon="seti:javascript">
```js
wails.Events.Emit("event1", "Hello from JS");
wails.Events.On("event2", function (event) {
console.log("[JS] CustomEvent received", event);
console.log(event.data); // prints "Hello from Go" to the webview console
});
```
</TabItem>
</Tabs>
### Emitting Events
<Tabs syncKey="language">
<TabItem label="Go" icon="seti:go">
#### `application.EmitEvent(name string, data ...any)`
Emits an event from the application instance
</TabItem>
<TabItem label="JS" icon="seti:javascript">
#### `window.EmitEvent(name string, data ...any)`
Emits an event from the window instance
#### `wails.Events.Emit(event:wails.Events.EventData)`
Emits an event from the frontend sending an object with `name` and `data`
properties or the typescript type WailsEvent
</TabItem>
</Tabs>
### Receiving Events
Events can be received on the application instance and the frontend with a
couple options of how you chose to receive them. You can register a single event
listener that will trigger every time the event is emitted or you can register
an event listener that will only trigger a specific number of times.
<Tabs syncKey="language">
<TabItem label="Go" icon="seti:go">
#### `application.OnEvent(name string, handler func(data ...any))`
Registers an event on the application instance this will trigger every time the
event is emitted
#### `application.OnMultipleEvent(name string, handler func(data ...any), count int)`
Registers an event on the application instance this will trigger every time the
event is emitted up to the count specified
</TabItem>
<TabItem label="JS" icon="seti:javascript">
#### `wails.Events.On(name: string, callback: ()=>void)`,
Registers an event on the frontend, this function returns a function that can be
called to remove the event listener
#### `wails.Events.Once(name: string, callback: ()=>void)`,
Registers an event on the frontend that will only be called once, this function
returns a function that can be called to remove the event listener
#### `wails.Events.OnMultiple(name: string, callback: ()=>void, count: number)`,
Registers an event on the frontend that will only be called `count` times, this
function returns a function that can be called to remove the event listener
</TabItem>
</Tabs>
### Removing Events
There are a few ways to remove events that are registered. All of the
registration functions return a function that can be called to remove the event
listener in the frontend. There are additional functions provided to help remove
events as well.
<Tabs syncKey="language">
<TabItem label="Go" icon="seti:go">
#### `application.OffEvent(name string, ...additionalNames string)`
Removes an event listener with the specified name
#### `application.ResetEvents()`
Removes all registered events and hooks
</TabItem>
<TabItem label="JS" icon="seti:javascript">
#### `wails.Events.OffAll()`
Removes all registered events
#### `wails.Events.Off(name: string)`
Removes an event listener with the specified name
</TabItem>
</Tabs>

View File

@ -1,43 +0,0 @@
---
title: Events (Linux)
tableOfContents:
maxHeadingLevel: 4
sidebar:
order: 120
---
## Application Events
#### `events.Linux.ApplicationStartup`
Triggered when the application starts
#### `events.Linux.SystemThemeChanged`
Triggered when the system theme changes
### Window Events
#### `events.Linux.WindowLoadChanged`
Triggered when the window load changes
#### `events.Linux.WindowDeleteEvent`
Triggered when the window is deleted
#### `events.Linux.WindowDidMove`
Triggered when the window is moved
#### `events.Linux.WindowDidResize`
Triggered when the window is resized
#### `events.Linux.WindowFocusIn`
Triggered when the window gains focus
#### `events.Linux.WindowFocusOut`
Triggered when the window loses focus

View File

@ -1,500 +0,0 @@
---
title: Events (macOS)
tableOfContents:
maxHeadingLevel: 4
sidebar:
order: 100
---
## Application Events
#### `events.Mac.ApplicationDidBecomeActive`
Triggered when the application becomes active
#### `events.Mac.ApplicationDidChangeBackingProperties`
Triggered when the application changes backing properties
#### `events.Mac.ApplicationDidChangeEffectiveAppearance`
Triggered when the application changes effective appearance
#### `events.Mac.ApplicationDidChangeIcon`
Triggered when the application changes icon
#### `events.Mac.ApplicationDidChangeOcclusionState`
Triggered when the application changes occlusion state
#### `events.Mac.ApplicationDidChangeScreenParameters`
Triggered when the application changes screen parameters
#### `events.Mac.ApplicationDidChangeStatusBarFrame`
Triggered when the application changes status bar frame
#### `events.Mac.ApplicationDidChangeStatusBarOrientation`
Triggered when the application changes status bar orientation
#### `events.Mac.ApplicationDidFinishLaunching`
Triggered when the application finishes launching
#### `events.Mac.ApplicationDidResignActiveNotification`
Triggered when the application is no longer active
#### `events.Mac.ApplicationDidHide`
Triggered when the application is hidden
#### `events.Mac.ApplicationDidUpdate`
Triggered when the application updates
#### `events.Mac.ApplicationWillBecomeActive`
Triggered when the application is about to become active
#### `events.Mac.ApplicationWillFinishLaunching`
Triggered when the application is about to finish launching
#### `events.Mac.ApplicationWillHide`
Triggered when the application is about to hide
#### `events.Mac.ApplicationWillResignActive`
Triggered when the application is about to lose focus
#### `events.Mac.ApplicationWillTerminate`
Triggered when the application is about to terminate
#### `events.Mac.ApplicationWillUnhide`
Triggered when the application is about to unhide
#### `events.Mac.ApplicationWillUpdate`
Triggered when the application is about to update
#### `events.Mac.ApplicationDidChangeTheme`
Triggered when the application changes theme
#### `events.Mac.MenuWillOpen`
Triggered when the menu is about to open
#### `events.Mac.MenuDidOpen`
Triggered when the menu opens
#### `events.Mac.MenuDidClose`
Triggered when the menu closes
#### `events.Mac.MenuWillSendAction`
Triggered when the menu is about to send an action
#### `events.Mac.MenuDidSendAction`
Triggered when the menu sends an action
#### `events.Mac.MenuWillHighlightItem`
Triggered when the menu is about to highlight an item
#### `events.Mac.MenuDidHighlightItem`
Triggered when the menu highlights an item
#### `events.Mac.MenuWillDisplayItem`
Triggered when the menu is about to display an item
#### `events.Mac.MenuDidDisplayItem`
Triggered when the menu displays an item
#### `events.Mac.MenuWillAddItem`
Triggered when the menu is about to add an item
#### `events.Mac.MenuDidAddItem`
Triggered when the menu adds an item
#### `events.Mac.MenuWillRemoveItem`
Triggered when the menu is about to remove an item
#### `events.Mac.MenuDidRemoveItem`
Triggered when the menu removes an item
#### `events.Mac.MenuWillBeginTracking`
Triggered when the menu is about to begin tracking
#### `events.Mac.MenuDidBeginTracking`
Triggered when the menu begins tracking
#### `events.Mac.MenuWillEndTracking`
Triggered when the menu is about to end tracking
#### `events.Mac.MenuDidEndTracking`
Triggered when the menu ends tracking
#### `events.Mac.MenuWillUpdate`
Triggered when the menu is about to update
#### `events.Mac.MenuDidUpdate`
Triggered when the menu updates
#### `events.Mac.MenuWillPopUp`
Triggered when the menu is about to pop up
#### `events.Mac.MenuDidPopUp`
Triggered when the menu pops up
#### `events.Mac.MenuWillSendActionToItem`
Triggered when the menu is about to send an action to an item
#### `events.Mac.MenuDidSendActionToItem`
Triggered when the menu sends an action to an item
##### Window Events
#### `events.Mac.WindowDidBecomeKey`
Triggered when the window becomes key
#### `events.Mac.WindowDidBecomeMain`
Triggered when the window becomes main
#### `events.Mac.WindowDidBeginSheet`
Triggered when the window begins a sheet
#### `events.Mac.WindowDidChangeAlpha`
Triggered when the window alpha changes
#### `events.Mac.WindowDidChangeBackingLocation`
Triggered when the window backing location changes
#### `events.Mac.WindowDidChangeBackingProperties`
Triggered when the window backing properties change
#### `events.Mac.WindowDidChangeCollectionBehavior`
Triggered when the window collection behavior changes
#### `events.Mac.WindowDidChangeEffectiveAppearance`
Triggered when the window effective appearance changes
#### `events.Mac.WindowDidChangeOcclusionState`
Triggered when the window occlusion state changes
#### `events.Mac.WindowDidChangeOrderingMode`
Triggered when the window ordering mode changes
#### `events.Mac.WindowDidChangeScreen`
Triggered when the window screen changes
#### `events.Mac.WindowDidChangeScreenParameters`
Triggered when the window screen parameters change
#### `events.Mac.WindowDidChangeScreenProfile`
Triggered when the window screen profile changes
#### `events.Mac.WindowDidChangeScreenSpace`
Triggered when the window screen space changes
#### `events.Mac.WindowDidChangeScreenSpaceProperties`
Triggered when the window screen space properties change
#### `events.Mac.WindowDidChangeSharingType`
Triggered when the window sharing type changes
#### `events.Mac.WindowDidChangeSpace`
Triggered when the window space changes
#### `events.Mac.WindowDidChangeSpaceOrderingMode`
Triggered when the window space ordering mode changes
#### `events.Mac.WindowDidChangeTitle`
Triggered when the window title changes
#### `events.Mac.WindowDidChangeToolbar`
Triggered when the window toolbar changes
#### `events.Mac.WindowDidChangeVisibility`
Triggered when the window visibility changes
#### `events.Mac.WindowDidDeminiaturize`
Triggered when the window is deminiaturized
#### `events.Mac.WindowDidEndSheet`
Triggered when the window ends a sheet
#### `events.Mac.WindowDidEnterFullScreen`
Triggered when the window enters fullscreen
#### `events.Mac.WindowDidEnterVersionBrowser`
Triggered when the window enters version browser
#### `events.Mac.WindowDidExitFullScreen`
Triggered when the window exits fullscreen
#### `events.Mac.WindowDidExitVersionBrowser`
Triggered when the window exits version browser
#### `events.Mac.WindowDidExpose`
Triggered when the window is exposed
#### `events.Mac.WindowDidFocus`
Triggered when the window is focused
#### `events.Mac.WindowDidMiniaturize`
Triggered when the window is miniaturized
#### `events.Mac.WindowDidMove`
Triggered when the window is moved
#### `events.Mac.WindowDidOrderOffScreen`
Triggered when the window is ordered off-screen
#### `events.Mac.WindowDidOrderOnScreen`
Triggered when the window is ordered on screen
#### `events.Mac.WindowDidResignKey`
Triggered when the window resigns key
#### `events.Mac.WindowDidResignMain`
Triggered when the window resigns main
#### `events.Mac.WindowDidResize`
Triggered when the window is resized
#### `events.Mac.WindowDidUpdate`
Triggered when the window updates
#### `events.Mac.WindowDidUpdateAlpha`
Triggered when the window alpha updates
#### `events.Mac.WindowDidUpdateCollectionBehavior`
Triggered when the window collection behavior updates
#### `events.Mac.WindowDidUpdateCollectionProperties`
Triggered when the window collection properties update
#### `events.Mac.WindowDidUpdateShadow`
Triggered when the window shadow updates
#### `events.Mac.WindowDidUpdateTitle`
Triggered when the window title updates
#### `events.Mac.WindowDidUpdateToolbar`
Triggered when the window toolbar updates
#### `events.Mac.WindowDidUpdateVisibility`
Triggered when the window visibility updates
#### `events.Mac.WindowShouldClose`
Triggered when the window should close
#### `events.Mac.WindowWillBecomeKey`
Triggered when the window will become key
#### `events.Mac.WindowWillBecomeMain`
Triggered when the window will become main
#### `events.Mac.WindowWillBeginSheet`
Triggered when the window will begin a sheet
#### `events.Mac.WindowWillChangeOrderingMode`
Triggered when the window will change ordering mode
#### `events.Mac.WindowWillClose`
Triggered when the window will close
#### `events.Mac.WindowWillDeminiaturize`
Triggered when the window will deminiaturize
#### `events.Mac.WindowWillEnterFullScreen`
Triggered when the window will enter fullscreen
#### `events.Mac.WindowWillEnterVersionBrowser`
Triggered when the window will enter version browser
#### `events.Mac.WindowWillExitFullScreen`
Triggered when the window will exit fullscreen
#### `events.Mac.WindowWillExitVersionBrowser`
Triggered when the window will exit version browser
#### `events.Mac.WindowWillFocus`
Triggered when the window will focus
#### `events.Mac.WindowWillMiniaturize`
Triggered when the window will miniaturize
#### `events.Mac.WindowWillMove`
Triggered when the window will move
#### `events.Mac.WindowWillOrderOffScreen`
Triggered when the window will order off-screen
#### `events.Mac.WindowWillOrderOnScreen`
Triggered when the window will order on screen
#### `events.Mac.WindowWillResignMain`
Triggered when the window will resign main
#### `events.Mac.WindowWillResize`
Triggered when the window will resize
#### `events.Mac.WindowWillUnfocus`
Triggered when the window will unfocus
#### `events.Mac.WindowWillUpdate`
Triggered when the window will update
#### `events.Mac.WindowWillUpdateAlpha`
Triggered when the window will update alpha
#### `events.Mac.WindowWillUpdateCollectionBehavior`
Triggered when the window will update collection behavior
#### `events.Mac.WindowWillUpdateCollectionProperties`
Triggered when the window will update collection properties
#### `events.Mac.WindowWillUpdateShadow`
Triggered when the window will update shadow
#### `events.Mac.WindowWillUpdateTitle`
Triggered when the window will update title
#### `events.Mac.WindowWillUpdateToolbar`
Triggered when the window will update toolbar
#### `events.Mac.WindowWillUpdateVisibility`
Triggered when the window will update visibility
#### `events.Mac.WindowWillUseStandardFrame`
Triggered when the window will use standard frame
#### `events.Mac.WebviewDidStartProvisionalNavigation`
Triggered when the webview starts a provisional navigation
#### `events.Mac.WebviewDidReceiveServerRedirectForProvisionalNavigation`
Triggered when the webview receives a server redirect for a provisional
navigation
#### `events.Mac.WebviewDidFinishNavigation`
Triggered when the webview finishes navigation
#### `events.Mac.WebviewDidCommitNavigation`
Triggered when the webview commits navigation
#### `events.Mac.WindowFileDraggingEntered`
Triggered when files are dragged into the window
#### `events.Mac.WindowFileDraggingPerformed`
Triggered when files are dragged in the window
#### `events.Mac.WindowFileDraggingExited`
Triggered when files are dragged out of the window

View File

@ -1,112 +0,0 @@
---
title: Events (Windows)
tableOfContents:
maxHeadingLevel: 4
sidebar:
order: 110
---
## Application Events
#### `events.Windows.ApplicationStarted`
Triggered when the application starts
#### `events.Windows.SystemThemeChanged`
Triggered when the system theme changes
#### `events.Windows.APMPowerStatusChange`
Triggered when the system power status changes
#### `events.Windows.APMSuspend`
Triggered when the system suspends
#### `events.Windows.APMResumeAutomatic`
Triggered when the system resumes after a sleep
#### `events.Windows.APMResumeSuspend`
Triggered when the system resumes after a suspend and resume was triggered by
the user
## Window Events
#### `events.Windows.WebviewNavigationCompleted`
Triggered when the webview navigation is completed
#### `events.Windows.WindowInactive`
Triggered when the window is inactive
#### `events.Windows.WindowActive`
Triggered when the window is active
#### `events.Windows.ClickActive`
Triggered when the window is activated via a click
#### `events.Windows.MaximiseActive`
Triggered when the window is maximised
#### `events.Windows.UnMaximise`
Triggered when the window is unmaximised
#### `events.Windows.Fullscreen`
Triggered when the window is set to fullscreen
#### `events.Windows.UnFullscreen`
Triggered when the window exits fullscreen mode
#### `events.Windows.WindowRestore`
Triggered when the window is restored
#### `events.Windows.WindowMinimise`
Triggered when the window is minimised
#### `events.Windows.WindowUnminimise`
Triggered when the window is minimised
#### `events.Windows.WindowClose`
Triggered before the window closes
#### `events.Windows.WindowSetFocus`
Triggered when the window gains keyboard focus
#### `events.Windows.WindowKillFocus`
Triggered when the window loses keyboard focus
#### `events.Windows.WindowDragDrop`
Triggered when files are dropped on the window
#### `events.Windows.WindowDragEnter`
Triggered when a drag enters the window
#### `events.Windows.WindowDragLeave`
Triggered when a drag leaves the window
#### `events.Windows.WindowDragOver`
Triggered when a drag is over the window
#### `events.Windows.WindowDidMove`
Triggered after a window has moved

View File

@ -1,58 +0,0 @@
---
title: Main Thread Functions
sidebar:
order: 170
---
These methods are utility functions to run code on the main thread. This is
required when you want to run custom code on the UI thread.
### InvokeSync
API: `InvokeSync(fn func())`
This function runs the passed function (`fn`) synchronously. It uses a WaitGroup
(`wg`) to ensure that the main thread waits for the `fn` function to finish
before it continues. If a panic occurs inside `fn`, it will be passed to the
handler function `PanicHandler`, defined in the application options.
### InvokeSyncWithResult
API: `InvokeSyncWithResult[T any](fn func() T) (res T)`
This function works similarly to `InvokeSync(fn func())`, however, it yields a
result. Use this for calling any function with a single return.
### InvokeSyncWithError
API: `InvokeSyncWithError(fn func() error) (err error)`
This function runs `fn` synchronously and returns any error that `fn` produces.
Note that this function will recover from a panic if one occurs during `fn`'s
execution.
### InvokeSyncWithResultAndError
API:
`InvokeSyncWithResultAndError[T any](fn func() (T, error)) (res T, err error)`
This function runs `fn` synchronously and returns both a result of type `T` and
an error.
### InvokeAsync
API: `InvokeAsync(fn func())`
This function runs `fn` asynchronously. It runs the given function on the main
thread. If a panic occurs inside `fn`, it will be passed to the handler function
`PanicHandler`, defined in the application options.
---
:::tip
These functions will block execution until `fn` has finished. It's critical to
ensure that `fn` doesn't block. If you need to run a function that blocks, use
`InvokeAsync` instead.
:::

View File

@ -1,73 +0,0 @@
---
title: Menu
sidebar:
order: 160
---
Menus can be created and added to the application. They can be used to create
context menus, system tray menus and application menus.
To create a new menu, call:
```go
// Create a new menu
menu := app.NewMenu()
```
The following operations are then available on the `Menu` type:
### Add
API: `Add(label string) *MenuItem`
This method takes a `label` of type `string` as an input and adds a new
`MenuItem` with the given label to the menu. It returns the `MenuItem` added.
### AddSeparator
API: `AddSeparator()`
This method adds a new separator `MenuItem` to the menu.
### AddCheckbox
API: `AddCheckbox(label string, enabled bool) *MenuItem`
This method takes a `label` of type `string` and `enabled` of type `bool` as
inputs and adds a new checkbox `MenuItem` with the given label and enabled state
to the menu. It returns the `MenuItem` added.
### AddRadio
API: `AddRadio(label string, enabled bool) *MenuItem`
This method takes a `label` of type `string` and `enabled` of type `bool` as
inputs and adds a new radio `MenuItem` with the given label and enabled state to
the menu. It returns the `MenuItem` added.
### Update
API: `Update()`
This method processes any radio groups and updates the menu if a menu
implementation is not initialized.
### AddSubmenu
API: `AddSubmenu(s string) *Menu`
This method takes a `s` of type `string` as input and adds a new submenu
`MenuItem` with the given label to the menu. It returns the submenu added.
### AddRole
API: `AddRole(role Role) *Menu`
This method takes `role` of type `Role` as input, adds it to the menu if it is
not `nil` and returns the `Menu`.
### SetLabel
API: `SetLabel(label string)`
This method sets the `label` of the `Menu`.

View File

@ -1,116 +0,0 @@
---
title: System Tray
sidebar:
order: 150
---
The system tray houses notification area on a desktop environment, which can
contain both icons of currently-running applications and specific system
notifications.
You create a system tray by calling `app.NewSystemTray()`:
```go
// Create a new system tray
tray := app.NewSystemTray()
```
The following methods are available on the `SystemTray` type:
### SetLabel
API: `SetLabel(label string)`
The `SetLabel` method sets the tray's label.
### Label
API: `Label() string`
The `Label` method retrieves the tray's label.
### PositionWindow
API: `PositionWindow(*WebviewWindow, offset int) error`
The `PositionWindow` method calls both `AttachWindow` and `WindowOffset`
methods.
### SetIcon
API: `SetIcon(icon []byte) *SystemTray`
The `SetIcon` method sets the system tray's icon.
### SetDarkModeIcon
API: `SetDarkModeIcon(icon []byte) *SystemTray`
The `SetDarkModeIcon` method sets the system tray's icon when in dark mode.
### SetMenu
API: `SetMenu(menu *Menu) *SystemTray`
The `SetMenu` method sets the system tray's menu.
### Destroy
API: `Destroy()`
The `Destroy` method destroys the system tray instance.
### OnClick
API: `OnClick(handler func()) *SystemTray`
The `OnClick` method sets the function to execute when the tray icon is clicked.
### OnRightClick
API: `OnRightClick(handler func()) *SystemTray`
The `OnRightClick` method sets the function to execute when right-clicking the
tray icon.
### OnDoubleClick
API: `OnDoubleClick(handler func()) *SystemTray`
The `OnDoubleClick` method sets the function to execute when double-clicking the
tray icon.
### OnRightDoubleClick
API: `OnRightDoubleClick(handler func()) *SystemTray`
The `OnRightDoubleClick` method sets the function to execute when right
double-clicking the tray icon.
### AttachWindow
API: `AttachWindow(window *WebviewWindow) *SystemTray`
The `AttachWindow` method attaches a window to the system tray. The window will
be shown when the system tray icon is clicked.
### WindowOffset
API: `WindowOffset(offset int) *SystemTray`
The `WindowOffset` method sets the gap in pixels between the system tray and the
window.
### WindowDebounce
API: `WindowDebounce(debounce time.Duration) *SystemTray`
The `WindowDebounce` method sets a debounce time. In the context of Windows,
this is used to specify how long to wait before responding to a mouse up event
on the notification icon.
### OpenMenu
API: `OpenMenu()`
The `OpenMenu` method opens the menu associated with the system tray.

View File

@ -1,118 +0,0 @@
---
title: Window
sidebar:
order: 80
---
To create a window, use
[Application.NewWebviewWindow](/api/application_window#newwebviewwindow) or
[Application.NewWebviewWindowWithOptions](/api/application_window#newwebviewwindowwithoptions).
The former creates a window with default options, while the latter allows you to
specify custom options.
These methods are callable on the returned WebviewWindow object:
### SetTitle
API: `SetTitle(title string) *WebviewWindow`
This method updates the window title to the provided string. It returns the
WebviewWindow object, allowing for method chaining.
### Name
API: `Name() string`
This function returns the name of the WebviewWindow.
### SetSize
API: `SetSize(width, height int) *WebviewWindow`
This method sets the size of the WebviewWindow to the provided width and height
parameters. If the dimensions provided exceed the constraints, they are adjusted
appropriately.
### SetAlwaysOnTop
API: `SetAlwaysOnTop(b bool) *WebviewWindow`
This function sets the window to stay on top based on the boolean flag provided.
### Show
API: `Show() *WebviewWindow`
`Show` method is used to make the window visible. If the window is not running,
it first invokes the `run` method to start the window and then makes it visible.
### Hide
API: `Hide() *WebviewWindow`
`Hide` method is used to hide the window. It sets the hidden status of the
window to true and emits the window hide event.
### SetURL
API: `SetURL(s string) *WebviewWindow`
`SetURL` method is used to set the URL of the window to the given URL string.
### SetZoom
API: `SetZoom(magnification float64) *WebviewWindow`
`SetZoom` method sets the zoom level of the window content to the provided
magnification level.
### GetZoom
API: `GetZoom() float64`
`GetZoom` function returns the current zoom level of the window content.
### GetScreen
API: `GetScreen() (*Screen, error)`
`GetScreen` method returns the screen on which the window is displayed.
### SetFrameless
API: `SetFrameless(frameless bool) *WebviewWindow`
This function is used to remove the window frame and title bar. It toggles the
framelessness of the window according to the boolean value provided (true for
frameless, false for framed).
### RegisterContextMenu
API: `RegisterContextMenu(name string, menu *Menu)`
This function is used to register a context menu and assigns it the given name.
### NativeWindowHandle
API: `NativeWindowHandle() (uintptr, error)`
This function is used to fetch the platform native window handle for the window.
### Focus
API: `Focus()`
This function is used to focus the window.
### SetEnabled
API: `SetEnabled(enabled bool)`
This function is used to enable/disable the window based on the provided boolean
value.
### SetPosition
API: `SetPosition(x int, y int)`
This function sets the absolute position of the window in the screen.

View File

@ -2,7 +2,13 @@
title: Changelog
---
<!--
Legend:
-  - macOS
- ⊞ - Windows
- 🐧 - Linux
/*--
All notable changes to this project will be documented in this file.
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
@ -15,24 +21,28 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- `Fixed` for any bug fixes.
- `Security` in case of vulnerabilities.
-->
*/
## [Unreleased]
### Added
- `app.OpenFileManager(path string, selectFile bool)` to open the system file manager to the path `path` with optional highlighting via `selectFile` by [@Krzysztofz01](https://github.com/Krzysztofz01) [@rcalixte](https://github.com/rcalixte)
- New `-git` flag for `wails3 init` command by [@leaanthony](https://github.com/leaanthony)
- New `wails3 generate webview2bootstrapper` command by [@leaanthony](https://github.com/leaanthony)2
### Fixed
- Fix Sveltekit template CSS referance by @atterpac in [#3945](https://github.com/wailsapp/wails/pull/3945)
- [darwin] Ensure `windowDidBecomeKey` callback is running on main thread by [@leaanthony](https://github.com/leaanthony)
- Ensure key callbacks in window run() are called on the main thread by [@leaanthony](https://github.com/leaanthony)
- [darwin] Support fullscreen for frameless windows by [@leaanthony](https://github.com/leaanthony)
- [darwin] Improved window destroying logic by [@leaanthony](https://github.com/leaanthony)
- [darwin] Fix window position logic when attached to system trays by [@leaanthony](https://github.com/leaanthony)
- Fix dialog directory chooser examples by [@leaanthony](https://github.com/leaanthony)
- Created new Chinese error page when index.html is missing by [@leaanthony](https://github.com/leaanthony)
-  Ensure `windowDidBecomeKey` callback is running on main thread by [@leaanthony](https://github.com/leaanthony)
-  Support fullscreen for frameless windows by [@leaanthony](https://github.com/leaanthony)
-  Improved window destroying logic by [@leaanthony](https://github.com/leaanthony)
-  Fix window position logic when attached to system trays by [@leaanthony](https://github.com/leaanthony)
-  Support fullscreen for frameless windows by [@leaanthony](https://github.com/leaanthony)
### Changed
@ -44,7 +54,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
### Changed
- Ensure for of taskfile is used by @leaanthony
- Ensure fork of taskfile is used by @leaanthony
## v3.0.0-alpha.8.2 - 2024-12-07
@ -152,15 +162,15 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Fixed `AlwaysOnTop` not working on Mac by
[leaanthony](https://github.com/leaanthony) in
[#3841](https://github.com/wailsapp/wails/pull/3841)
- [darwin] Fixed `application.NewEditMenu` including a duplicate
- Fixed `application.NewEditMenu` including a duplicate
`PasteAndMatchStyle` role in the edit menu on Darwin by
[johnmccabe](https://github.com/johnmccabe) in
[#3839](https://github.com/wailsapp/wails/pull/3839)
- [linux] Fixed aarch64 compilation
- 🐧 Fixed aarch64 compilation
[#3840](https://github.com/wailsapp/wails/issues/3840) in
[#3854](https://github.com/wailsapp/wails/pull/3854) by
[kodflow](https://github.com/kodflow)
- [windows] Fixed radio group menu items by
- Fixed radio group menu items by
[@leaanthony](https://github.com/leaanthony)
- Fix error on building runnable .app on MacOS when 'name' and 'outputfilename'
are different. by @nickisworking in
@ -170,10 +180,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
### Added
- [windows] New DIP system for Enhanced High DPI Monitor Support by
- New DIP system for Enhanced High DPI Monitor Support by
[mmghv](https://github.com/mmghv) in
[#3665](https://github.com/wailsapp/wails/pull/3665)
- [windows] Window class name option by [windom](https://github.com/windom/) in
- Window class name option by [windom](https://github.com/windom/) in
[#3682](https://github.com/wailsapp/wails/pull/3682)
- Services have been expanded to provide plugin functionality. By
[atterpac](https://github.com/atterpac) and
@ -197,26 +207,26 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Fixed bug with usage of customEventProcessor in drag-n-drop example by
[etesam913](https://github.com/etesam913) in
[#3742](https://github.com/wailsapp/wails/pull/3742)
- [linux] Fixed linux compile error introduced by IgnoreMouseEvents addition by
- 🐧 Fixed linux compile error introduced by IgnoreMouseEvents addition by
[atterpac](https://github.com/atterpac) in
[#3721](https://github.com/wailsapp/wails/pull/3721)
- [windows] Fixed syso icon file generation bug by
- Fixed syso icon file generation bug by
[atterpac](https://github.com/atterpac) in
[#3675](https://github.com/wailsapp/wails/pull/3675)
- [linux] Fix to run natively in wayland incorporated from
- 🐧 Fix to run natively in wayland incorporated from
[#1811](https://github.com/wailsapp/wails/pull/1811) in
[#3614](https://github.com/wailsapp/wails/pull/3614) by
[@stendler](https://github.com/stendler)
- Do not bind internal service methods in
[#3720](https://github.com/wailsapp/wails/pull/3720) by
[leaanthony](https://github.com/leaanthony)
- [windows] Fixed system tray startup panic in
- Fixed system tray startup panic in
[#3693](https://github.com/wailsapp/wails/issues/3693) by
[@DeltaLaboratory](https://github.com/DeltaLaboratory)
- Do not bind internal service methods in
[#3720](https://github.com/wailsapp/wails/pull/3720) by
[leaanthony](https://github.com/leaanthony)
- [windows] Fixed system tray startup panic in
- Fixed system tray startup panic in
[#3693](https://github.com/wailsapp/wails/issues/3693) by
[@DeltaLaboratory](https://github.com/DeltaLaboratory)
- Major menu item refactor and event handling. Mainly improves macOS for now. By
@ -224,7 +234,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Fix tests after plugins and event refactor in
[#3746](https://github.com/wailsapp/wails/pull/3746) by
[@stendler](https://github.com/stendler)
- [windows] Fixed `Failed to unregister class Chrome_WidgetWin_0` warning. By
- Fixed `Failed to unregister class Chrome_WidgetWin_0` warning. By
[leaanthony](https://github.com/leaanthony)
## v3.0.0-alpha.6 - 2024-07-30
@ -237,21 +247,21 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
### Added
- [linux] WindowDidMove / WindowDidResize events in
- 🐧 WindowDidMove / WindowDidResize events in
[#3580](https://github.com/wailsapp/wails/pull/3580)
- [windows] WindowDidResize event in
- WindowDidResize event in
[#3580](https://github.com/wailsapp/wails/pull/3580)
- [darwin] add Event ApplicationShouldHandleReopen to be able to handle dock
- add Event ApplicationShouldHandleReopen to be able to handle dock
icon click by @5aaee9 in [#2991](https://github.com/wailsapp/wails/pull/2991)
- [darwin] add getPrimaryScreen/getScreens to impl by @tmclane in
- add getPrimaryScreen/getScreens to impl by @tmclane in
[#2618](https://github.com/wailsapp/wails/pull/2618)
- [darwin] add option for showing the toolbar in fullscreen mode on macOS by
- add option for showing the toolbar in fullscreen mode on macOS by
[@fbbdev](https://github.com/fbbdev) in
[#3282](https://github.com/wailsapp/wails/pull/3282)
- [linux] add onKeyPress logic to convert linux keypress into an accelerator
- 🐧 add onKeyPress logic to convert linux keypress into an accelerator
@[Atterpac](https://github.com/Atterpac)
in[#3022](https://github.com/wailsapp/wails/pull/3022])
- [linux] add task `run:linux` by
- 🐧 add task `run:linux` by
[@marcus-crane](https://github.com/marcus-crane) in
[#3146](https://github.com/wailsapp/wails/pull/3146)
- Export `SetIcon` method by @almas1992 in
@ -284,10 +294,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Add tests for bound method calls by
[@abichinger](https://github.com/abichinger) in
[#3431](https://github.com/wailsapp/wails/pull/3431)
- [windows] add `SetIgnoreMouseEvents` for already created window by
- add `SetIgnoreMouseEvents` for already created window by
[@bruxaodev](https://github.com/bruxaodev) in
[#3667](https://github.com/wailsapp/wails/pull/3667)
- [darwin] Add ability to set a window's stacking level (order) by
- Add ability to set a window's stacking level (order) by
[@OlegGulevskyy](https://github.com/OlegGulevskyy) in
[#3674](https://github.com/wailsapp/wails/pull/3674)
@ -295,7 +305,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Fixed resize event messaging by [atterpac](https://github.com/atterpac) in
[#3606](https://github.com/wailsapp/wails/pull/3606)
- [linux] Fixed theme handling error on NixOS by
- 🐧Fixed theme handling error on NixOS by
[tmclane](https://github.com/tmclane) in
[#3515](https://github.com/wailsapp/wails/pull/3515)
- Fixed cross volume project install for windows by

View File

@ -6,7 +6,7 @@ This page serves as a list for community related links.
:::tip[How to Submit a Link]
You can click the `Edit this page` at the bottom of this page to submit a PR.
You can click the `Edit page` at the bottom of this page to submit a PR.
:::
@ -17,16 +17,11 @@ related to Wails.
## Support Channels
- [Wails Discord Server](https://discord.gg/JDdSxwjhGf)
- [Wails Discord Server](https://discord.gg/bdj28QNHmT)
- [Github Issues](https://github.com/wailsapp/wails/issues)
- [v2 Beta Discussion Board](https://github.com/wailsapp/wails/discussions/828)
## Social Media
- [Twitter](https://x.com/wailsapp)
- [Wails Chinese Community QQ Group](https://qm.qq.com/cgi-bin/qm/qr?k=PmIURne5hFGNd7QWzW5qd6FV-INEjNJv&jump_from=webapi) -
Group number: 1067173054
## Other Tutorials and Articles
- [Building of Bulletin Board](https://blog.customct.com/building-bulletin-board)

View File

@ -2,7 +2,7 @@
title: Clave
---
![Clave](../../../../assets/showcase-images/clave.gif)
![Clave](../../../../assets/showcase-images/clave.png)
Key Features

View File

@ -27,7 +27,7 @@ Check out the
title: "CFN Tracker",
},
{
thumbnail: import("../../../../assets/showcase-images/clave.gif"),
thumbnail: import("../../../../assets/showcase-images/clave.png"),
href: "/community/showcase/clave",
title: "Clave",
},
@ -57,7 +57,7 @@ Check out the
title: "hiposter",
},
{
thumbnail: import("../../../../assets/showcase-images/mchat.gif"),
thumbnail: import("../../../../assets/showcase-images/mchat.png"),
href: "/community/showcase/mchat",
title: "Mchat",
},

View File

@ -2,7 +2,7 @@
title: Mchat
---
![Mchat](../../../../assets/showcase-images/mchat.gif)
![Mchat](../../../../assets/showcase-images/mchat.png)
[Official page](https://marcio199226.github.io/mchat-site/public/) Fully
anonymous end2end encrypted chat.

View File

@ -18,13 +18,14 @@ import Contributors from "../../assets/contributors.html";
## Sponsors
<img
src="/sponsors/sponsors.svg"
style={{ width: "85%", "max-width": "800px;" }}
src="https://wails.io/img/sponsors.svg"
style={{ margin: "auto", width: "100%", "max-width": "1600px;" }}
alt="Sponsors"
/>
Special thanks:
<img
src="/sponsors/jetbrains-grayscale.webp"
style={{ width: "100px" }}
style={{ margin: "auto", width: "100px" }}
alt="JetBrains"
/>

View File

@ -1,38 +0,0 @@
---
title: Changes for v3
sidebar:
order: 30
---
:::note
This is currently an unsorted brain dump of changes. It will be organized into a
more readable format soon.
:::
### [Events](/development/changes_events)
### [Window](/development/changes_window)
### [Systray](/development/changes_systray)
### [Bindings](/development/changes_bindings)
### [Drag and Drop](/development/changes_dragndrop)
### [Context Menus](/development/changes_context_menus)
### [Dialogs](/development/changes_dialogs)
### [Clipboard](/development/changes_clipboard)
### [WML](/development/changes_wml)
### [Plugins](/development/changes_plugins)
### [Logging](/development/changes_logging)
### [Misc](/development/changes_misc)
### [Enums](/development/changes_enums)

View File

@ -1,94 +0,0 @@
---
title: Changes (Bindings)
sidebar:
order: 70
---
Bindings work in a similar way to v2, by providing a means to bind struct
methods to the frontend. These can be called in the frontend using the binding
wrappers generated by the `wails3 generate bindings` command:
```javascript
// @ts-check
// Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
// This file is automatically generated. DO NOT EDIT
import { main } from "./models";
window.go = window.go || {};
window.go.main = {
GreetService: {
/**
* GreetService.Greet
* Greet greets a person
* @param name {string}
* @returns {Promise<string>}
**/
Greet: function (name) {
wails.CallByID(1411160069, ...Array.prototype.slice.call(arguments, 0));
},
/**
* GreetService.GreetPerson
* GreetPerson greets a person
* @param person {main.Person}
* @returns {Promise<string>}
**/
GreetPerson: function (person) {
wails.CallByID(4021313248, ...Array.prototype.slice.call(arguments, 0));
},
},
};
```
Bound methods are obfuscated by default, and are identified using uint32 IDs,
calculated using the
[FNV hashing algorithm](https://en.wikipedia.org/wiki/Fowler%E2%80%93Noll%E2%80%93Vo_hash_function).
This is to prevent the method name from being exposed in production builds. In
debug mode, the method IDs are logged along with the calculated ID of the method
to aid in debugging. If you wish to add an extra layer of obfuscation, you can
use the `BindAliases` option. This allows you to specify a map of alias IDs to
method IDs. When the frontend calls a method using an ID, the method ID will be
looked up in the alias map first for a match. If it does not find it, it assumes
it's a standard method ID and tries to find the method in the usual way.
Example:
```go
app := application.New(application.Options{
Bind: []any{
&GreetService{},
},
BindAliases: map[uint32]uint32{
1: 1411160069,
2: 4021313248,
},
Assets: application.AssetOptions{
Handler: application.AssetFileServerFS(assets),
},
Mac: application.MacOptions{
ApplicationShouldTerminateAfterLastWindowClosed: true,
},
})
```
We can now call using this alias in the frontend: `wails.Call(1, "world!")`.
### Insecure calls
If you don't mind your calls being available in plain text in your binary and
have no intention of using [garble](https://github.com/burrowers/garble), then
you can use the insecure `wails.CallByName()` method. This method takes the
fully qualified name of the method to call and the arguments to pass to it.
Example:
```go
wails.CallByName("main.GreetService.Greet", "world!")
```
:::danger
This is only provided as a convenience method for development. It is not
recommended to use this in production.
:::

View File

@ -1,10 +0,0 @@
---
title: Changes (Clipboard)
sidebar:
order: 110
---
The clipboard API has been simplified. There is now a single `Clipboard` object
that can be used to read and write to the clipboard. The `Clipboard` object is
available in both Go and JS. `SetText()` to set the text and `Text()` to get the
text.

View File

@ -1,21 +0,0 @@
---
title: Changes (Context Menus)
sidebar:
order: 90
---
Context menus are contextual menus that are shown when the user right-clicks on
an element. Creating a context menu is the same as creating a standard menu , by
using `app.NewMenu()`. To make the context menu available to a window, call
`window.RegisterContextMenu(name, menu)`. The name will be the id of the context
menu and used by the frontend.
To indicate that an element has a context menu, add the `data-contextmenu`
attribute to the element. The value of this attribute should be the name of a
context menu previously registered with the window.
It is possible to register a context menu at the application level, making it
available to all windows. This can be done using
`app.RegisterContextMenu(name, menu)`. If a context menu cannot be found at the
window level, the application context menus will be checked. A demo of this can
be found in `v3/examples/contextmenus`.

View File

@ -1,43 +0,0 @@
---
title: Changes (Dialogs)
sidebar:
order: 100
---
Dialogs are now available in JavaScript!
### Windows
Dialog buttons in Windows are not configurable and are constant depending on the
type of dialog. To trigger a callback when a button is pressed, create a button
with the same name as the button you wish to have the callback attached to.
Example: Create a button with the label `Ok` and use `OnClick()` to set the
callback method:
```go
// Create a question dialog
dialog := app.QuestionDialog().
// Configure dialog title and message
SetTitle("Update").
SetMessage("The cancel button is selected when pressing escape")
// Add "Ok" button with callback
ok := dialog.AddButton("Ok")
ok.OnClick(func() {
// Handle successful confirmation (Or do something else)
if err := handleConfirmation(); err != nil {
log.Printf("Error handling confirmation: %v", err)
}
})
// Add "Cancel" button and configure dialog behavior
no := dialog.AddButton("Cancel")
dialog.SetDefaultButton(ok)
dialog.SetCancelButton(no)
// Show dialog and handle potential errors
if err := dialog.Show(); err != nil {
log.Printf("Error showing dialog: %v", err)
}
```

View File

@ -1,12 +0,0 @@
---
title: Changes (Drag and Drop)
sidebar:
order: 80
---
Native drag and drop can be enabled per-window. Simply set the
`EnableDragAndDrop` window config option to `true` and the window will allow
files to be dragged onto it. When this happens, the `events.FilesDropped` event
will be emitted. The filenames can then be retrieved from the
`WindowEvent.Context()` using the `DroppedFiles()` method. This returns a slice
of strings containing the filenames.

View File

@ -1,46 +0,0 @@
---
title: Changes (Enums)
sidebar:
order: 160
---
In Go, enums are often defined as a type and a set of constants. For example:
```go
type MyEnum int
const (
MyEnumOne MyEnum = iota
MyEnumTwo
MyEnumThree
)
```
Due to incompatibility between Go and JavaScript, custom types cannot be used in
this way. The best strategy is to use a type alias for float64:
```go
type MyEnum = float64
const (
MyEnumOne MyEnum = iota
MyEnumTwo
MyEnumThree
)
```
In Javascript, you can then use the following:
```js
const MyEnum = {
MyEnumOne: 0,
MyEnumTwo: 1,
MyEnumThree: 2,
};
```
- Why use `float64`? Can't we use `int`?
- Because JavaScript doesn't have a concept of `int`. Everything is a
`number`, which translates to `float64` in Go. There are also restrictions
on casting types in Go's reflection package, which means using `int` doesn't
work.

View File

@ -1,66 +0,0 @@
---
title: Changes (Events)
sidebar:
order: 40
---
In v3, there are 3 types of events:
- Application Events
- Window Events
- Custom Events
### Application Events
Application events are events that are emitted by the application. These events
include native events such as `ApplicationDidFinishLaunching` on macOS.
### Window Events
Window events are events that are emitted by a window. These events include
native events such as `WindowDidBecomeMain` on macOS. Common events are also
defined, so they work cross-platform, e.g. `WindowClosing`.
### Custom Events
Events that the user defines are called `WailsEvents`. This is to differentiate
them from the `Event` object that is used to communicate with the browser.
WailsEvents are now objects that encapsulate all the details of an event. This
includes the event name, the data, and the source of the event.
The data associated with a WailsEvent is now a single value. If multiple values
are required, then a struct can be used.
### Event callbacks and `Emit` function signature
The signatures events callbacks (as used by `On`, `Once` & `OnMultiple`) have
changed. In v2, the callback function received optional data. In v3, the
callback function receives a `WailsEvent` object that contains all data related
to the event.
Similarly, the `Emit` function has changed. Instead of taking a name and
optional data, it now takes a single `WailsEvent` object that it will emit.
### `Off` and `OffAll`
In v2, `Off` and `OffAll` calls would remove events in both JS and Go. Due to
the multi-window nature of v3, this has been changed so that these methods only
apply to the context they are called in. For example, if you call `Off` in a
window, it will only remove events for that window. If you use `Off` in Go, it
will only remove events for Go.
### Hooks
Event Hooks are a new feature in v3. They allow you to hook into the event
system and perform actions when certain events are emitted. For example, you can
hook into the `WindowClosing` event and perform some cleanup before the window
closes. Hooks can be registered at the application level or at the window level
using `RegisterHook`. Application level are for application events. Window level
hooks will only be called for the window they are registered with.
### Developer notes
When emitting an event in Go, it will dispatch the event to local Go listeners
and also each window in the application. When emitting an event in JS, it now
sends the event to the application. This will be processed as if it was emitted
in Go, however the sender ID will be that of the window.

View File

@ -1,15 +0,0 @@
---
title: Changes (Logging)
sidebar:
order: 140
---
Logging in v2 was confusing as both application logs and system (internal) logs
were using the same logger. We have simplified this as follows:
- Internal logs are now handled using the standard Go `slog` logger. This is
configured using the `logger` option in the application options. By default,
this uses the [tint](https://github.com/lmittmann/tint) logger.
- Application logs can now be achieved through the new `log` plugin which
utilises `slog` under the hood. This plugin provides a simple API for logging
to the console. It is available in both Go and JS.

View File

@ -1,46 +0,0 @@
---
title: Changes (Misc)
sidebar:
order: 150
---
## Windows Application Options
### WndProcInterceptor
If this is set, the WndProc will be intercepted and the function will be called.
This allows you to handle Windows messages directly. The function should have
the following signature:
```go
func(hwnd uintptr, msg uint32, wParam, lParam uintptr) (returnValue uintptr, shouldReturn)
```
The `shouldReturn` value should be set to `true` if the returnValue should be
returned by the main wndProc method. If it is set to `false`, the return value
will be ignored and the message will continue to be processed by the main
wndProc method.
## Hide Window on Close + OnBeforeClose
In v2, there was the `HideWindowOnClose` flag to hide the window when it closed.
There was a logical overlap between this flag and the `OnBeforeClose` callback.
In v3, the `HideWindowOnClose` flag has been removed and the `OnBeforeClose`
callback has been renamed to `ShouldClose`. The `ShouldClose` callback is called
when the user attempts to close a window. If the callback returns `true`, the
window will close. If it returns `false`, the window will not close. This can be
used to hide the window instead of closing it.
## Window Drag
In v2, the `--wails-drag` attribute was used to indicate that an element could
be used to drag the window. In v3, this has been replaced with
`--webkit-app-region` to be more in line with the way other frameworks handle
this. The `--webkit-app-region` attribute can be set to any of the following
values:
- `drag` - The element can be used to drag the window
- `no-drag` - The element cannot be used to drag the window
We would have ideally liked to use `app-region`, however this is not supported
by the `getComputedStyle` call on webkit on macOS.

View File

@ -1,38 +0,0 @@
---
title: Changes (Plugins)
sidebar:
order: 130
---
Plugins are a way to extend the functionality of your Wails application.
### Creating a plugin
Plugins are standard Go structure that adhere to the following interface:
```go
type Plugin interface {
Name() string
Init(*application.App) error
Shutdown()
CallableByJS() []string
InjectJS() string
}
```
The `Name()` method returns the name of the plugin. This is used for logging
purposes.
The `Init(*application.App) error` method is called when the plugin is loaded.
The `*application.App` parameter is the application that the plugin is being
loaded into. Any errors will prevent the application from starting.
The `Shutdown()` method is called when the application is shutting down.
The `CallableByJS()` method returns a list of exported functions that can be
called from the frontend. These method names must exactly match the names of the
methods exported by the plugin.
The `InjectJS()` method returns JavaScript that should be injected into all
windows as they are created. This is useful for adding custom JavaScript
functions that complement the plugin.

View File

@ -1,17 +0,0 @@
---
title: Changes (Systray)
sidebar:
order: 60
---
Wails 3 comes with a built-in systray. This is a fully featured systray that has
been designed to be as simple as possible to use. It is possible to set the
icon, tooltip and menu of the systray. It is possible to also "attach" a window
to the systray. Doing this will provide the following functionality:
- Clicking the systray icon with toggle the window visibility
- Right-clicking the systray will open the menu, if there is one
On macOS, if there is no attached window, the systray will use the default
method of displaying the menu (any button). If there is an attached window but
no menu, the systray will toggle the window regardless of the button pressed.

View File

@ -1,40 +0,0 @@
---
title: Changes (Window)
sidebar:
order: 50
---
The Window API has largely remained the same, however the methods are now on an
instance of a window rather than the runtime. Some notable differences are:
- Windows now have a Name that identifies them. This is used to identify the
window when emitting events.
- Windows have even more methods that were previously unavailable, such as
`SetFrameless` and `ToggleDevTools`.
- Windows can now accept files via native drag and drop. See the Drag and Drop
section for more details.
### BackgroundColour
In v2, this was a pointer to an `RGBA` struct. In v3, this is an `RGBA` struct
value.
### WindowIsTranslucent
This flag has been removed. Now there is a `BackgroundType` flag that can be
used to set the type of background the window should have. This flag can be set
to any of the following values:
- `BackgroundTypeSolid` - The window will have a solid background
- `BackgroundTypeTransparent` - The window will have a transparent background
- `BackgroundTypeTranslucent` - The window will have a translucent background
On Windows, if the `BackgroundType` is set to `BackgroundTypeTranslucent`, the
type of translucency can be set using the `BackdropType` flag in the
`WindowsWindow` options. This can be set to any of the following values:
- `Auto` - The window will use an effect determined by the system
- `None` - The window will have no background
- `Mica` - The window will use the Mica effect
- `Acrylic` - The window will use the acrylic effect
- `Tabbed` - The window will use the tabbed effect

View File

@ -1,54 +0,0 @@
---
title: Changes (WML)
sidebar:
order: 120
---
The Wails Markup Language (**WML**) is a simple markup language that allows you
to add functionality to standard HTML elements without the use of Javascript.
The following tags are currently supported:
### `data-wml-event`
This specifies that a Wails event will be emitted when the element is clicked.
The value of the attribute should be the name of the event to emit.
Example:
```html
<button data-wml-event="myevent">Click Me</button>
```
Sometimes you need the user to confirm an action. This can be done by adding the
`data-wml-confirm` attribute to the element. The value of this attribute will be
the message to display to the user.
Example:
```html
<button data-wml-event="delete-all-items" data-wml-confirm="Are you sure?">
Delete All Items
</button>
```
### `data-wml-window`
Any `wails.window` method can be called by adding the `data-wml-window`
attribute to an element. The value of the attribute should be the name of the
method to call. The method name should be in the same case as the method.
```html
<button data-wml-window="Close">Close Window</button>
```
### `data-wml-trigger`
This attribute specifies which javascript event should trigger the action. The
default is `click`.
```html
<button data-wml-event="hover-box" data-wml-trigger="mouseover">
Hover over me!
</button>
```

View File

@ -1,228 +0,0 @@
---
title: Introduction
sidebar:
order: 10
---
import { FileTree } from "@astrojs/starlight/components";
:::note
This guide is a work in progress.
:::
Thanks for wanting to help out with development of Wails! This guide will help
you get started.
## Getting Started
- Git clone this repository. Checkout the `v3-alpha` branch.
- Install the CLI: `cd v3/cmd/wails3 && go install`
- Optional: If you want to use the build system to build frontend code, you will
need to install [npm](https://nodejs.org/en/download).
## Building
For simple programs, you can use the standard `go build` command. It's also
possible to use `go run`.
Wails also comes with a build system that can be used to build more complex
projects. It utilises the awesome [Task](https://taskfile.dev) build system. For
more information, check out the task homepage or run `wails task --help`.
## Project layout
The project has the following structure:
<FileTree>
- v3
- cmd/wails3 CLI
- examples Examples of Wails apps
- internal Internal packages
- runtime The Wails JS runtime
- templates The supported project templates
- pkg
- application The core Wails library
- events The event definitions
- mac macOS specific code used by plugins
- w32 Windows specific code
- plugins Supported plugins
- tasks General tasks
- Taskfile.yaml Development tasks configuration
</FileTree>
## Development
### Alpha To-Do List
We are currently tracking known issues and tasks in the
[Alpha Todo List](https://github.com/orgs/wailsapp/projects/6). If you want to
help out, please check this list and follow the instructions in the
[Feedback](/getting-started/feedback) page.
### Adding window functionality
The preferred way to add window functionality is to add a new function to the
`pkg/application/webview_window.go` file. This should implement all the
functionality required for all platforms. Any platform specific code should be
called via a `webviewWindowImpl` interface method. This interface is implemented
by each of the target platforms to provide the platform specific functionality.
In some cases, this may do nothing. Once you've added the interface method,
ensure each platform implements it. A good example of this is the `SetMinSize`
method.
- Mac: `webview_window_darwin.go`
- Windows: `webview_window_windows.go`
- Linux: `webview_window_linux.go`
Most, if not all, of the platform specific code should be run on the main
thread. To simplify this, there are a number of `invokeSync` methods defined in
`application.go`.
### Updating the runtime
The runtime is located in `v3/internal/runtime`. When the runtime is updated,
the following steps need to be taken:
```shell
wails3 task runtime:build
```
### Events
Events are defined in `v3/pkg/events`. When adding a new event, the following
steps need to be taken:
- Add the event to the `events.txt` file
- Run `wails3 task events:generate`
There are a number of types of events: platform specific application and window
events + common events. The common events are useful for cross-platform event
handling, but you aren't limited to the "lowest common denominator". You can use
the platform specific events if you need to.
When adding a common event, ensure that the platform specific events are mapped.
An example of this is in `window_webview_darwin.go`:
```go
// Translate ShouldClose to common WindowClosing event
w.parent.On(events.Mac.WindowShouldClose, func(_ *WindowEventContext) {
w.parent.emit(events.Common.WindowClosing)
})
```
NOTE: We may try to automate this in the future by adding the mapping to the
event definition.
### Plugins
Plugins are a way to extend the functionality of your Wails application.
#### Creating a plugin
Plugins are standard Go structure that adhere to the following interface:
```go
type Plugin interface {
Name() string
Init(*application.App) error
Shutdown()
CallableByJS() []string
InjectJS() string
}
```
The `Name()` method returns the name of the plugin. This is used for logging
purposes.
The `Init(*application.App) error` method is called when the plugin is loaded.
The `*application.App` parameter is the application that the plugin is being
loaded into. Any errors will prevent the application from starting.
The `Shutdown()` method is called when the application is shutting down.
The `CallableByJS()` method returns a list of exported functions that can be
called from the frontend. These method names must exactly match the names of the
methods exported by the plugin.
The `InjectJS()` method returns JavaScript that should be injected into all
windows as they are created. This is useful for adding custom JavaScript
functions that complement the plugin.
The built-in plugins can be found in the `v3/plugins` directory. Check them out
for inspiration.
## Tasks
The Wails CLI uses the [Task](https://taskfile.dev) build system. It is imported
as a library and used to run the tasks defined in `Taskfile.yaml`. The main
interfacing with Task happens in `v3/internal/commands/task.go`.
### Upgrading Taskfile
To check if there's an upgrade for Taskfile, run `wails3 task -version` and
check against the Task website.
To upgrade the version of Taskfile used, run:
```shell
wails3 task taskfile:upgrade
```
If there are incompatibilities then they should appear in the
`v3/internal/commands/task.go` file.
Usually the best way to fix incompatibilities is to clone the task repo at
`https://github.com/go-task/task` and look at the git history to determine what
has changed and why.
To check all changes have worked correctly, re-install the CLI and check the
version again:
```shell
wails3 task cli:install
wails3 task -version
```
## Opening a PR
Make sure that all PRs have a ticket associated with them providing context for
the change. If there is no ticket, please create one first. Ensure that all PRs
have updated the CHANGELOG.md file with the changes made. The CHANGELOG.md file
is located in the `mkdocs-website/docs` directory.
## Misc Tasks
### Upgrading Taskfile
The Wails CLI uses the [Task](https://taskfile.dev) build system. It is imported
as a library and used to run the tasks defined in `Taskfile.yaml`. The main
interfacing with Task happens in `v3/internal/commands/task.go`.
To check if there's an upgrade for Taskfile, run `wails3 task -version` and
check against the Task website.
To upgrade the version of Taskfile used, run:
```shell
wails3 task taskfile:upgrade
```
If there are incompatibilities then they should appear in the
`v3/internal/commands/task.go` file.
Usually the best way to fix incompatibilities is to clone the task repo at
`https://github.com/go-task/task` and look at the git history to determine what
has changed and why.
To check all changes have worked correctly, re-install the CLI and check the
version again:
```shell
wails3 task cli:install
wails3 task -version
```

View File

@ -1,403 +0,0 @@
---
title: Status
sidebar:
order: 20
---
Status of features in v3.
:::note
This list is a mixture of public and internal API support.
It is not complete and probably not up to date.
:::
### Legend
- ✅ = Supported
- 🚧 = Under Development
- ❔ = Untested
- ❌ = Not available on the platform
## Known Issues
- Linux is not yet up to feature parity with Windows/Mac
## Application
Application interface methods
| Method | Windows | Linux | Mac | Notes |
| ------------------------------------------------------------- | ------- | ----- | --- | ----- |
| run() error | ✅ | ✅ | ✅ | |
| destroy() | | ✅ | ✅ | |
| setApplicationMenu(menu \*Menu) | ✅ | ✅ | ✅ | |
| name() string | | ✅ | ✅ | |
| getCurrentWindowID() uint | ✅ | ✅ | ✅ | |
| showAboutDialog(name string, description string, icon []byte) | | ✅ | ✅ | |
| setIcon(icon []byte) | ❌ | ✅ | ✅ | |
| on(id uint) | | | ✅ | |
| dispatchOnMainThread(fn func()) | ✅ | ✅ | ✅ | |
| hide() | ✅ | ✅ | ✅ | |
| show() | ✅ | ✅ | ✅ | |
| getPrimaryScreen() (\*Screen, error) | | ✅ | ✅ | |
| getScreens() ([]\*Screen, error) | | ✅ | ✅ | |
## Webview Window
Webview Window Interface Methods
| Method | Windows | Linux | Mac | Notes |
| -------------------------------------------------- | ------- | ----- | --- | ---------------------------------------- |
| center() | ✅ | ✅ | ✅ | |
| close() | ✅ | ✅ | ✅ | |
| destroy() | | ✅ | ✅ | |
| execJS(js string) | ✅ | ✅ | ✅ | |
| focus() | ✅ | ✅ | | |
| forceReload() | | ✅ | ✅ | |
| fullscreen() | ✅ | ✅ | ✅ | |
| getScreen() (\*Screen, error) | ✅ | ✅ | ✅ | |
| getZoom() float64 | | ✅ | ✅ | |
| height() int | ✅ | ✅ | ✅ | |
| hide() | ✅ | ✅ | ✅ | |
| isFullscreen() bool | ✅ | ✅ | ✅ | |
| isMaximised() bool | ✅ | ✅ | ✅ | |
| isMinimised() bool | ✅ | ✅ | ✅ | |
| maximise() | ✅ | ✅ | ✅ | |
| minimise() | ✅ | ✅ | ✅ | |
| nativeWindowHandle() (uintptr, error) | ✅ | ✅ | ✅ | |
| on(eventID uint) | ✅ | | ✅ | |
| openContextMenu(menu *Menu, data *ContextMenuData) | ✅ | ✅ | ✅ | |
| relativePosition() (int, int) | ✅ | ✅ | ✅ | |
| reload() | ✅ | ✅ | ✅ | |
| run() | ✅ | ✅ | ✅ | |
| setAlwaysOnTop(alwaysOnTop bool) | ✅ | ✅ | ✅ | |
| setBackgroundColour(color RGBA) | ✅ | ✅ | ✅ | |
| setEnabled(bool) | | ✅ | ✅ | |
| setFrameless(bool) | | ✅ | ✅ | |
| setFullscreenButtonEnabled(enabled bool) | ❌ | ✅ | ✅ | There is no fullscreen button in Windows |
| setHTML(html string) | ✅ | ✅ | ✅ | |
| setMaxSize(width, height int) | ✅ | ✅ | ✅ | |
| setMinSize(width, height int) | ✅ | ✅ | ✅ | |
| setRelativePosition(x int, y int) | ✅ | ✅ | ✅ | |
| setResizable(resizable bool) | ✅ | ✅ | ✅ | |
| setSize(width, height int) | ✅ | ✅ | ✅ | |
| setTitle(title string) | ✅ | ✅ | ✅ | |
| setURL(url string) | ✅ | ✅ | ✅ | |
| setZoom(zoom float64) | ✅ | ✅ | ✅ | |
| show() | ✅ | ✅ | ✅ | |
| size() (int, int) | ✅ | ✅ | ✅ | |
| toggleDevTools() | ✅ | ✅ | ✅ | |
| unfullscreen() | ✅ | ✅ | ✅ | |
| unmaximise() | ✅ | ✅ | ✅ | |
| unminimise() | ✅ | ✅ | ✅ | |
| width() int | ✅ | ✅ | ✅ | |
| zoom() | | ✅ | ✅ | |
| zoomIn() | ✅ | ✅ | ✅ | |
| zoomOut() | ✅ | ✅ | ✅ | |
| zoomReset() | ✅ | ✅ | ✅ | |
## Runtime
### Application
| Feature | Windows | Linux | Mac | Notes |
| ------- | ------- | ----- | --- | ----- |
| Quit | ✅ | ✅ | ✅ | |
| Hide | ✅ | ✅ | ✅ | |
| Show | ✅ | | ✅ | |
### Dialogs
| Feature | Windows | Linux | Mac | Notes |
| -------- | ------- | ----- | --- | ----- |
| Info | ✅ | ✅ | ✅ | |
| Warning | ✅ | ✅ | ✅ | |
| Error | ✅ | ✅ | ✅ | |
| Question | ✅ | ✅ | ✅ | |
| OpenFile | ✅ | ✅ | ✅ | |
| SaveFile | ✅ | ✅ | ✅ | |
### Clipboard
| Feature | Windows | Linux | Mac | Notes |
| ------- | ------- | ----- | --- | ----- |
| SetText | ✅ | ✅ | ✅ | |
| Text | ✅ | ✅ | ✅ | |
### ContextMenu
| Feature | Windows | Linux | Mac | Notes |
| ---------------- | ------- | ----- | --- | ----- |
| OpenContextMenu | ✅ | ✅ | ✅ | |
| On By Default | | | | |
| Control via HTML | ✅ | | | |
The default context menu is enabled by default for all elements that are
`contentEditable: true`, `<input>` or `<textarea>` tags or have the
`--default-contextmenu: true` style set. The `--default-contextmenu: show` style
will always show the context menu The `--default-contextmenu: hide` style will
always hide the context menu
Anything nested under a tag with `--default-contextmenu: hide` style will not
show the context menu unless it is explicitly set with
`--default-contextmenu: show`.
### Screens
| Feature | Windows | Linux | Mac | Notes |
| ---------- | ------- | ----- | --- | ----- |
| GetAll | ✅ | ✅ | ✅ | |
| GetPrimary | ✅ | ✅ | ✅ | |
| GetCurrent | ✅ | ✅ | ✅ | |
### System
| Feature | Windows | Linux | Mac | Notes |
| ---------- | ------- | ----- | --- | ----- |
| IsDarkMode | | | ✅ | |
### Window
| Feature | Windows | Linux | Mac | Notes |
| ------------------- | ------- | ----- | --- | ------------------------------------------------------------------------------------ |
| Center | ✅ | ✅ | ✅ | |
| Focus | ✅ | ✅ | | |
| FullScreen | ✅ | ✅ | ✅ | |
| GetZoom | ✅ | ✅ | ✅ | Get current view scale |
| Height | ✅ | ✅ | ✅ | |
| Hide | ✅ | ✅ | ✅ | |
| Maximise | ✅ | ✅ | ✅ | |
| Minimise | ✅ | ✅ | ✅ | |
| RelativePosition | ✅ | ✅ | ✅ | |
| Screen | ✅ | ✅ | ✅ | Get screen for window |
| SetAlwaysOnTop | ✅ | ✅ | ✅ | |
| SetBackgroundColour | ✅ | ✅ | ✅ | https://github.com/MicrosoftEdge/WebView2Feedback/issues/1621#issuecomment-938234294 |
| SetEnabled | ✅ | ❔ | ❌ | Set the window to be enabled/disabled |
| SetMaxSize | ✅ | ✅ | ✅ | |
| SetMinSize | ✅ | ✅ | ✅ | |
| SetRelativePosition | ✅ | ✅ | ✅ | |
| SetResizable | ✅ | ✅ | ✅ | |
| SetSize | ✅ | ✅ | ✅ | |
| SetTitle | ✅ | ✅ | ✅ | |
| SetZoom | ✅ | ✅ | ✅ | Set view scale |
| Show | ✅ | ✅ | ✅ | |
| Size | ✅ | ✅ | ✅ | |
| UnFullscreen | ✅ | ✅ | ✅ | |
| UnMaximise | ✅ | ✅ | ✅ | |
| UnMinimise | ✅ | ✅ | ✅ | |
| Width | ✅ | ✅ | ✅ | |
| ZoomIn | ✅ | ✅ | ✅ | Increase view scale |
| ZoomOut | ✅ | ✅ | ✅ | Decrease view scale |
| ZoomReset | ✅ | ✅ | ✅ | Reset view scale |
### Window Options
| Feature | Windows | Linux | Mac | Notes |
| ------------------------------- | ------- | ----- | --- | ------------------------------------------ |
| AlwaysOnTop | ✅ | ✅ | | |
| BackgroundColour | ✅ | ✅ | | |
| BackgroundType | | | | Acrylic seems to work but the others don't |
| CSS | ✅ | ✅ | | |
| DevToolsEnabled | ✅ | ✅ | ✅ | |
| DisableResize | ✅ | ✅ | | |
| EnableDragAndDrop | | ✅ | | |
| EnableFraudulentWebsiteWarnings | | | | |
| Focused | ✅ | ✅ | | |
| Frameless | ✅ | ✅ | | |
| FullscreenButtonEnabled | ✅ | | | |
| Height | ✅ | ✅ | | |
| Hidden | ✅ | ✅ | | |
| HTML | ✅ | ✅ | | |
| JS | ✅ | ✅ | | |
| Mac | ❌ | ❌ | | |
| MaxHeight | ✅ | ✅ | | |
| MaxWidth | ✅ | ✅ | | |
| MinHeight | ✅ | ✅ | | |
| MinWidth | ✅ | ✅ | | |
| Name | ✅ | ✅ | | |
| OpenInspectorOnStartup | | | | |
| StartState | ✅ | | | |
| Title | ✅ | ✅ | | |
| URL | ✅ | ✅ | | |
| Width | ✅ | ✅ | | |
| Windows | ✅ | ❌ | ❌ | |
| X | ✅ | ✅ | | |
| Y | ✅ | ✅ | | |
| Zoom | | | | |
| ZoomControlEnabled | | | | |
### Log
To log or not to log? System logger vs custom logger.
## Menu
| Event | Windows | Linux | Mac | Notes |
| ------------------------ | ------- | ----- | --- | ----- |
| Default Application Menu | ✅ | ✅ | ✅ | |
## Tray Menus
| Feature | Windows | Linux | Mac | Notes |
| ------------------ | ------- | ----- | --- | -------------------------------------------------------------------- |
| Icon | ✅ | ✅ | ✅ | Windows has default icons for light/dark mode & supports PNG or ICO. |
| Label | ❌ | ✅ | ✅ | |
| Label (ANSI Codes) | ❌ | | | |
| Menu | ✅ | ✅ | ✅ | |
### Methods
| Method | Windows | Linux | Mac | Notes |
| ----------------------------- | ------- | ----- | --- | ---------------------------------- |
| setLabel(label string) | ❌ | ✅ | ✅ | |
| run() | ✅ | ✅ | ✅ | |
| setIcon(icon []byte) | ✅ | ✅ | ✅ | |
| setMenu(menu \*Menu) | ✅ | ✅ | ✅ | |
| setIconPosition(position int) | ❌ | ✅ | ✅ | |
| setTemplateIcon(icon []byte) | ❌ | ✅ | ✅ | |
| destroy() | ✅ | ✅ | ✅ | |
| setDarkModeIcon(icon []byte) | ✅ | ✅ | ✅ | Darkmode isn't handled yet (linux) |
## Cross Platform Events
Mapping native events to cross-platform events.
| Event | Windows | Linux | Mac | Notes |
| ------------------------ | ------- | ----- | --------------- | ----- |
| WindowWillClose | | | WindowWillClose | |
| WindowDidClose | | | | |
| WindowDidResize | | | | |
| WindowDidHide | | | | |
| ApplicationWillTerminate | | | | |
... Add more
## Bindings Generation
Working well.
## Models Generation
Working well.
## Task file
Contains a lot needed for development.
## Theme
| Mode | Windows | Linux | Mac | Notes |
| ------ | ------- | ----- | --- | ----- |
| Dark | ✅ | | | |
| Light | ✅ | | | |
| System | ✅ | | | |
## NSIS Installer
TBD
## Templates
All templates are working.
## Plugins
Built-in plugin support:
| Plugin | Windows | Linux | Mac | Notes |
| --------------- | ------- | ----- | --- | ----- |
| Browser | ✅ | | ✅ | |
| KV Store | ✅ | ✅ | ✅ | |
| Log | ✅ | ✅ | ✅ | |
| Single Instance | ✅ | | ✅ | |
| SQLite | ✅ | ✅ | ✅ | |
| Start at login | ✅ | | ✅ | |
| Server | | | | |
TODO:
- Ensure each plugin has a JS wrapper that can be injected into the window.
## Packaging
| | Windows | Linux | Mac | Notes |
| --------------- | ------- | ----- | --- | ----- |
| Icon Generation | ✅ | | ✅ | |
| Icon Embedding | ✅ | | ✅ | |
| Info.plist | ❌ | | ✅ | |
| NSIS Installer | | | ❌ | |
| Mac bundle | ❌ | | ✅ | |
| Windows exe | ✅ | | ❌ | |
## Frameless Windows
| Feature | Windows | Linux | Mac | Notes |
| ------- | ------- | ----- | --- | ---------------------------------------------- |
| Resize | ✅ | | ✅ | |
| Drag | ✅ | ✅ | ✅ | Linux - can always drag with `Meta`+left mouse |
## Mac Specific
| Feature | Mac | Notes |
| ------------ | --- | ----- |
| Translucency | ✅ | |
### Mac Options
| Feature | Default | Notes |
| ----------------------- | ----------------- | ---------------------------------------------------- |
| Backdrop | MacBackdropNormal | Standard solid window |
| DisableShadow | false | |
| TitleBar | | Standard window decorations by default |
| Appearance | DefaultAppearance | |
| InvisibleTitleBarHeight | 0 | Creates an invisible title bar for frameless windows |
| DisableShadow | false | Disables the window drop shadow |
## Windows Specific
| Feature | Windows | Notes |
| ------------- | ------- | ----- |
| Translucency | ✅ | |
| Custom Themes | ✅ | |
### Windows Options
| Feature | Default | Notes |
| --------------------------------- | ------------- | ------------------------------------------- |
| BackdropType | Solid | |
| DisableIcon | false | |
| Theme | SystemDefault | |
| CustomTheme | nil | |
| DisableFramelessWindowDecorations | false | |
| WindowMask | nil | Makes the window the contents of the bitmap |
## Linux Specific
Implementation details for the functions utilized by the `*_linux.go` files are
located in the following files:
- `linux_cgo.go`: CGo implementation
- `linux_purego.go`: PureGo implementation
### CGO
By default CGO is utilized to compile the Linux port. This prevents easy
cross-compilation and so the PureGo implementation is also being simultaneously
developed.
### Purego
The examples can be compiled using the following command:
```bash
CGO_ENABLED=0 go build -tags purego
```
:::note
Things are currently not working after the refactor
:::

View File

@ -1,5 +1,5 @@
---
title: Feedback
title: v3 Alpha Feedback
sidebar:
order: 40
---
@ -12,7 +12,7 @@ posts before creating new ones. Here are the different ways to provide feedback:
<Tabs>
<TabItem label="Bugs" icon="error">
If you find a bug, please let us know by posting into the [v3 Alpha Feedback](https://discord.gg/Vgff2p8gsy) channel on Discord.
If you find a bug, please let us know by posting into the [v3 Alpha Feedback](https://discord.gg/bdj28QNHmT) channel on Discord.
- The post should clearly state what the bug is and have a simple reproducible example. If the docs are unclear what *should* happen, please include that in the post.
- The post should be given the `Bug` tag.
@ -36,7 +36,7 @@ posts before creating new ones. Here are the different ways to provide feedback:
If you have a fix for a bug or an update for documentation, please do the following:
- Open a pull request on the [Wails repository](https://github.com/wailsapp/wails). The title of the PR should start with `[v3 alpha]`.
- Create a post in the [v3 Alpha Feedback](https://discord.gg/Vgff2p8gsy) channel.
- Create a post in the [v3 Alpha Feedback](https://discord.gg/bdj28QNHmT) channel.
- The post should be given the `PR` tag.
- Please include a link to the PR in your post.
@ -44,11 +44,11 @@ posts before creating new ones. Here are the different ways to provide feedback:
<TabItem label="Suggestions" icon="puzzle" id="abc">
If you have a suggestion, please let us know by posting into the [v3 Alpha Feedback](https://discord.gg/Vgff2p8gsy) channel on Discord:
If you have a suggestion, please let us know by posting into the [v3 Alpha Feedback](https://discord.gg/bdj28QNHmT) channel on Discord:
- The post should be given the `Suggestion` tag.
Please feel free to reach out to us on [Discord](https://discord.gg/Vgff2p8gsy) if you have any questions.
Please feel free to reach out to us on [Discord](https://discord.gg/bdj28QNHmT) if you have any questions.
</TabItem>

View File

@ -6,9 +6,6 @@ sidebar:
import { Tabs, TabItem } from "@astrojs/starlight/components";
To install the Wails CLI, first ensure you have the correct dependencies
installed:
## Supported Platforms
- Windows 10/11 AMD64/ARM64
@ -21,7 +18,7 @@ installed:
Wails has a number of common dependencies that are required before installation:
<Tabs>
<TabItem label="Go (At least 1.22.4)" icon="seti:go">
<TabItem label="Go (At least 1.23)" icon="seti:go">
Download Go from the [Go Downloads Page](https://go.dev/dl/).
@ -42,12 +39,9 @@ Wails has a number of common dependencies that are required before installation:
Run `npm --version` to verify.
</TabItem>
<TabItem label="Task (Optional)">
The Wails CLI embeds a task runner called [Task](https://taskfile.dev/#/installation). It is optional, but recommended. If you do not wish to install Task, you can use the `wails3 task` command instead of `task`.
Installing Task will give you the greatest flexibility.
:::note
If you prefer a different package manager to npm, feel free to use it. You will need to update the project Taskfiles to use it.
:::
</TabItem>

View File

@ -1,27 +0,0 @@
---
title: Next Steps
sidebar:
order: 30
---
Now that you have created your first application, you can start exploring the
other features that v3 alpha provides.
## Examples
The best place to start is the `examples` directory in the Wails repository.
This contains a number of examples that you can run and play with.
To run an example, you can simply use:
```shell
go run .
```
in the example directory.
:::note
Some examples may not work during alpha development.
:::

View File

@ -5,22 +5,20 @@ sidebar:
---
import { Tabs, TabItem } from "@astrojs/starlight/components";
import { Badge } from '@astrojs/starlight/components';
import { Steps } from "@astrojs/starlight/components";
import { FileTree } from '@astrojs/starlight/components';
Creating your first application with Wails v3 Alpha is an exciting journey into
import wails_init from '../../../assets/wails_init.mp4';
import wails_build from '../../../assets/wails_build.mp4';
import wails_dev from '../../../assets/wails_dev.mp4';
Creating your first application with Wails v3 is an exciting journey into
the world of modern desktop app development. This guide will walk you through
the process of creating a basic application, showcasing the power and simplicity
of Wails.
## Prerequisites
Before you begin, ensure you have the following installed:
- Go (version 1.21 or later)
- Node.js (LTS version)
- Wails v3 Alpha (see the [installation guide](/getting-started/installation)
for instructions)
<br/>
<br/>
@ -38,27 +36,60 @@ Before you begin, ensure you have the following installed:
This command creates a new directory called `myfirstapp` with all the
necessary files.
<video src={wails_init} controls></video>
2. ## Exploring the Project Structure
Navigate to the `myfirstapp` directory. You'll find several files and
folders:
- `build`: Contains files used by the build process.
- `frontend`: Contains your web frontend code.
- `go.mod` & `go.sum`: Go module files.
- `main.go`: The entry point for your Wails application.
- `Taskfile.yml`: Defines all the tasks used by the build system. Learn more
at the [Task](https://taskfile.dev/) website.
<FileTree>
- build/ Contains files used by the build process
- appicon.png The application icon
- config.yml Build configuration
- Taskfile.yml Build tasks
- darwin/ macOS specific build files
- Info.dev.plist Development configuration
- Info.plist Production configuration
- Taskfile.yml macOS build tasks
- icons.icns macOS application icon
- linux/ Linux specific build files
- Taskfile.yml Linux build tasks
- appimage/ AppImage packaging
- build.sh AppImage build script
- nfpm/ NFPM packaging
- nfpm.yaml Package configuration
- scripts/ Build scripts
- windows/ Windows specific build files
- Taskfile.yml Windows build tasks
- icon.ico Windows application icon
- info.json Application metadata
- wails.exe.manifest Windows manifest file
- nsis/ NSIS installer files
- project.nsi NSIS project file
- wails_tools.nsh NSIS helper scripts
- frontend/ Frontend application files
- index.html Main HTML file
- main.js Main JavaScript file
- package.json NPM package configuration
- public/ Static assets
- Inter Font License.txt Font license
- .gitignore Git ignore file
- README.md Project documentation
- Taskfile.yml Project tasks
- go.mod Go module file
- go.sum Go module checksums
- greetservice.go Greeting service
- main.go Main application code
</FileTree>
Take a moment to explore these files and familiarize yourself with the
structure.
:::note [Although Wails v3 uses [Task](https://taskfile.dev/) as its
default]
build system, there is nothing stopping you from using `make` or any other
:::note
Although Wails v3 uses [Task](https://taskfile.dev/) as its
default build system, there is nothing stopping you from using `make` or any other
alternative build system.
:::
3. ## Building Your Application
@ -70,7 +101,17 @@ Before you begin, ensure you have the following installed:
```
This command compiles a debug version of your application and saves it in a
new `bin` directory. You can run this like you would any normal application:
new `bin` directory.
:::note
`wails3 build` is shorthand for `wails3 task build` and will run the `build` task in `Taskfile.yml`.
:::
<video src={wails_build} controls></video>
Once built, you can run this like you would any normal application:
<Tabs syncKey="platform">
@ -111,30 +152,26 @@ Before you begin, ensure you have the following installed:
running application without having to rebuild the entire application.
1. Open a new terminal window.
2. Run `wails3 dev`.
3. Open `frontend/main.js`.
4. Change the line that has `<h1>Hello Wails!</h1>` to
`<h1>Hello World!</h1>`.
2. Run `wails3 dev`. The application will compile and run in debug mode.
3. Open `frontend/index.html` in your editor of choice.
4. Edit the code and change `Please enter your name below` to
`Please enter your name below!!!`.
5. Save the file.
The application will update automatically, and you'll see the changes
reflected in the running application.
This change will reflect in your application immediately.
5. ## Building the Application Again
Any changes to backend code will trigger a rebuild:
Once you're happy with your changes, build your application again:
1. Open `greetservice.go`.
2. Change the line that has `return "Hello " + name + "!"` to
`return "Hello there " + name + "!"`.
3. Save the file.
```bash
wails3 build
```
The application will update within a matter of seconds.
You'll notice that the build time was faster this time. That's because the
new build system only builds the parts of your application that have
changed.
<video src={wails_dev} controls></video>
You should see a new executable in the `build` directory.
6. ## Packaging Your Application
5. ## Packaging Your Application
Once your application is ready for distribution, you can create
platform-specific packages:
@ -185,11 +222,54 @@ Before you begin, ensure you have the following installed:
For more detailed information about packaging options and configuration,
check out our [Packaging Guide](/guides/packaging).
6. ## Setting up Version Control and Module Name
Your project is created with the placeholder module name `changeme`. It's recommended to update this to match your repository URL:
1. Create a new repository on GitHub (or your preferred Git host)
2. Initialize git in your project directory:
```bash
git init
git add .
git commit -m "Initial commit"
```
3. Set your remote repository (replace with your repository URL):
```bash
git remote add origin https://github.com/username/myfirstapp.git
```
4. Update your module name in `go.mod` to match your repository URL:
```bash
go mod edit -module github.com/username/myfirstapp
```
5. Push your code:
```bash
git push -u origin main
```
This ensures your Go module name aligns with Go's module naming conventions and makes it easier to share your code.
:::tip[Pro Tip]
You can automate all of the initialisation steps by using the `-git` flag when creating your project:
```bash
wails3 init -n myfirstapp -git github.com/username/myfirstapp
```
This supports various Git URL formats:
- HTTPS: `https://github.com/username/project`
- SSH: `git@github.com:username/project` or `ssh://git@github.com/username/project`
- Git protocol: `git://github.com/username/project`
- Filesystem: `file:///path/to/project.git`
:::
</Steps>
## Conclusion
## Congratulations!
Congratulations! You've just created, developed and packaged your first Wails
application. This is just the beginning of what you can achieve with Wails v3.
Explore the documentation, experiment with different features, and start
building amazing applications!
You've just created, developed and packaged your first Wails application.
This is just the beginning of what you can achieve with Wails v3.
## Next Steps
If you are new to Wails, we recommend reading through our Tutorials next which will be a practical guide through
the various features of Wails. The first tutorial is [Creating a Service](/tutorials/01-creating-a-service).
If you are a more advanced user, check out our [Guides](/guides) for more detailed information on how to use Wails.

View File

@ -0,0 +1,8 @@
{
"label": "Guides",
"position": 3,
"link": {
"type": "generated-index",
"description": "Comprehensive guides for developing Wails applications"
}
}

View File

@ -0,0 +1,408 @@
---
title: CLI Reference
description: Complete reference for the Wails CLI commands
sidebar:
order: 1
---
import { Tabs, TabItem } from "@astrojs/starlight/components";
The Wails CLI provides a comprehensive set of commands to help you develop, build, and maintain your Wails applications.
## Core Commands
Core commands are the primary commands used for project creation, development, and building.
All CLI commands are of the following format: `wails3 <command>`.
### `init`
Initializes a new Wails project.
```bash
wails3 init [flags]
```
#### Flags
| Flag | Description | Default |
|-----------------------|----------------------|--------------------------|
| `-p` | Package name | `main` |
| `-t` | Template name or URL | `vanilla` |
| `-n` | Project name | |
| `-d` | Project directory | `.` |
| `-q` | Suppress output | `false` |
| `-l` | List templates | `false` |
| `-git` | Git repository URL | |
| `-productname` | Product name | `My Product` |
| `-productdescription` | Product description | `My Product Description` |
| `-productversion` | Product version | `0.1.0` |
| `-productcompany` | Company name | `My Company` |
| `-productcopyright` | Copyright notice | ` now, My Company` |
| `-productcomments` | File comments | `This is a comment` |
| `-productidentifier` | Product identifier | |
The `-git` flag accepts various Git URL formats:
- HTTPS: `https://github.com/username/project`
- SSH: `git@github.com:username/project` or `ssh://git@github.com/username/project`
- Git protocol: `git://github.com/username/project`
- Filesystem: `file:///path/to/project.git`
When provided, this flag will:
1. Initialize a git repository in the project directory
2. Set the specified URL as the remote origin
3. Update the module name in `go.mod` to match the repository URL
4. Add all files
### `dev`
Runs the application in development mode. This will give you a live view of your frontend code, and you can make changes and see them reflected
in the running application without having to rebuild the entire application. Changes to your Go code will also be detected and the application
will automatically rebuild and relaunch.
```bash
wails3 dev [flags]
```
#### Flags
| Flag | Description | Default |
|-----------|----------------------|----------------------|
| `-config` | Config file path | `./build/config.yml` |
| `-port` | Vite dev server port | `9245` |
| `-s` | Enable HTTPS | `false` |
:::note
This is equivalent to running `wails3 task dev` and runs the `dev` task in the project's main Taskfile. You can customise this by editing the `Taskfile.yml` file.
:::
### `build`
Builds a debug version of your application. It defaults to building for the current platform and architecture.
```bash
wails3 build
```
:::note
This is equivalent to running `wails3 task build` which runs the `build` task in the project's main Taskfile. You can customise the build process by editing the `Taskfile.yml` file.
:::
### `package`
Creates platform-specific packages for distribution.
```bash
wails3 package
```
#### Package Types
The following package types are available for each platform:
| Platform | Package Type |
|----------|-------------------------------------------|
| Windows | `.exe` |
| macOS | `.app`, |
| Linux | `.AppImage`, `.deb`, `.rpm`, `.archlinux` |
:::note
This is equivalent to `wails3 task package` which runs the `package` task in the project's main Taskfile. You can customise the packaging process by editing the `Taskfile.yml` file.
:::
### `doctor`
Performs a system check and displays a status report.
```bash
wails3 doctor
```
Base command: `wails3 generate`
## Generate Commands
Generate commands help create various project assets like bindings, icons, and build files. All generate commands use the base command: `wails3 generate <command>`.
### `generate bindings`
Generates bindings and models for your Go code.
```bash
wails3 generate bindings [flags] [patterns...]
```
#### Flags
| Flag | Description | Default |
|------|-------------|---------|
| `-f` | Additional Go build flags | |
| `-d` | Output directory | `frontend/bindings` |
| `-models` | Models filename | `models` |
| `-internal` | Internal filename | `internal` |
| `-index` | Index filename | `index` |
| `-ts` | Generate TypeScript | `false` |
| `-i` | Use TS interfaces | `false` |
| `-b` | Use bundled runtime | `false` |
| `-names` | Use names instead of IDs | `false` |
| `-noindex` | Skip index files | `false` |
| `-dry` | Dry run | `false` |
| `-silent` | Silent mode | `false` |
| `-v` | Debug output | `false` |
### `generate build-assets`
Generates build assets for your application.
```bash
wails3 generate build-assets [flags]
```
#### Flags
| Flag | Description | Default |
|------|-------------|---------|
| `-name` | Project name | |
| `-dir` | Output directory | `build` |
| `-silent` | Suppress output | `false` |
| `-company` | Company name | |
| `-productname` | Product name | |
| `-description` | Product description | |
| `-version` | Product version | |
| `-identifier` | Product identifier | `com.wails.[name]` |
| `-copyright` | Copyright notice | |
| `-comments` | File comments | |
### `generate icons`
Generates application icons.
```bash
wails3 generate icons [flags]
```
#### Flags
| Flag | Description | Default |
|------|-------------|---------|
| `-input` | Input PNG file | Required |
| `-windows` | Windows output filename | |
| `-mac` | macOS output filename | |
| `-sizes` | Icon sizes (comma-separated) | `256,128,64,48,32,16` |
| `-example` | Generate example icon | `false` |
### `generate syso`
Generates Windows .syso file.
```bash
wails3 generate syso [flags]
```
#### Flags
| Flag | Description | Default |
|------|-------------|---------|
| `-manifest` | Path to manifest file | Required |
| `-icon` | Path to icon file | Required |
| `-info` | Path to version info file | |
| `-arch` | Target architecture | Current GOARCH |
| `-out` | Output filename | `rsrc_windows_[arch].syso` |
### `generate .desktop`
Generates a Linux .desktop file.
```bash
wails3 generate .desktop [flags]
```
#### Flags
| Flag | Description | Default |
|------|-------------|---------|
| `-name` | Application name | Required |
| `-exec` | Executable path | Required |
| `-icon` | Icon path | |
| `-categories` | Application categories | `Utility` |
| `-comment` | Application comment | |
| `-terminal` | Run in terminal | `false` |
| `-keywords` | Search keywords | |
| `-version` | Application version | |
| `-genericname` | Generic name | |
| `-startupnotify` | Show startup notification | `false` |
| `-mimetype` | Supported MIME types | |
| `-output` | Output filename | `[name].desktop` |
### `generate runtime`
Generates the pre-built version of the runtime.
```bash
wails3 generate runtime
```
### `generate constants`
Generates JavaScript constants from Go code.
```bash
wails3 generate constants
```
### `generate appimage`
Generates a Linux AppImage.
```bash
wails3 generate appimage [flags]
```
#### Flags
| Flag | Description | Default |
|------|-------------|---------|
| `-binary` | Path to binary | Required |
| `-icon` | Path to icon file | Required |
| `-desktop` | Path to .desktop file | Required |
| `-builddir` | Build directory | Temp directory |
| `-output` | Output directory | `.` |
Base command: `wails3 service`
## Service Commands
Service commands help manage Wails services. All service commands use the base command: `wails3 service <command>`.
### `service init`
Initializes a new service.
```bash
wails3 service init [flags]
```
#### Flags
| Flag | Description | Default |
|------|-------------|---------|
| `-n` | Service name | `example_service` |
| `-d` | Service description | `Example service` |
| `-p` | Package name | |
| `-o` | Output directory | `.` |
| `-q` | Suppress output | `false` |
| `-a` | Author name | |
| `-v` | Version | |
| `-w` | Website URL | |
| `-r` | Repository URL | |
| `-l` | License | |
Base command: `wails3 tool`
## Tool Commands
Tool commands provide utilities for development and debugging. All tool commands use the base command: `wails3 tool <command>`.
### `tool checkport`
Checks if a port is open. Useful for testing if vite is running.
```bash
wails3 tool checkport [flags]
```
#### Flags
| Flag | Description | Default |
|------|-------------|---------|
| `-port` | Port to check | `9245` |
| `-host` | Host to check | `localhost` |
### `tool watcher`
Watches files and runs a command when they change.
```bash
wails3 tool watcher [flags]
```
#### Flags
| Flag | Description | Default |
|------|-------------|---------|
| `-config` | Config file path | `./build/config.yml` |
| `-ignore` | Patterns to ignore | |
| `-include` | Patterns to include | |
### `tool cp`
Copies files.
```bash
wails3 tool cp
```
### `tool buildinfo`
Shows build information about the application.
```bash
wails3 tool buildinfo
```
### `tool package`
Generates Linux packages (deb, rpm, archlinux).
```bash
wails3 tool package [flags]
```
#### Flags
| Flag | Description | Default |
|------|-------------|---------|
| `-format` | Package format (deb, rpm, archlinux) | `deb` |
| `-name` | Executable name | Required |
| `-config` | Config file path | Required |
| `-out` | Output directory | `.` |
#### Flags
| Flag | Description | Default |
|------|-------------|---------|
| `-format` | Package format (deb, rpm, archlinux) | `deb` |
| `-name` | Executable name | `myapp` |
| `-config` | Config file path | |
| `-out` | Output directory | `.` |
Base command: `wails3 update`
## Update Commands
Update commands help manage and update project assets. All update commands use the base command: `wails3 update <command>`.
### `update build-assets`
Updates the build assets using the given config file.
```bash
wails3 update build-assets [flags]
```
#### Flags
| Flag | Description | Default |
|------|-------------|---------|
| `-config` | Config file path | |
| `-dir` | Output directory | `build` |
| `-silent` | Suppress output | `false` |
| `-company` | Company name | |
| `-productname` | Product name | |
| `-description` | Product description | |
| `-version` | Product version | |
| `-identifier` | Product identifier | |
| `-copyright` | Copyright notice | |
| `-comments` | File comments | |
Base command: `wails3`
## Utility Commands
Utility commands provide helpful shortcuts for common tasks. Use these commands directly with the base command: `wails3 <command>`.
### `docs`
Opens the Wails documentation in your default browser.
```bash
wails3 docs
```
### `version`
Prints the current version of Wails.
```bash
wails3 version
```
### `sponsor`
Opens the Wails sponsorship page in your default browser.
```bash
wails3 sponsor
```

View File

@ -1,9 +1,14 @@
---
title: Customizing Window Controls in Wails
title: Customizing Windows in Wails
sidebar:
order: 10
---
import {Badge} from '@astrojs/starlight/components';
Relevant Platforms: <Badge text="Windows" variant="note" /> <Badge text="macOS" variant="success" />
<br/>
Wails provides an API to control the appearance and functionality of the
controls of a window. This functionality is available on Windows and macOS, but
not on Linux.
@ -17,8 +22,8 @@ type ButtonState int
const (
ButtonEnabled ButtonState = 0
ButtonDisabled ButtonState = 1
ButtonHidden ButtonState = 2
ButtonDisabled ButtonState = 1
ButtonHidden ButtonState = 2
)
```
@ -33,7 +38,7 @@ The button states can be set during window creation or at runtime.
When creating a new window, you can set the initial state of the buttons using
the `WebviewWindowOptions` struct:
```go
```go title="main.go"
package main
import (
@ -75,7 +80,7 @@ The button state functionality behaves slightly differently on Windows and
macOS:
| | Windows | Mac |
| --------------------- | ---------------------- | ---------------------- |
|-----------------------|------------------------|------------------------|
| Disable Min/Max/Close | Disables Min/Max/Close | Disables Min/Max/Close |
| Hide Min | Disables Min | Hides Min button |
| Hide Max | Disables Max | Hides Max button |
@ -92,7 +97,7 @@ in the `WebviewWindowOptions` struct:
Example:
```go
```go title="main.go"
package main
import (

View File

@ -1,157 +0,0 @@
---
title: File Associations
sidebar:
order: 20
---
File associations allow your application to handle specific file types when
users open them. This is particularly useful for text editors, image viewers, or
any application that works with specific file formats. This guide explains how
to implement file associations in your Wails v3 application.
## Overview
File association support in Wails v3 is currently available for:
- Windows (NSIS installer packages)
- macOS (application bundles)
## Configuration
File associations are configured in the `config.yml` file located in your
project's `build` directory.
### Basic Configuration
To set up file associations:
1. Open `build/config.yml`
2. Add your file associations under the `fileAssociations` section
3. Run `wails3 update build-assets` to update the build assets
4. Set the `FileAssociations` field in the application options
5. Package your application using `wails3 package`
Here's an example configuration:
```yaml
fileAssociations:
- ext: myapp
name: MyApp Document
description: MyApp Document File
iconName: myappFileIcon
role: Editor
- ext: custom
name: Custom Format
description: Custom File Format
iconName: customFileIcon
role: Editor
```
### Configuration Properties
| Property | Description | Platform |
| ----------- | ---------------------------------------------------------------- | -------- |
| ext | File extension without the leading period (e.g., `txt`) | All |
| name | Display name for the file type | All |
| description | Description shown in file properties | Windows |
| iconName | Name of the icon file (without extension) in the build folder | All |
| role | Application's role for this file type (e.g., `Editor`, `Viewer`) | macOS |
## Listening for File Open Events
To handle file open events in your application, you can listen for the
`events.Common.ApplicationOpenedWithFile` event:
```go
func main() {
app := application.New(application.Options{
Name: "MyApp",
FileAssociations: []string{".txt", ".md"}, // Specify supported extensions
})
// Listen for files being used to open the application
app.OnApplicationEvent(events.Common.ApplicationOpenedWithFile, func(event *application.ApplicationEvent) {
associatedFile := event.Context().Filename()
application.InfoDialog().SetMessage("Application opened with file: " + associatedFile).Show()
})
// Create your window and run the app...
}
```
## Step-by-Step Tutorial
Let's walk through setting up file associations for a simple text editor:
### 1. Create Icons
- Create icons for your file type (recommended sizes: 16x16, 32x32, 48x48,
256x256)
- Save the icons in your project's `build` folder
- Name them according to your `iconName` configuration (e.g.,
`textFileIcon.png`)
!!! tip You can use `wails3 generate icons` to generate the required icons for
you. Run `wails3 generate icons --help` for more information.
### 2. Configure File Associations
Edit the `build/config.yml` file to add your file associations:
```yaml
# build/config.yml
fileAssociations:
- ext: txt
name: Text Document
description: Plain Text Document
iconName: textFileIcon
role: Editor
```
### 3. Update Build Assets
Run the following command to update the build assets:
```bash
wails3 update build-assets
```
### 4. Set File Associations in the Application Options
In your `main.go` file, set the `FileAssociations` field in the application
options:
```go
app := application.New(application.Options{
Name: "MyApp",
FileAssociations: []string{".txt", ".md"}, // Specify supported extensions
})
```
<!-- prettier-ignore -->
:::tip[Why are file extensions required in both the application config and config.yml?]
On Windows, when a file is opened with a file association, the application is
launched with the filename as the first argument to the application. The
application has no way of knowing if the first argument is a file or a command
line argument, so it uses the `FileAssociations` field in the application
options to determine if the first argument is an associated file or not.
:::
### 5. Package Your Application
Package your application using the following command:
```bash
wails3 package
```
The packaged application will be created in the `bin` directory. You can then
install and test the application.
## Additional Notes
- Icons should be provided in PNG format in the build folder
- Testing file associations requires installing the packaged application

View File

@ -0,0 +1,169 @@
---
title: File Associations
sidebar:
order: 20
---
# File Associations <Badge text="Windows" variant="note" /> <Badge text="macOS" variant="success" />
import { Steps } from "@astrojs/starlight/components";
import {Badge} from '@astrojs/starlight/components';
Relevant Platforms: <Badge text="Windows" variant="note" /> <Badge text="macOS" variant="success" />
<br/>
File associations allow your application to handle specific file types when
users open them. This is particularly useful for text editors, image viewers, or
any application that works with specific file formats. This guide explains how
to implement file associations in your Wails v3 application.
## Overview
File association support in Wails v3 is currently available for:
- Windows (NSIS installer packages)
- macOS (application bundles)
## Configuration
File associations are configured in the `config.yml` file located in your
project's `build` directory.
### Basic Configuration
To set up file associations:
1. Open `build/config.yml`
2. Add your file associations under the `fileAssociations` section
3. Run `wails3 update build-assets` to update the build assets
4. Set the `FileAssociations` field in the application options
5. Package your application using `wails3 package`
Here's an example configuration:
```yaml
fileAssociations:
- ext: myapp
name: MyApp Document
description: MyApp Document File
iconName: myappFileIcon
role: Editor
- ext: custom
name: Custom Format
description: Custom File Format
iconName: customFileIcon
role: Editor
```
### Configuration Properties
| Property | Description | Platform |
|-------------|------------------------------------------------------------------|----------|
| ext | File extension without the leading period (e.g., `txt`) | All |
| name | Display name for the file type | All |
| description | Description shown in file properties | Windows |
| iconName | Name of the icon file (without extension) in the build folder | All |
| role | Application's role for this file type (e.g., `Editor`, `Viewer`) | macOS |
## Listening for File Open Events
To handle file open events in your application, you can listen for the
`events.Common.ApplicationOpenedWithFile` event:
```go
func main() {
app := application.New(application.Options{
Name: "MyApp",
FileAssociations: []string{".txt", ".md"}, // Specify supported extensions
})
// Listen for files being used to open the application
app.OnApplicationEvent(events.Common.ApplicationOpenedWithFile, func(event *application.ApplicationEvent) {
associatedFile := event.Context().Filename()
application.InfoDialog().SetMessage("Application opened with file: " + associatedFile).Show()
})
// Create your window and run the app...
}
```
## Step-by-Step Tutorial
Let's walk through setting up file associations for a simple text editor:
<Steps>
1. ### Create Icons
- Create icons for your file type (recommended sizes: 16x16, 32x32, 48x48,
256x256)
- Save the icons in your project's `build` folder
- Name them according to your `iconName` configuration (e.g.,
`textFileIcon.png`)
:::tip
You can use `wails3 generate icons` to generate the required icons for you.
Run `wails3 generate icons --help` for more information.
:::
2. ### Configure File Associations
Edit the `build/config.yml` file to add your file associations:
```yaml
# build/config.yml
fileAssociations:
- ext: txt
name: Text Document
description: Plain Text Document
iconName: textFileIcon
role: Editor
```
3. ### Update Build Assets
Run the following command to update the build assets:
```bash
wails3 update build-assets
```
4. ### Set File Associations in the Application Options
In your `main.go` file, set the `FileAssociations` field in the application
options:
```go
app := application.New(application.Options{
Name: "MyApp",
FileAssociations: []string{".txt", ".md"}, // Specify supported extensions
})
```
:::tip[Why are file extensions required in both the application config and config.yml?]
On Windows, when a file is opened with a file association, the application is
launched with the filename as the first argument to the application. The
application has no way of knowing if the first argument is a file or a command
line argument, so it uses the `FileAssociations` field in the application
options to determine if the first argument is an associated file or not.
:::
5. ### Package Your Application
Package your application using the following command:
```bash
wails3 package
```
The packaged application will be created in the `bin` directory. You can then
install and test the application.
## Additional Notes
- Icons should be provided in PNG format in the build folder
- Testing file associations requires installing the packaged application
</Steps>

View File

@ -1,89 +0,0 @@
---
title: Packaging Your Application
sidebar:
order: 30
---
This guide explains how to package your Wails application for different
platforms.
## Windows
Windows applications are packaged as `.exe` files. Wails automatically handles
this during the build process, creating a standalone executable that includes
all necessary resources.
## macOS
macOS applications are packaged as `.app` bundles. Wails creates these bundles
automatically during the build process, including proper code signing and
notarization if configured.
## Linux
Linux applications can be packaged in various formats. Wails v3 uses
[nfpm](https://github.com/goreleaser/nfpm), an excellent packaging tool that
makes it easy to create `.deb`, `.rpm`, and Arch Linux packages. nfpm is a
powerful tool that handles the complexities of Linux packaging, making it easy
to create professional-grade packages.
### Package Types
Wails supports creating the following types of Linux packages:
- Debian packages (`.deb`) - for Debian, Ubuntu, and related distributions
- Red Hat packages (`.rpm`) - for Red Hat, Fedora, CentOS, and related
distributions
- Arch Linux packages - for Arch Linux and related distributions
- AppImage - a distribution-independent package format
### Building Packages
Wails provides several task commands for building Linux packages. These are
defined in `Taskfile.linux.yml` and can be invoked using the `wails3 task`
command:
```bash
# Build all package types (AppImage, deb, rpm, and Arch Linux)
wails3 task linux:package
# Build specific package types
wails3 task linux:create:appimage # Create an AppImage
wails3 task linux:create:deb # Create a Debian package
wails3 task linux:create:rpm # Create a Red Hat package
wails3 task linux:create:aur # Create an Arch Linux package
```
Each of these tasks will:
1. Build your application in production mode
2. Generate necessary desktop integration files
3. Create the appropriate package using nfpm
### Configuration
The package configuration file should follow the nfpm configuration format and
is typically located at `build/nfpm/nfpm.yaml`. Here's an example:
```yaml
name: "myapp"
arch: "amd64"
version: "v1.0.0"
maintainer: "Your Name <your.email@example.com>"
description: |
A short description of your application
vendor: "Your Company"
homepage: "https://yourcompany.com"
license: "MIT"
contents:
- src: ./build/bin/myapp
dst: /usr/bin/myapp
- src: ./assets/icon.png
dst: /usr/share/icons/myapp.png
- src: ./assets/myapp.desktop
dst: /usr/share/applications/myapp.desktop
```
For detailed information about all available configuration options, please refer
to the
[nfpm configuration documentation](https://nfpm.goreleaser.com/configuration/).

View File

@ -0,0 +1,228 @@
---
title: Code Signing
description: Guide for signing your Wails applications on macOS and Windows
sidebar:
order: 4
---
import { Tabs, TabItem } from '@astrojs/starlight/components';
import { Steps } from '@astrojs/starlight/components';
import { Card, CardGrid } from '@astrojs/starlight/components';
# Code Signing Your Application
This guide covers how to sign your Wails applications for both macOS and Windows, with a focus on automated signing using GitHub Actions.
<CardGrid>
<Card title="Windows Signing" icon="windows">
Sign your Windows executables with certificates
</Card>
<Card title="macOS Signing" icon="apple">
Sign and notarize your macOS applications
</Card>
</CardGrid>
## Windows Code Signing
<Steps>
1. **Obtain a Code Signing Certificate**
- Get from a trusted provider listed on [Microsoft's documentation](https://docs.microsoft.com/en-us/windows-hardware/drivers/dashboard/get-a-code-signing-certificate)
- Standard code signing certificate is sufficient (EV not required)
- Test signing locally before setting up CI
2. **Prepare for GitHub Actions**
- Convert your certificate to Base64
- Store in GitHub Secrets
- Set up signing workflow
3. **Configure GitHub Actions**
```yaml
name: Sign Windows Binary
on:
workflow_dispatch:
release:
types: [created]
jobs:
sign:
runs-on: windows-latest
steps:
- uses: actions/checkout@v3
- name: Import Certificate
run: |
New-Item -ItemType directory -Path certificate
Set-Content -Path certificate\certificate.txt -Value ${{ secrets.WINDOWS_CERTIFICATE }}
certutil -decode certificate\certificate.txt certificate\certificate.pfx
- name: Sign Binary
run: |
& 'C:\Program Files (x86)\Windows Kits\10\bin\10.0.17763.0\x86\signtool.exe' sign /f certificate\certificate.pfx /t http://timestamp.sectigo.com /p ${{ secrets.WINDOWS_CERTIFICATE_PASSWORD }} /v /fd sha256 .\build\bin\app.exe
```
</Steps>
### Important Windows Parameters
- **Signing Algorithm**: Usually `sha256`
- **Timestamp Server**: Valid timestamping server URL
- **Certificate Password**: Stored in GitHub Secrets
- **Binary Path**: Path to your compiled executable
## macOS Code Signing
<Steps>
1. **Prerequisites**
- Apple Developer Account
- Developer ID Certificate
- App Store Connect API Key
- [gon](https://github.com/mitchellh/gon) for notarization
2. **Certificate Setup**
- Generate Developer ID Certificate
- Download and install certificate
- Export certificate for CI
3. **Configure Notarization**
```json title="gon-sign.json"
{
"source": ["./build/bin/app"],
"bundle_id": "com.company.app",
"apple_id": {
"username": "dev@company.com",
"password": "@env:AC_PASSWORD"
},
"sign": {
"application_identity": "Developer ID Application: Company Name"
}
}
```
4. **GitHub Actions Configuration**
```yaml
name: Sign macOS Binary
on:
workflow_dispatch:
release:
types: [created]
jobs:
sign:
runs-on: macos-latest
steps:
- uses: actions/checkout@v3
- name: Import Certificate
env:
MACOS_CERTIFICATE: ${{ secrets.MACOS_CERTIFICATE }}
MACOS_CERTIFICATE_PWD: ${{ secrets.MACOS_CERTIFICATE_PWD }}
run: |
echo $MACOS_CERTIFICATE | base64 --decode > certificate.p12
security create-keychain -p "" build.keychain
security default-keychain -s build.keychain
security unlock-keychain -p "" build.keychain
security import certificate.p12 -k build.keychain -P $MACOS_CERTIFICATE_PWD -T /usr/bin/codesign
security set-key-partition-list -S apple-tool:,apple:,codesign: -s -k "" build.keychain
- name: Sign and Notarize
env:
AC_USERNAME: ${{ secrets.AC_USERNAME }}
AC_PASSWORD: ${{ secrets.AC_PASSWORD }}
run: |
gon -log-level=info ./build/darwin/gon-sign.json
```
</Steps>
### Important macOS Parameters
- **Bundle ID**: Unique identifier for your app
- **Developer ID**: Your Developer ID Application certificate
- **Apple ID**: Developer account credentials
- **ASC API Key**: App Store Connect API credentials
## Best Practices
1. **Security**
- Store all credentials in GitHub Secrets
- Use environment variables for sensitive data
- Regularly rotate certificates and credentials
2. **Workflow**
- Test signing locally first
- Use conditional signing based on platform
- Implement proper error handling
3. **Verification**
- Verify signatures after signing
- Test notarization process
- Check timestamp validity
## Troubleshooting
### Windows Issues
- Certificate not found
- Invalid timestamp server
- Signing tool errors
### macOS Issues
- Keychain access issues
- Notarization failures
- Certificate validation errors
## Complete GitHub Actions Workflow
```yaml
name: Sign Binaries
on:
workflow_dispatch:
release:
types: [created]
jobs:
sign:
strategy:
matrix:
platform: [windows-latest, macos-latest]
runs-on: ${{ matrix.platform }}
steps:
- uses: actions/checkout@v3
# Windows Signing
- name: Sign Windows Binary
if: matrix.platform == 'windows-latest'
env:
CERTIFICATE: ${{ secrets.WINDOWS_CERTIFICATE }}
CERTIFICATE_PASSWORD: ${{ secrets.WINDOWS_CERTIFICATE_PASSWORD }}
run: |
New-Item -ItemType directory -Path certificate
Set-Content -Path certificate\certificate.txt -Value $env:CERTIFICATE
certutil -decode certificate\certificate.txt certificate\certificate.pfx
& 'C:\Program Files (x86)\Windows Kits\10\bin\10.0.17763.0\x86\signtool.exe' sign /f certificate\certificate.pfx /t http://timestamp.sectigo.com /p $env:CERTIFICATE_PASSWORD /v /fd sha256 .\build\bin\app.exe
# macOS Signing
- name: Sign macOS Binary
if: matrix.platform == 'macos-latest'
env:
MACOS_CERTIFICATE: ${{ secrets.MACOS_CERTIFICATE }}
MACOS_CERTIFICATE_PWD: ${{ secrets.MACOS_CERTIFICATE_PWD }}
AC_USERNAME: ${{ secrets.AC_USERNAME }}
AC_PASSWORD: ${{ secrets.AC_PASSWORD }}
run: |
echo $MACOS_CERTIFICATE | base64 --decode > certificate.p12
security create-keychain -p "" build.keychain
security default-keychain -s build.keychain
security unlock-keychain -p "" build.keychain
security import certificate.p12 -k build.keychain -P $MACOS_CERTIFICATE_PWD -T /usr/bin/codesign
security set-key-partition-list -S apple-tool:,apple:,codesign: -s -k "" build.keychain
gon -log-level=info ./build/darwin/gon-sign.json
```
## Additional Resources
- [Apple Code Signing Documentation](https://developer.apple.com/support/code-signing/)
- [Microsoft Code Signing Documentation](https://docs.microsoft.com/en-us/windows-hardware/drivers/dashboard/get-a-code-signing-certificate)
- [Gon Documentation](https://github.com/mitchellh/gon)
- [GitHub Actions Documentation](https://docs.github.com/en/actions)

View File

@ -1,11 +1,13 @@
---
title: Welcome to Wails
description: "Create beautiful applications using Go"
banner:
content: |
This site is for v3 Alpha and is under construction. <a href="https://wails.io">v2 is the stable release.</a>
template: splash
hero:
tagline:
This is your starting point for exploring the latest version of Wails, a
powerful framework for building desktop applications using Go and modern web
A powerful framework for building desktop applications using Go and modern web
technologies.
image:
dark: ../../assets/wails-logo-dark.svg
@ -16,9 +18,6 @@ hero:
- text: Getting Started
link: /getting-started/installation
icon: right-arrow
- text: Learn More
link: /learn/services
icon: right-arrow
- text: Sponsor
link: https://github.com/sponsors/leaanthony
icon: heart
@ -27,63 +26,91 @@ hero:
---
import { Card, CardGrid } from "@astrojs/starlight/components";
import CardAnimation from '../../components/CardAnimation.astro';
<CardGrid stagger>
<Card title="Introduction" icon="pencil">
:::danger[Alpha Status]
Wails v3 is currently in ALPHA. Please follow our [feedback guide](/feedback) to help us improve the project.
This site is still under construction.
:::
Wails v3 Alpha is the latest iteration of the Wails project, bringing new
features and improvements to make desktop application development more efficient
and enjoyable. This version is still in alpha, so some features might change
before the final release.
<br/>
</Card>
<Card title="Status" icon="add-document">
<CardAnimation />
Please consult our [Status Page](/status) for up-to-date status.
<div class="animate-cards">
<CardGrid>
<Card title="What is Wails?" icon="star">
Build desktop applications that combine the power of Go with modern web technologies:
</Card>
<Card title="What's New" icon="add-document">
- **Native Performance**: Direct in-memory Go-to-Frontend communication
- **Cross Platform**: One codebase for Windows, macOS and Linux
- **Modern Stack**: Use any modern web framework (React, Vue, Svelte, etc.)
- **Native APIs**: Access OS-level features directly from Go
- **Developer Experience**: Hot reload, native dialogs, system tray, and more
- **Small Footprint**: Lightweight alternative to Electron
</Card>
Here are some of the exciting new features and improvements in Wails v3 Alpha:
<Card title="Prerequisites" icon="document">
Before you begin, ensure you have:
- Multiple Windows
- System Trays
- Improved bindings generation
- Improved build system
- Improved events system
- Go 1.23 or later installed
- Latest version of npm installed (if you want to use the templates)
- Basic knowledge of Go programming
More information about these features and other changes can be found in the
[What's new](/whats-new) section.
Check our [detailed prerequisites](/getting-started/installation#dependencies) for a complete list.
</Card>
</Card>
<Card title="Getting Started" icon="open-book">
<Card title="Quick Start" icon="rocket">
```bash
# Install wails
go install github.com/wailsapp/wails/v3/cmd/wails@latest
To get started with Wails v3 Alpha:
# Create a new project
wails init -n myproject
1. [Installation](/getting-started/installation): Follow our simple guide to
install Wails on your system.
2. [Create Your First Application](/getting-started/your-first-app): Learn how
to create your first Wails application with our step-by-step tutorial.
3. [Explore the API Reference](/api/application): Dive deeper into the API
documentation.
# Run your project
cd myproject
wails dev
```
</Card>
</Card>
<Card title="Project Status" icon="information">
Wails v3 is currently in Alpha. While it's stable enough for testing and
development, there might be breaking changes before the final release. Your feedback
and contributions are welcome!
</Card>
<Card title="Feedback and Contributions" icon="open-book">
<Card title="What's New in v3?" icon="list-format">
- **Multiple Windows Support**: Create and manage multiple windows in a single application
- **Improved API Design**: New procedural approach for more flexibility
- **Enhanced Bindings**: Sophisticated static analyzer for Go-to-Frontend communication
- **Better Build Tooling**: A new build system based on [Taskfile](https://taskfile.dev/)
- **New Linux Packaging**: Support for deb, rpm, arch linux, and AppImage
- **New Templates**: Create applications with a single command using our pre-built templates
</Card>
Your feedback is vital to making Wails better. If you encounter any issues or
have suggestions, please use our [Feedback process](/getting-started/feedback).
Contributions to the project are also welcome!
<Card title="Getting Started" icon="open-book">
Ready to build your first Wails application? Check out our
[installation guide](/getting-started/installation) to get started.
</Card>
Thank you for trying out Wails v3 Alpha!
<Card title="Feedback & Support" icon="discord">
We value your feedback and have a [detailed guide on providing it](/feedback).
Use this guide to:
</Card>
<Card title="Alpha Version Notice" icon="add-document">
- Report bugs
- Request features
- Get help from the community
- Contribute to the project
Please note that this is an alpha version of Wails v3. Features may be added,
removed, or changed in future updates. This version is intended for early
adopters and those who wish to contribute to the development of Wails.
Join our [Discord community](https://discord.gg/bdj28QNHmT)
or visit our [GitHub repository](https://github.com/wailsapp/wails) to:
</Card>
</Card>
</CardGrid>
<Card title="Alpha Version Notice" icon="warning">
Please note that v3 is currently in Alpha. While we're working hard to ensure
stability, there might be breaking changes before the final release. For production
use, please use [Wails v2](https://wails.io).
</Card>
</CardGrid>
</div>

View File

@ -1,5 +1,5 @@
---
title: Bindings Generator Guide
title: Bindings
sidebar:
order: 20
---

View File

@ -26,41 +26,40 @@ system, [Task](https://taskfile.dev) plays a central role in orchestrating the
build process.
The main `Taskfile.yml` is located in the project root, while platform-specific
tasks are defined in `build/Taskfile.<platform>.yml` files.
tasks are defined in `build/<platform>/Taskfile.yml` files. A common `Taskfile.yml`
file in the `build` directory contains common tasks that are shared across
platforms.
<FileTree>
- Project Root
- Taskfile.yml
- build
- Taskfile.windows.yml
- Taskfile.darwin.yml
- Taskfile.linux.yml
- Taskfile.common.yml
- windows/Taskfile.yml
- darwin/Taskfile.yml
- linux/Taskfile.yml
- Taskfile.yml
</FileTree>
The `Taskfile.common.yml` file contains common tasks that are shared across
platforms.
## Taskfile.yml
The `Taskfile.yml` file is the main entry point for the build system. It defines
The `Taskfile.yml` file in the project root is the main entry point for the build system. It defines
the tasks and their dependencies. Here's the default `Taskfile.yml` file:
```yaml
version: "3"
version: '3'
includes:
common: ./build/Taskfile.common.yml
windows: ./build/Taskfile.windows.yml
darwin: ./build/Taskfile.darwin.yml
linux: ./build/Taskfile.linux.yml
common: ./build/Taskfile.yml
windows: ./build/windows/Taskfile.yml
darwin: ./build/darwin/Taskfile.yml
linux: ./build/linux/Taskfile.yml
vars:
APP_NAME: "{{.ProjectName}}"
APP_NAME: "myproject"
BIN_DIR: "bin"
VITE_PORT: "{{.WAILS_VITE_PORT | default 9245}}"
VITE_PORT: '{{.WAILS_VITE_PORT | default 9245}}'
tasks:
build:
@ -81,23 +80,19 @@ tasks:
dev:
summary: Runs the application in development mode
cmds:
- wails3 dev -config ./build/devmode.config.yaml -port {{.VITE_PORT}}
- wails3 dev -config ./build/config.yml -port {{.VITE_PORT}}
dev:reload:
summary: Reloads the application
cmds:
- task: run
```
## Platform-Specific Taskfiles
Each platform has its own Taskfile, located in the `build` directory. These
files define the core tasks for that platform. Each taskfile includes common
tasks from the `Taskfile.common.yml` file.
Each platform has its own Taskfile, located in the platform directories beneath the `build` directory. These
files define the core tasks for that platform. Each taskfile includes common tasks from the `build/Taskfile.yml` file.
### Windows
Location: `build/Taskfile.windows.yml`
Location: `build/windows/Taskfile.yml`
The Windows-specific Taskfile includes tasks for building, packaging, and
running the application on Windows. Key features include:
@ -108,30 +103,30 @@ running the application on Windows. Key features include:
### Linux
Location: `build/Taskfile.linux.yml`
Location: `build/linux/Taskfile.yml`
The Linux-specific Taskfile includes tasks for building, packaging, and running
the application on Linux. Key features include:
- Building with optional production flags
- Creating an AppImage for packaging
- Creating an AppImage, deb, rpm, and Arch Linux packages
- Generating `.desktop` file for Linux applications
### macOS
Location: `build/Taskfile.darwin.yml`
Location: `build/darwin/Taskfile.yml`
The macOS-specific Taskfile includes tasks for building, packaging, and running
the application on macOS. Key features include:
- Building with optional production flags
- Creating an `.app` bundle for packaging
- Building binaries for amd64, arm64 and universal (both) architectures
- Creating an `.app` bundle for distributing
- Setting macOS-specific build flags and environment variables
## Wails3 Commands and Task Execution
The `wails3 task` command is an embedded version of taskfile.dev, which executes
the tasks defined in your Taskfile.yml.
The `wails3 task` command is an embedded version of [Taskfile](https://taskfile.dev), which executes
the tasks defined in your `Taskfile.yml`.
The `wails3 build` and `wails3 package` commands are aliases for
`wails3 task build` and `wails3 task package` respectively. When you run these
@ -165,6 +160,12 @@ This flexibility allows you to tailor the build process to your specific
requirements while still benefiting from the structure provided by the Wails v3
build system.
:::tip[Learning Taskfile]
We highly recommend reading the [Taskfile](https://taskfile.dev) documentation to
understand how to use Taskfile effectively.
You can find out which version of Taskfile is embedded in the Wails CLI by running `wails3 task --version`.
:::
## Development Mode
The Wails v3 build system includes a powerful development mode that enhances the
@ -178,20 +179,19 @@ When you run `wails3 dev`, the following process occurs:
1. The command checks for an available port, defaulting to 9245 if not
specified.
2. It sets up the environment variables for the frontend dev server (Vite).
3. It starts the file watcher using the `refresh` library.
3. It starts the file watcher using the [refresh](https://github.com/atterpac/refresh) library.
The [refresh](https://github.com/atterpac/refresh) library is responsible for
monitoring file changes and triggering rebuilds. It uses a configuration file,
typically located at `./build/devmode.config.yaml`, to determine which files to
watch and what actions to take when changes are detected.
monitoring file changes and triggering rebuilds. It uses the configuration defined under the `dev_mode` key in the `./build/config.yaml` file.
It may be configured to ignore certain directories and files, to determine which files to watch and what actions to take when changes are detected.
The default configuration works pretty well, but feel free to customise it to your needs.
### Configuration
The development mode can be configured using the `devmode.config.yaml` file.
Here's an example of its structure:
```yaml
config:
dev_mode:
root_path: .
log_level: warn
debounce: 1000
@ -231,8 +231,7 @@ This configuration file allows you to:
### Customising Development Mode
You can customise the development mode experience by modifying the
`devmode.config.yaml` file.
You can customise the development mode experience by modifying these values in the `config.yaml` file.
Some ways to customise include:
@ -241,22 +240,16 @@ Some ways to customise include:
changes
3. Adding or modifying the execute commands to fit your project's needs
You can also specify a custom configuration file and port:
```shell
wails3 dev -config ./path/to/custom/config.yaml -port 8080
```
### Using a browser for development
Whilst v2 fully supported the use of a browser for development, it caused a lot
Whilst Wails v2 fully supported the use of a browser for development, it caused a lot
of confusion. Applications that would work in the browser would not necessarily
work in the desktop application, as not all browser APIs are available in
webviews.
work in the desktop application, as not all browser APIs are available in webviews.
For UI-focused development work, you still have the flexibility to use a browser
in v3, by accessing the Vite URL at `http://localhost:9245` in dev mode. This
gives you access to powerful browser dev tools while working on styling and
layout. When you're ready to test functionality like bindings and events, simply
layout. Be aware that Go bindings *will not work* in this mode.
When you're ready to test functionality like bindings and events, simply
switch to the desktop view to ensure everything works perfectly in the
production environment.

View File

@ -11,12 +11,9 @@ number of features that may be used in your applications, including:
- Dialogs
- Browser integration
- Clipboard
- Frameless dragging
- Tray icons
- Menu management
- Menus
- System information
- Events
- Calling Go code
- Context Menus
- Screens
- WML (Wails Markup Language)
@ -27,12 +24,12 @@ ways to integrate the runtime:
- Using the `@wailsio/runtime` package
- Using a pre-built version of the runtime
## Using the `@wailsio/runtime` package
## Using the npm package
The `@wailsio/runtime` package is a JavaScript package that provides access to
the Wails runtime. It is used in by all the standard templates and is the
recommended way to integrate the runtime into your application. By using the
package, you will only include the parts of the runtime that you use.
the Wails runtime from the frontend. It is used in by all the standard templates
and is the recommended way to integrate the runtime into your application.
By using the `@wailsio/runtime` package, you will only include the parts of the runtime that you use.
The package is available on npm and can be installed using:
@ -40,7 +37,7 @@ The package is available on npm and can be installed using:
npm install --save @wailsio/runtime
```
## Using a pre-built version of the runtime
## Using a pre-built local version of the runtime
Some projects will not use a Javascript bundler and may prefer to use a
pre-built version of the runtime. This is the default for the examples in
@ -52,13 +49,12 @@ wails3 generate runtime
```
This will generate a `runtime.js` (and `runtime.debug.js`) file in the current
directory. This file can be used by your application by adding it to your assets
directory (normally `frontend/dist`) and then including it in your HTML:
directory. This file can be used by your application by adding it to your frontend project:
```html
<html>
<head>
<script src="/runtime.js"></script>
<script src="./runtime.js"></script>
</head>
<!--- ... -->
</>

View File

@ -2,7 +2,7 @@
title: Roadmap
---
## Current Status: Alpha 7
## Current Status: Alpha 8
Our goal is to reach Beta status. This roadmap outlines the key features and
improvements we need to implement before transitioning to Beta. Please note that
@ -29,7 +29,7 @@ a living document and is subject to change. If you have any suggestions, please
open an issue. Each milestone will have a set of goals that we are aiming to
achieve. These are subject to change.
## Alpha 8 Status
## Alpha 9 Status
- In Progress: Add support for File Associations
- In Progress: Drag and Drop support for Linux
- In Progress: Update documentation
- In Progress: Linux Systray improvements

View File

@ -0,0 +1,351 @@
---
title: Creating a Service
sidebar:
label: 1. Creating a Service
order: 10
---
import { Steps } from "@astrojs/starlight/components";
import {Image } from 'astro:assets';
import qr1 from "../../../assets/qr1.png";
Services are the backbone of your application. They handle business logic and manage state.
In this guide, we'll create a new service that generates QR codes from text.
This will show you how to organize your code into reusable services and handle external dependencies.
<br/>
<Steps>
1. ## Create the QR Service file
Create a new file called `qrservice.go` in your application directory and add the following code:
```go title="qrservice.go"
package main
import (
"github.com/skip2/go-qrcode"
)
// QRService handles QR code generation
type QRService struct {
// We can add state here if needed
}
// NewQRService creates a new QR service
func NewQRService() *QRService {
return &QRService{}
}
// GenerateQRCode creates a QR code from the given text
func (s *QRService) GenerateQRCode(text string, size int) ([]byte, error) {
// Generate the QR code
qr, err := qrcode.New(text, qrcode.Medium)
if err != nil {
return nil, err
}
// Convert to PNG
png, err := qr.PNG(size)
if err != nil {
return nil, err
}
return png, nil
}
```
<br/>
2. ## Register the Service
Update your `main.go` to use the new QR service:
```go title="main.go" ins={7-9}
func main() {
app := application.New(application.Options{
Name: "myproject",
Description: "A demo of using raw HTML & CSS",
LogLevel: slog.LevelDebug,
Services: []application.Service{
application.NewService(NewQRService()),
},
Assets: application.AssetOptions{
Handler: application.AssetFileServerFS(assets),
},
Mac: application.MacOptions{
ApplicationShouldTerminateAfterLastWindowClosed: true,
},
})
app.NewWebviewWindowWithOptions(application.WebviewWindowOptions{
Title: "myproject",
Width: 600,
Height: 400,
})
// Run the application. This blocks until the application has been exited.
err := app.Run()
// If an error occurred while running the application, log it and exit.
if err != nil {
log.Fatal(err)
}
}
```
<br/>
3. ## Update go.mod
Update your `go.mod` dependencies to include the `github.com/skip2/go-qrcode` package:
```go
go mod tidy
```
<br/>
4. ## Generate the Bindings
To call these methods from your frontend, we need to generate bindings.
You can do this by running `wails generate bindings` in your project root directory.
:::note
The very first time you ever run this in a project, the bindings generator does a thorough analysis of your code and dependencies. This can sometimes take a little longer than expected, however subsequent runs will be much faster.
:::
Once you've run this, you should see something similar to the following in your terminal:
```bash
% wails3 generate bindings
INFO Processed: 337 Packages, 1 Service, 1 Method, 0 Enums, 0 Models in 740.196125ms.
INFO Output directory: /Users/leaanthony/myproject/frontend/bindings
```
You should notice that in the frontend directory, there is a new directory called `bindings`:
```bash
frontend/
└── bindings
└── changeme
├── index.js
└── qrservice.js
```
:::tip[Pro Tip]
When you build your application using `wails3 build`, it will automatically generate bindings for you and keep them up to date.
:::
<br/>
5. ## Understanding the Bindings
Let's look at the generated bindings in `bindings/changeme/qrservice.js`:
```js title="bindings/changeme/qrservice.js"
// @ts-check
// Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
// This file is automatically generated. DO NOT EDIT
/**
* QRService handles QR code generation
* @module
*/
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore: Unused imports
import {Call as $Call, Create as $Create} from "@wailsio/runtime";
/**
* GenerateQRCode creates a QR code from the given text
* @param {string} text
* @param {number} size
* @returns {Promise<string> & { cancel(): void }}
*/
export function GenerateQRCode(text, size) {
let $resultPromise = /** @type {any} */($Call.ByID(3576998831, text, size));
let $typingPromise = /** @type {any} */($resultPromise.then(($result) => {
return $Create.ByteSlice($result);
}));
$typingPromise.cancel = $resultPromise.cancel.bind($resultPromise);
return $typingPromise;
}
```
We can see that the bindings are generated for the `GenerateQRCode` method. The parameter names have been preserved,
as well as the comments. JSDoc has also been generated for the method to provide type information to your IDE.
:::note
It's not necessary to fully understand the generated bindings, but it's important to understand how they work.
:::
The bindings provide:
- Functions that are equivalent to your Go methods
- Automatic conversion between Go and JavaScript types
- Promise-based async operations
- Type information as JSDoc comments
:::tip[Typescript]
The bindings generator also supports generating Typescript bindings. You can do this by running `wails3 generate bindings -ts`.
:::
<br/>
6. ## Use Bindings in Frontend
Firstly, update `frontend/src/main.js` to use the new bindings:
```js title="frontend/src/main.js"
import { GenerateQRCode } from './bindings/changeme/qrservice.js';
async function generateQR() {
const text = document.getElementById('text').value;
if (!text) {
alert('Please enter some text');
return;
}
try {
// Generate QR code as base64
const qrCodeBase64 = await GenerateQRCode(text, 256);
// Display the QR code
const qrDiv = document.getElementById('qrcode');
qrDiv.src = `data:image/png;base64,${qrCodeBase64}`;
} catch (err) {
console.error('Failed to generate QR code:', err);
alert('Failed to generate QR code: ' + err);
}
}
export function initializeQRGenerator() {
const button = document.getElementById('generateButton');
button.addEventListener('click', generateQR);
}
```
Now update `main.js` to simply set the image `src` attribute to the QR code URL:
```js title="frontend/src/main.js"
import { GenerateQRCode } from './bindings/changeme/qrservice.js';
async function generateQR() {
const text = document.getElementById('text').value;
if (!text) {
alert('Please enter some text');
return;
}
const img = document.getElementById('qrcode');
img.src = `/qrservice?text=${text}`
}
export function initializeQRGenerator() {
const button = document.getElementById('generateButton');
if (button) {
button.addEventListener('click', generateQR);
} else {
console.error('Generate button not found');
}
}
```
Now, when you click the "Generate QR Code" button, you should see a QR code in the center of the page:
<Image src={qr1} alt="QR Code"/>
<br/>
<br/>
7. ## Alternative Approach
So far, we have covered the following areas:
- Creating a new Service
- Generating Bindings
- Using the Bindings in our Frontend code
If the aim of your service is to serve files/assets/media to the frontend, like a traditional web server,
then there is an alternative approach to achieve the same result.
If your service defines Go's standard http handler function `ServeHTTP(w http.ResponseWriter, r *http.Request)`,
then it can be made accessible on the frontend. Let's extend our QR code service to do this:
```go title="qrservice.go" ins={5-6,36-63}
package main
import (
"github.com/skip2/go-qrcode"
"net/http"
"strconv"
)
// QRService handles QR code generation
type QRService struct {
// We can add state here if needed
}
// NewQRService creates a new QR service
func NewQRService() *QRService {
return &QRService{}
}
// GenerateQRCode creates a QR code from the given text
func (s *QRService) GenerateQRCode(text string, size int) ([]byte, error) {
// Generate the QR code
qr, err := qrcode.New(text, qrcode.Medium)
if err != nil {
return nil, err
}
// Convert to PNG
png, err := qr.PNG(size)
if err != nil {
return nil, err
}
return png, nil
}
func (s *QRService) ServeHTTP(w http.ResponseWriter, r *http.Request) {
// Extract the text parameter from the request
text := r.URL.Query().Get("text")
if text == "" {
http.Error(w, "Missing 'text' parameter", http.StatusBadRequest)
return
}
// Extract Size parameter from the request
sizeText := r.URL.Query().Get("size")
if sizeText == "" {
sizeText = "256"
}
size, err := strconv.Atoi(sizeText)
if err != nil {
http.Error(w, "Invalid 'size' parameter", http.StatusBadRequest)
return
}
// Generate the QR code
qrCodeData, err := s.GenerateQRCode(text, size)
if err != nil {
http.Error(w, err.Error(), http.StatusInternalServerError)
return
}
// Write the QR code data to the response
w.Header().Set("Content-Type", "image/png")
w.Write(qrCodeData)
}
```
Running the application again should result in the same QR code:
<Image src={qr1} alt="QR Code"/>
<br/>
</Steps>
## Next Steps
Now that we've created our QR service, we will create bindings so that we can use it in our frontend.

View File

@ -1,13 +1,13 @@
---
title: What's New in Wails v3 Alpha
title: What's New in Wails v3
---
Wails v3 Alpha introduces significant changes from v2. It replaces the
Wails v3 introduces significant changes from v2. It replaces the
single-window, declarative API with a more flexible procedural approach. This
new API design improves code readability and simplifies development, especially
for complex multi-window applications.
Wails v3 Alpha represents a substantial evolution in how desktop applications
Wails v3 represents a substantial evolution in how desktop applications
can be built using Go and web technologies.
## Multiple Windows
@ -27,15 +27,16 @@ allowing for dynamic user interfaces that adapt to user needs and application
states.
:::tip[Multiple Windows]
<details><summary>Example</summary>
```go
package main
import (
_ "embed"
"log"
"github.com/wailsapp/wails/v3/pkg/application"
_ "embed"
"log"
"github.com/wailsapp/wails/v3/pkg/application"
)
//go:embed assets/*
@ -43,35 +44,36 @@ var assets embed.FS
func main() {
app := application.New(application.Options{
Name: "Multi Window Demo",
Assets: application.AssetOptions{
Handler: application.AssetFileServerFS(assets),
},
})
app := application.New(application.Options{
Name: "Multi Window Demo",
Assets: application.AssetOptions{
Handler: application.AssetFileServerFS(assets),
},
})
window1 := app.NewWebviewWindowWithOptions(application.WebviewWindowOptions{
Title: "Window 1",
})
window2 := app.NewWebviewWindowWithOptions(application.WebviewWindowOptions{
Title: "Window 2",
})
// load the embedded html from the embed.FS
window1.SetURL("/")
window1.Center()
// Load an external URL
window2.SetURL("https://wails.app")
err := app.Run()
window1 := app.NewWebviewWindowWithOptions(application.WebviewWindowOptions{
Title: "Window 1",
})
window2 := app.NewWebviewWindowWithOptions(application.WebviewWindowOptions{
Title: "Window 2",
})
// load the embedded html from the embed.FS
window1.SetURL("/")
window1.Center()
// Load an external URL
window2.SetURL("https://wails.app")
err := app.Run()
if err != nil {
log.Fatal(err.Error())
}
if err != nil {
log.Fatal(err.Error())
}
}
```
</details>
:::
@ -86,7 +88,7 @@ Key features of the Wails v3 system tray integration include:
1. Window Attachment: You can associate a window with the system tray icon. When
activated, this window will be centered relative to the icon's position,
providing a seamless user experience.
providing a great way to quickly access your application.
2. Comprehensive Menu Support: Create rich, interactive menus that users can
access directly from the system tray icon. This allows for quick actions
@ -94,10 +96,13 @@ Key features of the Wails v3 system tray integration include:
3. Adaptive Icon Display: Support for both light and dark mode icons ensures
your application's system tray icon remains visible and aesthetically
pleasing across different system themes.
pleasing across different system themes. Template icons are also supported on macOS.
:::tip[Systray]
<details><summary>Example</summary>
```go
package main
@ -158,7 +163,7 @@ func main() {
}
}
```
</details>
:::
## Improved bindings generation
@ -176,6 +181,8 @@ command: `wails3 generate bindings`.
:::tip[Bindings]
<details><summary>Example</summary>
```js
// @ts-check
// Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
@ -209,6 +216,8 @@ window.go.main = {
};
```
</details>
:::
## Improved build system
@ -229,6 +238,8 @@ You can even use make if that's your thing!
:::tip[Taskfile.yml]
<details><summary>Example</summary>
```yaml "Snippet from Taskfile.yml"
build:darwin:
summary: Builds the application
@ -244,6 +255,7 @@ build:darwin:
CGO_LDFLAGS: "-mmacosx-version-min=10.13"
MACOSX_DEPLOYMENT_TARGET: "10.13"
```
</details>
:::
@ -262,6 +274,8 @@ you more control over the event flow and user experience.
:::tip[Example of event handling]
<details><summary>Example</summary>
```go
package main
@ -332,9 +346,10 @@ func main() {
log.Fatal(err.Error())
}
}
```
</details>
:::
## Wails Markup Language (wml)
@ -344,6 +359,8 @@ An experimental feature to call runtime methods using plain html, similar to
:::tip[Example of wml]
<details><summary>Example</summary>
```html
<!doctype html>
<html lang="en">
@ -379,6 +396,8 @@ An experimental feature to call runtime methods using plain html, similar to
</html>
```
</details>
:::
## Examples

Some files were not shown because too many files have changed in this diff Show More