v7.9.0

Features

• add languageNames prop to HighlightAuto to allow a subset of languages (d2dd1fa, #384)
• update languageName in LangTag to use LanguageName utility type (a24cd3e, #388)
• export LanguageName utility type (e0e42a6, #386)

---

HighlightAuto supports languageNames

You can restrict language auto-detection to a subset using the languageNames prop. This can improve performance and accuracy.

<script>
  import { HighlightAuto } from "svelte-highlight";

  const code = "const x = 42;";
</script>

<HighlightAuto {code} languageNames={["javascript", "typescript"]} />

LanguageName utility type

Use the LanguageName to strongly type the language names included by highlight.js.

import type { LanguageName } from "svelte-highlight";

v7.8.4

Fixes

• export LanguageType utility type (fdb580b, #374)

v7.8.3

Fixes

• remove @ts-check comments (dd5d681)

v7.8.2

Fixes

• update docs on pnpm usage

v7.8.1

Fixes

• upgrade highlight.js to version 11.11.1

v7.8.0

Features

• upgrade highlight.js to version 11.11.0 (+7 styles)

Fixes

• optimize preprocessed CSS StyleSheets (#357)

v7.7.0

Features

• upgrade highlight.js to version 11.10.0 (+1 style)

v7.6.1

Fixes

• avoid self-closing tag in LineNumbers to address Svelte 5 warning (02341fc, #342)

v7.6.0

Features

• add --langtag-top, --langtag-right style props

---

The Highlight components support style props to customize the langtag, if displayed.

The default value for --langtag-top and --langtag-right is 0.

<HighlightAuto
  {code}
  langtag
  --langtag-top="0.5rem"
  --langtag-right="0.5rem"
  --langtag-background="linear-gradient(135deg, #2996cf, 80%, white)"
  --langtag-color="#fff"
  --langtag-border-radius="6px"
  --langtag-padding="0.5rem"
/>

v7.5.0

Features

• add --langtag-padding style prop

---

The Highlight components support style props to customize the langtag, if displayed.

The default value for --langtag-padding is "1em".

<HighlightAuto
  {code}
  langtag
  --langtag-background="linear-gradient(135deg, #2996cf, 80%, white)"
  --langtag-color="#fff"
  --langtag-border-radius="6px"
  --langtag-padding="0.5rem"
/>