svelte-highlight

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"
/>

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"
/>

Fixes

• add missing exports to allow importing from svelte-highlight/styles and svelte-highlight/languages (#316, 12e7830)

This fix supports the following import variations:

// Base import for styles/languages
import { _default } from "svelte-highlight/styles";
import { _1c } from "svelte-highlight/languages";

// Explicit index
import { _default } from "svelte-highlight/styles/index";
import { typescript } from "svelte-highlight/languages/index";

// Explicit extension
import lang from "svelte-highlight/languages/1c.js"
import style from "svelte-highlight/styles/3024.js";

Fixes

• use declare const for languages and styles type definitions (#314, bd956d6)

Fixes

• fix ./*.svelte mapping; use import specifier instead of svelte

Fixes

• map ./*.svelte files correctly in package.json exports

Fixes

• add types to exports map in package.json
• optimize generated CSS using cssnano

Fixes

• add svelte entry point to exports map in package.json to address Vite development warning (#308, 321e518)

Fixes

• Re-publish package to NPM with provenance

Fixes

• Re-publish package after correctly building it

From version 7.4.0:

Features

• upgrade highlight.js to version 11.9.0

⚠️ Deprecated due to a bad publish. Please use version 7.4.1

Features

• upgrade highlight.js to version 11.9.0

Features

• upgrade highlight.js to version 11.8.0

Fixes

• line numbers should not be covered by a solid fill, custom line background color (efd675051a2195b7d3095dc8ecfa09e8c9cb13de, #271)
• line numbers column should not be covered by code if scrollable (efd675051a2195b7d3095dc8ecfa09e8c9cb13de, #271)

Features

• support highlighted lines in LineNumbers through the highlightedLines prop (48c580da, #266)

Fixes

• correctly set top/bottom padding in LineNumbers if code is updated (5da30c8, #260)

Features

• add startingLineNumber prop to LineNumbers (41f1665, #257 contributed by @pjebs)

Fixes

• reset table styles in LineNumbers (a477780, #254)

Breaking Changes

• rename langtag style props (4b84dac, #253)
  • --hljs-background -> --langtag-background
  • --hljs-foreground -> --langtag-color
  • --hljs-radius -> --langtag-border-radius
• mark code, language as required props (86acf4c, #218)

Features

• include inferred language in on:highlight event detail in HighlightAuto (2c82ca3, #252)
• add LineNumbers component to support rendering line numbers (82f9366, #248)
• upgrade highlight.js to version 11.7.0 (d463d9b, #245)

Fixes

• use HTMLAttributes from svelte/elements to correctly type $$restProps (076b2b4)

Fixes

• generate types for svelte-highlight/languages/*, svelte-highlight/styles/* (5ea7dbd, #231)

Documentation

• add dynamic import example (c179b55, #234)
• document CDN styles usage (97c8e5c, #232)
• use TypeScript in all example set-ups (bb2b074, #230)
• remove Snowpack example as it is no longer maintained (6f859bb, #229)
• update set-up instructions for SvelteKit/Vite (058066f, #223)

Features

• upgrade highlight.js to version 11.6.0 (net +2 styles)