@jupyterlite/ai 0.2.0 → 0.3.0

package/src/provider.ts

@@ -8,6 +8,34 @@ import { CompletionProvider } from './completion-provider';
 import { getChatModel, IBaseCompleter } from './llm-models';
 import { IAIProvider } from './token';
 
+export const chatSystemPrompt = (options: AIProvider.IPromptOptions) => `
+You are Jupyternaut, a conversational assistant living in JupyterLab to help users.
+You are not a language model, but rather an application built on a foundation model from ${options.provider_name}.
+You are talkative and you provide lots of specific details from the foundation model's context.
+You may use Markdown to format your response.
+If your response includes code, they must be enclosed in Markdown fenced code blocks (with triple backticks before and after).
+If your response includes mathematical notation, they must be expressed in LaTeX markup and enclosed in LaTeX delimiters.
+All dollar quantities (of USD) must be formatted in LaTeX, with the \`$\` symbol escaped by a single backslash \`\\\`.
+- Example prompt: \`If I have \\\\$100 and spend \\\\$20, how much money do I have left?\`
+- **Correct** response: \`You have \\(\\$80\\) remaining.\`
+- **Incorrect** response: \`You have $80 remaining.\`
+If you do not know the answer to a question, answer truthfully by responding that you do not know.
+The following is a friendly conversation between you and a human.
+`;
+
+export const COMPLETION_SYSTEM_PROMPT = `
+You are an application built to provide helpful code completion suggestions.
+You should only produce code. Keep comments to minimum, use the
+programming language comment syntax. Produce clean code.
+The code is written in JupyterLab, a data analysis and code development
+environment which can execute code extended with additional syntax for
+interactive features, such as magics.
+Only give raw strings back, do not format the response using backticks.
+The output should be a single string, and should correspond to what a human users
+would write.
+Do not include the prompt in the output, only the string that should be appended to the current input.
+`;
+
 export class AIProvider implements IAIProvider {
   constructor(options: AIProvider.IOptions) {
     this._completionProvider = new CompletionProvider({
@@ -110,6 +138,16 @@ export namespace AIProvider {
     requestCompletion: () => void;
   }
 
+  /**
+   * The options for the Chat system prompt.
+   */
+  export interface IPromptOptions {
+    /**
+     * The provider name.
+     */
+    provider_name: string;
+  }
+
   /**
    * This function indicates whether a key is writable in an object.
    * https://stackoverflow.com/questions/54724875/can-we-check-whether-property-is-readonly-in-typescript

package/src/slash-commands.tsx

@@ -0,0 +1,55 @@
+/**
+ * TODO: reuse from Jupyter AI instead of copying?
+ * https://github.com/jupyterlab/jupyter-ai/blob/main/packages/jupyter-ai/src/slash-autocompletion.tsx
+ */
+
+import { Box, Typography } from '@mui/material';
+import { AutocompleteCommand } from '@jupyter/chat';
+
+import HideSource from '@mui/icons-material/HideSource';
+
+import React from 'react';
+
+const DEFAULT_SLASH_COMMAND_ICONS: Record<string, JSX.Element> = {
+  clear: <HideSource />
+};
+
+type SlashCommandOption = AutocompleteCommand & {
+  id: string;
+  description: string;
+};
+
+/**
+ * Renders an option shown in the slash command autocomplete.
+ */
+export function renderSlashCommandOption(
+  optionProps: React.HTMLAttributes<HTMLLIElement>,
+  option: SlashCommandOption
+): JSX.Element {
+  const icon =
+    option.id in DEFAULT_SLASH_COMMAND_ICONS
+      ? DEFAULT_SLASH_COMMAND_ICONS[option.id]
+      : DEFAULT_SLASH_COMMAND_ICONS.unknown;
+
+  return (
+    <li {...optionProps}>
+      <Box sx={{ lineHeight: 0, marginRight: 4, opacity: 0.618 }}>{icon}</Box>
+      <Box sx={{ flexGrow: 1 }}>
+        <Typography
+          component="span"
+          sx={{
+            fontSize: 'var(--jp-ui-font-size1)'
+          }}
+        >
+          {option.label}
+        </Typography>
+        <Typography
+          component="span"
+          sx={{ opacity: 0.618, fontSize: 'var(--jp-ui-font-size0)' }}
+        >
+          {' — ' + option.description}
+        </Typography>
+      </Box>
+    </li>
+  );
+}

package/style/icons/jupyternaut-lite.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg fill="none" version="1.1" viewBox="0 0 38 38" xmlns="http://www.w3.org/2000/svg">
+ <g>
+  <circle cx="19" cy="19" r="19" fill="#f7dc1e"/>
+  <path d="m19.948 6.8365c0.6344-0.21603 1.0908-0.81693 1.0908-1.5244 0-0.88916-0.7208-1.61-1.61-1.61s-1.61 0.72081-1.61 1.61c0 0.70739 0.4562 1.3082 1.0905 1.5243v1.1674h-0.5394c-6.2858 0-11.399 5.1132-11.399 11.399 0 6.2859 5.1133 11.399 11.399 11.399h1.398c6.2859 0 11.399-5.1132 11.399-11.399 0-6.2253-5.0159-11.301-11.219-11.397v-1.1687zm-1.5781 22.163h1.398c5.3669 0 9.7303-4.9787 9.7303-8.3455 0-5.3669-4.3634-9.7303-9.7303-9.7303h-1.398c-5.3668 0-9.7302 4.3634-9.7302 9.7303 0 3.3668 4.3634 8.3455 9.7302 8.3455zm14.522-5.003c0.7341 0 0.7375-0.5123 0.7422-1.2408v-1e-4c0.0012-0.1847 0.0025-0.3833 0.0158-0.591 0.0573-0.8624 0.0739-1.7008 0.0573-2.4892l-0.0033-0.119c-0.0373-1.3318-0.0436-1.5579-1.3047-1.8058l-0.1479-0.0246 0.0015 0.0495c0.0076 0.2465 0.0151 0.493 0.0151 0.739 0 1.8018-0.2712 3.5478-0.773 5.189-0.1363 0.4459 0.3433 0.8629 0.7534 0.6411l0.6436-0.3481zm-27.612 0c-0.73409 0-0.73741-0.5123-0.74215-1.2407-0.0012-0.1848-0.00249-0.3834-0.01581-0.5912-0.0573-0.8624-0.07392-1.7007-0.05731-2.4892l0.00336-0.1189c0.03721-1.3319 0.04352-1.5579 1.3047-1.8058l0.14784-0.0247-0.00151 0.0495c-0.00756 0.2465-0.01511 0.493-0.01511 0.739 0 1.8019 0.27119 3.5478 0.773 5.189 0.13634 0.4459-0.34326 0.8629-0.7534 0.6411l-0.64361-0.3481zm14.242-12.005c-4.6297 0-8.4776 2.9361-9.4584 6.7577-0.13379 0.5212 0.5513 0.6935 0.877 0.2653 1.3829-1.818 3.1418-2.153 4.7068-2.4511 2.1143-0.4027 3.8746-0.7379 3.8746-4.5719z" clip-rule="evenodd" fill="#000" fill-rule="evenodd"/>
+ </g>
+</svg>