1.6.0 • Published 2 months ago

@speakeasy-api/snippet-ai-react v1.6.0

Weekly downloads
-
License
UNLICENSED
Repository
-
Last release
2 months ago

Snippet-AI React

An AI-powered React component that generates code suggestions. Learn more about Snippet-AI

Features

  • AI-powered code suggestions
  • Command palette interface (⌘K / Ctrl+K)
  • OpenAPI specification integration
  • Modern, responsive design

Integration Guide

  1. Install the package via npm:

    npm install @speakeasy-api/snippet-ai-react
  2. Implement the component:

    import { SnippetAI } from '@speakeasy-api/snippet-ai-react';
    
    function App() {
      return (
        <div>
          <SnippetAI
            codeLang="typescript"
            publishingToken="sample_speakeasy_codewords_publishing_token"
          />
        </div>
      );
    }
  3. Access the command bar using:

    • macOS: ⌘K
    • Windows/Linux: Ctrl+K
  4. Optional - To open SnippetAI using a button, an onClick handler will be attached to the first element passed into the component:

    import { SnippetAI } from '@speakeasy-api/snippet-ai-react';
    
    function App() {
      return (
        <div>
          <SnippetAI
            codeLang="typescript"
            publishingToken="sample_speakeasy_codewords_publishing_token"
          >
            <button>Ask AI</button>
          </SnippetAI>
        </div>
      );
    }

Configuration

Required Props

  • publishingToken: Public access token for authentication and access to the API

Optional Props

  • children: This takes an optional element that will be used as a trigger to open SnippetAI. This is very similar to a popover trigger component.

  • baseUrl: Override the default API endpoint (falls back to spec's server URL if not provided)

  • codeLang: Set the programming language for suggestion results. One of typescript, python, go, java, csharp, or php (defaults to typescript).

  • toggleShortcut: Set the keyboard shortcut that opens the Code Words Command Bar. Defaults to Command+K. Example: "$mod+k" (cmd+k / ctrl+k)

  • zIndex: Override the default z-index of 1000. Useful if you see your content on top of the command bar

  • suggestions: Sets a searchable list of suggestions to easily access when launching the command bar. Example: suggestions="Create a function that gets all workspaces", "Create a function that gets a user by id"

1.6.0

2 months ago

1.5.0

2 months ago

1.4.0

2 months ago

1.3.0

2 months ago

1.2.0

2 months ago

1.1.2

3 months ago

1.1.1

3 months ago

1.1.0

3 months ago

1.0.1

3 months ago

1.0.0

3 months ago