New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →

@scalar/api-client

Package Overview

Dependencies

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

@scalar/api-client

the open source API testing client

2.2.39
Source
npm

Version published: last week

Weekly downloads: 18K; decreased by-20.54%

Maintainers: 8

Weekly downloads

Created: last year

Source

Scalar API Client

The Scalar API Client is a powerful tool designed to simplify API testing and integration. This versatile package offers multiple usage options:

standalone application for quick and easy API testing
embeddable component in various frontend environments
customizable module that can be integrated into existing projects

Features

Intuitive interface for sending API requests and viewing responses
Support for multiple authentication methods
Real-time request/response logging
Customizable request headers and parameters
Response visualization and formatting options

Installation

npm install @scalar/api-client

Usage

App

You can mount the full-blown API Client to your DOM like this:

<!-- index.html -->
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0" />
    <title>Scalar API Client App</title>
  </head>
  <body>
    <div
      id="scalar-client"
      class="scalar-app scalar-client"></div>
    <script
      type="module"
      src="./main.js"></script>
  </body>
</html>

// main.js
import { createApiClientApp } from '@/App'

// Initialize
await createApiClientApp(document.getElementById('scalar-client'), {
  spec: {
    url: 'https://cdn.jsdelivr.net/npm/@scalar/galaxy/dist/latest.json',
  },
  proxyUrl: 'https://proxy.scalar.com',
})

Or you can mount a more compact version, which is living in a modal:

// main.js
import { createApiClientApp } from '@/App'

// Initialize
const { open } = await createApiClientApp(
  document.getElementById('scalar-client'),
  {
    spec: {
      url: 'https://cdn.jsdelivr.net/npm/@scalar/galaxy/dist/latest.json',
    },
    proxyUrl: 'https://proxy.scalar.com',
  },
)

// Open the API client right-away
open()

// Or: Open a specific operation
// open({
//   method: 'GET',
//   path: '/me',
// })

Configuration

/** Configuration options for the Scalar API client */
export type ClientConfiguration = {
  /** The Swagger/OpenAPI spec to render */
  spec: SpecConfiguration
  /** Pass in a proxy to the API client */
  proxyUrl?: string
  /** Pass in a theme API client */
  themeId?: string
  /** Whether to show the sidebar */
  showSidebar?: boolean
  /** Whether dark mode is on or off initially (light mode) */
  // darkMode?: boolean
  /** Key used with CTRL/CMD to open the search modal (defaults to 'k' e.g. CMD+k) */
  searchHotKey?:
    | 'a'
    | 'b'
    | 'c'
    | 'd'
    | 'e'
    | 'f'
    | 'g'
    | 'h'
    | 'i'
    | 'j'
    | 'k'
    | 'l'
    | 'm'
    | 'n'
    | 'o'
    | 'p'
    | 'q'
    | 'r'
    | 's'
    | 't'
    | 'u'
    | 'v'
    | 'w'
    | 'x'
    | 'y'
    | 'z'
}

Available Methods

The following methods are returned from the createApiClientModal call:

open

Opens the modal while allowing you to select which request to open to

open({ path: string; method: RequestMethod })

updateConfig

Allows you to update the config at any time, this will clear your current state and re-import a fresh spec!

updateConfig(newConfig: ClientConfiguration, mergeConfigs?: boolean): void

Community

We are API nerds. You too? Let’s chat on Discord: https://discord.gg/scalar

License

The source code in this repository is licensed under MIT.

Keywords

FAQs

What is @scalar/api-client?

Is @scalar/api-client popular?

Is @scalar/api-client well maintained?

Package last updated on 28 Jan 2025

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install