or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

index.mdmodel.mdwidget.md
tile.json

tessl/npm-jupyterlab--outputarea

JupyterLab output area component for rendering notebook execution results with multiple MIME type support

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/@jupyterlab/outputarea@4.4.x

To install, run

npx @tessl/cli install tessl/npm-jupyterlab--outputarea@4.4.0

index.mddocs/

JupyterLab Output Area

The JupyterLab Output Area package provides components for rendering notebook execution results and interactive output in JupyterLab applications. It handles display of multiple MIME types, stream outputs, and user input requests through a comprehensive model-view architecture.

Package Information

  • Package Name: @jupyterlab/outputarea
  • Package Type: npm
  • Language: TypeScript
  • Installation: npm install @jupyterlab/outputarea

Core Imports

import {
  OutputArea,
  OutputAreaModel,
  IOutputAreaModel,
  SimplifiedOutputArea,
  IOutputPrompt,
  OutputPrompt,
  IStdin,
  Stdin
} from "@jupyterlab/outputarea";

For CommonJS:

const {
  OutputArea,
  OutputAreaModel,
  IOutputAreaModel,
  SimplifiedOutputArea,
  IOutputPrompt,
  OutputPrompt,
  IStdin,
  Stdin
} = require("@jupyterlab/outputarea");

Basic Usage

import { OutputArea, OutputAreaModel } from "@jupyterlab/outputarea";
import { RenderMimeRegistry } from "@jupyterlab/rendermime";

// Create an output area model
const model = new OutputAreaModel({
  trusted: true
});

// Create a rendermime registry (you would typically configure this)
const rendermime = new RenderMimeRegistry();

// Create the output area widget
const outputArea = new OutputArea({
  model,
  rendermime
});

// Add output to the model
model.add({
  output_type: "stream",
  name: "stdout",
  text: ["Hello, World!\n"]
});

// The output will be automatically rendered in the widget

Architecture

The JupyterLab Output Area is built around several key components:

  • Model Layer: OutputAreaModel manages output data and state changes through observable patterns
  • Widget Layer: OutputArea provides the visual rendering and user interaction components
  • Content Factory: Customizable factories for creating output prompts and input widgets
  • MIME Integration: Deep integration with JupyterLab's rendermime system for multiple output formats
  • Stream Management: Intelligent stream output consolidation and text processing
  • Input Handling: Support for kernel input requests with history and validation

Capabilities

Output Area Model

Core data model for managing notebook output items with observable state changes and JSON serialization support.

interface IOutputAreaModel extends IDisposable {
  readonly stateChanged: ISignal<IOutputAreaModel, number>;
  readonly changed: ISignal<IOutputAreaModel, IOutputAreaModel.ChangedArgs>;
  readonly length: number;
  trusted: boolean;
  readonly contentFactory: IOutputAreaModel.IContentFactory;
  
  get(index: number): IOutputModel;
  add(output: nbformat.IOutput): number;
  remove(index: number): void;
  set(index: number, output: nbformat.IOutput): void;
  clear(wait?: boolean): void;
  fromJSON(values: nbformat.IOutput[]): void;
  toJSON(): nbformat.IOutput[];
}

class OutputAreaModel implements IOutputAreaModel {
  constructor(options?: IOutputAreaModel.IOptions);
  // ... implements all IOutputAreaModel methods
}

Output Area Model

Output Area Widget

Visual component for rendering output areas with full widget lifecycle management and user interaction support.

class OutputArea extends Widget {
  constructor(options: OutputArea.IOptions);
  
  readonly contentFactory: OutputArea.IContentFactory;
  readonly model: IOutputAreaModel;
  readonly rendermime: IRenderMimeRegistry;
  readonly widgets: ReadonlyArray<Widget>;
  readonly outputLengthChanged: ISignal<this, number>;
  
  future: Kernel.IShellFuture<
    KernelMessage.IExecuteRequestMsg,
    KernelMessage.IExecuteReplyMsg
  >;
  maxNumberOutputs: number;
  readonly pendingInput: boolean;
}

Output Area Widget

Simplified Output Area

Streamlined output area variant without input handling capabilities, ideal for read-only displays.

class SimplifiedOutputArea extends OutputArea {
  constructor(options: OutputArea.IOptions);
  // Inherits all OutputArea functionality except input handling
}

Output Area Widget

Input Components

Interactive input widgets for handling kernel input requests with history and validation.

interface IStdin extends Widget {
  readonly value: Promise<string>;
}

class Stdin extends Widget implements IStdin {
  constructor(options: Stdin.IOptions);
  readonly value: Promise<string>;
  handleEvent(event: KeyboardEvent): void;
}

Output Area Widget

Core Types

// Change arguments for observable list changes
type IOutputAreaModel.ChangedArgs = IObservableList.IChangedArgs<IOutputModel>;

// Options for creating output area model
interface IOutputAreaModel.IOptions {
  values?: nbformat.IOutput[];
  trusted?: boolean;
  contentFactory?: IOutputAreaModel.IContentFactory;
}

// Options for creating output area widget
interface OutputArea.IOptions {
  model: IOutputAreaModel;
  contentFactory?: OutputArea.IContentFactory;
  rendermime: IRenderMimeRegistry;
  maxNumberOutputs?: number;
  promptOverlay?: boolean;
  translator?: ITranslator;
  inputHistoryScope?: 'global' | 'session';
  showInputPlaceholder?: boolean;
}

// Content factories for customization
interface IOutputAreaModel.IContentFactory {
  createOutputModel(options: IOutputModel.IOptions): IOutputModel;
}

interface OutputArea.IContentFactory {
  createOutputPrompt(): IOutputPrompt;
  createStdin(options: Stdin.IOptions): IStdin;
}