@jupyterlite/ai 0.8.0 → 0.9.0-a0

package/src/default-providers/MistralAI/completer.ts

@@ -1,69 +0,0 @@
-import {
-  CompletionHandler,
-  IInlineCompletionContext
-} from '@jupyterlab/completer';
-import { MistralAI } from '@langchain/mistralai';
-
-import { BaseCompleter } from '../../base-completer';
-
-const CODE_BLOCK_START_REGEX = /^```(?:[a-zA-Z]+)?\n?/;
-const CODE_BLOCK_END_REGEX = /```$/;
-
-export class CodestralCompleter extends BaseCompleter {
-  constructor(options: BaseCompleter.IOptions) {
-    super(options);
-    this._completer = new MistralAI({ ...options.settings });
-  }
-
-  async fetch(
-    request: CompletionHandler.IRequest,
-    context: IInlineCompletionContext
-  ) {
-    try {
-      const { text, offset: cursorOffset } = request;
-      const prompt = this.systemPrompt.concat(text.slice(0, cursorOffset));
-      const suffix = text.slice(cursorOffset);
-      this._controller.abort();
-      this._controller = new AbortController();
-
-      const response = await this._completer.completionWithRetry(
-        {
-          prompt,
-          model: this._completer.model,
-          suffix
-        },
-        { signal: this._controller.signal },
-        false
-      );
-      const items = response.choices.map(choice => {
-        const messageContent = choice.message.content;
-        let content = '';
-
-        if (typeof messageContent === 'string') {
-          content = messageContent
-            .replace(CODE_BLOCK_START_REGEX, '')
-            .replace(CODE_BLOCK_END_REGEX, '');
-        } else if (Array.isArray(messageContent)) {
-          // Handle ContentChunk[] case - extract text content
-          content = messageContent
-            .filter(chunk => chunk.type === 'text')
-            .map(chunk => chunk.text || '')
-            .join('')
-            .replace(CODE_BLOCK_START_REGEX, '')
-            .replace(CODE_BLOCK_END_REGEX, '');
-        }
-
-        return {
-          insertText: content
-        };
-      });
-      return { items };
-    } catch (error) {
-      // the request may be aborted
-      return { items: [] };
-    }
-  }
-
-  private _controller = new AbortController();
-  protected _completer: MistralAI;
-}

package/src/default-providers/MistralAI/instructions.ts

@@ -1,18 +0,0 @@
-export default `
-<i class="fas fa-exclamation-triangle"></i> This extension is still very much experimental. It is not an official MistralAI extension.
-
-1. Go to <https://console.mistral.ai/api-keys/> and create an API key.
-
-    <img src="https://raw.githubusercontent.com/jupyterlite/ai/refs/heads/main/img/1-api-key.png" alt="Screenshot showing how to create an API key" width="500px">
-
-2. Open the JupyterLab settings and go to the **Ai providers** section to select the \`MistralAI\`
-   provider and the API key (required).
-
-    <img src="https://raw.githubusercontent.com/jupyterlite/ai/refs/heads/main/img/2-jupyterlab-settings.png" alt="Screenshot showing how to add the API key to the settings" width="500px">
-
-**Note:** When using MistralAI for completions, only a subset of models are available. Please check [this resource](https://docs.mistral.ai/api/#tag/fim) to see the list of supported models for completions.
-
-3. Open the chat, or use the inline completer
-
-    <img src="https://raw.githubusercontent.com/jupyterlite/ai/refs/heads/main/img/3-usage.png" alt="Screenshot showing how to use the chat" width="500px">
-`;

package/src/default-providers/Ollama/completer.ts

@@ -1,54 +0,0 @@
-import {
-  CompletionHandler,
-  IInlineCompletionContext
-} from '@jupyterlab/completer';
-import { AIMessage, SystemMessage } from '@langchain/core/messages';
-import { ChatOllama } from '@langchain/ollama';
-
-import { BaseCompleter } from '../../base-completer';
-
-export class OllamaCompleter extends BaseCompleter {
-  constructor(options: BaseCompleter.IOptions) {
-    super(options);
-    this._completer = new ChatOllama({ ...options.settings });
-  }
-
-  async fetch(
-    request: CompletionHandler.IRequest,
-    context: IInlineCompletionContext
-  ) {
-    const { text, offset: cursorOffset } = request;
-    const prompt = text.slice(0, cursorOffset);
-
-    const messages = [
-      new SystemMessage(this.systemPrompt),
-      new AIMessage(prompt)
-    ];
-
-    try {
-      const response = await this._completer.invoke(messages);
-      const items = [];
-      if (typeof response.content === 'string') {
-        items.push({
-          insertText: response.content
-        });
-      } else {
-        response.content.forEach(content => {
-          if (content.type !== 'text') {
-            return;
-          }
-          items.push({
-            insertText: content.text,
-            filterText: prompt.substring(prompt.length)
-          });
-        });
-      }
-      return { items };
-    } catch (error) {
-      console.error('Error fetching completions', error);
-      return { items: [] };
-    }
-  }
-
-  protected _completer: ChatOllama;
-}

package/src/default-providers/Ollama/instructions.ts

@@ -1,70 +0,0 @@
-export default `
-Ollama allows to run large language models locally on your machine.
-To use it you need to install the Ollama CLI and pull the model you want to use.
-
-1. Install the Ollama CLI by following the instructions at <https://ollama.com/download>
-
-2. Pull the model you want to use by running the following command in your terminal:
-
-   \`\`\`bash
-   ollama pull <model-name>
-   \`\`\`
-
-   For example, to pull the Llama 2 model, run:
-
-   \`\`\`bash
-   ollama pull llama2
-   \`\`\`
-
-3. Once the model is pulled, you can use it in your application by running the following command:
-
-    \`\`\`bash
-    ollama serve
-    \`\`\`
-
-4. This model will be available in the extension, using the model name you used in the command above.
-
-<details>
-<summary>Deploying Lite/Lab on external server</summary>
-
-See https://objectgraph.com/blog/ollama-cors/ for more details.
-
-On Linux, you can run the following commands:
-
-1. Check if CORS is enabled on the server. You can do this by running the following command in your terminal:
-
-   \`\`\`bash
-   curl -X OPTIONS http://localhost:11434 -H "Origin: http://example.com" -H "Access-Control-Request-Method: GET" -I
-   \`\`\`
-
-   If CORS is disabled, you will see a response like this:
-
-   \`\`\`bash
-   HTTP/1.1 403 Forbidden
-   Date: Wed, 09 Oct 2024 10:12:15 GMT
-   Content-Length: 0
-    \`\`\`
-
-2. If CORS is not enabled, update _/etc/systemd/system/ollama.service_ with:
-
-   \`\`\`bash
-   [Service]
-   Environment="OLLAMA_HOST=0.0.0.0"
-   Environment="OLLAMA_ORIGINS=*"
-   \`\`\`
-
-3. Restart the service:
-
-   \`\`\`bash
-   sudo systemctl daemon-reload
-   sudo systemctl restart ollama
-   \`\`\`
-
-4. Check if CORS is enabled on the server again by running the following command in your terminal:
-
-    \`\`\`bash
-    curl -X OPTIONS http://localhost:11434 -H "Origin: http://example.com" -H "Access-Control-Request-Method: GET" -I
-    \`\`\`
-
-</details>
-`;

package/src/default-providers/OpenAI/completer.ts

@@ -1,54 +0,0 @@
-import {
-  CompletionHandler,
-  IInlineCompletionContext
-} from '@jupyterlab/completer';
-import { AIMessage, SystemMessage } from '@langchain/core/messages';
-import { ChatOpenAI } from '@langchain/openai';
-
-import { BaseCompleter } from '../../base-completer';
-
-export class OpenAICompleter extends BaseCompleter {
-  constructor(options: BaseCompleter.IOptions) {
-    super(options);
-    this._completer = new ChatOpenAI({ ...options.settings });
-  }
-
-  async fetch(
-    request: CompletionHandler.IRequest,
-    context: IInlineCompletionContext
-  ) {
-    const { text, offset: cursorOffset } = request;
-    const prompt = text.slice(0, cursorOffset);
-
-    const messages = [
-      new SystemMessage(this.systemPrompt),
-      new AIMessage(prompt)
-    ];
-
-    try {
-      const response = await this._completer.invoke(messages);
-      const items = [];
-      if (typeof response.content === 'string') {
-        items.push({
-          insertText: response.content
-        });
-      } else {
-        response.content.forEach(content => {
-          if (content.type !== 'text') {
-            return;
-          }
-          items.push({
-            insertText: content.text,
-            filterText: prompt.substring(prompt.length)
-          });
-        });
-      }
-      return { items };
-    } catch (error) {
-      console.error('Error fetching completions', error);
-      return { items: [] };
-    }
-  }
-
-  protected _completer: ChatOpenAI;
-}

package/src/default-providers/WebLLM/completer.ts

@@ -1,151 +0,0 @@
-import {
-  CompletionHandler,
-  IInlineCompletionContext
-} from '@jupyterlab/completer';
-import { HumanMessage, SystemMessage } from '@langchain/core/messages';
-import { ChatWebLLM } from '@langchain/community/chat_models/webllm';
-
-import { BaseCompleter } from '../../base-completer';
-
-/**
- * Regular expression to match the '```' string at the start of a string.
- * So the completions returned by the LLM can still be kept after removing the code block formatting.
- *
- * For example, if the response contains the following content after typing `import pandas`:
- *
- * ```python
- * as pd
- * ```
- *
- * The formatting string after removing the code block delimiters will be:
- *
- * as pd
- */
-const CODE_BLOCK_START_REGEX = /^```(?:[a-zA-Z]+)?\n?/;
-
-/**
- * Regular expression to match the '```' string at the end of a string.
- */
-const CODE_BLOCK_END_REGEX = /```$/;
-
-export class WebLLMCompleter extends BaseCompleter {
-  constructor(options: BaseCompleter.IOptions) {
-    super(options);
-    const model = options.settings.model as string;
-    // provide model separately since ChatWebLLM expects it
-    this._completer = new ChatWebLLM({
-      ...options.settings,
-      model
-    });
-
-    // Initialize the model and track its status
-    this._isInitialized = false;
-    this._isInitializing = false;
-    this._initError = null;
-    void this._initializeModel();
-  }
-
-  /**
-   * Initialize the WebLLM model
-   */
-  private async _initializeModel(): Promise<void> {
-    if (this._isInitialized || this._isInitializing) {
-      return;
-    }
-
-    this._isInitializing = true;
-    try {
-      await this._completer.initialize((progress: any) => {
-        console.log('WebLLM initialization progress:', progress);
-      });
-      this._isInitialized = true;
-      this._isInitializing = false;
-      console.log('WebLLM model successfully initialized');
-    } catch (error) {
-      this._initError =
-        error instanceof Error ? error : new Error(String(error));
-      this._isInitializing = false;
-      console.error('Failed to initialize WebLLM model:', error);
-    }
-  }
-
-  get provider(): ChatWebLLM {
-    return this._completer;
-  }
-
-  async fetch(
-    request: CompletionHandler.IRequest,
-    context: IInlineCompletionContext
-  ) {
-    // Abort any pending request
-    if (this._abortController) {
-      this._abortController.abort();
-    }
-
-    // Create a new abort controller for this request
-    this._abortController = new AbortController();
-    const signal = this._abortController.signal;
-
-    if (!this._isInitialized) {
-      if (this._initError) {
-        console.error('WebLLM model failed to initialize:', this._initError);
-        return { items: [] };
-      }
-
-      if (!this._isInitializing) {
-        // Try to initialize again if it's not currently initializing
-        await this._initializeModel();
-      } else {
-        console.log(
-          'WebLLM model is still initializing, please try again later'
-        );
-        return { items: [] };
-      }
-
-      // Return empty if still not initialized
-      if (!this._isInitialized) {
-        return { items: [] };
-      }
-    }
-
-    const { text, offset: cursorOffset } = request;
-    const prompt = text.slice(0, cursorOffset);
-    const trimmedPrompt = prompt.trim();
-
-    const messages = [
-      new SystemMessage(this.systemPrompt),
-      new HumanMessage(trimmedPrompt)
-    ];
-
-    try {
-      console.log('Trigger invoke');
-      const response = await this._completer.invoke(messages, { signal });
-      let content = response.content as string;
-      console.log('Response content:', content);
-
-      if (CODE_BLOCK_START_REGEX.test(content)) {
-        content = content
-          .replace(CODE_BLOCK_START_REGEX, '')
-          .replace(CODE_BLOCK_END_REGEX, '');
-      }
-
-      const items = [{ insertText: content }];
-      return {
-        items
-      };
-    } catch (error) {
-      if (error instanceof Error) {
-        console.error('Error fetching completion from WebLLM:', error.message);
-      } else {
-        console.error('Unknown error fetching completion from WebLLM:', error);
-      }
-      return { items: [] };
-    }
-  }
-
-  protected _completer: ChatWebLLM;
-  private _isInitialized: boolean = false;
-  private _isInitializing: boolean = false;
-  private _initError: Error | null = null;
-  private _abortController: AbortController | null = null;
-}

package/src/default-providers/WebLLM/instructions.ts

@@ -1,33 +0,0 @@
-export default `
-WebLLM enables running LLMs directly in your browser, making it possible to use AI features without sending data to external servers.
-
-<i class="fas fa-info-circle"></i> WebLLM runs models entirely in your browser, so initial model download may be large (100MB-2GB depending on the model).
-
-<i class="fas fa-exclamation-triangle"></i> <strong>Requirements:</strong> WebLLM requires a browser with WebGPU support (Chrome 113+, Edge 113+, or Safari 17+). It will not work on older browsers or browsers without WebGPU enabled.
-
-1. Enter a model in the JupyterLab settings under the **Ai providers** section. Select the \`WebLLM\` provider and type the model you want to use.
-2. When you first use WebLLM, your browser will download the model. A progress notification will appear:
-3. Once loaded, use the chat
-4. Example of available models:
-  - Llama-3.2-1B-Instruct-q4f32_1-MLC
-  - Mistral-7B-Instruct-v0.3-q4f32_1-MLC
-  - Qwen3-0.6B-q4f32_1-MLC
-5. See the full list of models: https://github.com/mlc-ai/web-llm/blob/632d34725629b480b5b2772379ef5c150b1286f0/src/config.ts#L303-L309
-
-<i class="fas fa-exclamation-triangle"></i> Model performance depends on your device's hardware capabilities. More powerful devices will run models faster. Some larger models may not work well on devices with limited GPU memory or may experience slow response times.
-`;
-
-/**
- * Check if the browser supports WebLLM.
- */
-export async function compatibilityCheck(): Promise<string | null> {
-  // Check if the browser supports the ChromeAI model
-  if (typeof navigator === 'undefined' || !('gpu' in navigator)) {
-    return 'Your browser does not support WebLLM, it does not support required WebGPU.';
-  }
-  if ((await navigator.gpu.requestAdapter()) === null) {
-    return 'You may need to enable WebGPU, `await navigator.gpu.requestAdapter()` is null.';
-  }
-  // If the model is available, return null to indicate compatibility
-  return null;
-}

package/src/default-providers/index.ts

@@ -1,211 +0,0 @@
-import {
-  JupyterFrontEnd,
-  JupyterFrontEndPlugin
-} from '@jupyterlab/application';
-import { Notification } from '@jupyterlab/apputils';
-
-import { ChatAnthropic } from '@langchain/anthropic';
-import { ChatWebLLM } from '@langchain/community/chat_models/webllm';
-import { ChromeAI } from '@langchain/community/experimental/llms/chrome_ai';
-import { ChatGoogleGenerativeAI } from '@langchain/google-genai';
-import { ChatMistralAI } from '@langchain/mistralai';
-import { ChatOllama } from '@langchain/ollama';
-import { ChatOpenAI } from '@langchain/openai';
-
-// Import completers
-import { AnthropicCompleter } from './Anthropic/completer';
-import { ChromeCompleter } from './ChromeAI/completer';
-import { GeminiCompleter } from './Gemini/completer';
-import { CodestralCompleter } from './MistralAI/completer';
-import { OllamaCompleter } from './Ollama/completer';
-import { OpenAICompleter } from './OpenAI/completer';
-import { WebLLMCompleter } from './WebLLM/completer';
-
-// Import Settings
-import AnthropicSettings from './Anthropic/settings-schema.json';
-import ChromeAISettings from './ChromeAI/settings-schema.json';
-import GeminiSettings from './Gemini/settings-schema.json';
-import MistralAISettings from './MistralAI/settings-schema.json';
-import OllamaAISettings from './Ollama/settings-schema.json';
-import OpenAISettings from './OpenAI/settings-schema.json';
-import WebLLMSettings from './WebLLM/settings-schema.json';
-
-// Import instructions
-import ChromeAIInstructions, {
-  compatibilityCheck as chromeAICompatibilityCheck
-} from './ChromeAI/instructions';
-import GeminiInstructions from './Gemini/instructions';
-import MistralAIInstructions from './MistralAI/instructions';
-import OllamaInstructions from './Ollama/instructions';
-import WebLLMInstructions, {
-  compatibilityCheck as webLLMCompatibilityCheck
-} from './WebLLM/instructions';
-
-import { prebuiltAppConfig } from '@mlc-ai/web-llm';
-
-import { IAIProvider, IAIProviderRegistry } from '../tokens';
-
-// Build the AIProvider list
-const AIProviders: IAIProvider[] = [
-  {
-    name: 'Anthropic',
-    chat: ChatAnthropic,
-    completer: AnthropicCompleter,
-    settingsSchema: AnthropicSettings,
-    errorMessage: (error: any) => error.error.error.message
-  },
-  {
-    name: 'ChromeAI',
-    // TODO: fix
-    // @ts-expect-error: missing properties
-    chat: ChromeAI,
-    completer: ChromeCompleter,
-    instructions: ChromeAIInstructions,
-    settingsSchema: ChromeAISettings,
-    compatibilityCheck: chromeAICompatibilityCheck
-  },
-  {
-    name: 'MistralAI',
-    chat: ChatMistralAI,
-    completer: CodestralCompleter,
-    instructions: MistralAIInstructions,
-    settingsSchema: MistralAISettings
-  },
-  {
-    name: 'Ollama',
-    chat: ChatOllama,
-    completer: OllamaCompleter,
-    instructions: OllamaInstructions,
-    settingsSchema: OllamaAISettings
-  },
-  {
-    name: 'Gemini',
-    chat: ChatGoogleGenerativeAI,
-    completer: GeminiCompleter,
-    instructions: GeminiInstructions,
-    settingsSchema: GeminiSettings
-  },
-  {
-    name: 'OpenAI',
-    chat: ChatOpenAI,
-    completer: OpenAICompleter,
-    settingsSchema: OpenAISettings
-  }
-];
-
-/**
- * Register the WebLLM provider in a separate plugin since it creates notifications
- * when the model is changed in the settings.
- */
-const webLLMProviderPlugin: JupyterFrontEndPlugin<void> = {
-  id: '@jupyterlite/ai:webllm',
-  description: 'Register the WebLLM provider',
-  autoStart: true,
-  requires: [IAIProviderRegistry],
-  activate: (app: JupyterFrontEnd, registry: IAIProviderRegistry) => {
-    registry.add({
-      name: 'WebLLM',
-      chat: ChatWebLLM,
-      completer: WebLLMCompleter,
-      settingsSchema: WebLLMSettings,
-      instructions: WebLLMInstructions,
-      compatibilityCheck: webLLMCompatibilityCheck,
-      exposeChatModel: true
-    });
-
-    registry.providerChanged.connect(async (sender, role) => {
-      const { currentChatModel } = registry;
-
-      // TODO: implement a proper way to handle models that may need to be initialized before being used.
-      // Mostly applies to WebLLM and ChromeAI as they may need to download the model in the browser first.
-      if (registry.currentName(role) === 'WebLLM') {
-        // Leaving this check here, but it should never happen, this check is done in
-        // the provider registry, and the current name is set to 'None' if there is a
-        // compatibility error.
-        const compatibilityError = await webLLMCompatibilityCheck();
-        if (compatibilityError) {
-          return;
-        }
-
-        const model = currentChatModel as ChatWebLLM;
-        if (model === null || !model.model) {
-          return;
-        }
-
-        // Find if the model is part of the prebuiltAppConfig
-        const modelRecord = prebuiltAppConfig.model_list.find(
-          modelRecord => modelRecord.model_id === model.model
-        );
-        if (!modelRecord) {
-          Notification.dismiss();
-          Notification.emit(
-            `Model ${model.model} not found in the prebuiltAppConfig`,
-            'error',
-            {
-              autoClose: 2000
-            }
-          );
-          return;
-        }
-
-        // create a notification
-        const notification = Notification.emit(
-          'Loading model...',
-          'in-progress',
-          {
-            autoClose: false,
-            progress: 0
-          }
-        );
-        try {
-          void model.initialize(report => {
-            const { progress, text } = report;
-            if (progress === 1) {
-              Notification.update({
-                id: notification,
-                progress: 1,
-                message: `Model ${model.model} loaded successfully`,
-                type: 'success',
-                autoClose: 2000
-              });
-              return;
-            }
-            Notification.update({
-              id: notification,
-              progress: progress / 1,
-              message: text,
-              type: 'in-progress'
-            });
-          });
-        } catch (err) {
-          Notification.update({
-            id: notification,
-            progress: 1,
-            message: `Error loading model ${model.model}`,
-            type: 'error',
-            autoClose: 2000
-          });
-        }
-      }
-    });
-  }
-};
-
-/**
- * Register all default AI providers.
- */
-const aiProviderPlugins = AIProviders.map(provider => {
-  return {
-    id: `@jupyterlite/ai:${provider.name}`,
-    autoStart: true,
-    requires: [IAIProviderRegistry],
-    activate: (app: JupyterFrontEnd, registry: IAIProviderRegistry) => {
-      registry.add(provider);
-    }
-  };
-});
-
-export const defaultProviderPlugins: JupyterFrontEndPlugin<void>[] = [
-  webLLMProviderPlugin,
-  ...aiProviderPlugins
-];

package/src/global.d.ts

@@ -1,9 +0,0 @@
-/*
- * Copyright (c) Jupyter Development Team.
- * Distributed under the terms of the Modified BSD License.
- */
-
-declare module '*.svg' {
-  const value: string;
-  export default value;
-}