# code/highlighter (zidane-ui)

Import: `import { … } from 'zidane-ui'`. Source: [ui/src/code/highlighter.ts](https://github.com/Tahul/zidane/blob/main/ui/src/code/highlighter.ts).

## Functions

### `createCodeHighlighter`

Function.

Creates a highlighter with its own cache and, given a factory, its own worker.

```ts
function createCodeHighlighter(options?: CodeHighlighterOptions): CodeHighlighter
```

**Parameters**

- `options?` (`CodeHighlighterOptions`, default `{}`): The [`CodeHighlighterOptions`](https://zidane.si/docs/reference/ui-code-highlighter.md#CodeHighlighterOptions).

**Returns** `CodeHighlighter`: The [`CodeHighlighter`](https://zidane.si/docs/reference/ui-code-highlighter.md#CodeHighlighter).

Source: [ui/src/code/highlighter.ts:138](https://github.com/Tahul/zidane/blob/main/ui/src/code/highlighter.ts#L138)

## Interfaces

### `CodeHighlighter`

Interface.

Highlights code to HTML, with a result cache. Create one per app with [`createCodeHighlighter`](https://zidane.si/docs/reference/ui-code-highlighter.md#createCodeHighlighter).

```ts
interface CodeHighlighter
```

**Properties**

- `cached` (`(code: string, lang: string, theme: string) => string | null | undefined`): The settled result of an earlier `CodeHighlighter.highlight`, read synchronously, so a
  block highlighted before paints colored on its first frame.
- `highlight` (`(code: string, lang: string, theme: string) => Promise<string | null>`): Highlights code, or returns the cached result.

Source: [ui/src/code/highlighter.ts:46](https://github.com/Tahul/zidane/blob/main/ui/src/code/highlighter.ts#L46)

### `CodeHighlighterOptions`

Interface.

Options of [`createCodeHighlighter`](https://zidane.si/docs/reference/ui-code-highlighter.md#createCodeHighlighter).

```ts
interface CodeHighlighterOptions
```

**Properties**

- `createWorker?` (`() => Worker`): Starts a worker running `zidane-ui/code/highlight.worker`. Called once, on the first
  highlight. Without it, highlighting runs on the main thread.

Source: [ui/src/code/highlighter.ts:37](https://github.com/Tahul/zidane/blob/main/ui/src/code/highlighter.ts#L37)

### `HighlightRequest`

Interface.

A request to the highlighting worker.

```ts
interface HighlightRequest
```

**Properties**

- `code` (`string`): The code.
- `id` (`number`): Correlates the response.
- `lang` (`string`): A language name or alias.
- `theme` (`string`): A bundled code theme id.

Source: [ui/src/code/highlighter.ts:17](https://github.com/Tahul/zidane/blob/main/ui/src/code/highlighter.ts#L17)

### `HighlightResponse`

Interface.

The highlighting worker's answer to a [`HighlightRequest`](https://zidane.si/docs/reference/ui-code-highlighter.md#HighlightRequest).

```ts
interface HighlightResponse
```

**Properties**

- `html` (`string | null`): The highlighted HTML, or `null` for a language with no lexer.
- `id` (`number`): The request's id.

Source: [ui/src/code/highlighter.ts:29](https://github.com/Tahul/zidane/blob/main/ui/src/code/highlighter.ts#L29)