open-index/open-npm huggingface dataset:
npm package: @scalar/icons
Description: Scalar Icons
Author: Scalar
Latest version: 0.7.2

# Scalar Icons

This package provide a set of icons for use Scalar applications based on [Phosphor Icons](https://phosphoricons.com/). It uses a custom Vue implementation based on the [`@phosphor-icons/vue`](https://github.com/phosphor-icons/vue) package which allows for tree shaking.

For a full list of available icons see [Phosphor Icons](https://phosphoricons.com/#beacon). The icon will be available from this package as `ScalarIcon<Icon Name in PascalCase>`.

## Installation

```bash
pnpm i @scalar/icons
```

## Usage

```vue
<script setup lang="ts">
import { ScalarIconMagnifyingGlass } from '@scalar/icons'
</script>

<template>
  <!-- You can size and color the icons easily using Tailwind -->
  <ScalarIconMagnifyingGlass class="size-4 text-c-3" weight="bold" />
</template>
```

## Differences from [`@phosphor-icons/vue`](https://github.com/phosphor-icons/vue)

There are a few differences between this implementation and [`@phosphor-icons/vue`](https://github.com/phosphor-icons/vue) to better it align with our Scalar stack.

* **Size & Color Props:** Rather than using props you can use Tailwind classes (e.g. `size-<Number>` or `text-<color>`) to adjust the size and color of the icons. By default the icons are sized to `1em` (the size of the text around it) and set to the currentColor.
* **Mirrored Prop:** If you need to mirror an icon (e.g. for a RTL layout) you can use the `-scale-x-100` Tailwind class.
* **A11y Attributes:** In order to make the icons accessible by default icons have the `aria-hidden` and `role="presentation"` attributes set. If you set the `label` prop then the `aria-label` will be set instead.

## Development

To build the icons we use a icon generation script modified from the [`@phosphor-icons/vue`](https://github.com/phosphor-icons/vue) [`assemble.ts`](https://github.com/phosphor-icons/vue/blob/main/bin/assemble.ts) script. The icon SVGs are pulled from [`@phosphor-icons/core`](https://github.com/phosphor-icons/core) and compiled into individual Vue components for tree shaking.

To generate the icons run:

```bash
pnpm generate:icons
```

This will also update / override the exports in the index file at `src/index.ts`. See also the [development docs for `@phosphor-icons/vue`](https://github.com/phosphor-icons/vue/tree/main?tab=readme-ov-file#development).

## 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](https://github.com/scalar/scalar/blob/main/LICENSE).
npm package: @scalar/json-diff
Description: Diffing and conflict resolution tool for JSON objects
Author: Scalar
Latest version: 0.0.4

# Scalar JSON Diff

[![Version](https://img.shields.io/npm/v/%40scalar/json-diff)](https://www.npmjs.com/package/@scalar/json-diff)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/json-diff)](https://www.npmjs.com/package/@scalar/json-diff)
[![License](https://img.shields.io/npm/l/%40scalar%2Fjson-diff)](https://www.npmjs.com/package/@scalar/json-diff)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

This package provides a way to compare two OpenAPI definitions and get the differences, resolve conflicts and return conflicts that need to be resolved manually.

# Quickstart

```ts
import { apply, diff, merge } from '@scalar/json-diff'

const baseDocument = {
  openapi: '3.0.0',
  info: {
    title: 'Simple API',
    description: 'A small OpenAPI specification example',
    version: '1.0.0',
  },
}

const documentV1 = {
  openapi: '3.0.0',
  info: {
    title: 'Simple API',
    description: 'A small OpenAPI specification example',
    version: '1.0.0',
  },
  change: 'This is a new property',
}

const documentV2 = {
  openapi: '3.0.0',
  info: {
    title: 'Simple API',
    description: 'A small OpenAPI specification example',
    version: '1.0.1',
  },
}

// Merge the changes of both versions with the same parent document
const { diffs, conflicts } = merge(
  diff(baseDocument, documentV1),
  diff(baseDocument, documentV2),
)

// Apply changes from v1 and v2 to the parent document to get the final document
const finalDocument = apply(baseDocument, diffs)
```

## 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](https://github.com/scalar/scalar/blob/main/LICENSE).
npm package: @scalar/nextjs-openapi
Description: Automatically generate an OpenAPI schema from a Nextjs API
Author: Scalar
Latest version: 0.3.7

# [PRE-ALPHA] Scalar Next.js API Reference Handler

[![Version](https://img.shields.io/npm/v/%40scalar/nextjs-openapi)](https://www.npmjs.com/package/@scalar/nextjs-openapi)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/nextjs-openapi)](https://www.npmjs.com/package/@scalar/nextjs-openapi)
[![License](https://img.shields.io/npm/l/%40scalar%2fnextjs-openapi)](https://www.npmjs.com/package/@scalar/nextjs-openapi)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

This plugin automatically generates an OpenAPI schema file based on a Next.js API.

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="https://github.com/scalar/scalar/assets/2039539/5837adad-a605-4edb-90ec-b929ff2b803b">
  <source media="(prefers-color-scheme: light)" srcset="https://github.com/scalar/scalar/assets/2039539/4f58202d-f40f-47b3-aeaa-44681b424a45">
  <img alt="Screenshot of an API Reference" src="https://github.com/scalar/scalar/assets/2039539/4f58202d-f40f-47b3-aeaa-44681b424a45">
</picture>

## Installation

```bash
npm install @scalar/nextjs-openapi
```

## Usage

Currently this plugin is strictly for the app router with typescript. Currently we generate the spec from the Request/Context types as well as the returns in the HTTP method. You can find a simple example in the `playground` folder.

Also is currently under heavy development, all API's are likely to change. However we are looking for feedback! If you have an open API OR would like to share a private one, let us know so we can test the integration with it.

You just need to drop this file into the `app/api/openapi/[[...openapi]]` folder. You can rename the openapi folder to whatever you like but the dynamic folder must be catch-all as we will be serving two endpoints.

```ts
// app/api/openapi/[[...slug]]/route.ts
import { OpenAPI } from '@scalar/nextjs-openapi'

export const GET = OpenAPI().GET
```
npm package: @scalar/openapi-types
Description: Modern OpenAPI types
Author: Scalar
Latest version: 0.7.0

# Scalar OpenAPI Types

[![CI](https://github.com/scalar/scalar/actions/workflows/ci.yml/badge.svg)](https://github.com/scalar/scalar/actions/workflows/ci.yml)
[![Contributors](https://img.shields.io/github/contributors/scalar/scalar)](https://github.com/scalar/scalar/graphs/contributors)
[![GitHub License](https://img.shields.io/github/license/scalar/scalar)](https://github.com/scalar/scalar/blob/main/LICENSE)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

Modern OpenAPI parser written in TypeScript, with support for Swagger 2.0, OpenAPI 3.0, 3.1 and 3.2

## Installation

```bash
npm add @scalar/openapi-types
```

## Usage

```ts
import type { OpenAPI } from '@scalar/openapi-types'

const file: OpenAPI.Document = {
  openapi: '3.1.0',
  info: {
    title: 'Hello World',
    version: '1.0.0',
  },
  paths: {},
}
```

## 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](https://github.com/scalar/scalar/blob/main/LICENSE).
npm package: @scalar/play-button
Description: A minimal package to test any OpenAPI/Swagger document with the Scalar API Client
Author: Scalar
Latest version: 0.3.31

# Scalar Play Button

Have your own custom docs and want API testing built in? Check out our new release Scalar ▶️ Button which brings up Scalar's simple API Client for you to play around with an endpoint right away

## Installation and Usage

Add the Scalar Play Button to your page

```html
<script
  id="scalar-play-button-script"
  data-url="https://cdn.jsdelivr.net/npm/@scalar/galaxy/dist/latest.yaml"></script>
<script src="https://cdn.jsdelivr.net/npm/@scalar/play-button"></script>
```

then add a button with the class and optional scalar-operation-id

```html
<button
  scalar-operation-id="getPetById"
  class="scalar-play-button">
  Try it Out
</button>
```

Now when that button is clicked the Scalar API Client will open up :)
npm package: @scalar/postman-to-openapi
Description: Converts Postman collections to OpenAPI documents
Author: Scalar
Latest version: 0.6.1

# Postman to OpenAPI Converter

[![Version](https://img.shields.io/npm/v/%40scalar/postman-to-openapi)](https://www.npmjs.com/package/@scalar/postman-to-openapi)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/postman-to-openapi)](https://www.npmjs.com/package/@scalar/postman-to-openapi)
[![License](https://img.shields.io/npm/l/%40scalar%2Fpostman-to-openapi)](https://www.npmjs.com/package/@scalar/postman-to-openapi)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

Convert Postman collections to [the open standard OpenAPI](https://github.com/OAI/OpenAPI-Specification). Free the postman!

## Installation

```bash
npm install @scalar/postman-to-openapi
```

## Usage

```ts
import { convert } from '@scalar/postman-to-openapi'

// Free the postman!
const result = await convert(myPostmanCollection)

console.log(result)
```

## Community

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

## Thank you!

This package is based on the existing [`postman-to-openapi`](https://github.com/joolfe/postman-to-openapi) by [@joolfe](https://github.com/joolfe). We update the code and adapted it to our use case. You might consider our package the modern successor.
npm package: @scalar/pre-post-request-scripts
Description: Execute pre-request and post-response scripts in the Scalar API Client
Author: Scalar
Latest version: 0.4.1

# Scalar Scripts

[![Version](https://img.shields.io/npm/v/%40scalar/scripts)](https://www.npmjs.com/package/@scalar/pre-post-request-scripts)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/scripts)](https://www.npmjs.com/package/@scalar/pre-post-request-scripts)
[![License](https://img.shields.io/npm/l/%40scalar%2Fmock-server)](https://www.npmjs.com/package/@scalar/pre-post-request-scripts)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

Post-response scripts for your OpenAPI documents.

Scripts are executed with the official Postman sandbox runtime (`postman-sandbox`), so the `pm` API behavior follows Postman semantics.

> Note: This is intended to be used as a plugin with @scalar/api-client.

## Installation

```bash
npm install @scalar/pre-post-request-scripts
```

## Usage

```ts
import { createApiClientWeb } from '@scalar/api-client/layouts/Web'
import { postResponseScriptsPlugin } from '@scalar/pre-post-request-scripts'
import '@scalar/api-client/style.css'

createApiClientWeb(
  document.getElementById('app'),
  {
    proxyUrl: 'https://proxy.scalar.com',
    // Load the plugin
    plugins: [
      postResponseScriptsPlugin()
    ],
  },
)
```

## Script Runtime

- Uses the official Postman sandbox package: <https://github.com/postmanlabs/postman-sandbox>
- Scripts run as Postman `test` scripts, so `pm.response`, `pm.test`, and `pm.expect` are provided by Postman
- Script results are surfaced in the Tests panel via the plugin

## 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](https://github.com/scalar/scalar/blob/main/LICENSE).
npm package: @scalar/react-renderer
Description: Render React components in Vue
Author: Scalar
Latest version: 0.4.1

# Scalar React Renderer

[![Version](https://img.shields.io/npm/v/%40scalar/react-renderer)](https://www.npmjs.com/package/@scalar/react-renderer)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/react-renderer)](https://www.npmjs.com/package/@scalar/react-renderer)
[![License](https://img.shields.io/npm/l/%40scalar%2Freact-renderer)](https://www.npmjs.com/package/@scalar/react-renderer)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

A Vue component to render React components inside Vue.

## Installation

```bash
npm install @scalar/react-renderer
```

## Usage

```vue
<script setup lang="ts">
import { ReactRenderer } from '@scalar/react-renderer'
import { MyReactComponent } from './components/MyReactComponent'
</script>

<template>
  <ReactRenderer :component="MyReactComponent" my-custom-prop="foobar" />
</template>

```

## 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](https://github.com/scalar/scalar/blob/main/LICENSE).
npm package: @scalar/server-side-rendering
Description: Server-side rendering for the Scalar API Reference using bundled JS
Author: Scalar
Latest version: 0.1.1

# Scalar Server-Side Rendering

[![Version](https://img.shields.io/npm/v/%40scalar/server-side-rendering)](https://www.npmjs.com/package/@scalar/server-side-rendering)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/server-side-rendering)](https://www.npmjs.com/package/@scalar/server-side-rendering)
[![License](https://img.shields.io/npm/l/%40scalar%2Fserver-side-rendering)](https://www.npmjs.com/package/@scalar/server-side-rendering)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

Server-side render the Scalar API Reference with client-side hydration. Pre-renders HTML on the server for instant content, then hydrates with the standalone bundle for full interactivity.

## Installation

```bash
npm install @scalar/server-side-rendering
```

## Usage

Render the HTML and JS once at startup, then serve from memory.

```ts
import { renderApiReference, getJsAsset } from '@scalar/server-side-rendering'

// Render once at startup
const html = await renderApiReference({
  config: {
    url: 'https://registry.scalar.com/@scalar/apis/galaxy?format=json',
  },
  pageTitle: 'My API Reference',
})

const js = getJsAsset()

// Serve the JS bundle for client-side hydration
app.get('/scalar/scalar.js', (c) => {
  return c.body(js, {
    headers: { 'content-type': 'application/javascript' },
  })
})

// Serve the pre-rendered HTML
app.get('/scalar', (c) => c.html(html))
```

## 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](https://github.com/scalar/scalar/blob/main/LICENSE).
npm package: @scalar/snippetz
Description: [![Version](https://img.shields.io/npm/v/%40scalar/snippetz)](https://www.npmjs.com/package/@scalar/snippetz) [![Downloads](https://img.shields.io/npm/dm/%40scalar/snippetz)](https://www.npmjs.com/package/@scalar/snippetz) [![License](https://img.shields.
Author: Scalar
Latest version: 0.8.0

# Snippetz

[![Version](https://img.shields.io/npm/v/%40scalar/snippetz)](https://www.npmjs.com/package/@scalar/snippetz)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/snippetz)](https://www.npmjs.com/package/@scalar/snippetz)
[![License](https://img.shields.io/npm/l/%40scalar%2Fsnippetz)](https://www.npmjs.com/package/@scalar/snippetz)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

A modern way to generate HTTP request examples for different languages and libraries.

## Installation

```bash
npm install @scalar/snippetz
```

## Usage

```ts
import { snippetz } from '@scalar/snippetz'

const snippet = snippetz().print('node', 'undici', {
  url: 'https://example.com',
})

/* Output */

// import { request } from 'undici'
//
// const { statusCode, body } = await request(
//   'https://example.com',
// )
```

## API

### Get all plugins

```ts
import { snippetz } from '@scalar/snippetz'

const snippet = snippetz().plugins()

/* Output */

// [
//   {
//     target: 'node',
//     client: 'undici',
//   }
// ]
```

### Check if a plugin is loaded

```ts
import { snippetz } from '@scalar/snippetz'

const snippet = snippetz().hasPlugin('node', 'undici')

/* Output */

// true
```

### Lean usage

You can also just use one specific plugin to keep your bundle size small.

```ts
import { nodeUndici } from '@scalar/snippetz/plugins/node/undici'

const result = nodeUndici.generate({
  url: 'https://example.com',
})

console.log(source)

// import { request } from 'undici'

// const { statusCode, body } = await request(
//   'url': 'https://example.com',
// )
```

## 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](https://github.com/scalar/scalar/blob/main/LICENSE).
npm package: @scalar/swagger-editor
Description: an editor which is tailored to write OpenAPI spec
Author: Scalar
Latest version: 1.0.2

# Scalar Swagger Editor

[![Version](https://img.shields.io/npm/v/%40scalar/swagger-editor)](https://www.npmjs.com/package/@scalar/swagger-editor)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/swagger-editor)](https://www.npmjs.com/package/@scalar/swagger-editor)
[![License](https://img.shields.io/npm/l/%40scalar%2Fswagger-editor)](https://www.npmjs.com/package/@scalar/swagger-editor)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/8HeZcRGPFS)

## Installation

```bash
npm install @scalar/swagger-editor
```

## Usage

```vue
<script setup>
import { SwaggerEditor } from '@scalar/swagger-editor'
</script>

<template>
  <SwaggerEditor value="{ … }" />
</template>
```
npm package: @scalar/swagger-parser
Description: parse OpenAPI specs
Author: Scalar
Latest version: 0.5.23

# Scalar Swagger Parser

[![Version](https://img.shields.io/npm/v/%40scalar/swagger-parser)](https://www.npmjs.com/package/@scalar/swagger-parser)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/swagger-parser)](https://www.npmjs.com/package/@scalar/swagger-parser)
[![License](https://img.shields.io/npm/l/%40scalar%2Fswagger-parser)](https://www.npmjs.com/package/@scalar/swagger-parser)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/8HeZcRGPFS)

## Installation

```bash
npm install @scalar/swagger-parser
```

## Usage

```js
import { parse } from '@scalar/swagger-parser'

parse(value)
  .then((spec) => {
    console.log(spec)
  })
  .catch((error) => {
    console.error(error)
  })
```
npm package: @scalar/ts-to-openapi
Description: Convert typescript types to openapi spec compliant json
Author: Scalar
Latest version: 0.2.1

# Scalar Typescript Type to OpenAPI Spec Converter

[![Version](https://img.shields.io/npm/v/%40scalar/type-to-openapi)](https://www.npmjs.com/package/@scalar/type-to-openapi)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/type-to-openapi)](https://www.npmjs.com/package/@scalar/type-to-openapi)
[![License](https://img.shields.io/npm/l/%40scalar%type-to-openapi)](https://www.npmjs.com/package/@scalar/type-to-openapi)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

This an extremely early version of a typescript type to OpenAPI document converter. The goal is to take types that one
would normally use when developing an API and convert them to an OpenAPI document which will then be used to power the
standalone Scalar API References.

This package is not meant to be used directly, but will be the core technology behind framework specific integrations
starting with Next.js.
npm package: @scalar/use-clipboard
Description: tiny wrapper around the clipboard API
Author: Scalar
Latest version: 0.5.13

# Scalar useClipboard()

[![Version](https://img.shields.io/npm/v/%40scalar/use-clipboard)](https://www.npmjs.com/package/@scalar/use-clipboard)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/use-clipboard)](https://www.npmjs.com/package/@scalar/use-clipboard)
[![License](https://img.shields.io/npm/l/%40scalar%2Fuse-clipboard)](https://www.npmjs.com/package/@scalar/use-clipboard)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/8HeZcRGPFS)

## Installation

```bash
npm install @scalar/use-clipboard
```

## Usage

```js
import { useClipboard } from '@scalar/use-clipboard'

const { copyToClipboard } = useClipboard()

copyToClipboard(
  'The average distance between the Earth and the Moon is 384 400 km (238 855 miles).',
)
```
npm package: @scalar/use-codemirror
Description: CodeMirror for Vue
Author: Scalar
Latest version: 0.14.11

# CodeMirror Hook for Vue

[![Version](https://img.shields.io/npm/v/%40scalar/use-codemirror)](https://www.npmjs.com/package/@scalar/use-codemirror)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/use-codemirror)](https://www.npmjs.com/package/@scalar/use-codemirror)
[![License](https://img.shields.io/npm/l/%40scalar%2Fuse-codemirror)](https://www.npmjs.com/package/@scalar/use-codemirror)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

## Installation

```bash
npm install @scalar/use-codemirror
```

## Usage

```vue
<script setup>
import { useCodeMirror } from '@scalar/use-codemirror'
import { ref } from 'vue'

const editor = ref(null)

const { codeMirror, setCodeMirrorContent } = useCodeMirror({
  codeMirrorRef: editor,
  content: '{ "foo": "bar" }',
  language: 'json',
  lineNumbers: true,
  onChange: (value) => {
    console.log('Content changed:', value)
  },
})
</script>

<template>
  <div ref="editor" />
</template>
```

## 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](https://github.com/scalar/scalar/blob/main/LICENSE).
npm package: @scalar/use-hooks
Description: Utility hooks for Scalar
Author: Scalar
Latest version: 0.4.2

# Scalar Use Hooks

A collection of utility hooks for Scalar.

## Installation

```bash
npm add @scalar/use-hooks
```

## Available Hooks

- [useClipboard](./src/useClipboard/README.md)
- [useColorMode](./src/useColorMode/README.md)
npm package: @scalar/use-keyboard-event
Description: keyboard shortcuts for Vue
Author: Scalar
Latest version: 0.5.9

# Scalar useKeyboardEvent()

[![Version](https://img.shields.io/npm/v/%40scalar/use-keyboard-event)](https://www.npmjs.com/package/@scalar/use-keyboard-event)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/use-keyboard-event)](https://www.npmjs.com/package/@scalar/use-keyboard-event)
[![License](https://img.shields.io/npm/l/%40scalar%2Fuse-keyboard-event)](https://www.npmjs.com/package/@scalar/use-keyboard-event)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/8HeZcRGPFS)

## Installation

```bash
npm install @scalar/use-keyboard-event
```

## Usage

```js
import { useKeyboardEvent } from '@scalar/use-keyboard-event'

// Control/Cmd + K
useKeyboardEvent({
  keyList: ['k'],
  withCtrlCmd: true,
  handler: () => { … },
})
```
npm package: @scalar/use-toasts
Description: display toasts in Vue
Author: Scalar
Latest version: 0.10.1

# Scalar useToasts()

[![Version](https://img.shields.io/npm/v/%40scalar/use-toasts)](https://www.npmjs.com/package/@scalar/use-toasts)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/use-toasts)](https://www.npmjs.com/package/@scalar/use-toasts)
[![License](https://img.shields.io/npm/l/%40scalar%2Fuse-toasts)](https://www.npmjs.com/package/@scalar/use-toasts)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/8HeZcRGPFS)

## Installation

```bash
npm install @scalar/use-toasts
```

## Usage

```vue
// App.vue
<script setup>
import { ScalarToasts } from '@scalar/use-toasts'
</script>
<template>
  <ScalarToasts />
</template>
```

```vue
// ChildComponent.vue
<script setup>
import { useToasts } from '@scalar/use-toasts'

const { toast } = useToasts()

const sendMessage = () => {
  toast('This is a message from the toaster!', 'success', { timeout: 2000 })
}
</script>
```
npm package: @scalar/use-tooltip
Description: use tooltips with Vue
Author: Scalar
Latest version: 1.1.0
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# Scalar useTooltip()

[![Version](https://img.shields.io/npm/v/%40scalar/use-tooltip)](https://www.npmjs.com/package/@scalar/use-tooltip)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/use-tooltip)](https://www.npmjs.com/package/@scalar/use-tooltip)
[![License](https://img.shields.io/npm/l/%40scalar%2Fuse-tooltip)](https://www.npmjs.com/package/@scalar/use-tooltip)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

## Installation

```bash
npm install @scalar/use-tooltip
```
npm package: @scalar/void-server
Description: Mirror for HTTP requests
Author: Scalar
Latest version: 2.4.4

# Scalar Void Server

[![Version](https://img.shields.io/npm/v/%40scalar/void-server)](https://www.npmjs.com/package/@scalar/void-server)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/void-server)](https://www.npmjs.com/package/@scalar/void-server)
[![License](https://img.shields.io/npm/l/%40scalar%2Fvoid-server)](https://www.npmjs.com/package/@scalar/void-server)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

An Hono server that responds with the request data. Kind of a mirror for HTTP requests.

It's running on <https://void.scalar.com>, feel free to use it.

## Examples

- https://void.scalar.com/
- https://void.scalar.com/404
- https://void.scalar.com/foobar.html
- https://void.scalar.com/foobar.json
- https://void.scalar.com/foobar.xml
- https://void.scalar.com/foobar.zip
- https://void.scalar.com/?foo=bar&foo=rab

## Installation

```bash
npm add @scalar/void-server
```

## Usage

```ts
import { serve } from '@hono/node-server'
import { createVoidServer } from '@scalar/void-server'

// Create the server instance
const app = await createVoidServer()

// Start the server
serve(
  {
    fetch: app.fetch,
    port: 3000,
  },
  (info) => {
    console.log(`Listening on http://localhost:${info.port}`)
  },
)
```

## 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](https://github.com/scalar/scalar/blob/main/packages/void-server/LICENSE).