Adds an Ollama example

.cursorrules

@@ -0,0 +1,13 @@
+This repository contains a TypeScript library for building terminal applications, either using React or directly through its TypeScript APIs.
+
+Not all HTML elements are supported. All elements are prefixed with `term:` to avoid conflicts with the HTML namespace.
+
+Inline elements are not supported - only block elements are supported (no `term:span`).
+
+Layout can be constructed using flexbox properties.
+
+Style properties are inlined - ie `<term:div width="100%" height="100%">` rather than `<term:div style={{ width: '100%', height: '100%' }}>`.
+
+Referencing the props of a React component can be done using, for example, `JSX.IntrinsicElements['term:div']`.
+
+The documentation is available in the `docs` folder.

docs/XTermRun.tsx

@@ -4,6 +4,9 @@ import * as terminosaurusReact from 'terminosaurus/react';
 import {XTerm, XTermScreenIn, XTermScreenOut}  from 'terminosaurus/xterm';
 import * as terminosaurus from 'terminosaurus';
 import React, {useEffect, useRef} from 'react';
+import ollama from 'ollama/browser';
+import * as reactRedux from 'react-redux';
+import * as reduxToolkit from '@reduxjs/toolkit';
 import {PassThrough} from 'stream';
 
 import grammar from '#data/languages/TypeScript.tmLanguage.json';
@@ -61,6 +64,9 @@ export function XTermRun({className = ``, code, rows}: {className?: string, code
             [`react`]: React,
             [`terminosaurus`]: patchedTerminosaurus,
             [`terminosaurus/react`]: patchedTerminosaurusReact,
+            [`ollama`]: {default: ollama},
+            [`react-redux`]: reactRedux,
+            [`@reduxjs/toolkit`]: reduxToolkit,
             [`#data/languages/TypeScript.tmLanguage.json`]: {default: grammar},
             [`#data/themes/WinterIsComing.json`]: {default: theme},
         };

docs/examples/ollama/page.mdx

@@ -0,0 +1,8 @@
+---
+layout: fixed
+nextjs:
+  metadata:
+    title: Ollama example
+---
+
+<XTermFullExample path="ollama.tsx"/>

docs/examples/simple-form/page.mdx

@@ -5,4 +5,4 @@ nextjs:
     title: Simple form example
 ---
 
-<XTermFullExample path="small-form.tsx"/>
+<XTermFullExample path="small-form-react.tsx"/>

docs/navigation.ts

@@ -27,6 +27,9 @@ export const navigation = [{
   }, {
     title: `Simple form`,
     href: `/docs/examples/simple-form`,
+  }, {
+    title: `Ollama chat`,
+    href: `/docs/examples/ollama`,
   }],
 }, {
   title: `Entry points`,

examples/index.ts

@@ -11,17 +11,20 @@ import {
   render,
   run,
 } from 'terminosaurus/react';
+import { RunOptions } from '../sources/dom/TermScreen';
 
 runExit(class Main extends Command {
+  public debugPaintRects = Option.Boolean(`--debug-paint-rects`, false);
   public logOutput = Option.Boolean(`--log-output`, false);
   public console = Option.String(`--console`);
 
   public examplePath = Option.String();
 
   async execute() {
-    let streams: ScreenStreams = {
+    let streams: ScreenStreams & RunOptions = {
       stdin: this.context.stdin,
       stdout: this.context.stdout,
+      debugPaintRects: this.debugPaintRects,
     };
 
     if (this.logOutput) {