json-lighter

json-lighter

A lightweight JSON syntax highlighter for the web.

Installation

npm install json-lighter

Usage

import { JsonLighter } from "json-lighter";

const lighter = new JsonLighter({
  spaces: 2,
  colors: {
    punctuation: "gray",
    string: "orange",
    number: "green",
    boolean: "purple",
    null: "blue",
  },
});

// Inject the CSS into the document
lighter.injectCSS();

// Highlight JSON
const html = lighter.highlight(`
  {
    "string": "value",
    "number": 123.123,
    "boolean": false,
    "null": null
  }
`);

## API

### `JsonLighter(options)`

Creates a new instance of JsonLighter.

#### Options

- `spaces` (number): Number of spaces for indentation.
- `colors` (object): Custom colors for different JSON elements
  - `punctuation` (string): Color for punctuation characters
  - `string` (string): Color for string values
  - `number` (string): Color for number values
  - `boolean` (string): Color for boolean values
  - `null` (string): Color for null values

### `lighter.injectCSS()`

Injects the necessary CSS into the document's head. Call this once before using the `highlight` method.

### `lighter.highlight(json)`

Highlights the provided JSON string and returns HTML with syntax highlighting.

#### Parameters

- `json` (string): The JSON string to highlight

#### Returns

- (string): HTML string with syntax highlighting