svelte-rune-highlight
Version:
A highlight library for Svelte 5 with Rune
51 lines (50 loc) • 2.26 kB
TypeScript
/**
* HighlightAuto.svelte
*
* A syntax-highlighting component that uses Highlight.js to automatically detect
* the programming language of the provided code string and render it with
* syntax highlighting. Supports line numbers and highlighted lines.
*
* ## Props
* @prop {string} [code=''] - The raw code to highlight.
* @prop {boolean} [langtag=false] - Whether to display the detected language as a tag overlay.
* @prop {boolean} [numberLine] - Whether to show line numbers.
* @prop {boolean} [hideBorder] - Hide the border between line numbers and code.
* @prop {boolean} [wrapLines] - Wrap long lines instead of horizontal scrolling.
* @prop {number} [startingLineNumber=1] - Starting line number.
* @prop {number[]} [highlightedLines=[]] - Individual lines to highlight.
* @prop {[number, number][]} [highlightedRanges=[]] - Ranges of lines to highlight.
* @prop {string} [backgroundColor] - Background color for line numbers.
* @prop {'static' | 'relative' | 'absolute' | 'sticky'} [position='sticky'] - Position style for line numbers.
* @prop {string[]} [languages] - Optional subset of languages to detect from.
* @prop {string} [class] - Additional classes for the root element.
*
* ## Behavior
* - Automatically detects language via `hljs.highlightAuto`.
* - Falls back to plaintext if detection fails or code is empty.
* - Can optionally restrict detection to specific languages for better accuracy.
* - When `numberLine` is true, renders a table with line numbers; otherwise uses `LangTag.svelte`.
*/
import './styles.css';
import type { HighlightAutoProps } from './types';
/**
* [Go to docs](https://svelte-rune-highlight.codewithshin.com/)
* ## Props
* @prop code = ''
* @prop langtag = false
* @prop numberLine
* @prop hideBorder
* @prop wrapLines
* @prop startingLineNumber = 1
* @prop highlightedLines = []
* @prop highlightedRanges = []
* @prop backgroundColor
* @prop position = 'sticky'
* @prop languages
* @prop replaceLib
* @prop class: className
* @prop ...restProps
*/
declare const HighlightAuto: import("svelte").Component<HighlightAutoProps, {}, "">;
type HighlightAuto = ReturnType<typeof HighlightAuto>;
export default HighlightAuto;