Nicholai 4e92884d51 feat: add Claude-style artifacts for persistent workspace documents
Implement a comprehensive artifacts system that allows users to create, edit,
and manage persistent documents alongside conversations, inspired by Claude's
artifacts feature.

Key Features:
- AI model integration with system prompts teaching artifact usage
- Inline preview cards in chat messages with collapsible previews
- On-demand side panel overlay (replaces split view)
- Preview/Code toggle for rendered markdown vs raw content
- Artifacts sidebar for managing multiple artifacts per thread
- Monaco editor integration for code artifacts
- Autosave with debounced writes and conflict detection
- Diff preview system for proposed updates
- Keyboard shortcuts and quick switcher
- Export/import functionality

Backend (Rust):
- New artifacts module in src-tauri/src/core/artifacts/
- 12 Tauri commands for CRUD, proposals, and export/import
- Atomic file writes with SHA256 hashing
- Sharded history storage with pruning policy
- Path traversal validation and UTF-8 enforcement

Frontend (TypeScript/React):
- ArtifactSidePanel: Claude-style overlay panel from right
- InlineArtifactCard: Preview cards embedded in chat
- ArtifactsSidebar: Floating list for artifact switching
- Enhanced ArtifactActionMessage: Parses AI metadata from content
- useArtifacts: Zustand store with autosave and conflict resolution

Types:
- Extended ThreadMessage.metadata with ArtifactAction
- ProposedContentRef supports inline and temp storage
- MIME-like content_type values for extensibility

Platform:
- Fixed platform detection to check window.__TAURI__
- Web service stubs for browser mode compatibility
- Updated assistant system prompts in both extension and web-app

This implements the complete workflow studied from Claude:
1. AI only creates artifacts when explicitly requested
2. Inline cards appear in chat with preview buttons
3. Side panel opens on demand, not automatic split
4. Users can toggle Preview/Code views and edit content
5. Autosave and version management prevent data loss
2025-11-02 12:19:36 -07:00
..
2025-10-15 14:43:58 +07:00
2025-10-28 17:26:27 +07:00
2025-07-10 21:23:04 +07:00
2024-02-15 08:38:05 +07:00
2025-07-12 20:15:45 +07:00

@janhq/core

This module includes functions for communicating with core APIs, registering app extensions, and exporting type definitions.

Usage

Import the package

// Web / extension runtime
import * as core from '@janhq/core'

Build an Extension

  1. Download an extension template, for example, https://github.com/janhq/extension-template.

  2. Update the source code:

    1. Open index.ts in your code editor.

    2. Rename the extension class from SampleExtension to your preferred extension name.

    3. Import modules from the core package.

      import * as core from '@janhq/core'
      
    4. In the onLoad() method, add your code:

      // Example of listening to app events and providing customized inference logic:
      import * as core from '@janhq/core'
      
      export default class MyExtension extends BaseExtension {
        // On extension load
        onLoad() {
          core.events.on(MessageEvent.OnMessageSent, (data) => MyExtension.inference(data, this))
        }
      
        // Customized inference logic
        private static inference(incomingMessage: MessageRequestData) {
          // Prepare customized message content
          const content: ThreadContent = {
            type: ContentType.Text,
            text: {
              value: "I'm Jan Assistant!",
              annotations: [],
            },
          }
      
          // Modify message and send out
          const outGoingMessage: ThreadMessage = {
            ...incomingMessage,
            content,
          }
        }
      }
      
  3. Build the extension:

    1. Navigate to the extension directory.
    2. Install dependencies.
      yarn install
      
    3. Compile the source code. The following command keeps running in the terminal and rebuilds the extension when you modify the source code.
      yarn build
      
    4. Select the generated .tgz from Jan > Settings > Extension > Manual Installation.