diff --git a/.gitignore b/.gitignore
index 1b1f680f..3a0a25da 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,4 +1,5 @@
 test.ipynb
+.DS_STORE
 
 # Visual Studio and Visual Studio Code
 bin/
diff --git a/README.md b/README.md
index 8becaf90..5949a49a 100644
--- a/README.md
+++ b/README.md
@@ -2,7 +2,7 @@
   <picture align="center">
     <source media="(prefers-color-scheme: dark)" srcset="media/icons/foundry_local_white.svg">
     <source media="(prefers-color-scheme: light)" srcset="media/icons/foundry_local_black.svg">
-    <img alt="AI Foundry icon." src="media/icons/foundry_local_black.svg" height="100" style="max-width: 100%;">
+    <img alt="Foundry Local icon." src="media/icons/foundry_local_black.svg" height="100" style="max-width: 100%;">
   </picture>
 <div id="user-content-toc">
   <ul align="center" style="list-style: none;">
@@ -12,261 +12,191 @@
     </summary>
   </ul>
 </div>
+
+## Add on-device AI to your app, effortlessly
+
 </div>
 
-## 👋 Welcome to Foundry Local
 
-Foundry Local brings the power of Azure AI Foundry to your local device **without requiring an Azure subscription**. It allows you to:
+Foundry Local lets you embed generative AI directly into your applications — no cloud or server calls required. All inference runs on-device, which means user data never leaves the device, responses start immediately with zero network latency, and your app works offline. No per-token costs, no backend infrastructure to maintain.
+
+Key benefits include:
 
-- Run Generative AI models directly on your local hardware - no sign-up required.
-- Keep all data processing on-device for enhanced privacy and security
-- Integrate models with your applications through an OpenAI-compatible API
-- Optimize performance using ONNX Runtime and hardware acceleration
+- **Self-contained SDK** — Ship AI features without requiring users to install any external dependencies.
+- **Easy-to-use CLI** — Explore models and experiment locally before integrating with your app.
+- **Optimized models out-of-the-box** — State-of-the-art quantization and compression deliver both performance and quality.
+- **Small footprint** — Leverages [ONNX Runtime](https://onnxruntime.ai/); a high performance inference runtime (written in C++) that has minimal disk and memory requirements.
+- **Automatic hardware acceleration** — Leverage GPUs and NPUs when available, with seamless fallback to CPU.
+- **Model distribution** — Popular open-source models hosted in the cloudwith automatic downloading and updating.
+- **Multi-platform support** — Windows, macOS (Apple silicon), Linux and Android.
+- **Bring your own models** — Add and run custom models alongside the built-in catalog.
 
 ## 🚀 Quickstart
 
-1. **Install Foundry Local:**
+### Explore with the CLI
 
-   - **Windows**: Install Foundry Local for your architecture (x64 or arm64):
+The Foundry Local CLI is a great way to explore models and test features before integrating with your app.
 
-     ```bash
-       winget install Microsoft.FoundryLocal
-     ```
+1. Install the CLI to explore models interactively before integrating with your app.
 
-- **MacOS**: Open a terminal and run the following command:
-  `bash
+    **Windows:**
+    ```bash
+    winget install Microsoft.FoundryLocal
+    ```
+
+    **macOS:**
+    ```bash
     brew install microsoft/foundrylocal/foundrylocal
-    `
-  Alternatively, you can download the installers from the [releases page](https://github.com/microsoft/Foundry-Local/releases) and follow the on-screen installation instructions.
+    ```
+
+2. Start a chat session with a model:
+
+    ```bash
+    foundry model run qwen2.5-0.5b
+    ```
+
+3. Explore available models
+
+    ```bash
+    foundry model ls
+    ```
 
 > [!TIP]
-> For any issues, refer to the [Installation section](#installing) below.
+> For installation issues, see the [Installation section](#installing) below.
 
-2. **Run your first model**: Open a terminal and run the following command to run a model:
+### Add on-device AI to your app
 
-   ```bash
-   foundry model run phi-3.5-mini
-   ```
+The Foundry Local SDK makes it easy to integrate local AI models into your applications. Below are quickstart examples for JavaScript, C# and Python.
 
-> [!NOTE]
-> The `foundry model run <model>` command will automatically download the model if it's not already cached on your local machine, and then start an interactive chat session with the model.
+> [!TIP]
+> For the JavaScript and C# SDKs you do **not** require the CLI to be installed. The Python SDK has a dependency on the CLI but a native in-process SDK is coming soon.
 
-Foundry Local will automatically select and download a model _variant_ with the best performance for your hardware. For example:
+<details open>
+<summary><strong>JavaScript</strong></summary>
 
-- if you have an Nvidia CUDA GPU, it will download the CUDA-optimized model.
-- if you have a Qualcomm NPU, it will download the NPU-optimized model.
-- if you don't have a GPU or NPU, Foundry local will download the CPU-optimized model.
+1. Install the SDK using npm:
 
-### 🔍 Explore available models
+    ```bash
+    npm install foundry-local-sdk
+    ```
 
-You can list all available models by running the following command:
+    > [!NOTE]
+    > On Windows, NPU models are not currently available for the JavaScript SDK. These will be enabled in a subsequent release.
 
-```bash
-foundry model ls
-```
+2. Use the SDK in your application as follows:
 
-This will show you a list of all models that can be run locally, including their names, sizes, and other details.
+    ```javascript
+    import { FoundryLocalManager } from 'foundry-local-sdk';
 
-## 🧑‍💻 Integrate with your applications using the SDK
+    const manager = FoundryLocalManager.create({ appName: 'foundry_local_samples' });
 
-Foundry Local has an easy-to-use SDK (C#, Python, JavaScript) to get you started with existing applications:
+    // Download and load a model (auto-selects best variant for user's hardware)
+    const model = await manager.catalog.getModel('qwen2.5-0.5b');
+    await model.download();
+    await model.load();
 
-### C#
+    // Create a chat client and get a completion
+    const chatClient = model.createChatClient();
+    const response = await chatClient.completeChat([
+        { role: 'user', content: 'What is the golden ratio?' }
+    ]);
 
-The C# SDK is available as a package on NuGet. You can install it using the .NET CLI:
+    console.log(response.choices[0]?.message?.content);
 
-```bash
-dotnet add package Microsoft.AI.Foundry.Local.WinML
-```
+    // Unload the model when done
+    await model.unload();
+    ```
 
-> [!TIP]
-> The C# SDK does not require end users to have Foundry Local CLI installed. It is a completely self-contained SDK that will does not depend on any external services. Also, the C# SDK has native in-process Chat Completions and Audio Transcription APIs that do not require HTTP calls to the local Foundry service.
-
-Here is an example of using the C# SDK to run a model and generate a chat completion:
-
-```csharp
-using Microsoft.AI.Foundry.Local;
-using Betalgo.Ranul.OpenAI.ObjectModels.RequestModels;
-using Microsoft.Extensions.Logging;
-
-CancellationToken ct = new CancellationToken();
-
-var config = new Configuration
-{
-    AppName = "my-app-name",
-    LogLevel = Microsoft.AI.Foundry.Local.LogLevel.Debug
-};
-
-using var loggerFactory = LoggerFactory.Create(builder =>
-{
-    builder.SetMinimumLevel(Microsoft.Extensions.Logging.LogLevel.Debug);
-});
-var logger = loggerFactory.CreateLogger<Program>();
-
-// Initialize the singleton instance.
-await FoundryLocalManager.CreateAsync(config, logger);
-var mgr = FoundryLocalManager.Instance;
-
-// Get the model catalog
-var catalog = await mgr.GetCatalogAsync();
-
-// List available models
-Console.WriteLine("Available models for your hardware:");
-var models = await catalog.ListModelsAsync();
-foreach (var availableModel in models)
-{
-    foreach (var variant in availableModel.Variants)
-    {
-        Console.WriteLine($"  - Alias: {variant.Alias} (Id: {string.Join(", ", variant.Id)})");
-    }
-}
+</details>
 
-// Get a model using an alias
-var model = await catalog.GetModelAsync("qwen2.5-0.5b") ?? throw new Exception("Model not found");
+<details>
+<summary><strong>C#</strong></summary>
 
+1. Install the SDK using NuGet:
 
-// is model cached
-Console.WriteLine($"Is model cached: {await model.IsCachedAsync()}");
+    ```bash
+    # Windows 
+    dotnet add package Microsoft.AI.Foundry.Local.WinML
 
-// print out cached models
-var cachedModels = await catalog.GetCachedModelsAsync();
-Console.WriteLine("Cached models:");
-foreach (var cachedModel in cachedModels)
-{
-    Console.WriteLine($"- {cachedModel.Alias} ({cachedModel.Id})");
-}
+    # macOS/Linux
+    dotnet add package Microsoft.AI.Foundry.Local
+    ```
+    On Windows, we recommend using the `Microsoft.AI.Foundry.Local.WinML` package, which will enable wider hardware acceleration support.
 
-// Download the model (the method skips download if already cached)
-await model.DownloadAsync(progress =>
-{
-    Console.Write($"\rDownloading model: {progress:F2}%");
-    if (progress >= 100f)
-    {
-        Console.WriteLine();
-    }
-});
-
-// Load the model
-await model.LoadAsync();
-
-// Get a chat client
-var chatClient = await model.GetChatClientAsync();
-
-// Create a chat message
-List<ChatMessage> messages = new()
-{
-    new ChatMessage { Role = "user", Content = "Why is the sky blue?" }
-};
-
-var streamingResponse = chatClient.CompleteChatStreamingAsync(messages, ct);
-await foreach (var chunk in streamingResponse)
-{
-    Console.Write(chunk.Choices[0].Message.Content);
-    Console.Out.Flush();
-}
-Console.WriteLine();
-
-// Tidy up - unload the model
-await model.UnloadAsync();
-```
+2. Use the SDK in your application as follows:
+    ```csharp
+    using Microsoft.AI.Foundry.Local;
 
+    var config = new Configuration { AppName = "foundry_local_samples" };
+    await FoundryLocalManager.CreateAsync(config);
+    var mgr = FoundryLocalManager.Instance;
 
-### Python
+    // Download and load a model (auto-selects best variant for user's hardware)
+    var catalog = await mgr.GetCatalogAsync();
+    var model = await catalog.GetModelAsync("qwen2.5-0.5b");
+    await model.DownloadAsync();
+    await model.LoadAsync();
 
-The Python SDK is available as a package on PyPI. You can install it using pip:
+    // Create a chat client and get a streaming completion
+    var chatClient = await model.GetChatClientAsync();
+    var messages = new List<ChatMessage> 
+    { 
+        new() { Role = "user", Content = "What is the golden ratio?" } 
+    };
 
-```bash
-pip install foundry-local-sdk
-pip install openai
-```
+    await foreach (var chunk in chatClient.CompleteChatStreamingAsync(messages))
+    {
+        Console.Write(chunk.Choices[0].Message.Content);
+    }
 
-> [!TIP]
-> We recommend using a virtual environment such as `conda` or `venv` to avoid conflicts with other packages.
+    // Unload the model when done
+    await model.Unload();
+    ```
 
-Foundry Local provides an OpenAI-compatible API that you can call from any application:
+</details>
 
-```python
-import openai
-from foundry_local import FoundryLocalManager
+<details>
+<summary><strong>Python</strong></summary>
 
-# By using an alias, the most suitable model will be downloaded
-# to your end-user's device.
-alias = "phi-3.5-mini"
+**NOTE:** The Python SDK currently relies on the Foundry Local CLI and uses the OpenAI-compatible REST API. A native in-process SDK (matching JS/C#) is coming soon.
 
-# Create a FoundryLocalManager instance. This will start the Foundry
-# Local service if it is not already running and load the specified model.
-manager = FoundryLocalManager(alias)
+1. Install the SDK using pip:
 
-# The remaining code us es the OpenAI Python SDK to interact with the local model.
+    ```bash
+    pip install foundry-local-sdk openai
+    ```
 
-# Configure the client to use the local Foundry service
-client = openai.OpenAI(
-    base_url=manager.endpoint,
-    api_key=manager.api_key  # API key is not required for local usage
-)
+2. Use the SDK in your application as follows:
 
-# Set the model to use and generate a streaming response
-stream = client.chat.completions.create(
-    model=manager.get_model_info(alias).id,
-    messages=[{"role": "user", "content": "What is the golden ratio?"}],
-    stream=True
-)
+    ```python
+    import openai
+    from foundry_local import FoundryLocalManager
 
-# Print the streaming response
-for chunk in stream:
-    if chunk.choices[0].delta.content is not None:
-        print(chunk.choices[0].delta.content, end="", flush=True)
-```
+    # Initialize manager (starts local service and loads model)
+    manager = FoundryLocalManager("phi-3.5-mini")
 
-### JavaScript
+    # Use the OpenAI SDK pointed at your local endpoint
+    client = openai.OpenAI(base_url=manager.endpoint, api_key=manager.api_key)
 
-The JavaScript SDK is available as a package on npm. You can install it using npm:
+    response = client.chat.completions.create(
+        model=manager.get_model_info("phi-3.5-mini").id,
+        messages=[{"role": "user", "content": "What is the golden ratio?"}]
+    )
 
-```bash
-npm install foundry-local-sdk
-npm install openai
-```
+    print(response.choices[0].message.content)
+    ```
 
-```javascript
-import { OpenAI } from "openai";
-import { FoundryLocalManager } from "foundry-local-sdk";
-
-// By using an alias, the most suitable model will be downloaded
-// to your end-user's device.
-// TIP: You can find a list of available models by running the
-// following command in your terminal: `foundry model list`.
-const alias = "phi-3.5-mini";
-
-// Create a FoundryLocalManager instance. This will start the Foundry
-// Local service if it is not already running.
-const foundryLocalManager = new FoundryLocalManager();
-
-// Initialize the manager with a model. This will download the model
-// if it is not already present on the user's device.
-const modelInfo = await foundryLocalManager.init(alias);
-console.log("Model Info:", modelInfo);
-
-const openai = new OpenAI({
-  baseURL: foundryLocalManager.endpoint,
-  apiKey: foundryLocalManager.apiKey,
-});
-
-async function streamCompletion() {
-  const stream = await openai.chat.completions.create({
-    model: modelInfo.id,
-    messages: [{ role: "user", content: "What is the golden ratio?" }],
-    stream: true,
-  });
-
-  for await (const chunk of stream) {
-    if (chunk.choices[0]?.delta?.content) {
-      process.stdout.write(chunk.choices[0].delta.content);
-    }
-  }
-}
+</details>
 
-streamCompletion();
-```
+### More samples
+
+Explore complete working examples in the [`samples/`](samples/) folder:
+
+| Sample | Description |
+|--------|-------------|
+| [**cs/**](samples/cs/) | C# examples using the .NET SDK |
+| [**js/**](samples/js/) | JavaScript/Node.js examples |
+| [**python/**](samples/python/) | Python examples using the OpenAI-compatible API |
 
 ## Manage
 
@@ -376,20 +306,11 @@ To uninstall Foundry Local, run the following command in your terminal:
   uninstall-foundry
   ```
 
-## Features & Use Cases
-
-- **On-device inference** - Process sensitive data locally for privacy, reduced latency, and no cloud costs
-- **OpenAI-compatible API** - Seamlessly integrate with applications using familiar SDKs
-- **High performance** - Optimized execution with ONNX Runtime and hardware acceleration
-- **Flexible deployment** - Ideal for edge computing scenarios with limited connectivity
-- **Development friendly** - Perfect for prototyping AI features before production deployment
-- **Model versatility** - Use pre-compiled models or [convert your own](https://learn.microsoft.com/azure/ai-foundry/foundry-local/how-to/how-to-compile-hugging-face-models?view=foundry-classic&tabs=Bash).
-
 ## Reporting Issues
 
 We're actively looking for feedback during this preview phase. Please report issues or suggest improvements in the [GitHub Issues](https://github.com/microsoft/Foundry-Local/issues) section.
 
-## 🎓 Learn
+## 🎓 Learn More
 
 - [Foundry Local Documentation on Microsoft Learn](https://learn.microsoft.com/en-us/azure/ai-foundry/foundry-local/?view=foundry-classic)
 - [Troubleshooting guide](https://learn.microsoft.com/azure/ai-foundry/foundry-local/reference/reference-best-practice?view=foundry-classic)
diff --git a/samples/cs/GettingStarted/Directory.Packages.props b/samples/cs/GettingStarted/Directory.Packages.props
index 7b3d7b80..9f946ef0 100644
--- a/samples/cs/GettingStarted/Directory.Packages.props
+++ b/samples/cs/GettingStarted/Directory.Packages.props
@@ -1,14 +1,10 @@
 <Project>
   <PropertyGroup>
     <ManagePackageVersionsCentrally>true</ManagePackageVersionsCentrally>
-    <OnnxRuntimeGenAIVersion>0.11.2</OnnxRuntimeGenAIVersion>
-    <OnnxRuntimeVersion>1.23.2</OnnxRuntimeVersion>    
   </PropertyGroup>
   <ItemGroup>
     <PackageVersion Include="Microsoft.AI.Foundry.Local" Version="0.8.2.1" />
     <PackageVersion Include="Microsoft.AI.Foundry.Local.WinML" Version="0.8.2.1" />
-    <PackageVersion Include="Microsoft.ML.OnnxRuntime.Gpu" Version="$(OnnxRuntimeVersion)" />
-    <PackageVersion Include="Microsoft.ML.OnnxRuntimeGenAI.Cuda" Version="$(OnnxRuntimeGenAIVersion)" />
     <PackageVersion Include="Microsoft.Extensions.Logging" Version="9.0.10" />
     <PackageVersion Include="OpenAI" Version="2.5.0" />
   </ItemGroup>
diff --git a/samples/cs/GettingStarted/ExcludeExtraLibs.props b/samples/cs/GettingStarted/ExcludeExtraLibs.props
deleted file mode 100644
index 5c23078f..00000000
--- a/samples/cs/GettingStarted/ExcludeExtraLibs.props
+++ /dev/null
@@ -1,49 +0,0 @@
-<Project>
-  <!-- we want to ensure we're using the onnxruntime libraries from Foundry Local Core so 
-  we delete the WindowsAppSdk versions once they're unzipped. -->
-  <Target Name="ExcludeOnnxRuntimeLibs" AfterTargets="ExtractMicrosoftWindowsAppSDKMsixFiles">
-    <Delete Files="$(MicrosoftWindowsAppSDKMsixContent)\onnxruntime.dll"/>
-    <Delete Files="$(MicrosoftWindowsAppSDKMsixContent)\onnxruntime_providers_shared.dll"/>
-    <Message Importance="Normal" Text="Deleted onnxruntime libraries from $(MicrosoftWindowsAppSDKMsixContent)." />
-  </Target>
-
-  <!-- Remove CUDA EP on Windows x64. onnxruntime-genai-cuda.dll is required for TRT RTX models. -->
-  <Target Name="ExcludeCudaLibs" Condition="'$(RuntimeIdentifier)'=='win-x64'" AfterTargets="ResolvePackageAssets">
-    <ItemGroup>
-      <!-- match onnxruntime_providers_cuda (we're matching %(Filename) which excludes the extension) -->
-      <NativeCopyLocalItems Remove="@(NativeCopyLocalItems)"
-                            Condition="$([System.Text.RegularExpressions.Regex]::IsMatch('%(Filename)', 
-                                      'onnxruntime_providers_cuda', RegexOptions.IgnoreCase))" />
-    </ItemGroup>
-    <Message Importance="Normal" Text="Excluded onnxruntime CUDA libraries from package (except onnxruntime-genai-cuda)." />
-  </Target>
-
-  <!-- Remove QNN EP and IHV libraries on Windows arm64 -->
-  <Target Name="ExcludeQnnLibs" Condition="'$(RuntimeIdentifier)'=='win-arm64'" AfterTargets="ResolvePackageAssets">
-    <ItemGroup>
-      <NativeCopyLocalItems Remove="@(NativeCopyLocalItems)"
-                            Condition="$([System.Text.RegularExpressions.Regex]::IsMatch('%(Filename)%(Extension)', 
-                                      '^QNN.*\.dll', RegexOptions.IgnoreCase))" />
-      <NativeCopyLocalItems Remove="@(NativeCopyLocalItems)"
-                            Condition="$([System.Text.RegularExpressions.Regex]::IsMatch('%(Filename)', 
-                                      '^libQNNhtp.*', RegexOptions.IgnoreCase))" />
-      <NativeCopyLocalItems Remove="@(NativeCopyLocalItems)"
-                            Condition="'%(FileName)%(Extension)' == 'onnxruntime_providers_qnn.dll'" />
-    </ItemGroup>
-    <Message Importance="Normal" Text="Excluded onnxruntime QNN libraries from package." />
-  </Target>
-
-  <!-- need to manually copy on linux-x64 due to the nuget packages not having the correct props file setup -->
-  <ItemGroup Condition="'$(RuntimeIdentifier)' == 'linux-x64'">
-    <!-- 'Update' as the Core package will add these dependencies, but we want to be explicit about the version -->
-    <PackageReference Update="Microsoft.ML.OnnxRuntime.Gpu" />
-    <PackageReference Update="Microsoft.ML.OnnxRuntimeGenAI.Cuda" />
-    <OrtNativeLibs Include="$(NuGetPackageRoot)microsoft.ml.onnxruntime.gpu.linux/$(OnnxRuntimeVersion)/runtimes/$(RuntimeIdentifier)/native/*" />
-    <OrtGenAINativeLibs Include="$(NuGetPackageRoot)microsoft.ml.onnxruntimegenai.cuda/$(OnnxRuntimeGenAIVersion)/runtimes/$(RuntimeIdentifier)/native/*" />
-  </ItemGroup>
-
-  <Target Name="CopyOrtNativeLibs" AfterTargets="Build" Condition=" '$(RuntimeIdentifier)' == 'linux-x64'">
-    <Copy SourceFiles="@(OrtNativeLibs)" DestinationFolder="$(OutputPath)"></Copy>
-    <Copy SourceFiles="@(OrtGenAINativeLibs)" DestinationFolder="$(OutputPath)"></Copy>
-  </Target>
-</Project>
\ No newline at end of file
diff --git a/samples/cs/GettingStarted/cross-platform/AudioTranscriptionExample/AudioTranscriptionExample.csproj b/samples/cs/GettingStarted/cross-platform/AudioTranscriptionExample/AudioTranscriptionExample.csproj
index 1b72f089..22e6bf49 100644
--- a/samples/cs/GettingStarted/cross-platform/AudioTranscriptionExample/AudioTranscriptionExample.csproj
+++ b/samples/cs/GettingStarted/cross-platform/AudioTranscriptionExample/AudioTranscriptionExample.csproj
@@ -31,7 +31,5 @@
     </None>
   </ItemGroup>
 
-  <!-- Exclude superfluous ORT and IHV libs -->
-  <Import Project="../../ExcludeExtraLibs.props" />
 
 </Project>
diff --git a/samples/cs/GettingStarted/cross-platform/FoundryLocalWebServer/FoundryLocalWebServer.csproj b/samples/cs/GettingStarted/cross-platform/FoundryLocalWebServer/FoundryLocalWebServer.csproj
index 71fd3b84..63e0dae2 100644
--- a/samples/cs/GettingStarted/cross-platform/FoundryLocalWebServer/FoundryLocalWebServer.csproj
+++ b/samples/cs/GettingStarted/cross-platform/FoundryLocalWebServer/FoundryLocalWebServer.csproj
@@ -24,10 +24,6 @@
     <PackageReference Include="Microsoft.ML.OnnxRuntime.Gpu" />
     <PackageReference Include="Microsoft.ML.OnnxRuntimeGenAI.Cuda" />
   </ItemGroup>
-  
-
-  <!-- Exclude superfluous ORT and IHV libs -->
-  <Import Project="../../ExcludeExtraLibs.props" />
 
 
 </Project>
diff --git a/samples/cs/GettingStarted/cross-platform/FoundrySamplesXPlatform.sln b/samples/cs/GettingStarted/cross-platform/FoundrySamplesXPlatform.sln
index eddab625..e85bdd04 100644
--- a/samples/cs/GettingStarted/cross-platform/FoundrySamplesXPlatform.sln
+++ b/samples/cs/GettingStarted/cross-platform/FoundrySamplesXPlatform.sln
@@ -8,7 +8,6 @@ EndProject
 Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "build", "build", "{8EC462FD-D22E-90A8-E5CE-7E832BA40C5D}"
 	ProjectSection(SolutionItems) = preProject
 		..\Directory.Packages.props = ..\Directory.Packages.props
-		..\ExcludeExtraLibs.props = ..\ExcludeExtraLibs.props
 		..\nuget.config = ..\nuget.config
 	EndProjectSection
 EndProject
diff --git a/samples/cs/GettingStarted/cross-platform/HelloFoundryLocalSdk/HelloFoundryLocalSdk.csproj b/samples/cs/GettingStarted/cross-platform/HelloFoundryLocalSdk/HelloFoundryLocalSdk.csproj
index dbd3084a..adb89687 100644
--- a/samples/cs/GettingStarted/cross-platform/HelloFoundryLocalSdk/HelloFoundryLocalSdk.csproj
+++ b/samples/cs/GettingStarted/cross-platform/HelloFoundryLocalSdk/HelloFoundryLocalSdk.csproj
@@ -25,7 +25,4 @@
   </ItemGroup>
 
 
-  <!-- Exclude superfluous ORT and IHV libs -->
-  <Import Project="../../ExcludeExtraLibs.props" />
-
 </Project>
diff --git a/samples/cs/GettingStarted/cross-platform/ModelManagementExample/ModelManagementExample.csproj b/samples/cs/GettingStarted/cross-platform/ModelManagementExample/ModelManagementExample.csproj
index cf104e5e..2cad9dec 100644
--- a/samples/cs/GettingStarted/cross-platform/ModelManagementExample/ModelManagementExample.csproj
+++ b/samples/cs/GettingStarted/cross-platform/ModelManagementExample/ModelManagementExample.csproj
@@ -26,7 +26,4 @@
   </ItemGroup>
 
 
-  <!-- Exclude superfluous ORT and IHV libs -->
-  <Import Project="../../ExcludeExtraLibs.props" />
-  
 </Project>
diff --git a/samples/cs/GettingStarted/windows/AudioTranscriptionExample/AudioTranscriptionExample.csproj b/samples/cs/GettingStarted/windows/AudioTranscriptionExample/AudioTranscriptionExample.csproj
index 499d320f..e6af2f7a 100644
--- a/samples/cs/GettingStarted/windows/AudioTranscriptionExample/AudioTranscriptionExample.csproj
+++ b/samples/cs/GettingStarted/windows/AudioTranscriptionExample/AudioTranscriptionExample.csproj
@@ -29,7 +29,4 @@
     </None>
   </ItemGroup>
 
-  <!-- On Publish: Exclude superfluous ORT and IHV libs -->
-  <Import Project="../../ExcludeExtraLibs.props" />
-
 </Project>
\ No newline at end of file
diff --git a/samples/cs/GettingStarted/windows/FoundryLocalWebServer/FoundryLocalWebServer.csproj b/samples/cs/GettingStarted/windows/FoundryLocalWebServer/FoundryLocalWebServer.csproj
index 2fba6130..c3834b69 100644
--- a/samples/cs/GettingStarted/windows/FoundryLocalWebServer/FoundryLocalWebServer.csproj
+++ b/samples/cs/GettingStarted/windows/FoundryLocalWebServer/FoundryLocalWebServer.csproj
@@ -23,7 +23,4 @@
     <PackageReference Include="OpenAI" />
   </ItemGroup>
 
-  <!-- On Publish: Exclude superfluous ORT and IHV libs -->
-  <Import Project="../../ExcludeExtraLibs.props"/>
-
 </Project>
\ No newline at end of file
diff --git a/samples/cs/GettingStarted/windows/FoundrySamplesWinML.sln b/samples/cs/GettingStarted/windows/FoundrySamplesWinML.sln
index e013ab58..cf6f3641 100644
--- a/samples/cs/GettingStarted/windows/FoundrySamplesWinML.sln
+++ b/samples/cs/GettingStarted/windows/FoundrySamplesWinML.sln
@@ -12,7 +12,6 @@ EndProject
 Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "build", "build", "{8EC462FD-D22E-90A8-E5CE-7E832BA40C5D}"
 	ProjectSection(SolutionItems) = preProject
 		..\Directory.Packages.props = ..\Directory.Packages.props
-		..\ExcludeExtraLibs.props = ..\ExcludeExtraLibs.props
 		..\nuget.config = ..\nuget.config
 	EndProjectSection
 EndProject
diff --git a/samples/cs/GettingStarted/windows/HelloFoundryLocalSdk/HelloFoundryLocalSdk.csproj b/samples/cs/GettingStarted/windows/HelloFoundryLocalSdk/HelloFoundryLocalSdk.csproj
index 12e3bff5..4aa8ebd0 100644
--- a/samples/cs/GettingStarted/windows/HelloFoundryLocalSdk/HelloFoundryLocalSdk.csproj
+++ b/samples/cs/GettingStarted/windows/HelloFoundryLocalSdk/HelloFoundryLocalSdk.csproj
@@ -23,7 +23,5 @@
     <PackageReference Include="Microsoft.AI.Foundry.Local.WinML" />
   </ItemGroup>
   
-  <!-- On Publish: Exclude superfluous ORT and IHV libs -->
-  <Import Project="../../ExcludeExtraLibs.props"/>
 
 </Project>
\ No newline at end of file
diff --git a/samples/cs/GettingStarted/windows/ModelManagementExample/ModelManagementExample.csproj b/samples/cs/GettingStarted/windows/ModelManagementExample/ModelManagementExample.csproj
index 153de653..cce3252a 100644
--- a/samples/cs/GettingStarted/windows/ModelManagementExample/ModelManagementExample.csproj
+++ b/samples/cs/GettingStarted/windows/ModelManagementExample/ModelManagementExample.csproj
@@ -22,7 +22,5 @@
     <PackageReference Include="Microsoft.AI.Foundry.Local.WinML" />
   </ItemGroup>
 
-  <!-- On Publish: Exclude superfluous ORT and IHV libs -->
-  <Import Project="../../ExcludeExtraLibs.props" />
 
 </Project>
\ No newline at end of file
diff --git a/samples/electron/foundry-chat/.gitignore b/samples/electron/foundry-chat/.gitignore
deleted file mode 100644
index 1294fc6f..00000000
--- a/samples/electron/foundry-chat/.gitignore
+++ /dev/null
@@ -1,9 +0,0 @@
-# Dependencies
-node_modules/
-package-lock.json
-
-
-# Build output
-dist/
-build/
-
diff --git a/samples/electron/foundry-chat/.vscode/launch.json b/samples/electron/foundry-chat/.vscode/launch.json
deleted file mode 100644
index 7318f04f..00000000
--- a/samples/electron/foundry-chat/.vscode/launch.json
+++ /dev/null
@@ -1,36 +0,0 @@
-{
-    // Use IntelliSense to learn about possible attributes.
-    // Hover to view descriptions of existing attributes.
-    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
-    "version": "0.2.0",
-    "configurations": [
-        {
-            "name": "Debug Main Process",
-            "type": "node",
-            "request": "launch",
-            "cwd": "${workspaceFolder}",
-            "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
-            "windows": {
-                "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron.cmd"
-            },
-            "args": ["."],
-            "outputCapture": "std",
-            "console": "integratedTerminal"
-        },
-        {
-            "name": "Debug Renderer Process",
-            "type": "chrome",
-            "request": "launch",
-            "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
-            "windows": {
-                "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron.cmd"
-            },
-            "runtimeArgs": [
-                "${workspaceFolder}",
-                "--remote-debugging-port=9222"
-            ],
-            "webRoot": "${workspaceFolder}",
-            "timeout": 30000
-        }
-    ]
-}
\ No newline at end of file
diff --git a/samples/electron/foundry-chat/Readme.md b/samples/electron/foundry-chat/Readme.md
deleted file mode 100644
index aea59131..00000000
--- a/samples/electron/foundry-chat/Readme.md
+++ /dev/null
@@ -1,63 +0,0 @@
-# Foundry Local Chat Demo
-
-A simple Electron Chat application that can chat with cloud and Foundry local models.
-
-## Prerequisites
-
-- Node.js (v16 or higher)
-  - To install Node.js on Windows, run:
-    ```powershell
-    winget install OpenJS.NodeJS
-    ```
-  - npm comes bundled with Node.js
-
-## Setup Instructions
-1. Download the latest Foundry .MSIX and install for your processor:
-   [Foundry Releases](https://github.com/microsoft/Foundry-Local/releases)
-   Then install it using the following powershell command.
-   ```powershell
-   add-appxpackage <foundryfile>.msix
-   ```
- 
-2. Install dependencies:
-   ```powershell
-   npm install
-   ```
-
-3. Set the following environment variables to your Cloud AI Service
-   ```powershell
-   YOUR_API_KEY
-   YOUR_ENDPOINT
-   YOUR_MODEL_NAME
-   ```
-
-4. Start the application:
-   ```powershell
-   npm start
-   ```
-
-## Building the Application (not necessary for testing)
-
-To build the application for your platform:
-```powershell
-# For all platforms
-npm run build
-
-# For Windows specifically
-npm run build:win
-```
-
-The built application will be available in the `dist` directory.
-
-## Project Structure
-
-- `main.js` - Main Electron process file
-- `chat.html` - Main application window
-- `preload.cjs` - Preload script for secure IPC communication
-
-## Dependencies
-
-- Electron - Cross-platform desktop application framework
-- foundry-local-sdk - Local model integration
-- OpenAI - Cloud model integration
-
diff --git a/samples/electron/foundry-chat/chat.html b/samples/electron/foundry-chat/chat.html
deleted file mode 100644
index 9b706672..00000000
--- a/samples/electron/foundry-chat/chat.html
+++ /dev/null
@@ -1,448 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Foundry Local - Chat Demo</title>
-    <style>
-        /* Base Styles */
-        body {
-            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-            margin: 0;
-            padding: 0;
-            height: 100vh;
-            display: flex;
-            flex-direction: column;
-            background: linear-gradient(135deg, #1a223f 0%, #2d1a1a 100%);
-        }
-
-        /* Layout Components */
-        .chat-container {
-            flex: 1;
-            display: flex;
-            flex-direction: column;
-            width: 100%;
-            background: rgba(20, 20, 30, 0.95);
-            border: 2px dashed #ffd580;
-            box-shadow: 0 2px 16px rgba(0, 0, 0, 0.4);
-            position: relative;
-            height: 100vh;
-            border-radius: 24px;
-            margin: 24px auto;
-            max-width: 800px;
-            overflow: hidden;
-        }
-
-        /* Header Styles */
-        .chat-header {
-            padding: 20px;
-            background: transparent;
-            border-bottom: 1px solid #3a2e1a;
-            position: sticky;
-            top: 0;
-            z-index: 2;
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-        }
-
-        .chat-header h2 {
-            color: #ffd580;
-            font-weight: 700;
-            letter-spacing: 1px;
-        }
-
-        /* Model Selector Styles */
-        .model-selector {
-            padding: 8px 12px;
-            border: 1px solid #ffd580;
-            border-radius: 6px;
-            background: #23243a;
-            color: #ffd580;
-            font-size: 14px;
-            cursor: pointer;
-        }
-
-        .model-selector:focus {
-            outline: none;
-            border-color: #ffe4a1;
-        }
-
-        /* Messages Area Styles */
-        .chat-messages {
-            flex: 1;
-            overflow-y: auto;
-            padding: 20px;
-            padding-bottom: 100px;
-            scrollbar-width: thin;
-            scrollbar-color: #ffd580 #1a223f;
-            border-radius: 0 0 22px 22px;
-        }
-
-        .chat-messages::-webkit-scrollbar {
-            width: 16px;
-        }
-
-        .chat-messages::-webkit-scrollbar-track {
-            background: #1a223f;
-        }
-
-        .chat-messages::-webkit-scrollbar-thumb {
-            background-color: #ffd580;
-            border-radius: 6px;
-        }
-
-        /* Message Styles */
-        .message {
-            margin-bottom: 20px;
-            display: flex;
-            flex-direction: column;
-        }
-
-        .message.user {
-            align-items: flex-end;
-        }
-
-        .message.assistant {
-            align-items: flex-start;
-        }
-
-        .message-content {
-            max-width: 80%;
-            padding: 12px 16px;
-            border-radius: 12px;
-            margin: 4px 0;
-            white-space: pre-wrap;
-            color: #f8f9fa;
-        }
-
-        .user .message-content {
-            background: linear-gradient(135deg, #2d1a1a 60%, #3a2e1a 100%);
-            color: #ffd580;
-            border: 1px solid #ffd580;
-        }
-
-        .assistant .message-content {
-            background: linear-gradient(135deg, #23243a 60%, #1a223f 100%);
-            color: #f8f9fa;
-            border: 1px solid #ffd58044;
-        }
-
-        /* Input Area Styles */
-        .chat-input {
-            padding: 20px;
-            background: rgba(26, 34, 63, 0.95);
-            border-top: 1px solid #3a2e1a;
-            position: sticky;
-            bottom: 0;
-            z-index: 2;
-            width: 100%;
-            box-sizing: border-box;
-            border-radius: 0 0 22px 22px;
-        }
-
-        .input-container {
-            display: flex;
-            gap: 10px;
-        }
-
-        .message-input {
-            flex: 1;
-            padding: 12px;
-            border: 1px solid #ffd580;
-            border-radius: 6px;
-            font-size: 16px;
-            resize: none;
-            height: 50px;
-            overflow-y: auto;
-            background: #23243a;
-            color: #ffd580;
-            border-bottom-left-radius: 0;
-            border-bottom-right-radius: 0;
-        }
-
-        .send-button {
-            padding: 12px 24px;
-            background-color: #ffd580;
-            color: #23243a;
-            border: none;
-            border-radius: 6px;
-            cursor: pointer;
-            font-size: 16px;
-            font-weight: bold;
-            box-shadow: 0 2px 8px rgba(255, 213, 128, 0.1);
-        }
-
-        .send-button:hover {
-            background-color: #ffe4a1;
-        }
-
-        .send-button:disabled {
-            background-color: #6c757d;
-            cursor: not-allowed;
-        }
-
-        /* Status and Error Styles */
-        .status-bar {
-            padding: 10px;
-            background-color: #23243a;
-            color: #ffd580;
-            text-align: center;
-            display: none;
-        }
-
-        .error-message {
-            padding: 10px;
-            background-color: #4b2323;
-            color: #ffd580;
-            border-radius: 4px;
-            margin: 10px 0;
-            display: none;
-        }
-
-        /* Typing Indicator Animation */
-        .typing-indicator {
-            display: inline-block;
-            margin-left: 8px;
-        }
-
-        .typing-indicator span {
-            display: inline-block;
-            width: 8px;
-            height: 8px;
-            background-color: #ffd580;
-            border-radius: 50%;
-            margin: 0 2px;
-            animation: typing 1s infinite;
-        }
-
-        .typing-indicator span:nth-child(2) { animation-delay: 0.2s; }
-        .typing-indicator span:nth-child(3) { animation-delay: 0.4s; }
-
-        @keyframes typing {
-            0%, 100% { transform: translateY(0); }
-            50% { transform: translateY(-5px); }
-        }
-    </style>
-</head>
-<body>
-    <div class="chat-container">
-        <!-- Header Section -->
-        <div class="chat-header">
-            <h2 id="model-name">Foundry Chat</h2>
-            <select id="model-selector" class="model-selector">
-                <option value="cloud">Cloud Model</option>
-            </select>
-        </div>
-
-        <!-- Status and Error Messages -->
-        <div id="status-bar" class="status-bar"></div>
-        <div id="error-message" class="error-message"></div>
-
-        <!-- Chat Messages Area -->
-        <div id="chat-messages" class="chat-messages"></div>
-
-        <!-- Input Section -->
-        <div class="chat-input">
-            <div class="input-container">
-                <textarea id="message-input" class="message-input" placeholder="Type your message..."></textarea>
-                <button id="send-button" class="send-button">Send</button>
-            </div>
-        </div>
-    </div>
-
-    <script>
-        // Initialize debug logging
-        console.log('Initial script starting...');
-        console.log('window.mainAPI status:', !!window.mainAPI);
-
-        // Main application initialization
-        document.addEventListener('DOMContentLoaded', () => {
-            console.log('DOM Content Loaded');
-            console.log('window.mainAPI status after DOM loaded:', !!window.mainAPI);
-
-            // Validate mainAPI availability
-            if (!window.mainAPI) {
-                console.error('mainAPI not available in window object');
-                console.error('Full window object:', window);
-                document.getElementById('error-message').textContent = 'Error: mainAPI not available. Please check the preload script.';
-                document.getElementById('error-message').style.display = 'block';
-                return;
-            }
-
-            // Initialize UI elements
-            const messageInput = document.getElementById('message-input');
-            const sendButton = document.getElementById('send-button');
-            const chatMessages = document.getElementById('chat-messages');
-            const statusBar = document.getElementById('status-bar');
-            const errorMessage = document.getElementById('error-message');
-            const modelName = document.getElementById('model-name');
-            const modelSelector = document.getElementById('model-selector');
-
-            // Log UI element initialization
-            console.log('UI elements initialized:', {
-                messageInput: !!messageInput,
-                sendButton: !!sendButton,
-                chatMessages: !!chatMessages,
-                statusBar: !!statusBar,
-                errorMessage: !!errorMessage,
-                modelName: !!modelName,
-                modelSelector: !!modelSelector
-            });
-
-            // Initialize chat state
-            let messages = [{ role: 'system', content: 'You are a helpful AI chat assistant' }];
-
-            // Model Management Functions
-            async function loadLocalModels() {
-                try {
-                    console.log('Loading local models...');
-                    const result = await window.mainAPI.getLocalModels();
-                    console.log('Local models loaded:', result);
-                    
-                    if (result.success) {
-                        const models = result.models;
-                        // Clear existing options except cloud
-                        while (modelSelector.options.length > 1) {
-                            modelSelector.remove(1);
-                        }
-                        // Add local models
-                        models.forEach(model => {
-                            const option = document.createElement('option');
-                            option.value = model.id;
-                            option.textContent = model.alias;
-                            modelSelector.appendChild(option);
-                        });
-                    } else {
-                        throw new Error(result.error || 'Failed to load local models');
-                    }
-                } catch (error) {
-                    console.error('Failed to load local models:', error);
-                    errorMessage.textContent = `Error loading local models: ${error.message}`;
-                    errorMessage.style.display = 'block';
-                }
-            }
-
-            // Chat Functions
-            function addMessage(text, sender) {
-                const messageDiv = document.createElement('div');
-                messageDiv.className = `message ${sender}`;
-                
-                const content = document.createElement('div');
-                content.className = 'message-content';
-                content.textContent = text;
-                
-                messageDiv.appendChild(content);
-                chatMessages.appendChild(messageDiv);
-                scrollToBottom();
-                return messageDiv;
-            }
-
-            function scrollToBottom() {
-                const lastMessage = chatMessages.lastElementChild;
-                if (lastMessage) {
-                    lastMessage.scrollIntoView({ behavior: 'smooth', block: 'end' });
-                }
-            }
-
-            async function sendMessage() {
-                const message = messageInput.value.trim();
-                if (!message) return;
-
-                addMessage(message, 'user');
-                messageInput.value = '';
-                sendButton.disabled = true;
-
-                const assistantMessage = addMessage('', 'assistant');
-                const messageContent = assistantMessage.querySelector('.message-content');
-                
-                messages.push({ role: 'user', content: message });
-                
-                try {
-                    let fullResponse = '';
-                    
-                    window.mainAPI.removeAllChatListeners();
-                    
-                    window.mainAPI.onChatChunk((chunk) => {
-                        fullResponse += chunk;
-                        messageContent.textContent = fullResponse;
-                        scrollToBottom();
-                    });
-
-                    window.mainAPI.onChatComplete(() => {
-                        messages.push({ role: 'assistant', content: fullResponse });
-                        sendButton.disabled = false;
-                        scrollToBottom();
-                    });
-
-                    await window.mainAPI.sendMessage(messages);
-
-                } catch (error) {
-                    console.error('Error sending message:', error);
-                    errorMessage.textContent = `Error: ${error.message}`;
-                    errorMessage.style.display = 'block';
-                    sendButton.disabled = false;
-                }
-            }
-
-            // Event Listeners
-            sendButton.addEventListener('click', sendMessage);
-            messageInput.addEventListener('keypress', (e) => {
-                if (e.key === 'Enter' && !e.shiftKey) {
-                    e.preventDefault();
-                    sendMessage();
-                }
-            });
-
-            modelSelector.addEventListener('change', async (e) => {
-                const selectedModel = e.target.value;
-                try {
-                    statusBar.textContent = `Loading model: ${selectedModel}...`;
-                    statusBar.style.display = 'block';
-                    
-                    messages = [{ role: 'system', content: 'You are a helpful AI chat assistant' }];
-                    chatMessages.innerHTML = '';
-                    
-                    messageInput.disabled = true;
-                    sendButton.disabled = true;
-
-                    const result = await window.mainAPI.switchModel(selectedModel);
-                    if (result.success) {
-                        statusBar.textContent = `Connected to: ${result.endpoint} - ${result.modelName}`;
-                        statusBar.style.display = 'block';
-                    } else {
-                        throw new Error(result.error);
-                    }
-                } catch (error) {
-                    console.error('Failed to switch model:', error);
-                    errorMessage.textContent = `Error switching model: ${error.message}`;
-                    errorMessage.style.display = 'block';
-                } finally {
-                    messageInput.disabled = false;
-                    sendButton.disabled = false;
-                }
-            });
-
-            // Initialize cloud model
-            window.mainAPI.onInitializeWithCloud(async () => {
-                try {
-                    const result = await window.mainAPI.switchModel('cloud');
-                    if (result.success) {
-                        statusBar.textContent = `Connected to: ${result.endpoint} - ${result.modelName}`;
-                        statusBar.style.display = 'block';
-                    } else {
-                        throw new Error(result.error);
-                    }
-                } catch (error) {
-                    console.error('Failed to initialize with cloud model:', error);
-                    errorMessage.textContent = `Error initializing cloud model: ${error.message}`;
-                    errorMessage.style.display = 'block';
-                }
-            });
-
-            // Initial setup
-            loadLocalModels();
-        });
-    </script>
-</body>
-</html>
\ No newline at end of file
diff --git a/samples/electron/foundry-chat/main.js b/samples/electron/foundry-chat/main.js
deleted file mode 100644
index 68c66aa9..00000000
--- a/samples/electron/foundry-chat/main.js
+++ /dev/null
@@ -1,158 +0,0 @@
-import { app, BrowserWindow, Menu, ipcMain } from 'electron'
-import { fileURLToPath } from 'url'
-import path from 'path'
-import OpenAI from 'openai'
-import { FoundryLocalManager } from 'foundry-local-sdk'
-
-
-// Global variables
-let mainWindow
-let aiClient = null
-let currentModelType = 'cloud' // Add this to track current model type, default to cloud
-let modelName = null
-let endpoint = null
-let apiKey = ""
-
-const cloudApiKey = process.env.YOUR_API_KEY // load cloude api key from environment variable
-const cloudEndpoint = process.env.YOUR_ENDPOINT // load cloud endpoint from environment variable
-const cloudModelName = process.env.YOUR_MODEL_NAME // load cloud model name from environment variable
-// Check if all required environment variables are set
-if (!cloudApiKey || !cloudEndpoint || !cloudModelName) {
-  console.error('Cloud API key, endpoint, or model name not set in environment variables, cloud mode will not work')
-  console.error('Please set YOUR_API_KEY, YOUR_ENDPOINT, and YOUR_MODEL_NAME')
-}
-
-// Create and initialize the FoundryLocalManager and start the service
-const foundryManager = new FoundryLocalManager()
-if (!foundryManager.isServiceRunning()) {
-    console.error('Foundry Local service is not running')
-    app.quit()
-}
-
-// Simplified IPC handlers
-ipcMain.handle('send-message', (_, messages) => {
-  return sendMessage(messages)
-})
-
-// Add new IPC handler for getting local models
-ipcMain.handle('get-local-models', async () => {
-  if (!foundryManager) {
-    return { success: false, error: 'Local manager not initialized' }
-  }
-  try {
-    const models = await foundryManager.listCachedModels()
-    return { success: true, models }
-  } catch (error) {
-    return { success: false, error: error.message }
-  }
-})
-
-// Add new IPC handler for switching models
-ipcMain.handle('switch-model', async (_, modelId) => {
-  try {
-    if (modelId === 'cloud') {
-      console.log("Switching to cloud model")
-      currentModelType = 'cloud'
-      endpoint = cloudEndpoint
-      apiKey = cloudApiKey
-      modelName = cloudModelName
-    } else {
-      console.log("Switching to local model")
-      currentModelType = 'local'
-      modelName = (await foundryManager.init(modelId)).id
-      endpoint = foundryManager.endpoint
-      apiKey = foundryManager.apiKey
-    }
-
-    aiClient = new OpenAI({
-      apiKey: apiKey,
-      baseURL: endpoint
-    })
-
-    return { 
-      success: true,
-      endpoint: endpoint,
-      modelName: modelName
-    }
-  } catch (error) {
-    return { success: false, error: error.message }
-  }
-})
-
-export async function sendMessage(messages) {
-  try {
-      if (!aiClient) {
-          throw new Error('Client not initialized')
-      }
-
-      const stream = await aiClient.chat.completions.create({
-        model: modelName,
-        messages: messages,
-        stream: true
-      })
-
-      for await (const chunk of stream) {
-        const content = chunk.choices[0]?.delta?.content
-        if (content) {
-          mainWindow.webContents.send('chat-chunk', content)
-        }
-      }
-      
-      mainWindow.webContents.send('chat-complete')
-      return { success: true }
-  } catch (error) {
-      return { success: false, error: error.message }
-  }
-} 
-
-// Window management
-async function createWindow() {
-  // Dynamically import the preload script
-  const __filename = fileURLToPath(import.meta.url)
-  const __dirname = path.dirname(__filename)
-  const preloadPath = path.join(__dirname, 'preload.cjs')
-  
-  mainWindow = new BrowserWindow({
-    width: 1024,
-    height: 768,
-    autoHideMenuBar: false,
-    webPreferences: {
-      allowRunningInsecureContent: true,
-      nodeIntegration: false,
-      contextIsolation: true,
-      preload: preloadPath,
-      enableRemoteModule: false,
-      sandbox: false
-    }
-  })
-
-  Menu.setApplicationMenu(null)
-
-  console.log("Creating chat window")
-  mainWindow.loadFile('chat.html')
- 
-  // Send initial config to renderer
-  mainWindow.webContents.on('did-finish-load', () => {
-    // Initialize with cloud model after page loads
-    mainWindow.webContents.send('initialize-with-cloud')
-  })
-
-  return mainWindow
-}
-
-// App lifecycle handlers
-app.whenReady().then(() => {
-  createWindow()
-
-  app.on('activate', () => {
-    if (BrowserWindow.getAllWindows().length === 0) {
-      createWindow()
-    }
-  })
-})
-
-app.on('window-all-closed', () => {
-  if (process.platform !== 'darwin') {
-    app.quit()
-  }
-})
diff --git a/samples/electron/foundry-chat/package.json b/samples/electron/foundry-chat/package.json
deleted file mode 100644
index 92720f0c..00000000
--- a/samples/electron/foundry-chat/package.json
+++ /dev/null
@@ -1,32 +0,0 @@
-{
-  "name": "foundry-local-chat-demo",
-  "version": "1.0.0",
-  "description": "A simple Electron Chat application that can chat with cloud and local models",
-  "main": "main.js",
-  "type": "module",
-  "scripts": {
-    "start": "electron .",
-    "build": "electron-builder",
-    "build:win": "electron-builder --win"
-  },
-  "author": "",
-  "license": "ISC",
-  "devDependencies": {
-    "electron": "^28.1.0",
-    "electron-builder": "^24.9.1"
-  },
-  "dependencies": {
-    "foundry-local-sdk": "^0.3.0",
-    "openai": "^4.98.0"
-  },
-  "build": {
-    "appId": "com.microsoft.foundrylocalchatdemo",
-    "productName": "Foundry Local - Chat Demo",
-    "directories": {
-      "output": "dist"
-    },
-    "win": {
-      "target": "nsis"
-    }
-  }
-}
diff --git a/samples/electron/foundry-chat/preload.cjs b/samples/electron/foundry-chat/preload.cjs
deleted file mode 100644
index 294c03e3..00000000
--- a/samples/electron/foundry-chat/preload.cjs
+++ /dev/null
@@ -1,38 +0,0 @@
-const { contextBridge, ipcRenderer } = require('electron');
-
-console.log('Preload script starting...');
-console.log('Current directory:', __dirname);
-console.log('Module paths:', module.paths);
-console.log('contextBridge available:', !!contextBridge);
-console.log('ipcRenderer available:', !!ipcRenderer);
-
-try {
-    console.log('Electron modules loaded');
-   
-    contextBridge.exposeInMainWorld('versions', {
-        node: () => process.versions.node,
-        chrome: () => process.versions.chrome,
-        electron: () => process.versions.electron
-    })
-
-    console.log('Versions bridge exposed');
-
-    contextBridge.exposeInMainWorld('mainAPI', {
-        sendMessage: (messages) => ipcRenderer.invoke('send-message', messages),
-        onChatChunk: (callback) => ipcRenderer.on('chat-chunk', (_, chunk) => callback(chunk)),
-        onChatComplete: (callback) => ipcRenderer.on('chat-complete', () => callback()),
-        removeAllChatListeners: () => {
-            ipcRenderer.removeAllListeners('chat-chunk');
-            ipcRenderer.removeAllListeners('chat-complete');
-        },
-        getLocalModels: () => ipcRenderer.invoke('get-local-models'),
-        switchModel: (modelId) => ipcRenderer.invoke('switch-model', modelId),
-        onInitializeWithCloud: (callback) => ipcRenderer.on('initialize-with-cloud', () => callback())
-    })
-
-    console.log('mainAPI bridge exposed');
-    console.log('Preload script completed successfully');
-} catch (error) {
-    console.error('Error in preload script:', error);
-    console.error('Error stack:', error.stack);
-}
\ No newline at end of file
diff --git a/samples/js/audio-transcription-example/README.md b/samples/js/audio-transcription-example/README.md
new file mode 100644
index 00000000..c26404ce
--- /dev/null
+++ b/samples/js/audio-transcription-example/README.md
@@ -0,0 +1,33 @@
+# Audio transcription example
+
+This sample demonstrates how to use the audio transcription capabilities of the Foundry Local SDK with a local model. It initializes the SDK, selects an audio transcription model, and sends an audio file for transcription.
+
+## Prerequisites
+- Ensure you have Node.js installed (version 20 or higher is recommended).
+
+## Setup project
+
+Navigate to the sample directory, setup the project, and install the Foundry Local SDK package.
+
+1. Navigate to the sample directory and setup the project:
+    ```bash
+    cd samples/js/audio-transcription-example
+    npm init -y
+    npm pkg set type=module
+    ```
+1. Install the Foundry Local package:
+    ```bash
+    npm install foundry-local-sdk
+    ```
+
+> [!NOTE]
+> On Windows, NPU models are not currently available for the JavaScript SDK. These will be enabled in a subsequent release.
+
+## Run the sample
+
+Run the sample script using Node.js:
+
+```bash
+cd samples/js/audio-transcription-example
+node app.js
+```
\ No newline at end of file
diff --git a/samples/js/audio-transcription-example/Recording.mp3 b/samples/js/audio-transcription-example/Recording.mp3
new file mode 100644
index 00000000..deb38418
Binary files /dev/null and b/samples/js/audio-transcription-example/Recording.mp3 differ
diff --git a/samples/js/audio-transcription-example/app.js b/samples/js/audio-transcription-example/app.js
new file mode 100644
index 00000000..fd4ae3df
--- /dev/null
+++ b/samples/js/audio-transcription-example/app.js
@@ -0,0 +1,42 @@
+import { FoundryLocalManager } from 'foundry-local-sdk';
+
+// Initialize the Foundry Local SDK
+console.log('Initializing Foundry Local SDK...');
+
+const manager = FoundryLocalManager.create({
+    appName: 'foundry_local_samples',
+    logLevel: 'info'
+});
+console.log('✓ SDK initialized successfully');
+
+// Get the model object
+const modelAlias = 'whisper-tiny'; // Using an available model from the list above
+let model = await manager.catalog.getModel(modelAlias);
+console.log(`Using model: ${model.id}`);
+
+// Download the model
+console.log(`\nDownloading model ${modelAlias}...`);
+model.download();
+console.log('✓ Model downloaded');
+
+// Load the model
+console.log(`\nLoading model ${modelAlias}...`);
+model.load();
+console.log('✓ Model loaded');
+
+// Create audio client
+console.log('\nCreating audio client...');
+const audioClient = model.createAudioClient();
+console.log('✓ Audio client created');
+
+// Example audio transcription
+console.log('\nTesting audio transcription...');
+const transcription = await audioClient.transcribe('./Recording.mp3');
+
+console.log('\nAudio transcription result:');
+console.log(transcription.text);
+
+// Unload the model
+console.log('Unloading model...');
+model.unload();
+console.log(`✓ Model unloaded`);
diff --git a/samples/js/electron-chat-application/README.md b/samples/js/electron-chat-application/README.md
new file mode 100644
index 00000000..9a2a9979
--- /dev/null
+++ b/samples/js/electron-chat-application/README.md
@@ -0,0 +1,240 @@
+# Foundry Local Chat - Electron Application
+
+A modern, full-featured chat application built with Electron and the Foundry Local SDK. Chat with AI models running entirely on your local machine with complete privacy.
+
+![Foundry Local Chat](https://img.shields.io/badge/Electron-34.1.0-47848F?logo=electron)
+![Node.js](https://img.shields.io/badge/Node.js-18+-339933?logo=node.js)
+
+## Features
+
+### Core Features
+- **🔒 100% Private** - All AI inference runs locally on your machine
+- **⚡ Low Latency** - Direct local inference with no network round trips
+- **📊 Performance Metrics** - Real-time tokens/second and time-to-first-token stats
+- **🎨 Modern UI** - Beautiful dark theme with smooth animations
+- **💬 Markdown Support** - Code blocks with syntax highlighting, headings, and lists
+- **📋 Copy Code** - One-click copy button on all code blocks
+
+### Model Management
+- **📦 Download Models** - Browse and download models from the catalog
+- **🔄 Load/Unload** - Easily switch between downloaded models
+- **🗑️ Delete Models** - Remove downloaded models to free up disk space
+- **🟢 Visual Status** - Green background for loaded model, green dot for downloaded
+
+### Voice Transcription
+- **🎤 Voice Input** - Record voice messages with the microphone button
+- **🗣️ Whisper Integration** - Uses OpenAI Whisper models for accurate transcription
+- **⚙️ Transcription Settings** - Choose from multiple Whisper model sizes
+- **🔊 Audio Processing** - Automatic conversion to 16kHz WAV for optimal quality
+
+### Context Tracking
+- **📏 Context Usage** - Visual progress bar showing how much context is used
+- **⚠️ Usage Warnings** - Bar changes color (green → yellow → red) as context fills
+
+## Screenshots
+
+Here is a screenshot of the chat interface with some annotations highlighting key features:
+
+![Chat Interface](./screenshots/electron-description-of-functions.png)
+
+*On the first use* of the microphone button, you will be prompted to download a Whisper model for transcription:
+
+![Whisper Transcription](./screenshots/electron-transcription.png)
+
+You can also change and/or delete the model for transcription using the *Voice settings* link just underneath the text input box.
+
+## Prerequisites
+
+- [Node.js](https://nodejs.org/) 18 or later
+
+## Installation
+
+To set up and run the Electron Chat Application, follow these steps:
+
+```bash
+# Navigate to the sample directory
+cd samples/js/electron-chat-application
+
+# Install dependencies
+npm install
+
+# Install Foundry Local SDK
+npm install foundry-local-sdk
+
+# Start the application
+npm start
+```
+
+> [!NOTE]
+> On Windows, only CPU and Generic GPU models are supported in the JavaScript API. Full NPU and discrete GPU support will be coming soon.
+
+## Usage
+
+### Basic Chat
+1. **Start the app** - Run `npm start` to launch the Electron application
+2. **Download a model** - Click "Download" on any available model
+3. **Load the model** - Click "Load" on a downloaded model (background turns green when loaded)
+4. **Start chatting** - Type your message and press Enter to send
+5. **View stats** - Each AI response shows TTFT and tokens/sec metrics
+
+### Voice Transcription
+1. **Click the microphone** - Opens Whisper model selection if first time
+2. **Download a Whisper model** - Choose a size (tiny is fastest, large is most accurate)
+3. **Record your voice** - Click mic to start, click stop when done
+4. **Auto-transcription** - Text appears in the input field automatically
+
+### Model Management
+- **Load**: Click "Load" button on any downloaded model
+- **Unload**: Click "Unload" on the currently loaded model
+- **Delete**: Click the trash icon to remove a downloaded model from cache
+
+## Project Structure
+
+```
+electron-chat-application/
+├── main.js              # Electron main process - SDK integration & IPC handlers
+├── preload.js           # Secure bridge between main and renderer
+├── index.html           # Main application UI
+├── styles.css           # Modern dark theme CSS
+├── renderer.js          # Chat UI logic, markdown rendering, voice recording
+├── foundry_local_color.svg  # Application logo
+├── package.json         # Dependencies and scripts
+└── README.md            # This file
+```
+
+## Architecture
+
+### Main Process (`main.js`)
+- Initializes Foundry Local SDK with HTTP web service
+- Handles model loading/unloading via IPC
+- Streams chat completions using Server-Sent Events (SSE)
+- Manages audio transcription with Whisper models
+
+### Preload Script (`preload.js`)
+- Exposes secure API to renderer via `contextBridge`
+- Handles IPC communication for all SDK operations
+
+### Renderer Process (`renderer.js`)
+- Manages chat UI and message display
+- Implements SimpleMarkdown parser for rich text
+- Handles voice recording and WAV conversion
+- Tracks context usage and updates UI
+
+## API Reference
+
+The renderer has access to the Foundry Local SDK via `window.foundryAPI`. This bridge is exposed via the preload script using Electron's `contextBridge`, allowing secure communication between the renderer and main process while maintaining `contextIsolation`. Each method invokes IPC handlers in the main process that call the underlying Foundry Local SDK to manage models and perform inference.
+
+### Available Methods
+
+| Method | Purpose | SDK Operation |
+|--------|---------|---------------|
+| `getModels()` | Fetches available AI models from the Foundry Local catalog | `manager.catalog.getModels()` |
+| `downloadModel(alias)` | Downloads a model to local cache | `model.download()` |
+| `loadModel(alias)` | Loads a model into memory for inference | `model.load()` |
+| `unloadModel()` | Unloads the currently loaded model | `model.unload()` |
+| `deleteModel(alias)` | Removes a model from local cache | `model.removeFromCache()` |
+| `chat(messages)` | Sends chat messages to the loaded model and returns response | HTTP streaming via SDK web service |
+| `getLoadedModel()` | Returns info about the currently loaded model | Returns cached model state |
+| `onChatChunk(callback)` | Subscribes to streaming chat response chunks (returns cleanup function) | IPC event listener |
+| `getWhisperModels()` | Lists available Whisper models for transcription | `manager.catalog.getModels()` (filtered) |
+| `downloadWhisperModel(alias)` | Downloads a Whisper model | `model.download()` |
+| `transcribeAudio(path, base64)` | Transcribes audio using Whisper | `audioClient.transcribe()` |
+
+### Usage Examples
+
+```javascript
+// Get all available models
+const models = await foundryAPI.getModels();
+
+// Download a model
+await foundryAPI.downloadModel('phi-4');
+
+// Load a model for chat
+await foundryAPI.loadModel('phi-4');
+
+// Unload the current model
+await foundryAPI.unloadModel();
+
+// Delete a model from cache
+await foundryAPI.deleteModel('phi-4');
+
+// Send chat messages (streaming)
+const response = await foundryAPI.chat([
+  { role: 'user', content: 'Hello!' }
+]);
+
+// Listen for streaming chunks
+foundryAPI.onChatChunk((data) => {
+  console.log(data.content, data.tokenCount);
+});
+
+// Get Whisper models for transcription
+const whisperModels = await foundryAPI.getWhisperModels();
+
+// Download a Whisper model
+await foundryAPI.downloadWhisperModel('whisper-small');
+
+// Transcribe audio (base64 WAV data)
+const text = await foundryAPI.transcribeAudio(base64WavData);
+```
+
+## Customization
+
+### Theming
+Edit CSS variables in `styles.css`:
+```css
+:root {
+  --accent-primary: #6366f1;    /* Primary accent color */
+  --accent-secondary: #818cf8;  /* Secondary accent */
+  --success: #10b981;           /* Success/loaded state */
+  --warning: #f59e0b;           /* Warning state */
+  --error: #ef4444;             /* Error state */
+  --bg-primary: #0f0f1a;        /* Main background */
+}
+```
+
+### Context Window
+Adjust the context limit in `renderer.js`:
+```javascript
+const CONTEXT_LIMIT = 8192; // Default context window size
+```
+
+### Sidebar Width
+The sidebar is resizable between 240-480px. Default is 320px, configured in CSS:
+```css
+.sidebar {
+  width: 320px;
+  min-width: 240px;
+  max-width: 480px;
+}
+```
+
+## Technical Notes
+
+### HTTP Streaming
+The app uses HTTP streaming via the SDK's built-in web service (port 47392) instead of native callbacks, which provides better compatibility with Electron's process model.
+
+### Audio Processing
+Voice recordings are converted to 16kHz mono 16-bit PCM WAV format before transcription, as required by Whisper models. The conversion uses Web Audio API's OfflineAudioContext for resampling.
+
+### Temporary Files
+Audio files are stored in the system temp directory (`os.tmpdir()`) and automatically cleaned up after transcription.
+
+## Troubleshooting
+
+**Slow performance?**
+- Try a smaller model variant (e.g., phi-4-mini instead of phi-4)
+
+**Transcription not working?**
+- Ensure you've downloaded a Whisper model first
+- Check microphone permissions in System Preferences
+- Verify audio is recording (mic icon changes to stop icon)
+
+**High context usage?**
+- Click "New Chat" to clear the conversation and reset context
+- The context bar shows usage: green (<70%), yellow (70-90%), red (>90%)
+
+## License
+
+MIT
+
diff --git a/samples/js/electron-chat-application/foundry_local_color.svg b/samples/js/electron-chat-application/foundry_local_color.svg
new file mode 100644
index 00000000..412a6fb7
--- /dev/null
+++ b/samples/js/electron-chat-application/foundry_local_color.svg
@@ -0,0 +1,40 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_1197_17983)">
+<rect width="256" height="256" fill="white"/>
+<path d="M154.903 33.0322H35.785C34.2618 33.0322 33.0323 34.2618 33.0323 35.7849V63.3118C33.0323 64.835 34.2618 66.0645 35.785 66.0645H181.677C186.238 66.0645 189.936 69.7623 189.936 74.3225V70.9C189.936 51.3101 175.319 33.0322 154.903 33.0322Z" fill="url(#paint0_linear_1197_17983)"/>
+<path d="M178.255 42.7031C185.733 50.1996 189.936 60.3112 189.936 70.8998V220.215C189.936 221.738 191.165 222.967 192.688 222.967H220.215C221.738 222.967 222.968 221.738 222.968 220.215V101.106C222.968 92.3433 219.49 83.9476 213.297 77.7449L178.255 42.7031Z" fill="url(#paint1_linear_1197_17983)"/>
+<path d="M113.613 74.3228H35.785C34.2618 74.3228 33.0323 75.5523 33.0323 77.0754V104.602C33.0323 106.125 34.2618 107.355 35.785 107.355H140.387C144.947 107.355 148.645 111.053 148.645 115.613V112.191C148.645 92.6006 134.028 74.3228 113.613 74.3228Z" fill="url(#paint2_linear_1197_17983)"/>
+<path d="M136.965 83.9937C144.443 91.4901 148.645 101.602 148.645 112.19V220.215C148.645 221.738 149.875 222.968 151.398 222.968H178.925C180.448 222.968 181.677 221.738 181.677 220.215V142.397C181.677 133.634 178.2 125.238 172.006 119.035L136.965 83.9937Z" fill="url(#paint3_linear_1197_17983)"/>
+<path d="M72.3223 115.613H35.785C34.2618 115.613 33.0323 116.842 33.0323 118.365V145.892C33.0323 147.416 34.2618 148.645 35.785 148.645H99.0968C103.657 148.645 107.355 152.343 107.355 156.903V153.481C107.355 133.891 92.7381 115.613 72.3223 115.613Z" fill="url(#paint4_linear_1197_17983)"/>
+<path d="M95.6743 125.284C103.152 132.781 107.355 142.892 107.355 153.481V220.215C107.355 221.738 108.584 222.968 110.108 222.968H137.634C139.158 222.968 140.387 221.738 140.387 220.215V183.687C140.387 174.924 136.91 166.529 130.716 160.326L95.6743 125.284Z" fill="url(#paint5_linear_1197_17983)"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_1197_17983" x1="189.936" y1="70.4672" x2="33.0323" y2="70.4672" gradientUnits="userSpaceOnUse">
+<stop stop-color="#2C08AC"/>
+<stop offset="0.8" stop-color="#4F42FD"/>
+</linearGradient>
+<linearGradient id="paint1_linear_1197_17983" x1="201.96" y1="42.7031" x2="311.288" y2="175.174" gradientUnits="userSpaceOnUse">
+<stop offset="0.3" stop-color="#7274FF"/>
+<stop offset="1" stop-color="#4F42FD"/>
+</linearGradient>
+<linearGradient id="paint2_linear_1197_17983" x1="148.645" y1="111.758" x2="33.0323" y2="111.758" gradientUnits="userSpaceOnUse">
+<stop stop-color="#2C08AC"/>
+<stop offset="0.8" stop-color="#4F42FD"/>
+</linearGradient>
+<linearGradient id="paint3_linear_1197_17983" x1="160.67" y1="83.9937" x2="238.429" y2="206.207" gradientUnits="userSpaceOnUse">
+<stop offset="0.3" stop-color="#7274FF"/>
+<stop offset="1" stop-color="#4F42FD"/>
+</linearGradient>
+<linearGradient id="paint4_linear_1197_17983" x1="107.355" y1="150.688" x2="33.0323" y2="150.688" gradientUnits="userSpaceOnUse">
+<stop stop-color="#2C08AC"/>
+<stop offset="0.8" stop-color="#4F42FD"/>
+</linearGradient>
+<linearGradient id="paint5_linear_1197_17983" x1="119.38" y1="125.284" x2="164.354" y2="225.849" gradientUnits="userSpaceOnUse">
+<stop offset="0.3" stop-color="#7274FF"/>
+<stop offset="1" stop-color="#4F42FD"/>
+</linearGradient>
+<clipPath id="clip0_1197_17983">
+<rect width="256" height="256" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/samples/js/electron-chat-application/index.html b/samples/js/electron-chat-application/index.html
new file mode 100644
index 00000000..5d6bd306
--- /dev/null
+++ b/samples/js/electron-chat-application/index.html
@@ -0,0 +1,174 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="Content-Security-Policy" content="default-src 'self'; style-src 'self' 'unsafe-inline'; script-src 'self'">
+  <title>Foundry Local Chat</title>
+  <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+  <div class="app-container">
+    <!-- Sidebar -->
+    <aside class="sidebar" id="sidebar">
+      <div class="sidebar-resize-handle" id="sidebarResizeHandle"></div>
+      <div class="sidebar-header">
+        <div class="logo">
+          <img src="foundry_local_color.svg" alt="Foundry Local" width="24" height="24">
+          <span>Foundry Local</span>
+        </div>
+        <button class="sidebar-toggle" id="sidebarToggle" aria-label="Toggle sidebar">
+          <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <path d="M15 18l-6-6 6-6"/>
+          </svg>
+        </button>
+      </div>
+      
+      <div class="sidebar-content">
+        <div class="section-header">
+          <h3>Models</h3>
+          <button class="refresh-btn" id="refreshModels" title="Refresh models">
+            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+              <path d="M23 4v6h-6M1 20v-6h6"/>
+              <path d="M3.51 9a9 9 0 0114.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0020.49 15"/>
+            </svg>
+          </button>
+        </div>
+        
+        <div class="model-list" id="modelList">
+          <div class="loading-spinner">
+            <div class="spinner"></div>
+            <span>Loading models...</span>
+          </div>
+        </div>
+      </div>
+    </aside>
+    
+    <!-- Main Chat Area -->
+    <main class="chat-area">
+      <div class="chat-header">
+        <button class="mobile-menu-btn" id="mobileMenuBtn" aria-label="Open menu">
+          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <line x1="3" y1="12" x2="21" y2="12"/>
+            <line x1="3" y1="6" x2="21" y2="6"/>
+            <line x1="3" y1="18" x2="21" y2="18"/>
+          </svg>
+        </button>
+        <div class="chat-title">
+          <h1>Chat</h1>
+          <span class="model-badge" id="modelBadge">Select a model to start</span>
+        </div>
+        <button class="new-chat-btn" id="newChatBtn" title="New chat">
+          <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <line x1="12" y1="5" x2="12" y2="19"/>
+            <line x1="5" y1="12" x2="19" y2="12"/>
+          </svg>
+        </button>
+      </div>
+      
+      <div class="chat-messages" id="chatMessages">
+        <div class="welcome-message">
+          <div class="welcome-icon">
+            <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+              <path d="M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2v10z"/>
+            </svg>
+          </div>
+          <h2>Welcome to Foundry Local Chat</h2>
+          <p>Select a model from the sidebar to start chatting with AI running locally on your machine.</p>
+          <div class="feature-highlights">
+            <div class="feature">
+              <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
+              </svg>
+              <span>100% Private</span>
+            </div>
+            <div class="feature">
+              <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <circle cx="12" cy="12" r="10"/>
+                <polyline points="12 6 12 12 16 14"/>
+              </svg>
+              <span>Low Latency</span>
+            </div>
+            <div class="feature">
+              <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <rect x="2" y="3" width="20" height="14" rx="2" ry="2"/>
+                <line x1="8" y1="21" x2="16" y2="21"/>
+                <line x1="12" y1="17" x2="12" y2="21"/>
+              </svg>
+              <span>Runs Locally</span>
+            </div>
+          </div>
+        </div>
+      </div>
+      
+      <div class="chat-input-container">
+        <form class="chat-input-form" id="chatForm">
+          <div class="input-wrapper">
+            <textarea 
+              id="messageInput" 
+              placeholder="Type your message..." 
+              rows="1"
+              disabled
+            ></textarea>
+            <button type="button" class="record-btn" id="recordBtn" title="Record voice">
+              <svg class="mic-icon" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                <path d="M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z"></path>
+                <path d="M19 10v2a7 7 0 0 1-14 0v-2"></path>
+                <line x1="12" y1="19" x2="12" y2="23"></line>
+                <line x1="8" y1="23" x2="16" y2="23"></line>
+              </svg>
+              <svg class="stop-icon" width="20" height="20" viewBox="0 0 24 24" fill="currentColor" stroke="none">
+                <rect x="6" y="6" width="12" height="12" rx="2"></rect>
+              </svg>
+            </button>
+            <button type="submit" class="send-btn" id="sendBtn" disabled title="Send message">
+              <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <line x1="22" y1="2" x2="11" y2="13"/>
+                <polygon points="22 2 15 22 11 13 2 9 22 2"/>
+              </svg>
+            </button>
+          </div>
+          <div class="input-hint">
+            Press <kbd>Enter</kbd> to send, <kbd>Shift+Enter</kbd> for new line
+            <span class="hint-separator">•</span>
+            <button type="button" class="transcription-settings-link" id="transcriptionSettingsBtn">Voice settings</button>
+          </div>
+          <div class="context-usage" id="contextUsage">
+            <span class="context-label-text">Context</span>
+            <div class="context-bar">
+              <div class="context-fill" id="contextFill"></div>
+            </div>
+            <span class="context-label" id="contextLabel">0%</span>
+          </div>
+        </form>
+      </div>
+    </main>
+  </div>
+  
+  <!-- Whisper Model Modal -->
+  <div class="modal-overlay" id="whisperModal">
+    <div class="modal">
+      <h3>Transcription Settings</h3>
+      <p>Select a Whisper model for voice transcription.</p>
+      <div class="current-whisper-model" id="currentWhisperModel">
+        <span class="label">Current model:</span>
+        <span class="model-name">None selected</span>
+      </div>
+      <div class="whisper-models" id="whisperModelList">
+        <div class="loading-spinner">
+          <div class="spinner"></div>
+          <span>Loading models...</span>
+        </div>
+      </div>
+      <div class="modal-actions">
+        <button class="modal-btn secondary" id="whisperModalCancel">Close</button>
+      </div>
+    </div>
+  </div>
+  
+  <!-- Toast Container -->
+  <div class="toast-container" id="toastContainer"></div>
+  
+  <script src="renderer.js"></script>
+</body>
+</html>
diff --git a/samples/js/electron-chat-application/main.js b/samples/js/electron-chat-application/main.js
new file mode 100644
index 00000000..6d2dd782
--- /dev/null
+++ b/samples/js/electron-chat-application/main.js
@@ -0,0 +1,359 @@
+const { app, BrowserWindow, ipcMain } = require('electron');
+const path = require('path');
+const fs = require('fs');
+const os = require('os');
+
+let mainWindow;
+
+function createWindow() {
+  mainWindow = new BrowserWindow({
+    width: 1200,
+    height: 800,
+    minWidth: 800,
+    minHeight: 600,
+    webPreferences: {
+      preload: path.join(__dirname, 'preload.js'),
+      contextIsolation: true,
+      nodeIntegration: false
+    },
+    titleBarStyle: 'hiddenInset',
+    backgroundColor: '#1a1a2e'
+  });
+
+  mainWindow.loadFile('index.html');
+  
+  // Open DevTools in development
+  if (process.argv.includes('--enable-logging')) {
+    mainWindow.webContents.openDevTools();
+  }
+}
+
+app.whenReady().then(createWindow);
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit();
+  }
+});
+
+app.on('activate', () => {
+  if (BrowserWindow.getAllWindows().length === 0) {
+    createWindow();
+  }
+});
+
+// SDK Management
+let manager = null;
+let currentModel = null;
+let chatClient = null;
+let webServiceStarted = false;
+const SERVICE_PORT = 47392;
+const SERVICE_URL = `http://127.0.0.1:${SERVICE_PORT}`;
+
+async function initializeSDK() {
+  if (manager) return manager;
+  
+  const { FoundryLocalManager } = await import('foundry-local-sdk');
+  manager = FoundryLocalManager.create({
+    appName: 'foundry_local_samples',
+    logLevel: 'info',
+    webServiceUrls: SERVICE_URL
+  });
+  
+  return manager;
+}
+
+function ensureWebServiceStarted() {
+  if (!webServiceStarted && manager) {
+    manager.startWebService();
+    webServiceStarted = true;
+  }
+}
+
+// IPC Handlers
+ipcMain.handle('get-models', async () => {
+  try {
+    console.log('get-models: initializing SDK...');
+    await initializeSDK();
+    
+    console.log('get-models: fetching models from catalog...');
+    const models = await manager.catalog.getModels();
+    console.log(`get-models: found ${models.length} models`);
+    
+    const cachedVariants = await manager.catalog.getCachedModels();
+    const cachedIds = new Set(cachedVariants.map(v => v.id));
+    console.log(`get-models: ${cachedVariants.length} cached models`);
+    
+    const result = models.map(m => ({
+      id: m.id,
+      alias: m.alias,
+      isCached: m.isCached,
+      variants: m.variants.map(v => ({
+        id: v.id,
+        alias: v.alias,
+        displayName: v.modelInfo.displayName || v.alias,
+        isCached: cachedIds.has(v.id),
+        fileSizeMb: v.modelInfo.fileSizeMb,
+        modelType: v.modelInfo.modelType,
+        publisher: v.modelInfo.publisher
+      }))
+    }));
+    
+    console.log('get-models: returning', result.length, 'models');
+    return result;
+  } catch (error) {
+    console.error('Error getting models:', error);
+    throw error;
+  }
+});
+
+ipcMain.handle('download-model', async (event, modelAlias) => {
+  try {
+    await initializeSDK();
+    const model = await manager.catalog.getModel(modelAlias);
+    if (!model) throw new Error(`Model ${modelAlias} not found`);
+    
+    model.download();
+    return { success: true };
+  } catch (error) {
+    console.error('Error downloading model:', error);
+    throw error;
+  }
+});
+
+ipcMain.handle('load-model', async (event, modelAlias) => {
+  try {
+    await initializeSDK();
+    
+    // Start web service for HTTP streaming (only once)
+    ensureWebServiceStarted();
+    
+    // Unload current model if any
+    if (currentModel) {
+      try {
+        await currentModel.unload();
+      } catch (e) {
+        // Ignore unload errors
+      }
+      chatClient = null;
+    }
+    
+    const model = await manager.catalog.getModel(modelAlias);
+    if (!model) throw new Error(`Model ${modelAlias} not found`);
+    
+    // Download if not cached
+    if (!model.isCached) {
+      model.download();
+    }
+    
+    await model.load();
+    
+    // Wait for model to be fully loaded before creating chat client
+    while (!(await model.isLoaded())) {
+      await new Promise(resolve => setTimeout(resolve, 100));
+    }
+    
+    currentModel = model;
+    chatClient = model.createChatClient();
+    
+    return { success: true, modelId: model.id };
+  } catch (error) {
+    console.error('Error loading model:', error);
+    throw error;
+  }
+});
+
+ipcMain.handle('unload-model', async () => {
+  try {
+    if (currentModel) {
+      await currentModel.unload();
+      currentModel = null;
+      chatClient = null;
+    }
+    return { success: true };
+  } catch (error) {
+    console.error('Error unloading model:', error);
+    throw error;
+  }
+});
+
+ipcMain.handle('delete-model', async (event, modelAlias) => {
+  try {
+    await initializeSDK();
+    const model = await manager.catalog.getModel(modelAlias);
+    if (!model) throw new Error(`Model ${modelAlias} not found`);
+    
+    // Unload if currently loaded
+    if (currentModel && currentModel.alias === modelAlias) {
+      await currentModel.unload();
+      currentModel = null;
+      chatClient = null;
+    }
+    
+    model.removeFromCache();
+    return { success: true };
+  } catch (error) {
+    console.error('Error deleting model:', error);
+    throw error;
+  }
+});
+
+ipcMain.handle('chat', async (event, messages) => {
+  if (!currentModel) throw new Error('No model loaded');
+  
+  const startTime = performance.now();
+  let firstTokenTime = null;
+  let tokenCount = 0;
+  let fullContent = '';
+  
+  // Use HTTP streaming to avoid koffi callback issues with Electron
+  const response = await fetch(`${SERVICE_URL}/v1/chat/completions`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({
+      model: currentModel.id,
+      messages,
+      stream: true
+    })
+  });
+  
+  if (!response.ok) {
+    throw new Error(`HTTP error: ${response.status}`);
+  }
+  
+  const reader = response.body.getReader();
+  const decoder = new TextDecoder();
+  
+  while (true) {
+    const { done, value } = await reader.read();
+    if (done) break;
+    
+    const chunk = decoder.decode(value, { stream: true });
+    const lines = chunk.split('\n').filter(line => line.startsWith('data: '));
+    
+    for (const line of lines) {
+      const data = line.slice(6); // Remove 'data: ' prefix
+      if (data === '[DONE]') continue;
+      
+      try {
+        const parsed = JSON.parse(data);
+        const content = parsed.choices?.[0]?.delta?.content;
+        if (content) {
+          if (firstTokenTime === null) {
+            firstTokenTime = performance.now();
+          }
+          tokenCount++;
+          fullContent += content;
+          
+          mainWindow.webContents.send('chat-chunk', {
+            content,
+            tokenCount,
+            timeToFirstToken: firstTokenTime ? (firstTokenTime - startTime) : null
+          });
+        }
+      } catch (e) {
+        // Skip invalid JSON chunks
+      }
+    }
+  }
+  
+  const endTime = performance.now();
+  const totalTime = endTime - startTime;
+  const tokensPerSecond = tokenCount > 0 ? (tokenCount / (totalTime / 1000)).toFixed(2) : 0;
+  
+  return {
+    content: fullContent,
+    stats: {
+      tokenCount,
+      timeToFirstToken: firstTokenTime ? Math.round(firstTokenTime - startTime) : 0,
+      totalTime: Math.round(totalTime),
+      tokensPerSecond: parseFloat(tokensPerSecond)
+    }
+  };
+});
+
+ipcMain.handle('get-loaded-model', async () => {
+  if (!currentModel) return null;
+  return {
+    id: currentModel.id,
+    alias: currentModel.alias
+  };
+});
+
+// Transcription handlers
+ipcMain.handle('get-whisper-models', async () => {
+  await initializeSDK();
+  const models = await manager.catalog.getModels();
+  return models
+    .filter(m => m.alias.toLowerCase().includes('whisper'))
+    .map(m => ({
+      alias: m.alias,
+      isCached: m.isCached,
+      fileSizeMb: m.variants[0]?.modelInfo?.fileSizeMb
+    }));
+});
+
+ipcMain.handle('download-whisper-model', async (event, modelAlias) => {
+  await initializeSDK();
+  const model = await manager.catalog.getModel(modelAlias);
+  if (!model) throw new Error(`Model ${modelAlias} not found`);
+  model.download();
+  return { success: true };
+});
+
+ipcMain.handle('transcribe-audio', async (event, audioFilePath, base64Data) => {
+  await initializeSDK();
+  ensureWebServiceStarted();
+  
+  // Use OS temp directory
+  const tempDir = os.tmpdir();
+  const tempFilePath = path.join(tempDir, `foundry_audio_${Date.now()}.wav`);
+  
+  // Write audio data to temp file
+  const audioBuffer = Buffer.from(base64Data, 'base64');
+  fs.writeFileSync(tempFilePath, audioBuffer);
+  
+  try {
+    // Find a cached whisper model
+    const models = await manager.catalog.getModels();
+    const whisperModels = models.filter(m => 
+      m.alias.toLowerCase().includes('whisper') && m.isCached
+    );
+    
+    if (whisperModels.length === 0) {
+      throw new Error('No whisper model downloaded');
+    }
+    
+    // Use the smallest cached whisper model
+    const selectedModel = whisperModels.sort((a, b) => {
+      const sizeA = a.variants[0]?.modelInfo?.fileSizeMb || 0;
+      const sizeB = b.variants[0]?.modelInfo?.fileSizeMb || 0;
+      return sizeA - sizeB;
+    })[0];
+    
+    // Load whisper model
+    const whisperModel = await manager.catalog.getModel(selectedModel.alias);
+    await whisperModel.load();
+    
+    // Wait for model to be loaded
+    while (!(await whisperModel.isLoaded())) {
+      await new Promise(resolve => setTimeout(resolve, 100));
+    }
+    
+    // Create audio client and transcribe
+    const audioClient = whisperModel.createAudioClient();
+    const result = await audioClient.transcribe(tempFilePath);
+    
+    // Unload whisper model
+    await whisperModel.unload();
+    
+    return result;
+  } finally {
+    // Clean up temp file
+    try {
+      fs.unlinkSync(tempFilePath);
+    } catch (e) {
+      // Ignore cleanup errors
+    }
+  }
+});
diff --git a/samples/js/electron-chat-application/package.json b/samples/js/electron-chat-application/package.json
new file mode 100644
index 00000000..29ccd2b7
--- /dev/null
+++ b/samples/js/electron-chat-application/package.json
@@ -0,0 +1,25 @@
+{
+  "name": "foundry-local-chat",
+  "version": "1.0.0",
+  "description": "A modern chat application using Foundry Local SDK",
+  "main": "main.js",
+  "scripts": {
+    "start": "electron .",
+    "dev": "electron . --enable-logging"
+  },
+  "keywords": [
+    "electron",
+    "chat",
+    "foundry-local",
+    "ai"
+  ],
+  "author": "",
+  "license": "MIT",
+  "devDependencies": {
+    "electron": "^34.5.8"
+  },
+  "dependencies": {
+    "highlight.js": "^11.11.1",
+    "marked": "^15.0.6"
+  }
+}
diff --git a/samples/js/electron-chat-application/preload.js b/samples/js/electron-chat-application/preload.js
new file mode 100644
index 00000000..7026b0b2
--- /dev/null
+++ b/samples/js/electron-chat-application/preload.js
@@ -0,0 +1,20 @@
+const { contextBridge, ipcRenderer } = require('electron');
+
+contextBridge.exposeInMainWorld('foundryAPI', {
+  getModels: () => ipcRenderer.invoke('get-models'),
+  downloadModel: (modelAlias) => ipcRenderer.invoke('download-model', modelAlias),
+  loadModel: (modelAlias) => ipcRenderer.invoke('load-model', modelAlias),
+  unloadModel: () => ipcRenderer.invoke('unload-model'),
+  deleteModel: (modelAlias) => ipcRenderer.invoke('delete-model', modelAlias),
+  chat: (messages) => ipcRenderer.invoke('chat', messages),
+  getLoadedModel: () => ipcRenderer.invoke('get-loaded-model'),
+  onChatChunk: (callback) => {
+    const handler = (event, data) => callback(data);
+    ipcRenderer.on('chat-chunk', handler);
+    return () => ipcRenderer.removeListener('chat-chunk', handler);
+  },
+  // Transcription
+  getWhisperModels: () => ipcRenderer.invoke('get-whisper-models'),
+  downloadWhisperModel: (modelAlias) => ipcRenderer.invoke('download-whisper-model', modelAlias),
+  transcribeAudio: (filePath, base64Data) => ipcRenderer.invoke('transcribe-audio', filePath, base64Data)
+});
diff --git a/samples/js/electron-chat-application/renderer.js b/samples/js/electron-chat-application/renderer.js
new file mode 100644
index 00000000..86b84039
--- /dev/null
+++ b/samples/js/electron-chat-application/renderer.js
@@ -0,0 +1,1066 @@
+// =====================================================
+// Foundry Local Chat - Renderer Process
+// =====================================================
+
+// Simple markdown parser with code block handling
+const SimpleMarkdown = {
+  parse(text) {
+    if (!text) return '';
+    
+    // Extract code blocks first to protect them from other processing
+    const codeBlocks = [];
+    let html = text.replace(/```(\w*)\n([\s\S]*?)```/g, (match, lang, code) => {
+      const placeholder = `__CODE_BLOCK_${codeBlocks.length}__`;
+      codeBlocks.push({ lang, code });
+      return placeholder;
+    });
+    
+    // Extract inline code
+    const inlineCodes = [];
+    html = html.replace(/`([^`]+)`/g, (match, code) => {
+      const placeholder = `__INLINE_CODE_${inlineCodes.length}__`;
+      inlineCodes.push(code);
+      return placeholder;
+    });
+    
+    // Now escape HTML on the remaining text
+    html = this.escapeHtml(html);
+    
+    // Headings (### before ## before #)
+    html = html.replace(/^### (.+)$/gm, '<h4>$1</h4>');
+    html = html.replace(/^## (.+)$/gm, '<h3>$1</h3>');
+    html = html.replace(/^# (.+)$/gm, '<h2>$1</h2>');
+    
+    // Unordered lists
+    html = html.replace(/^- (.+)$/gm, '<li>$1</li>');
+    html = html.replace(/(<li>.*<\/li>\n?)+/g, '<ul>$&</ul>');
+    
+    // Bold
+    html = html.replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>');
+    
+    // Italic
+    html = html.replace(/\*([^*]+)\*/g, '<em>$1</em>');
+    
+    // Links
+    html = html.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank">$1</a>');
+    
+    // Line breaks (but not inside block elements)
+    html = html.replace(/\n/g, '<br>');
+    
+    // Clean up extra <br> around block elements
+    html = html.replace(/<br>(<h[234]>)/g, '$1');
+    html = html.replace(/(<\/h[234]>)<br>/g, '$1');
+    html = html.replace(/<br>(<ul>)/g, '$1');
+    html = html.replace(/(<\/ul>)<br>/g, '$1');
+    
+    // Restore inline code
+    inlineCodes.forEach((code, i) => {
+      html = html.replace(`__INLINE_CODE_${i}__`, `<code>${this.escapeHtml(code)}</code>`);
+    });
+    
+    // Restore code blocks
+    codeBlocks.forEach((block, i) => {
+      const codeHtml = `<div class="code-block-wrapper">
+        <button class="code-copy-btn" data-copy="true" title="Copy code">
+          <span class="copy-icon">⧉</span>
+          <span class="check-icon">✓</span>
+        </button>
+        <pre><code class="language-${block.lang || 'plaintext'}">${this.escapeHtml(block.code.trim())}</code></pre>
+      </div>`;
+      html = html.replace(`__CODE_BLOCK_${i}__`, codeHtml);
+    });
+    
+    return html;
+  },
+  
+  escapeHtml(text) {
+    const div = document.createElement('div');
+    div.textContent = text;
+    return div.innerHTML;
+  }
+};
+
+// Copy code to clipboard - use event delegation
+document.addEventListener('click', async (e) => {
+  const button = e.target.closest('.code-copy-btn');
+  if (!button) return;
+  
+  const codeBlock = button.closest('.code-block-wrapper').querySelector('code');
+  const text = codeBlock.textContent;
+  
+  try {
+    await navigator.clipboard.writeText(text);
+    button.classList.add('copied');
+    setTimeout(() => button.classList.remove('copied'), 2000);
+  } catch (err) {
+    console.error('Failed to copy:', err);
+  }
+});
+
+// Estimate tokens from text (rough approximation: ~4 chars per token)
+function estimateTokens(text) {
+  return Math.ceil(text.length / 4);
+}
+
+// Calculate total context tokens from all messages
+function calculateContextTokens() {
+  return messages.reduce((total, msg) => total + estimateTokens(msg.content), 0);
+}
+
+// Update context usage display
+function updateContextUsage() {
+  contextTokens = calculateContextTokens();
+  const percentage = Math.min(100, Math.round((contextTokens / CONTEXT_LIMIT) * 100));
+  
+  contextFill.style.width = `${percentage}%`;
+  contextLabel.textContent = `${percentage}%`;
+  
+  // Update color based on usage
+  contextFill.classList.remove('warning', 'danger');
+  if (percentage >= 90) {
+    contextFill.classList.add('danger');
+  } else if (percentage >= 70) {
+    contextFill.classList.add('warning');
+  }
+  
+  // Update tooltip
+  contextUsage.title = `Context: ${contextTokens.toLocaleString()} / ${CONTEXT_LIMIT.toLocaleString()} tokens (~${percentage}%)`;
+}
+
+// State
+let messages = [];
+let currentModelAlias = null;
+let isGenerating = false;
+let contextTokens = 0;
+const CONTEXT_LIMIT = 8192; // Default context window, will update based on model
+
+// DOM Elements
+const sidebar = document.getElementById('sidebar');
+const sidebarToggle = document.getElementById('sidebarToggle');
+const mobileMenuBtn = document.getElementById('mobileMenuBtn');
+const modelList = document.getElementById('modelList');
+const refreshModels = document.getElementById('refreshModels');
+const modelBadge = document.getElementById('modelBadge');
+const chatMessages = document.getElementById('chatMessages');
+const chatForm = document.getElementById('chatForm');
+const messageInput = document.getElementById('messageInput');
+const sendBtn = document.getElementById('sendBtn');
+const newChatBtn = document.getElementById('newChatBtn');
+const toastContainer = document.getElementById('toastContainer');
+const recordBtn = document.getElementById('recordBtn');
+const transcriptionSettingsBtn = document.getElementById('transcriptionSettingsBtn');
+const whisperModal = document.getElementById('whisperModal');
+const whisperModelList = document.getElementById('whisperModelList');
+const whisperModalCancel = document.getElementById('whisperModalCancel');
+const currentWhisperModelEl = document.getElementById('currentWhisperModel');
+const contextFill = document.getElementById('contextFill');
+const contextLabel = document.getElementById('contextLabel');
+const contextUsage = document.getElementById('contextUsage');
+
+// Recording state
+let mediaRecorder = null;
+let audioChunks = [];
+let isRecording = false;
+let selectedWhisperModel = null;
+
+// Initialize
+document.addEventListener('DOMContentLoaded', async () => {
+  setupEventListeners();
+  setupSidebarResize();
+  setupRecordButton();
+  updateContextUsage();
+  await loadModels();
+  setupChatChunkListener();
+});
+
+function setupSidebarResize() {
+  const resizeHandle = document.getElementById('sidebarResizeHandle');
+  let isResizing = false;
+  
+  resizeHandle.addEventListener('mousedown', (e) => {
+    isResizing = true;
+    resizeHandle.classList.add('dragging');
+    document.body.style.cursor = 'col-resize';
+    document.body.style.userSelect = 'none';
+  });
+  
+  document.addEventListener('mousemove', (e) => {
+    if (!isResizing) return;
+    const newWidth = Math.min(Math.max(e.clientX, 240), 480);
+    sidebar.style.width = newWidth + 'px';
+  });
+  
+  document.addEventListener('mouseup', () => {
+    if (isResizing) {
+      isResizing = false;
+      resizeHandle.classList.remove('dragging');
+      document.body.style.cursor = '';
+      document.body.style.userSelect = '';
+    }
+  });
+}
+
+function setupRecordButton() {
+  recordBtn.addEventListener('click', handleRecordClick);
+  transcriptionSettingsBtn.addEventListener('click', openTranscriptionSettings);
+  whisperModalCancel.addEventListener('click', () => {
+    whisperModal.classList.remove('visible');
+  });
+}
+
+async function openTranscriptionSettings() {
+  const whisperModels = await window.foundryAPI.getWhisperModels();
+  showWhisperModal(whisperModels, true);
+}
+
+async function handleRecordClick() {
+  if (isRecording) {
+    // Stop recording
+    stopRecording();
+  } else {
+    // Check if whisper model is available
+    const whisperModels = await window.foundryAPI.getWhisperModels();
+    const cachedModels = whisperModels.filter(m => m.isCached);
+    
+    if (cachedModels.length === 0) {
+      // Show modal to download whisper model
+      showWhisperModal(whisperModels, false);
+    } else {
+      // Start recording
+      startRecording();
+    }
+  }
+}
+
+function showWhisperModal(models, isSettings = false) {
+  // Update current model display
+  const cachedModels = models.filter(m => m.isCached);
+  const modelNameEl = currentWhisperModelEl.querySelector('.model-name');
+  if (cachedModels.length > 0) {
+    const current = selectedWhisperModel || cachedModels.sort((a, b) => (a.fileSizeMb || 0) - (b.fileSizeMb || 0))[0].alias;
+    modelNameEl.textContent = current;
+  } else {
+    modelNameEl.textContent = 'None - download a model below';
+  }
+  
+  whisperModelList.innerHTML = '';
+  
+  models.forEach(model => {
+    const sizeStr = model.fileSizeMb ? `${(model.fileSizeMb / 1024).toFixed(1)} GB` : '';
+    const isSelected = selectedWhisperModel === model.alias;
+    const item = document.createElement('div');
+    item.className = 'whisper-model-item' + (isSelected ? ' selected' : '');
+    item.innerHTML = `
+      <div class="model-info">
+        <span class="model-name">${model.alias}</span>
+        <span class="model-size">${sizeStr}</span>
+      </div>
+      <div class="model-actions">
+        ${model.isCached 
+          ? `<button class="use-btn">${isSelected ? '✓ Selected' : 'Select'}</button>
+             <button class="delete-btn" title="Delete from cache">
+               <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                 <polyline points="3 6 5 6 21 6"></polyline>
+                 <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
+               </svg>
+             </button>`
+          : '<button class="download-btn">Download</button>'
+        }
+      </div>
+    `;
+    
+    if (model.isCached) {
+      const useBtn = item.querySelector('.use-btn');
+      useBtn.addEventListener('click', () => {
+        selectedWhisperModel = model.alias;
+        showToast(`Selected ${model.alias} for transcription`, 'success');
+        // Refresh modal to show selection
+        showWhisperModal(models, true);
+      });
+      
+      const deleteBtn = item.querySelector('.delete-btn');
+      deleteBtn.addEventListener('click', async () => {
+        if (confirm(`Delete ${model.alias} from cache?`)) {
+          try {
+            await window.foundryAPI.deleteModel(model.alias);
+            if (selectedWhisperModel === model.alias) {
+              selectedWhisperModel = null;
+            }
+            showToast(`Deleted ${model.alias}`, 'success');
+            const updatedModels = await window.foundryAPI.getWhisperModels();
+            showWhisperModal(updatedModels, true);
+          } catch (error) {
+            showToast('Delete failed: ' + error.message, 'error');
+          }
+        }
+      });
+    } else {
+      const downloadBtn = item.querySelector('.download-btn');
+      downloadBtn.addEventListener('click', async () => {
+        downloadBtn.textContent = 'Downloading...';
+        downloadBtn.disabled = true;
+        try {
+          await window.foundryAPI.downloadWhisperModel(model.alias);
+          showToast(`Downloaded ${model.alias}`, 'success');
+          selectedWhisperModel = model.alias;
+          const updatedModels = await window.foundryAPI.getWhisperModels();
+          showWhisperModal(updatedModels, true);
+        } catch (error) {
+          showToast('Download failed: ' + error.message, 'error');
+          downloadBtn.textContent = 'Download';
+          downloadBtn.disabled = false;
+        }
+      });
+    }
+    
+    whisperModelList.appendChild(item);
+  });
+  
+  whisperModal.classList.add('visible');
+}
+
+async function startRecording() {
+  try {
+    // Request 16kHz mono audio for Whisper compatibility
+    const stream = await navigator.mediaDevices.getUserMedia({ 
+      audio: {
+        sampleRate: 16000,
+        channelCount: 1,
+        echoCancellation: true,
+        noiseSuppression: true
+      } 
+    });
+    
+    mediaRecorder = new MediaRecorder(stream);
+    audioChunks = [];
+    
+    mediaRecorder.ondataavailable = (e) => {
+      audioChunks.push(e.data);
+    };
+    
+    mediaRecorder.onstop = async () => {
+      // Stop all tracks
+      stream.getTracks().forEach(track => track.stop());
+      
+      // Create audio blob
+      const audioBlob = new Blob(audioChunks, { type: mediaRecorder.mimeType });
+      await transcribeAudio(audioBlob);
+    };
+    
+    mediaRecorder.start();
+    isRecording = true;
+    recordBtn.classList.add('recording');
+    showToast('Recording... Click stop when done', 'warning');
+  } catch (error) {
+    console.error('Failed to start recording:', error);
+    showToast('Failed to access microphone', 'error');
+  }
+}
+
+function stopRecording() {
+  if (mediaRecorder && isRecording) {
+    mediaRecorder.stop();
+    isRecording = false;
+    recordBtn.classList.remove('recording');
+    recordBtn.classList.add('transcribing');
+  }
+}
+
+// Convert audio blob to 16kHz mono WAV format for Whisper
+async function convertToWav(audioBlob) {
+  const audioContext = new AudioContext();
+  try {
+    const arrayBuffer = await audioBlob.arrayBuffer();
+    const audioBuffer = await audioContext.decodeAudioData(arrayBuffer);
+    
+    // Resample to 16kHz mono
+    const targetSampleRate = 16000;
+    const offlineContext = new OfflineAudioContext(1, audioBuffer.duration * targetSampleRate, targetSampleRate);
+    
+    const source = offlineContext.createBufferSource();
+    source.buffer = audioBuffer;
+    source.connect(offlineContext.destination);
+    source.start(0);
+    
+    const resampledBuffer = await offlineContext.startRendering();
+    
+    // Convert to WAV
+    const wavBuffer = audioBufferToWav(resampledBuffer);
+    return new Blob([wavBuffer], { type: 'audio/wav' });
+  } finally {
+    await audioContext.close();
+  }
+}
+
+// Encode AudioBuffer to 16-bit PCM WAV format
+function audioBufferToWav(buffer) {
+  const numChannels = 1; // Force mono
+  const sampleRate = buffer.sampleRate;
+  const bitDepth = 16;
+  
+  const bytesPerSample = bitDepth / 8;
+  const blockAlign = numChannels * bytesPerSample;
+  
+  // Get mono channel (mix down if stereo)
+  let monoData;
+  if (buffer.numberOfChannels === 1) {
+    monoData = buffer.getChannelData(0);
+  } else {
+    // Mix stereo to mono
+    const left = buffer.getChannelData(0);
+    const right = buffer.getChannelData(1);
+    monoData = new Float32Array(left.length);
+    for (let i = 0; i < left.length; i++) {
+      monoData[i] = (left[i] + right[i]) / 2;
+    }
+  }
+  
+  const samples = monoData.length;
+  const dataSize = samples * blockAlign;
+  const bufferSize = 44 + dataSize;
+  
+  const arrayBuffer = new ArrayBuffer(bufferSize);
+  const view = new DataView(arrayBuffer);
+  
+  // RIFF header
+  writeString(view, 0, 'RIFF');
+  view.setUint32(4, 36 + dataSize, true);
+  writeString(view, 8, 'WAVE');
+  
+  // fmt chunk
+  writeString(view, 12, 'fmt ');
+  view.setUint32(16, 16, true); // chunk size
+  view.setUint16(20, 1, true);  // PCM format
+  view.setUint16(22, numChannels, true);
+  view.setUint32(24, sampleRate, true);
+  view.setUint32(28, sampleRate * blockAlign, true);
+  view.setUint16(32, blockAlign, true);
+  view.setUint16(34, bitDepth, true);
+  
+  // data chunk
+  writeString(view, 36, 'data');
+  view.setUint32(40, dataSize, true);
+  
+  // Write audio data as 16-bit PCM
+  let offset = 44;
+  for (let i = 0; i < samples; i++) {
+    const sample = Math.max(-1, Math.min(1, monoData[i]));
+    const intSample = sample < 0 ? sample * 0x8000 : sample * 0x7FFF;
+    view.setInt16(offset, intSample, true);
+    offset += 2;
+  }
+  
+  return arrayBuffer;
+}
+
+function writeString(view, offset, string) {
+  for (let i = 0; i < string.length; i++) {
+    view.setUint8(offset + i, string.charCodeAt(i));
+  }
+}
+
+async function transcribeAudio(audioBlob) {
+  try {
+    showToast('Converting audio...', 'warning');
+    
+    // Convert to 16kHz mono WAV format for Whisper compatibility
+    let wavBlob;
+    try {
+      wavBlob = await convertToWav(audioBlob);
+    } catch (e) {
+      console.error('WAV conversion failed:', e);
+      showToast('Audio conversion failed: ' + e.message, 'error');
+      recordBtn.classList.remove('transcribing');
+      return;
+    }
+    
+    showToast('Transcribing audio...', 'warning');
+    
+    // Convert blob to base64
+    const arrayBuffer = await wavBlob.arrayBuffer();
+    const uint8Array = new Uint8Array(arrayBuffer);
+    
+    // Use chunked base64 encoding for large arrays
+    let base64 = '';
+    const chunkSize = 32768;
+    for (let i = 0; i < uint8Array.length; i += chunkSize) {
+      const chunk = uint8Array.subarray(i, i + chunkSize);
+      base64 += String.fromCharCode.apply(null, chunk);
+    }
+    base64 = btoa(base64);
+    
+    const tempPath = `/tmp/foundry_audio_${Date.now()}.wav`;
+    
+    const result = await window.foundryAPI.transcribeAudio(tempPath, base64);
+    
+    // Insert transcribed text into input
+    const text = result.text || result.Text || '';
+    if (text) {
+      messageInput.value += text;
+      messageInput.dispatchEvent(new Event('input'));
+      showToast('Transcription complete', 'success');
+    } else {
+      showToast('No speech detected', 'warning');
+    }
+  } catch (error) {
+    console.error('Transcription failed:', error);
+    showToast('Transcription failed: ' + error.message, 'error');
+  } finally {
+    recordBtn.classList.remove('transcribing');
+  }
+}
+
+function setupEventListeners() {
+  // Sidebar toggle
+  sidebarToggle.addEventListener('click', () => {
+    sidebar.classList.toggle('collapsed');
+  });
+  
+  mobileMenuBtn.addEventListener('click', () => {
+    sidebar.classList.toggle('open');
+  });
+  
+  // Refresh models
+  refreshModels.addEventListener('click', async () => {
+    refreshModels.classList.add('spinning');
+    await loadModels();
+    refreshModels.classList.remove('spinning');
+  });
+  
+  // Chat form
+  chatForm.addEventListener('submit', handleSendMessage);
+  
+  // Textarea auto-resize
+  messageInput.addEventListener('input', () => {
+    messageInput.style.height = 'auto';
+    messageInput.style.height = Math.min(messageInput.scrollHeight, 150) + 'px';
+  });
+  
+  // Enter to send, Shift+Enter for new line
+  messageInput.addEventListener('keydown', (e) => {
+    if (e.key === 'Enter' && !e.shiftKey) {
+      e.preventDefault();
+      chatForm.dispatchEvent(new Event('submit'));
+    }
+  });
+  
+  // New chat
+  newChatBtn.addEventListener('click', clearChat);
+  
+  // Close sidebar on outside click (mobile)
+  document.addEventListener('click', (e) => {
+    if (window.innerWidth <= 768 && 
+        sidebar.classList.contains('open') &&
+        !sidebar.contains(e.target) &&
+        !mobileMenuBtn.contains(e.target)) {
+      sidebar.classList.remove('open');
+    }
+  });
+}
+
+function setupChatChunkListener() {
+  window.foundryAPI.onChatChunk((data) => {
+    if (data.content) {
+      appendToLastAssistantMessage(data.content);
+    }
+  });
+}
+
+// Model Management
+async function loadModels() {
+  modelList.innerHTML = `
+    <div class="loading-spinner">
+      <div class="spinner"></div>
+      <span>Loading models...</span>
+    </div>
+  `;
+  
+  try {
+    const models = await window.foundryAPI.getModels();
+    
+    if (!models || models.length === 0) {
+      modelList.innerHTML = `
+        <div class="loading-spinner">
+          <span>No models found</span>
+        </div>
+      `;
+      return;
+    }
+    
+    // Filter out whisper/audio models - only show chat models
+    const chatModels = models.filter(m => {
+      const alias = m.alias.toLowerCase();
+      // Exclude whisper and other audio models
+      if (alias.includes('whisper')) return false;
+      return true;
+    });
+    
+    const displayModels = chatModels;
+    
+    // Sort: cached first, then by name
+    displayModels.sort((a, b) => {
+      if (a.isCached && !b.isCached) return -1;
+      if (!a.isCached && b.isCached) return 1;
+      return a.alias.localeCompare(b.alias);
+    });
+    
+    // Group by cached status
+    const cachedModels = displayModels.filter(m => m.isCached);
+    const availableModels = displayModels.filter(m => !m.isCached);
+    
+    modelList.innerHTML = '';
+    
+    if (cachedModels.length > 0) {
+      const cachedGroup = document.createElement('div');
+      cachedGroup.className = 'model-group';
+      cachedGroup.innerHTML = `
+        <div class="model-group-header">
+          <div class="status-dot cached"></div>
+          <span>Downloaded</span>
+        </div>
+      `;
+      cachedModels.forEach(model => {
+        cachedGroup.appendChild(createModelItem(model));
+      });
+      modelList.appendChild(cachedGroup);
+    }
+    
+    if (availableModels.length > 0) {
+      const availableGroup = document.createElement('div');
+      availableGroup.className = 'model-group';
+      availableGroup.innerHTML = `
+        <div class="model-group-header">
+          <div class="status-dot"></div>
+          <span>Available</span>
+        </div>
+      `;
+      availableModels.forEach(model => {
+        availableGroup.appendChild(createModelItem(model));
+      });
+      modelList.appendChild(availableGroup);
+    }
+    
+    if (displayModels.length === 0) {
+      modelList.innerHTML = `
+        <div class="loading-spinner">
+          <span>No models available</span>
+        </div>
+      `;
+    }
+  } catch (error) {
+    console.error('Failed to load models:', error);
+    modelList.innerHTML = `
+      <div class="loading-spinner">
+        <span>Failed to load models</span>
+        <span style="font-size: 11px; color: var(--error);">${error.message || error}</span>
+      </div>
+    `;
+    showToast('Failed to load models: ' + error.message, 'error');
+  }
+}
+
+function createModelItem(model) {
+  const variant = model.variants[0];
+  const item = document.createElement('div');
+  item.className = 'model-item';
+  const isActive = model.alias === currentModelAlias;
+  if (isActive) {
+    item.classList.add('active');
+  }
+  
+  const sizeMb = variant?.fileSizeMb;
+  const sizeStr = sizeMb ? `${(sizeMb / 1024).toFixed(1)} GB` : '';
+  
+  let statusHtml;
+  if (isActive) {
+    statusHtml = `
+      <button class="unload-btn">Unload</button>
+    `;
+  } else if (model.isCached) {
+    statusHtml = `
+      <button class="delete-model-btn" title="Delete from cache">
+        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+          <polyline points="3 6 5 6 21 6"></polyline>
+          <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
+          <line x1="10" y1="11" x2="10" y2="17"></line>
+          <line x1="14" y1="11" x2="14" y2="17"></line>
+        </svg>
+      </button>
+      <button class="load-btn">Load</button>
+    `;
+  } else {
+    statusHtml = '<button class="download-btn">Download</button>';
+  }
+  
+  item.innerHTML = `
+    <div class="model-icon">
+      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+        <path d="M21 16V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l7-4A2 2 0 0021 16z"/>
+        <polyline points="3.27 6.96 12 12.01 20.73 6.96"/>
+        <line x1="12" y1="22.08" x2="12" y2="12"/>
+      </svg>
+    </div>
+    <div class="model-info">
+      <div class="model-name">${model.alias}</div>
+      <div class="model-size">${sizeStr}</div>
+    </div>
+    <div class="model-status">
+      ${statusHtml}
+    </div>
+  `;
+  
+  // Handle click events
+  if (isActive) {
+    const unloadBtn = item.querySelector('.unload-btn');
+    unloadBtn.addEventListener('click', async (e) => {
+      e.stopPropagation();
+      await unloadModel();
+    });
+  } else if (model.isCached) {
+    const loadBtn = item.querySelector('.load-btn');
+    loadBtn.addEventListener('click', async (e) => {
+      e.stopPropagation();
+      await loadModel(model.alias);
+    });
+    
+    const deleteBtn = item.querySelector('.delete-model-btn');
+    deleteBtn.addEventListener('click', async (e) => {
+      e.stopPropagation();
+      if (confirm(`Delete ${model.alias} from cache?`)) {
+        try {
+          await window.foundryAPI.deleteModel(model.alias);
+          showToast(`Deleted ${model.alias}`, 'success');
+          await loadModels();
+        } catch (error) {
+          showToast('Delete failed: ' + error.message, 'error');
+        }
+      }
+    });
+  } else {
+    const downloadBtn = item.querySelector('.download-btn');
+    downloadBtn.addEventListener('click', async (e) => {
+      e.stopPropagation();
+      await downloadModel(model.alias, item);
+    });
+  }
+  
+  return item;
+}
+
+async function downloadModel(alias, itemElement) {
+  const statusEl = itemElement.querySelector('.model-status');
+  statusEl.innerHTML = '<div class="status-indicator loading"></div>';
+  
+  try {
+    showToast(`Downloading ${alias}...`, 'warning');
+    await window.foundryAPI.downloadModel(alias);
+    showToast(`Downloaded ${alias}. Loading...`, 'success');
+    await loadModels();
+    // Auto-load the model after download
+    await loadModel(alias);
+  } catch (error) {
+    console.error('Download failed:', error);
+    showToast('Download failed: ' + error.message, 'error');
+    await loadModels();
+  }
+}
+
+async function loadModel(alias) {
+  if (isGenerating) {
+    showToast('Please wait for the current response to finish', 'warning');
+    return;
+  }
+  
+  // Update UI to show loading
+  const items = modelList.querySelectorAll('.model-item');
+  items.forEach(item => {
+    item.classList.remove('active');
+    const nameEl = item.querySelector('.model-name');
+    if (nameEl.textContent.includes(alias) || item.dataset.alias === alias) {
+      item.classList.add('loading');
+    }
+  });
+  
+  try {
+    showToast(`Loading ${alias}...`, 'warning');
+    await window.foundryAPI.loadModel(alias);
+    currentModelAlias = alias;
+    
+    // Update UI
+    updateCurrentModelDisplay(alias);
+    enableChat();
+    showToast(`Model ${alias} loaded`, 'success');
+    
+    // Refresh model list to update active state
+    await loadModels();
+  } catch (error) {
+    console.error('Failed to load model:', error);
+    showToast('Failed to load model: ' + error.message, 'error');
+    await loadModels();
+  }
+}
+
+async function unloadModel() {
+  if (isGenerating) {
+    showToast('Please wait for the current response to finish', 'warning');
+    return;
+  }
+  
+  try {
+    showToast('Unloading model...', 'warning');
+    await window.foundryAPI.unloadModel();
+    currentModelAlias = null;
+    
+    // Update UI
+    modelBadge.textContent = 'Select a model to start';
+    disableChat();
+    showToast('Model unloaded', 'success');
+    
+    // Refresh model list
+    await loadModels();
+  } catch (error) {
+    console.error('Failed to unload model:', error);
+    showToast('Failed to unload model: ' + error.message, 'error');
+  }
+}
+
+function updateCurrentModelDisplay(alias) {
+  modelBadge.textContent = alias;
+}
+
+function enableChat() {
+  messageInput.disabled = false;
+  sendBtn.disabled = false;
+  messageInput.placeholder = 'Type your message...';
+  messageInput.focus();
+}
+
+function disableChat() {
+  messageInput.disabled = true;
+  sendBtn.disabled = true;
+  messageInput.placeholder = 'Select a model to start chatting...';
+}
+
+// Chat Management
+async function handleSendMessage(e) {
+  e.preventDefault();
+  
+  const content = messageInput.value.trim();
+  if (!content || isGenerating || !currentModelAlias) return;
+  
+  // Clear welcome message if present
+  const welcomeMessage = chatMessages.querySelector('.welcome-message');
+  if (welcomeMessage) {
+    welcomeMessage.remove();
+  }
+  
+  // Add user message
+  messages.push({ role: 'user', content });
+  addMessageToChat('user', content);
+  updateContextUsage();
+  
+  // Clear input
+  messageInput.value = '';
+  messageInput.style.height = 'auto';
+  
+  // Disable send button
+  isGenerating = true;
+  sendBtn.disabled = true;
+  
+  // Add typing indicator
+  const typingEl = addTypingIndicator();
+  
+  try {
+    // Make API call
+    const result = await window.foundryAPI.chat(messages);
+    
+    // Remove typing indicator
+    typingEl.remove();
+    
+    // Add assistant message (content was already streamed, just add stats)
+    messages.push({ role: 'assistant', content: result.content });
+    updateLastAssistantMessageStats(result.stats);
+    updateContextUsage();
+    
+  } catch (error) {
+    console.error('Chat error:', error);
+    typingEl.remove();
+    showToast('Chat error: ' + error.message, 'error');
+  } finally {
+    isGenerating = false;
+    sendBtn.disabled = false;
+    messageInput.focus();
+  }
+}
+
+function addMessageToChat(role, content) {
+  const messageEl = document.createElement('div');
+  messageEl.className = `message ${role}`;
+  
+  const avatar = role === 'user' ? 'U' : 
+    `<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+      <path d="M21 16V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l7-4A2 2 0 0021 16z"/>
+    </svg>`;
+  
+  messageEl.innerHTML = `
+    <div class="message-avatar">${avatar}</div>
+    <div class="message-content">
+      <div class="message-bubble">${role === 'user' ? SimpleMarkdown.escapeHtml(content) : SimpleMarkdown.parse(content)}</div>
+      ${role === 'assistant' ? '<div class="message-stats"></div>' : ''}
+    </div>
+  `;
+  
+  chatMessages.appendChild(messageEl);
+  scrollToBottom();
+  
+  return messageEl;
+}
+
+function addTypingIndicator() {
+  const typingEl = document.createElement('div');
+  typingEl.className = 'message assistant';
+  typingEl.id = 'typing-indicator';
+  typingEl.innerHTML = `
+    <div class="message-avatar">
+      <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+        <path d="M21 16V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l7-4A2 2 0 0021 16z"/>
+      </svg>
+    </div>
+    <div class="message-content">
+      <div class="typing-indicator">
+        <span></span>
+        <span></span>
+        <span></span>
+      </div>
+    </div>
+  `;
+  chatMessages.appendChild(typingEl);
+  scrollToBottom();
+  return typingEl;
+}
+
+let currentAssistantMessage = null;
+let currentAssistantContent = '';
+
+function appendToLastAssistantMessage(content) {
+  // If there's a typing indicator, replace it with actual message
+  const typingIndicator = document.getElementById('typing-indicator');
+  if (typingIndicator) {
+    typingIndicator.remove();
+    currentAssistantMessage = addMessageToChat('assistant', '');
+    currentAssistantContent = '';
+  }
+  
+  if (!currentAssistantMessage) {
+    currentAssistantMessage = addMessageToChat('assistant', '');
+    currentAssistantContent = '';
+  }
+  
+  currentAssistantContent += content;
+  const bubble = currentAssistantMessage.querySelector('.message-bubble');
+  bubble.innerHTML = SimpleMarkdown.parse(currentAssistantContent);
+  scrollToBottom();
+}
+
+function updateLastAssistantMessageStats(stats) {
+  if (!currentAssistantMessage) return;
+  
+  const statsEl = currentAssistantMessage.querySelector('.message-stats');
+  if (statsEl && stats) {
+    statsEl.innerHTML = `
+      <div class="stat-item">
+        <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+          <circle cx="12" cy="12" r="10"/>
+          <polyline points="12 6 12 12 16 14"/>
+        </svg>
+        <span>TTFT: ${stats.timeToFirstToken}ms</span>
+      </div>
+      <div class="stat-item">
+        <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+          <polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"/>
+        </svg>
+        <span>${stats.tokensPerSecond} tok/s</span>
+      </div>
+      <div class="stat-item">
+        <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+          <path d="M22 11.08V12a10 10 0 11-5.93-9.14"/>
+          <polyline points="22 4 12 14.01 9 11.01"/>
+        </svg>
+        <span>${stats.tokenCount} tokens</span>
+      </div>
+    `;
+  }
+  
+  // Reset for next message
+  currentAssistantMessage = null;
+  currentAssistantContent = '';
+}
+
+function clearChat() {
+  messages = [];
+  currentAssistantMessage = null;
+  currentAssistantContent = '';
+  updateContextUsage();
+  
+  chatMessages.innerHTML = `
+    <div class="welcome-message">
+      <div class="welcome-icon">
+        <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+          <path d="M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2v10z"/>
+        </svg>
+      </div>
+      <h2>Welcome to Foundry Local Chat</h2>
+      <p>Select a model from the sidebar to start chatting with AI running locally on your machine.</p>
+      <div class="feature-highlights">
+        <div class="feature">
+          <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
+          </svg>
+          <span>100% Private</span>
+        </div>
+        <div class="feature">
+          <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <circle cx="12" cy="12" r="10"/>
+            <polyline points="12 6 12 12 16 14"/>
+          </svg>
+          <span>Low Latency</span>
+        </div>
+        <div class="feature">
+          <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <rect x="2" y="3" width="20" height="14" rx="2" ry="2"/>
+            <line x1="8" y1="21" x2="16" y2="21"/>
+            <line x1="12" y1="17" x2="12" y2="21"/>
+          </svg>
+          <span>Runs Locally</span>
+        </div>
+      </div>
+    </div>
+  `;
+}
+
+function scrollToBottom() {
+  chatMessages.scrollTop = chatMessages.scrollHeight;
+}
+
+// Toast Notifications
+function showToast(message, type = 'info') {
+  const toast = document.createElement('div');
+  toast.className = `toast ${type}`;
+  toast.innerHTML = `
+    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+      ${type === 'success' ? '<polyline points="20 6 9 17 4 12"/>' :
+        type === 'error' ? '<circle cx="12" cy="12" r="10"/><line x1="15" y1="9" x2="9" y2="15"/><line x1="9" y1="9" x2="15" y2="15"/>' :
+        type === 'warning' ? '<path d="M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/>' :
+        '<circle cx="12" cy="12" r="10"/><line x1="12" y1="16" x2="12" y2="12"/><line x1="12" y1="8" x2="12.01" y2="8"/>'
+      }
+    </svg>
+    <span>${message}</span>
+  `;
+  
+  toastContainer.appendChild(toast);
+  
+  setTimeout(() => {
+    toast.style.animation = 'slideIn 0.3s ease reverse';
+    setTimeout(() => toast.remove(), 300);
+  }, 3000);
+}
diff --git a/samples/js/electron-chat-application/screenshots/electron-description-of-functions.png b/samples/js/electron-chat-application/screenshots/electron-description-of-functions.png
new file mode 100644
index 00000000..ee46f8be
Binary files /dev/null and b/samples/js/electron-chat-application/screenshots/electron-description-of-functions.png differ
diff --git a/samples/js/electron-chat-application/screenshots/electron-transcription.png b/samples/js/electron-chat-application/screenshots/electron-transcription.png
new file mode 100644
index 00000000..32295ac1
Binary files /dev/null and b/samples/js/electron-chat-application/screenshots/electron-transcription.png differ
diff --git a/samples/js/electron-chat-application/styles.css b/samples/js/electron-chat-application/styles.css
new file mode 100644
index 00000000..1f0e2fc2
--- /dev/null
+++ b/samples/js/electron-chat-application/styles.css
@@ -0,0 +1,1348 @@
+/* =====================================================
+   Foundry Local Chat - Modern Chat Interface Styles
+   ===================================================== */
+
+:root {
+  /* Color Palette - Dark Theme */
+  --bg-primary: #0f0f1a;
+  --bg-secondary: #1a1a2e;
+  --bg-tertiary: #16213e;
+  --bg-hover: #1f2b4d;
+  --bg-active: #2a3a5f;
+  
+  --text-primary: #e8e8e8;
+  --text-secondary: #a0a0b0;
+  --text-muted: #6b6b80;
+  
+  --accent-primary: #6366f1;
+  --accent-secondary: #818cf8;
+  --accent-gradient: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
+  
+  --success: #22c55e;
+  --warning: #f59e0b;
+  --error: #ef4444;
+  
+  --border-color: #2a2a4a;
+  --border-subtle: rgba(255, 255, 255, 0.06);
+  
+  /* Sizing */
+  --sidebar-width: 320px;
+  --sidebar-min-width: 240px;
+  --sidebar-max-width: 480px;
+  --header-height: 60px;
+  --input-height: 56px;
+  
+  /* Spacing */
+  --space-xs: 4px;
+  --space-sm: 8px;
+  --space-md: 16px;
+  --space-lg: 24px;
+  --space-xl: 32px;
+  
+  /* Typography */
+  --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
+  --font-mono: 'SF Mono', 'Fira Code', 'Consolas', monospace;
+  
+  /* Transitions */
+  --transition-fast: 150ms ease;
+  --transition-normal: 250ms ease;
+  
+  /* Shadows */
+  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
+  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.3);
+  --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.4);
+  
+  /* Border Radius */
+  --radius-sm: 6px;
+  --radius-md: 10px;
+  --radius-lg: 16px;
+  --radius-full: 9999px;
+}
+
+/* =====================================================
+   Reset & Base Styles
+   ===================================================== */
+
+*, *::before, *::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+html, body {
+  height: 100%;
+  overflow: hidden;
+}
+
+body {
+  font-family: var(--font-family);
+  font-size: 14px;
+  line-height: 1.5;
+  color: var(--text-primary);
+  background: var(--bg-primary);
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+/* =====================================================
+   App Container
+   ===================================================== */
+
+.app-container {
+  display: flex;
+  height: 100vh;
+  width: 100vw;
+  overflow: hidden;
+}
+
+/* =====================================================
+   Sidebar
+   ===================================================== */
+
+.sidebar {
+  width: var(--sidebar-width);
+  min-width: var(--sidebar-min-width);
+  max-width: var(--sidebar-max-width);
+  height: 100%;
+  background: var(--bg-secondary);
+  border-right: 1px solid var(--border-color);
+  display: flex;
+  flex-direction: column;
+  transition: transform var(--transition-normal);
+  z-index: 100;
+  position: relative;
+}
+
+.sidebar-resize-handle {
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 4px;
+  height: 100%;
+  cursor: col-resize;
+  background: transparent;
+  transition: background var(--transition-fast);
+  z-index: 10;
+}
+
+.sidebar-resize-handle:hover,
+.sidebar-resize-handle.dragging {
+  background: var(--accent-primary);
+}
+
+.sidebar.collapsed {
+  width: 0;
+  min-width: 0;
+  transform: translateX(-100%);
+}
+
+.sidebar-header {
+  padding: var(--space-md);
+  padding-top: 40px; /* Account for macOS title bar */
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  border-bottom: 1px solid var(--border-color);
+  -webkit-app-region: drag;
+}
+
+.logo {
+  display: flex;
+  align-items: center;
+  gap: var(--space-sm);
+  font-weight: 600;
+  font-size: 16px;
+  color: var(--text-primary);
+}
+
+.logo svg {
+  color: var(--accent-primary);
+}
+
+.sidebar-toggle {
+  background: transparent;
+  border: none;
+  color: var(--text-secondary);
+  cursor: pointer;
+  padding: var(--space-xs);
+  border-radius: var(--radius-sm);
+  transition: all var(--transition-fast);
+  -webkit-app-region: no-drag;
+}
+
+.sidebar-toggle:hover {
+  background: var(--bg-hover);
+  color: var(--text-primary);
+}
+
+.sidebar-content {
+  flex: 1;
+  overflow-y: auto;
+  padding: var(--space-md);
+}
+
+.section-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: var(--space-md);
+}
+
+.section-header h3 {
+  font-size: 12px;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: var(--text-muted);
+}
+
+.refresh-btn {
+  background: transparent;
+  border: none;
+  color: var(--text-muted);
+  cursor: pointer;
+  padding: var(--space-xs);
+  border-radius: var(--radius-sm);
+  transition: all var(--transition-fast);
+}
+
+.refresh-btn:hover {
+  background: var(--bg-hover);
+  color: var(--text-primary);
+}
+
+.refresh-btn.spinning svg {
+  animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+  from { transform: rotate(0deg); }
+  to { transform: rotate(360deg); }
+}
+
+/* Model List */
+.model-list {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-sm);
+}
+
+.model-group {
+  margin-bottom: var(--space-md);
+}
+
+.model-group-header {
+  display: flex;
+  align-items: center;
+  gap: var(--space-sm);
+  padding: var(--space-xs) 0;
+  margin-bottom: var(--space-xs);
+}
+
+.model-group-header .status-dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: var(--text-muted);
+}
+
+.model-group-header .status-dot.cached {
+  background: var(--success);
+}
+
+.model-group-header .status-dot.loaded {
+  background: var(--success);
+}
+
+.model-group-header span {
+  font-size: 11px;
+  font-weight: 500;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: var(--text-muted);
+}
+
+.model-item {
+  display: flex;
+  align-items: center;
+  padding: var(--space-sm) var(--space-md);
+  background: var(--bg-tertiary);
+  border: 1px solid var(--border-subtle);
+  border-radius: var(--radius-md);
+  cursor: pointer;
+  transition: all var(--transition-fast);
+  gap: var(--space-sm);
+}
+
+.model-item:hover {
+  background: var(--bg-hover);
+  border-color: var(--border-color);
+}
+
+.model-item.active {
+  background: rgba(16, 185, 129, 0.15);
+  border-color: var(--success);
+}
+
+.model-item.active .model-name,
+.model-item.active .model-size {
+  color: var(--text-primary);
+}
+
+.model-item.loading {
+  pointer-events: none;
+  opacity: 0.7;
+}
+
+.model-icon {
+  width: 32px;
+  height: 32px;
+  border-radius: var(--radius-sm);
+  background: var(--bg-primary);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+
+.model-icon svg {
+  width: 18px;
+  height: 18px;
+  color: var(--accent-secondary);
+}
+
+.model-info {
+  flex: 1;
+  min-width: 0;
+}
+
+.model-name {
+  font-weight: 500;
+  font-size: 13px;
+  color: var(--text-primary);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.model-size {
+  font-size: 11px;
+  color: var(--text-muted);
+}
+
+.model-status {
+  display: flex;
+  align-items: center;
+  gap: var(--space-xs);
+}
+
+.status-indicator {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: var(--text-muted);
+}
+
+.status-indicator.cached {
+  background: var(--warning);
+}
+
+.status-indicator.loaded {
+  background: var(--success);
+}
+
+.status-indicator.loading {
+  background: var(--warning);
+  animation: pulse 1.5s ease-in-out infinite;
+}
+
+@keyframes pulse {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.5; }
+}
+
+.download-btn,
+.load-btn {
+  padding: var(--space-xs) var(--space-sm);
+  font-size: 11px;
+  font-weight: 500;
+  background: var(--accent-primary);
+  color: white;
+  border: none;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  transition: all var(--transition-fast);
+}
+
+.download-btn:hover,
+.load-btn:hover {
+  background: var(--accent-secondary);
+}
+
+.unload-btn {
+  padding: var(--space-xs) var(--space-sm);
+  font-size: 11px;
+  font-weight: 500;
+  background: rgba(239, 68, 68, 0.15);
+  color: var(--error);
+  border: none;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  transition: all var(--transition-fast);
+}
+
+.unload-btn:hover {
+  background: var(--error);
+  color: white;
+}
+
+.delete-model-btn {
+  width: 24px;
+  height: 24px;
+  font-size: 12px;
+  background: transparent;
+  color: var(--text-muted);
+  border: none;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  transition: all var(--transition-fast);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0;
+}
+
+.model-item:hover .delete-model-btn {
+  opacity: 1;
+}
+
+.delete-model-btn:hover {
+  color: var(--error);
+}
+
+/* Loading Spinner */
+.loading-spinner {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: var(--space-xl);
+  gap: var(--space-md);
+  color: var(--text-muted);
+}
+
+.spinner {
+  width: 24px;
+  height: 24px;
+  border: 2px solid var(--border-color);
+  border-top-color: var(--accent-primary);
+  border-radius: 50%;
+  animation: spin 0.8s linear infinite;
+}
+
+/* =====================================================
+   Chat Area
+   ===================================================== */
+
+.chat-area {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  background: var(--bg-primary);
+}
+
+.chat-header {
+  height: var(--header-height);
+  padding: 0 var(--space-lg);
+  padding-top: 20px; /* Account for macOS title bar */
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  border-bottom: 1px solid var(--border-color);
+  background: var(--bg-secondary);
+  -webkit-app-region: drag;
+}
+
+.mobile-menu-btn {
+  display: none;
+  background: transparent;
+  border: none;
+  color: var(--text-secondary);
+  cursor: pointer;
+  padding: var(--space-xs);
+  border-radius: var(--radius-sm);
+  -webkit-app-region: no-drag;
+}
+
+.chat-title {
+  display: flex;
+  align-items: center;
+  gap: var(--space-md);
+}
+
+.chat-title h1 {
+  font-size: 18px;
+  font-weight: 600;
+}
+
+.model-badge {
+  font-size: 12px;
+  padding: var(--space-xs) var(--space-sm);
+  background: var(--bg-tertiary);
+  border-radius: var(--radius-full);
+  color: var(--text-secondary);
+}
+
+.new-chat-btn {
+  background: transparent;
+  border: none;
+  color: var(--text-secondary);
+  cursor: pointer;
+  padding: var(--space-sm);
+  border-radius: var(--radius-sm);
+  transition: all var(--transition-fast);
+  -webkit-app-region: no-drag;
+}
+
+.new-chat-btn:hover {
+  background: var(--bg-hover);
+  color: var(--text-primary);
+}
+
+/* Chat Messages */
+.chat-messages {
+  flex: 1;
+  overflow-y: auto;
+  padding: var(--space-lg);
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-lg);
+}
+
+/* Welcome Message */
+.welcome-message {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  padding: var(--space-xl);
+  margin: auto;
+  max-width: 500px;
+}
+
+.welcome-icon {
+  width: 80px;
+  height: 80px;
+  background: var(--accent-gradient);
+  border-radius: var(--radius-lg);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: var(--space-lg);
+  color: white;
+}
+
+.welcome-message h2 {
+  font-size: 24px;
+  font-weight: 600;
+  margin-bottom: var(--space-sm);
+}
+
+.welcome-message p {
+  color: var(--text-secondary);
+  margin-bottom: var(--space-lg);
+}
+
+.feature-highlights {
+  display: flex;
+  gap: var(--space-lg);
+  flex-wrap: wrap;
+  justify-content: center;
+}
+
+.feature {
+  display: flex;
+  align-items: center;
+  gap: var(--space-sm);
+  color: var(--text-secondary);
+  font-size: 13px;
+}
+
+.feature svg {
+  color: var(--accent-secondary);
+}
+
+/* Message Bubbles */
+.message {
+  display: flex;
+  gap: var(--space-md);
+  max-width: 85%;
+  animation: fadeIn 0.3s ease;
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.message.user {
+  margin-left: auto;
+  flex-direction: row-reverse;
+}
+
+.message-avatar {
+  width: 36px;
+  height: 36px;
+  border-radius: var(--radius-md);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  font-weight: 600;
+  font-size: 14px;
+}
+
+.message.user .message-avatar {
+  background: var(--accent-gradient);
+  color: white;
+}
+
+.message.assistant .message-avatar {
+  background: var(--bg-tertiary);
+  color: var(--accent-secondary);
+}
+
+.message-content {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-xs);
+}
+
+.message-bubble {
+  padding: var(--space-md);
+  border-radius: var(--radius-lg);
+  line-height: 1.6;
+}
+
+.message.user .message-bubble {
+  background: var(--accent-gradient);
+  color: white;
+  border-bottom-right-radius: var(--radius-sm);
+}
+
+.message.assistant .message-bubble {
+  background: var(--bg-secondary);
+  border: 1px solid var(--border-color);
+  border-bottom-left-radius: var(--radius-sm);
+}
+
+/* Message Stats */
+.message-stats {
+  display: flex;
+  gap: var(--space-md);
+  font-size: 11px;
+  color: var(--text-muted);
+  padding: 0 var(--space-sm);
+}
+
+.stat-item {
+  display: flex;
+  align-items: center;
+  gap: var(--space-xs);
+}
+
+/* Code Blocks */
+.message-bubble pre {
+  margin: var(--space-sm) 0;
+  padding: var(--space-md);
+  background: var(--bg-primary);
+  border-radius: var(--radius-md);
+  overflow-x: auto;
+  position: relative;
+}
+
+.message-bubble code {
+  font-family: var(--font-mono);
+  font-size: 13px;
+}
+
+.message-bubble pre code {
+  display: block;
+}
+
+.message-bubble :not(pre) > code {
+  background: var(--bg-tertiary);
+  padding: 2px 6px;
+  border-radius: var(--radius-sm);
+}
+
+.code-block-wrapper {
+  position: relative;
+  margin: var(--space-sm) 0;
+}
+
+.code-block-wrapper pre {
+  margin: 0;
+  border-radius: var(--radius-md);
+}
+
+.code-copy-btn {
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  width: 28px;
+  height: 28px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: rgba(30, 30, 50, 0.9);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-sm);
+  color: var(--text-secondary);
+  cursor: pointer;
+  opacity: 0;
+  transition: all var(--transition-fast);
+  font-size: 14px;
+  line-height: 1;
+}
+
+.code-block-wrapper:hover .code-copy-btn {
+  opacity: 1;
+}
+
+.code-copy-btn:hover {
+  background: var(--bg-hover);
+  color: var(--text-primary);
+  border-color: var(--text-muted);
+}
+
+.code-copy-btn .copy-icon {
+  display: inline;
+}
+
+.code-copy-btn .check-icon {
+  display: none;
+}
+
+.code-copy-btn.copied {
+  border-color: var(--success);
+  background: rgba(34, 197, 94, 0.2);
+  color: var(--success);
+}
+
+.code-copy-btn.copied .copy-icon {
+  display: none;
+}
+
+.code-copy-btn.copied .check-icon {
+  display: inline;
+}
+
+/* Headings in messages */
+.message-bubble h2 {
+  font-size: 1.3em;
+  font-weight: 600;
+  margin: var(--space-md) 0 var(--space-sm) 0;
+  color: var(--text-primary);
+}
+
+.message-bubble h3 {
+  font-size: 1.15em;
+  font-weight: 600;
+  margin: var(--space-md) 0 var(--space-sm) 0;
+  color: var(--text-primary);
+}
+
+.message-bubble h4 {
+  font-size: 1.05em;
+  font-weight: 600;
+  margin: var(--space-sm) 0 var(--space-xs) 0;
+  color: var(--text-primary);
+}
+
+.message-bubble h2:first-child,
+.message-bubble h3:first-child,
+.message-bubble h4:first-child {
+  margin-top: 0;
+}
+
+/* Lists in messages */
+.message-bubble ul {
+  margin: var(--space-sm) 0;
+  padding-left: var(--space-lg);
+}
+
+.message-bubble li {
+  margin: var(--space-xs) 0;
+}
+
+/* Typing Indicator */
+.typing-indicator {
+  display: flex;
+  gap: 4px;
+  padding: var(--space-md);
+  background: var(--bg-secondary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-lg);
+  border-bottom-left-radius: var(--radius-sm);
+  width: fit-content;
+}
+
+.typing-indicator span {
+  width: 8px;
+  height: 8px;
+  background: var(--text-muted);
+  border-radius: 50%;
+  animation: typing 1.4s ease-in-out infinite;
+}
+
+.typing-indicator span:nth-child(2) {
+  animation-delay: 0.2s;
+}
+
+.typing-indicator span:nth-child(3) {
+  animation-delay: 0.4s;
+}
+
+@keyframes typing {
+  0%, 100% { transform: translateY(0); opacity: 0.5; }
+  50% { transform: translateY(-4px); opacity: 1; }
+}
+
+/* =====================================================
+   Chat Input
+   ===================================================== */
+
+.chat-input-container {
+  padding: var(--space-md) var(--space-lg) var(--space-lg);
+  background: var(--bg-primary);
+}
+
+.chat-input-form {
+  max-width: 900px;
+  margin: 0 auto;
+}
+
+.input-wrapper {
+  display: flex;
+  align-items: flex-end;
+  gap: var(--space-sm);
+  padding: var(--space-sm);
+  background: var(--bg-secondary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-lg);
+  transition: all var(--transition-fast);
+}
+
+.input-wrapper:focus-within {
+  border-color: var(--accent-primary);
+  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
+}
+
+.input-wrapper textarea {
+  flex: 1;
+  background: transparent;
+  border: none;
+  outline: none;
+  color: var(--text-primary);
+  font-family: inherit;
+  font-size: 14px;
+  line-height: 1.5;
+  resize: none;
+  max-height: 150px;
+  padding: var(--space-sm);
+}
+
+.input-wrapper textarea::placeholder {
+  color: var(--text-muted);
+}
+
+.input-wrapper textarea:disabled {
+  cursor: not-allowed;
+}
+
+.send-btn {
+  width: 40px;
+  height: 40px;
+  background: var(--accent-gradient);
+  border: none;
+  border-radius: var(--radius-md);
+  color: white;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all var(--transition-fast);
+  flex-shrink: 0;
+}
+
+.send-btn:hover:not(:disabled) {
+  transform: scale(1.05);
+}
+
+.send-btn:active:not(:disabled) {
+  transform: scale(0.95);
+}
+
+.send-btn:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+/* Record Button */
+.record-btn {
+  width: 40px;
+  height: 40px;
+  background: var(--bg-tertiary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all var(--transition-fast);
+  flex-shrink: 0;
+  color: var(--text-secondary);
+}
+
+.record-btn:hover {
+  background: var(--bg-hover);
+  border-color: var(--text-muted);
+  color: var(--text-primary);
+}
+
+.record-btn .stop-icon {
+  display: none;
+}
+
+.record-btn.recording {
+  background: var(--error);
+  border-color: var(--error);
+  color: white;
+  animation: pulse-recording 1.5s ease-in-out infinite;
+}
+
+.record-btn.recording .mic-icon {
+  display: none;
+}
+
+.record-btn.recording .stop-icon {
+  display: block;
+}
+
+@keyframes pulse-recording {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.7; }
+}
+
+.record-btn.transcribing {
+  pointer-events: none;
+  opacity: 0.7;
+}
+
+.input-hint {
+  text-align: center;
+  font-size: 11px;
+  color: var(--text-muted);
+  margin-top: var(--space-sm);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--space-xs);
+}
+
+.hint-separator {
+  opacity: 0.5;
+}
+
+.transcription-settings-link {
+  background: none;
+  border: none;
+  color: var(--text-muted);
+  font-size: 11px;
+  cursor: pointer;
+  padding: 0;
+  transition: color var(--transition-fast);
+}
+
+.transcription-settings-link:hover {
+  color: var(--accent-secondary);
+  text-decoration: underline;
+}
+
+/* Context Usage Indicator */
+.context-usage {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--space-sm);
+  margin-top: var(--space-xs);
+}
+
+.context-label-text {
+  font-size: 11px;
+  color: var(--text-muted);
+}
+
+.context-bar {
+  width: 100px;
+  height: 4px;
+  background: var(--bg-tertiary);
+  border-radius: var(--radius-full);
+  overflow: hidden;
+}
+
+.context-fill {
+  height: 100%;
+  width: 0%;
+  background: var(--success);
+  border-radius: var(--radius-full);
+  transition: width 0.3s ease, background 0.3s ease;
+}
+
+.context-fill.warning {
+  background: var(--warning);
+}
+
+.context-fill.danger {
+  background: var(--error);
+}
+
+.context-label {
+  font-size: 11px;
+  color: var(--text-muted);
+  min-width: 28px;
+}
+
+.input-hint kbd {
+  padding: 2px 6px;
+  background: var(--bg-secondary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-sm);
+  font-family: var(--font-mono);
+  font-size: 10px;
+}
+
+/* =====================================================
+   Toast Notifications
+   ===================================================== */
+
+.toast-container {
+  position: fixed;
+  top: var(--space-lg);
+  right: var(--space-lg);
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-sm);
+  z-index: 1000;
+}
+
+.toast {
+  padding: var(--space-md) var(--space-lg);
+  background: var(--bg-secondary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  box-shadow: var(--shadow-lg);
+  display: flex;
+  align-items: center;
+  gap: var(--space-sm);
+  animation: slideIn 0.3s ease;
+  max-width: 350px;
+}
+
+@keyframes slideIn {
+  from {
+    opacity: 0;
+    transform: translateX(100%);
+  }
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+.toast.success {
+  border-left: 3px solid var(--success);
+}
+
+.toast.error {
+  border-left: 3px solid var(--error);
+}
+
+.toast.warning {
+  border-left: 3px solid var(--warning);
+}
+
+/* =====================================================
+   Scrollbar
+   ===================================================== */
+
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+::-webkit-scrollbar-thumb {
+  background: var(--border-color);
+  border-radius: var(--radius-full);
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background: var(--text-muted);
+}
+
+/* =====================================================
+   Responsive
+   ===================================================== */
+
+@media (max-width: 768px) {
+  .sidebar {
+    position: fixed;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    transform: translateX(-100%);
+    box-shadow: var(--shadow-lg);
+  }
+  
+  .sidebar.open {
+    transform: translateX(0);
+  }
+  
+  .mobile-menu-btn {
+    display: block;
+  }
+  
+  .message {
+    max-width: 95%;
+  }
+  
+  .feature-highlights {
+    flex-direction: column;
+    align-items: center;
+  }
+}
+
+/* =====================================================
+   Syntax Highlighting (Basic)
+   ===================================================== */
+
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-built_in {
+  color: #c792ea;
+}
+
+.hljs-string,
+.hljs-attr {
+  color: #c3e88d;
+}
+
+.hljs-number,
+.hljs-literal {
+  color: #f78c6c;
+}
+
+.hljs-comment {
+  color: #546e7a;
+  font-style: italic;
+}
+
+.hljs-function,
+.hljs-title {
+  color: #82aaff;
+}
+
+.hljs-variable,
+.hljs-params {
+  color: #f07178;
+}
+
+/* =====================================================
+   Modal
+   ===================================================== */
+
+.modal-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.7);
+  display: none;
+  align-items: center;
+  justify-content: center;
+  z-index: 2000;
+}
+
+.modal-overlay.visible {
+  display: flex;
+}
+
+.modal {
+  background: var(--bg-secondary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-lg);
+  padding: var(--space-lg);
+  max-width: 400px;
+  width: 90%;
+  box-shadow: var(--shadow-lg);
+}
+
+.modal h3 {
+  margin-bottom: var(--space-sm);
+  font-size: 18px;
+}
+
+.modal p {
+  color: var(--text-secondary);
+  margin-bottom: var(--space-md);
+  font-size: 14px;
+}
+
+.whisper-models {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-sm);
+  margin-bottom: var(--space-lg);
+  max-height: 200px;
+  overflow-y: auto;
+}
+
+.whisper-model-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: var(--space-sm) var(--space-md);
+  background: var(--bg-tertiary);
+  border: 1px solid var(--border-subtle);
+  border-radius: var(--radius-md);
+}
+
+.whisper-model-item.selected {
+  border-color: var(--success);
+  background: rgba(34, 197, 94, 0.1);
+}
+
+.whisper-model-item .model-info {
+  display: flex;
+  flex-direction: column;
+}
+
+.whisper-model-item .model-name {
+  font-weight: 500;
+  font-size: 13px;
+}
+
+.whisper-model-item .model-size {
+  font-size: 11px;
+  color: var(--text-muted);
+}
+
+.whisper-model-item .model-actions {
+  display: flex;
+  align-items: center;
+  gap: var(--space-xs);
+}
+
+.whisper-model-item .download-btn,
+.whisper-model-item .use-btn {
+  padding: var(--space-xs) var(--space-sm);
+  font-size: 11px;
+  font-weight: 500;
+  border: none;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  transition: all var(--transition-fast);
+}
+
+.whisper-model-item .download-btn {
+  background: var(--accent-primary);
+  color: white;
+}
+
+.whisper-model-item .download-btn:hover {
+  background: var(--accent-secondary);
+}
+
+.whisper-model-item .use-btn {
+  background: var(--success);
+  color: white;
+}
+
+.whisper-model-item .use-btn:hover {
+  opacity: 0.9;
+}
+
+.whisper-model-item .delete-btn {
+  padding: var(--space-xs);
+  font-size: 12px;
+  background: transparent;
+  color: var(--text-muted);
+  border: none;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  transition: all var(--transition-fast);
+}
+
+.whisper-model-item .delete-btn:hover {
+  color: var(--error);
+}
+
+.current-whisper-model {
+  padding: var(--space-sm) var(--space-md);
+  background: var(--bg-tertiary);
+  border-radius: var(--radius-md);
+  margin-bottom: var(--space-md);
+  display: flex;
+  align-items: center;
+  gap: var(--space-sm);
+}
+
+.current-whisper-model .label {
+  font-size: 12px;
+  color: var(--text-secondary);
+}
+
+.current-whisper-model .model-name {
+  font-weight: 500;
+  color: var(--accent-secondary);
+}
+
+.modal-actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: var(--space-sm);
+}
+
+.modal-btn {
+  padding: var(--space-sm) var(--space-md);
+  font-size: 13px;
+  font-weight: 500;
+  border: none;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  transition: all var(--transition-fast);
+}
+
+.modal-btn.secondary {
+  background: var(--bg-tertiary);
+  color: var(--text-secondary);
+}
+
+.modal-btn.secondary:hover {
+  background: var(--bg-hover);
+  color: var(--text-primary);
+}
diff --git a/samples/js/hello-foundry-local/README.md b/samples/js/hello-foundry-local/README.md
deleted file mode 100644
index 24e60d3e..00000000
--- a/samples/js/hello-foundry-local/README.md
+++ /dev/null
@@ -1,15 +0,0 @@
-# Sample: Hello Foundry Local!
-
-This is a simple example of how to use the Foundry Local SDK to run a model locally and make requests to it. The example demonstrates how to set up the SDK, initialize a model, and make a request to the model.
-
-Install the Foundry Local SDK and OpenAI packages using npm:
-
-```bash
-npm install foundry-local-sdk openai
-```
-
-Run the application using Node.js:
-
-```bash
-node src/app.js
-```
diff --git a/samples/js/hello-foundry-local/src/app.js b/samples/js/hello-foundry-local/src/app.js
deleted file mode 100644
index eb81e3e4..00000000
--- a/samples/js/hello-foundry-local/src/app.js
+++ /dev/null
@@ -1,41 +0,0 @@
-// Copyright (c) Microsoft Corporation. All rights reserved.
-// Licensed under the MIT License.
-
-import { OpenAI } from "openai";
-import { FoundryLocalManager } from "foundry-local-sdk";
-
-// By using an alias, the most suitable model will be downloaded 
-// to your end-user's device.
-// TIP: You can find a list of available models by running the 
-// following command in your terminal: `foundry model list`.
-const alias = "qwen2.5-coder-0.5b";
-
-// Create a FoundryLocalManager instance. This will start the Foundry 
-// Local service if it is not already running.
-const foundryLocalManager = new FoundryLocalManager()
-
-// Initialize the manager with a model. This will download the model 
-// if it is not already present on the user's device.
-const modelInfo = await foundryLocalManager.init(alias)
-console.log("Model Info:", modelInfo)
-
-const openai = new OpenAI({
-  baseURL: foundryLocalManager.endpoint,
-  apiKey: foundryLocalManager.apiKey,
-});
-
-async function streamCompletion() {
-    const stream = await openai.chat.completions.create({
-      model: modelInfo.id,
-      messages: [{ role: "user", content: "What is the golden ratio?" }],
-      stream: true,
-    });
-  
-    for await (const chunk of stream) {
-      if (chunk.choices[0]?.delta?.content) {
-        process.stdout.write(chunk.choices[0].delta.content);
-      }
-    }
-}
-  
-streamCompletion();
diff --git a/samples/js/langchain-integration-example/README.md b/samples/js/langchain-integration-example/README.md
new file mode 100644
index 00000000..5cd34112
--- /dev/null
+++ b/samples/js/langchain-integration-example/README.md
@@ -0,0 +1,34 @@
+# LangChain integration example
+
+This sample demonstrates how to integrate the Foundry Local SDK with LangChain.js to create a simple application that uses local language models for text generation.
+
+## Prerequisites
+- Ensure you have Node.js installed (version 20 or higher is recommended).
+
+## Setup project
+
+Navigate to the sample directory, setup the project, and install the Foundry Local and LangChain packages.
+
+1. Navigate to the sample directory and setup the project:
+    ```bash
+    cd samples/js/langchain-integration-example
+    npm init -y
+    npm pkg set type=module
+    ```
+1. Install the Foundry Local and LangChain packages:
+    ```bash
+    npm install foundry-local-sdk
+    npm install @langchain/openai @langchain/core
+    ```
+
+> [!NOTE]
+> On Windows, NPU models are not currently available for the JavaScript SDK. These will be enabled in a subsequent release.
+
+## Run the sample
+
+Run the sample script using Node.js:
+
+```bash
+cd samples/js/langchain-integration-example
+node app.js
+```
\ No newline at end of file
diff --git a/samples/js/langchain-integration-example/app.js b/samples/js/langchain-integration-example/app.js
new file mode 100644
index 00000000..05641502
--- /dev/null
+++ b/samples/js/langchain-integration-example/app.js
@@ -0,0 +1,82 @@
+import { ChatOpenAI } from "@langchain/openai";
+import { ChatPromptTemplate } from "@langchain/core/prompts";
+import { FoundryLocalManager } from 'foundry-local-sdk';
+
+// Initialize the Foundry Local SDK
+console.log('Initializing Foundry Local SDK...');
+
+const endpointUrl = 'http://localhost:5764';
+
+const manager = FoundryLocalManager.create({
+    appName: 'foundry_local_samples',
+    logLevel: 'info',
+    webServiceUrls: endpointUrl
+});
+console.log('✓ SDK initialized successfully');
+
+// Get the model object
+const modelAlias = 'qwen2.5-0.5b'; // Using an available model from the list above
+const model = await manager.catalog.getModel(modelAlias);
+
+// Download the model
+console.log(`\nDownloading model ${modelAlias}...`);
+model.download();
+console.log('✓ Model downloaded');
+
+// Load the model
+console.log(`\nLoading model ${modelAlias}...`);
+model.load();
+console.log('✓ Model loaded');
+
+// Start the web service
+console.log('\nStarting web service...');
+manager.startWebService();
+console.log('✓ Web service started');
+
+
+// Configure ChatOpenAI to use your locally-running model
+const llm = new ChatOpenAI({
+    model: model.id,
+    configuration: {
+        baseURL: endpointUrl + '/v1',
+        apiKey: 'notneeded'
+    },
+    temperature: 0.6,
+    streaming: false
+});
+
+// Create a translation prompt template
+const prompt = ChatPromptTemplate.fromMessages([
+    {
+        role: "system",
+        content: "You are a helpful assistant that translates {input_language} to {output_language}."
+    },
+    {
+        role: "user",
+        content: "{input}"
+    }
+]);
+
+// Build a simple chain by connecting the prompt to the language model
+const chain = prompt.pipe(llm);
+
+const input = "I love to code.";
+console.log(`Translating '${input}' to French...`);
+
+// Run the chain with your inputs
+await chain.invoke({
+    input_language: "English",
+    output_language: "French",
+    input: input
+}).then(aiMsg => {
+    // Print the result content
+    console.log(`Response: ${aiMsg.content}`);
+}).catch(err => {
+    console.error("Error:", err);
+});
+
+// Tidy up
+console.log('Unloading model and stopping web service...');
+model.unload();
+manager.stopWebService();
+console.log(`✓ Model unloaded and web service stopped`);
\ No newline at end of file
diff --git a/samples/js/native-chat-completions/README.md b/samples/js/native-chat-completions/README.md
new file mode 100644
index 00000000..0138e19c
--- /dev/null
+++ b/samples/js/native-chat-completions/README.md
@@ -0,0 +1,33 @@
+# Native chat completions with Foundry Local SDK
+
+This sample demonstrates how to use the Foundry Local SDK to perform native chat completions using a local model. It initializes the SDK, selects a model, and sends a chat completion request with a system prompt and user message.
+
+## Prerequisites
+- Ensure you have Node.js installed (version 20 or higher is recommended).
+
+## Setup project
+
+Navigate to the sample directory, setup the project, and install the Foundry Local SDK package.
+
+1. Navigate to the sample directory and setup the project:
+    ```bash
+    cd samples/js/native-chat-completions
+    npm init -y
+    npm pkg set type=module
+    ```
+1. Install the Foundry Local SDK package:
+    ```bash
+    npm install foundry-local-sdk
+    ```
+
+> [!NOTE]
+> On Windows, NPU models are not currently available for the JavaScript SDK. These will be enabled in a subsequent release.
+
+## Run the sample
+
+Run the sample script using Node.js:
+
+```bash
+cd samples/js/native-chat-completions
+node app.js
+```
\ No newline at end of file
diff --git a/samples/js/native-chat-completions/app.js b/samples/js/native-chat-completions/app.js
new file mode 100644
index 00000000..5cea4853
--- /dev/null
+++ b/samples/js/native-chat-completions/app.js
@@ -0,0 +1,57 @@
+import { FoundryLocalManager } from 'foundry-local-sdk';
+
+// Initialize the Foundry Local SDK
+console.log('Initializing Foundry Local SDK...');
+
+const manager = FoundryLocalManager.create({
+    appName: 'foundry_local_samples',
+    logLevel: 'info'
+});
+console.log('✓ SDK initialized successfully');
+
+// Get the model object
+const modelAlias = 'qwen2.5-0.5b'; // Using an available model from the list above
+const model = await manager.catalog.getModel(modelAlias);
+
+// Download the model
+console.log(`\nDownloading model ${modelAlias}...`);
+model.download();
+console.log('✓ Model downloaded');
+
+// Load the model
+console.log(`\nLoading model ${modelAlias}...`);
+model.load();
+console.log('✓ Model loaded');
+
+// Create chat client
+console.log('\nCreating chat client...');
+const chatClient = model.createChatClient();
+console.log('✓ Chat client created');
+
+// Example chat completion
+console.log('\nTesting chat completion...');
+const completion = await chatClient.completeChat([
+    { role: 'user', content: 'Why is the sky blue?' }
+]);
+
+console.log('\nChat completion result:');
+console.log(completion.choices[0]?.message?.content);
+
+// Example streaming completion
+console.log('\nTesting streaming completion...');
+await chatClient.completeStreamingChat(
+    [{ role: 'user', content: 'Write a short poem about programming.' }],
+    (chunk) => {
+        const content = chunk.choices?.[0]?.message?.content;
+        if (content) {
+            process.stdout.write(content);
+        }
+    }
+);
+console.log('\n');
+
+// Unload the model
+console.log('Unloading model...');
+model.unload();
+console.log(`✓ Model unloaded`);
+    
\ No newline at end of file
diff --git a/samples/js/web-server-example/README.md b/samples/js/web-server-example/README.md
new file mode 100644
index 00000000..d8685a5b
--- /dev/null
+++ b/samples/js/web-server-example/README.md
@@ -0,0 +1,34 @@
+# Chat completions using an OpenAI-compatible web server
+
+This sample demonstrates how to use the Foundry Local SDK to perform chat completions using an OpenAI-compatible web server. It initializes the SDK with the server URL, selects a model, and sends a chat completion request with a system prompt and user message.
+
+## Prerequisites
+- Ensure you have Node.js installed (version 20 or higher is recommended).
+
+## Setup project
+
+Navigate to the sample directory, setup the project, and install the required packages.
+
+1. Navigate to the sample directory and setup the project:
+    ```bash
+    cd samples/js/web-server-example
+    npm init -y
+    npm pkg set type=module
+    ```
+1. Install the Foundry Local and OpenAI packages:
+    ```bash
+    npm install foundry-local-sdk
+    npm install openai
+    ```
+
+> [!NOTE]
+> On Windows, NPU models are not currently available for the JavaScript SDK. These will be enabled in a subsequent release.
+
+## Run the sample
+
+Run the sample script using Node.js:
+
+```bash
+cd samples/js/web-server-example
+node app.js
+```
\ No newline at end of file
diff --git a/samples/js/web-server-example/app.js b/samples/js/web-server-example/app.js
new file mode 100644
index 00000000..56a07823
--- /dev/null
+++ b/samples/js/web-server-example/app.js
@@ -0,0 +1,58 @@
+import { FoundryLocalManager } from 'foundry-local-sdk';
+import { OpenAI } from 'openai';
+
+// Initialize the Foundry Local SDK
+console.log('Initializing Foundry Local SDK...');
+
+const endpointUrl = 'http://localhost:5764';
+
+const manager = FoundryLocalManager.create({
+    appName: 'foundry_local_samples',
+    logLevel: 'info',
+    webServiceUrls: endpointUrl
+});
+console.log('✓ SDK initialized successfully');
+
+// Get the model object
+const modelAlias = 'qwen2.5-0.5b'; // Using an available model from the list above
+const model = await manager.catalog.getModel(modelAlias);
+
+// Download the model
+console.log(`\nDownloading model ${modelAlias}...`);
+model.download();
+console.log('✓ Model downloaded');
+
+// Load the model
+console.log(`\nLoading model ${modelAlias}...`);
+model.load();
+console.log('✓ Model loaded');
+
+// Start the web service
+console.log('\nStarting web service...');
+manager.startWebService();
+console.log('✓ Web service started');
+
+const openai = new OpenAI({
+    baseURL: endpointUrl + '/v1',
+    apiKey: 'notneeded',
+});
+
+// Example chat completion
+console.log('\nTesting chat completion with OpenAI client...');
+const response = await openai.chat.completions.create({
+    model: model.id,
+    messages: [
+    {
+        role: "user",
+        content: "What is the golden ratio?",
+    },
+    ],
+});
+
+console.log(response.choices[0].message.content);
+
+// Tidy up
+console.log('Unloading model and stopping web service...');
+await model.unload();
+await manager.stopWebService();
+console.log(`✓ Model unloaded and web service stopped`);