update docs and readmes

docs/src/content/docs/learn/badges.mdx

@@ -29,6 +29,34 @@ app := application.New(application.Options{
 })
 ```
 
+### Creating the Service with Custom Options (Windows Only)
+
+On Windows, you can customize the badge appearance with various options:
+
+```go
+import "github.com/wailsapp/wails/v3/pkg/application"
+import "github.com/wailsapp/wails/v3/pkg/services/badge"
+import "image/color"
+
+// Create a badge service with custom options
+options := badge.Options{
+    TextColour:       color.RGBA{255, 255, 255, 255}, // White text
+    BackgroundColour: color.RGBA{0, 0, 255, 255},     // Green background
+    FontName:         "consolab.ttf",                 // Bold Consolas font
+    FontSize:         20,                             // Font size for single character
+    SmallFontSize:    14,                             // Font size for multiple characters
+}
+
+badgeService := badge.NewWithOptions(options)
+
+// Register the service with the application
+app := application.New(application.Options{
+    Services: []application.Service{
+        application.NewService(badgeService),
+    },
+})
+```
+
 ## Badge Operations
 
 ### Setting a Badge
@@ -66,6 +94,8 @@ badgeService.RemoveBadge()
     - Automatically handle dark/light mode appearance
     - Use the standard macOS dock badge styling
     - Automatically handle label overflow
+    - Do not support customization options (any options passed to NewWithOptions will be ignored)
+    - Will display "●" as the default badge if an empty label is provided
     
   </TabItem>
   
@@ -75,9 +105,17 @@ badgeService.RemoveBadge()
     
     - Are displayed as an overlay icon in the taskbar
     - Support text values
+    - Allow customization of colors, font, and font sizes
     - Adapt to Windows theme settings
     - Require the application to have a window
-    - Does not handle label overflow
+    - Use smaller font size automatically for badges with multiple characters
+    - Do not handle label overflow
+    - Support the following customization options:
+      - TextColour: Text color (default: white)
+      - BackgroundColour: Badge background color (default: red)
+      - FontName: Font file name (default: "segoeuib.ttf")
+      - FontSize: Font size for single character (default: 18)
+      - SmallFontSize: Font size for multiple characters (default: 14)
     
   </TabItem>
   
@@ -100,12 +138,18 @@ badgeService.RemoveBadge()
    - Numeric badges are most effective
    - On macOS, text badges should be brief
 
+3. For Windows customization:
+   - Ensure high contrast between text and background colors
+   - Test with different text lengths as font size decreases with length
+   - Use common system fonts to ensure availability
+
 ## API Reference
 
 ### Service Management
 | Method                                     | Description                                           |
 |--------------------------------------------|-------------------------------------------------------|
-| `New()`                                    | Creates a new badge service                           |
+| `New()`                                    | Creates a new badge service with default options      |
+| `NewWithOptions(options Options)`          | Creates a new badge service with custom option (Windows only, options are ignored on macOS) |
 
 ### Badge Operations
 | Method                                       | Description                                                |
@@ -115,4 +159,13 @@ badgeService.RemoveBadge()
 
 ### Structs and Types
 
-This service doesn't define any specific structs or types beyond the standard error return types.
+```go
+// Options for customizing badge appearance (Windows only)
+type Options struct {
+    TextColour       color.RGBA  // Color of the badge text
+    BackgroundColour color.RGBA  // Color of the badge background
+    FontName         string      // Font file name (e.g., "segoeuib.ttf")
+    FontSize         int         // Font size for single character
+    SmallFontSize    int         // Font size for multiple characters
+}
+```

v3/examples/badge-custom/README.md

@@ -1,59 +1,80 @@
 # Welcome to Your New Wails3 Project!
+Now that you have your project set up, it's time to explore the custom badge features that Wails3 offers on **Windows**.
 
-Congratulations on generating your Wails3 application! This README will guide you through the next steps to get your project up and running.
+## Exploring Custom Badge Features
 
-## Getting Started
+### Creating the Service with Custom Options (Windows Only)
 
-1. Navigate to your project directory in the terminal.
+On Windows, you can customize the badge appearance with various options:
 
-2. To run your application in development mode, use the following command:
+```go
+import "github.com/wailsapp/wails/v3/pkg/application"
+import "github.com/wailsapp/wails/v3/pkg/services/badge"
+import "image/color"
 
-   ```
+// Create a badge service with custom options
-   wails3 dev
+options := badge.Options{
-   ```
+    TextColour:       color.RGBA{255, 255, 255, 255}, // White text
+    BackgroundColour: color.RGBA{0, 0, 255, 255},     // Green background
+    FontName:         "consolab.ttf",                 // Bold Consolas font
+    FontSize:         20,                             // Font size for single character
+    SmallFontSize:    14,                             // Font size for multiple characters
+}
 
-   This will start your application and enable hot-reloading for both frontend and backend changes.
+badgeService := badge.NewWithOptions(options)
 
-3. To build your application for production, use:
+// Register the service with the application
+app := application.New(application.Options{
+    Services: []application.Service{
+        application.NewService(badgeService),
+    },
+})
+```
 
-   ```
+## Badge Operations
-   wails3 build
-   ```
 
-   This will create a production-ready executable in the `build` directory.
+### Setting a Badge
 
-## Exploring Wails3 Features
+Set a badge on the application tile/dock icon:
 
-Now that you have your project set up, it's time to explore the features that Wails3 offers:
+**Go**
+```go
+// Set a default badge
+badgeService.SetBadge("")
 
-1. **Check out the examples**: The best way to learn is by example. Visit the `examples` directory in the `v3/examples` directory to see various sample applications.
+// Set a numeric badge
+badgeService.SetBadge("3")
 
-2. **Run an example**: To run any of the examples, navigate to the example's directory and use:
+// Set a text badge
+badgeService.SetBadge("New")
+```
 
-   ```
+**JS**
-   go run .
+```js
-   ```
+import {SetBadge} from "../bindings/github.com/wailsapp/wails/v3/pkg/services/badge/service";
 
-   Note: Some examples may be under development during the alpha phase.
+// Set a default badge
+SetBadge("")
 
-3. **Explore the documentation**: Visit the [Wails3 documentation](https://v3.wails.io/) for in-depth guides and API references.
+// Set a numeric badge
+SetBadge("3")
 
-4. **Join the community**: Have questions or want to share your progress? Join the [Wails Discord](https://discord.gg/JDdSxwjhGf) or visit the [Wails discussions on GitHub](https://github.com/wailsapp/wails/discussions).
+// Set a text badge
+SetBadge("New")
+```
 
-## Project Structure
+### Removing a Badge
 
-Take a moment to familiarize yourself with your project structure:
+Remove the badge from the application icon:
 
-- `frontend/`: Contains your frontend code (HTML, CSS, JavaScript/TypeScript)
+**Go**
-- `main.go`: The entry point of your Go backend
+```go
-- `app.go`: Define your application structure and methods here
+badgeService.RemoveBadge()
-- `wails.json`: Configuration file for your Wails project
+```
 
-## Next Steps
+**JS**
+```js
+import {RemoveBadge} from "../bindings/github.com/wailsapp/wails/v3/pkg/services/badge/service";
 
-1. Modify the frontend in the `frontend/` directory to create your desired UI.
+RemoveBadge()
-2. Add backend functionality in `main.go`.
+```
-3. Use `wails3 dev` to see your changes in real-time.
-4. When ready, build your application with `wails3 build`.
-
-Happy coding with Wails3! If you encounter any issues or have questions, don't hesitate to consult the documentation or reach out to the Wails community.

v3/examples/badge-custom/frontend/bindings/github.com/wailsapp/wails/v3/pkg/services/badge/service.ts

@@ -8,14 +8,18 @@
 
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore: Unused imports
-import {Call as $Call, Create as $Create} from "@wailsio/runtime";
+import { Call as $Call, CancellablePromise as $CancellablePromise, Create as $Create } from "@wailsio/runtime";
 
-export function RemoveBadge(): Promise<void> & { cancel(): void } {
+/**
-    let $resultPromise = $Call.ByID(2633565570) as any;
+ * RemoveBadge removes the badge label from the application icon.
-    return $resultPromise;
+ */
+export function RemoveBadge(): $CancellablePromise<void> {
+    return $Call.ByID(2633565570);
 }
 
-export function SetBadge(label: string): Promise<void> & { cancel(): void } {
+/**
-    let $resultPromise = $Call.ByID(3052354152, label) as any;
+ * SetBadge sets the badge label on the application icon.
-    return $resultPromise;
+ */
+export function SetBadge(label: string): $CancellablePromise<void> {
+    return $Call.ByID(3052354152, label);
 }

v3/examples/badge-custom/frontend/dist/assets/index-edhLCYCH.js

@@ -1324,12 +1324,10 @@ window._wails = window._wails || {};
 window._wails.invoke = invoke;
 invoke("wails:runtime:ready");
 function RemoveBadge() {
-  let $resultPromise = ByID(2633565570);
+  return ByID(2633565570);
-  return $resultPromise;
 }
 function SetBadge(label) {
-  let $resultPromise = ByID(3052354152, label);
+  return ByID(3052354152, label);
-  return $resultPromise;
 }
 const setButton = document.getElementById("set");
 const removeButton = document.getElementById("remove");

v3/examples/badge-custom/frontend/dist/index.html

@@ -6,7 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
     <link rel="stylesheet" href="/style.css"/>
     <title>Wails App</title>
-  <script type="module" crossorigin src="/assets/index-sXwpgKSV.js"></script>
+    <script type="module" crossorigin src="/assets/index-edhLCYCH.js"></script>
 </head>
 <body>
 <div class="container">

v3/examples/badge/README.md

@@ -1,59 +1,71 @@
 # Welcome to Your New Wails3 Project!
+Now that you have your project set up, it's time to explore the basic badge features that Wails3 offers on **macOS** and **Windows**.
 
-Congratulations on generating your Wails3 application! This README will guide you through the next steps to get your project up and running.
+## Exploring Badge Features
 
-## Getting Started
+### Creating the Service
 
-1. Navigate to your project directory in the terminal.
+First, initialize the badge service:
 
-2. To run your application in development mode, use the following command:
+```go
+import "github.com/wailsapp/wails/v3/pkg/application"
+import "github.com/wailsapp/wails/v3/pkg/services/badge"
 
-   ```
+// Create a new badge service
-   wails3 dev
+badgeService := badge.New()
-   ```
 
-   This will start your application and enable hot-reloading for both frontend and backend changes.
+// Register the service with the application
+app := application.New(application.Options{
+    Services: []application.Service{
+        application.NewService(badgeService),
+    },
+})
+```
 
-3. To build your application for production, use:
+## Badge Operations
 
-   ```
+### Setting a Badge
-   wails3 build
-   ```
 
-   This will create a production-ready executable in the `build` directory.
+Set a badge on the application tile/dock icon:
 
-## Exploring Wails3 Features
+**Go**
+```go
+// Set a default badge
+badgeService.SetBadge("")
 
-Now that you have your project set up, it's time to explore the features that Wails3 offers:
+// Set a numeric badge
+badgeService.SetBadge("3")
 
-1. **Check out the examples**: The best way to learn is by example. Visit the `examples` directory in the `v3/examples` directory to see various sample applications.
+// Set a text badge
+badgeService.SetBadge("New")
+```
 
-2. **Run an example**: To run any of the examples, navigate to the example's directory and use:
+**JS**
+```js
+import {SetBadge} from "../bindings/github.com/wailsapp/wails/v3/pkg/services/badge/service";
 
-   ```
+// Set a default badge
-   go run .
+SetBadge("")
-   ```
 
-   Note: Some examples may be under development during the alpha phase.
+// Set a numeric badge
+SetBadge("3")
 
-3. **Explore the documentation**: Visit the [Wails3 documentation](https://v3.wails.io/) for in-depth guides and API references.
+// Set a text badge
+SetBadge("New")
+```
 
-4. **Join the community**: Have questions or want to share your progress? Join the [Wails Discord](https://discord.gg/JDdSxwjhGf) or visit the [Wails discussions on GitHub](https://github.com/wailsapp/wails/discussions).
+### Removing a Badge
 
-## Project Structure
+Remove the badge from the application icon:
 
-Take a moment to familiarize yourself with your project structure:
+**Go**
+```go
+badgeService.RemoveBadge()
+```
 
-- `frontend/`: Contains your frontend code (HTML, CSS, JavaScript/TypeScript)
+**JS**
-- `main.go`: The entry point of your Go backend
+```js
-- `app.go`: Define your application structure and methods here
+import {RemoveBadge} from "../bindings/github.com/wailsapp/wails/v3/pkg/services/badge/service";
-- `wails.json`: Configuration file for your Wails project
 
-## Next Steps
+RemoveBadge()
-
+```
-1. Modify the frontend in the `frontend/` directory to create your desired UI.
-2. Add backend functionality in `main.go`.
-3. Use `wails3 dev` to see your changes in real-time.
-4. When ready, build your application with `wails3 build`.
-
-Happy coding with Wails3! If you encounter any issues or have questions, don't hesitate to consult the documentation or reach out to the Wails community.