Markdown Display View

https://github.com/zjc19891106/markdowndisplayview
Admin
A high-performance iOS Markdown rendering component built on TextKit 2 with streaming rendering...
Tokens:39,854
Snippets:398
Trust Score:8.4
License:Apache-2.0
Update:1 month ago
Show doc for...
Tokens:
Raw
### Streaming Initialization Example

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit-streaming.md

An example of calling beginRealStreaming within a main actor context.

```swift
@MainActor
func streamDidStart(_ view: MarkdownViewTextKit) {
    view.beginRealStreaming()
}
```

--------------------------------

### Example Registration in AppDelegate

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdowncustomextension.md

Demonstrates registering multiple custom extensions during application launch.

```swift
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
    MarkdownCustomExtensionManager.shared.register(parser: VideoParser())
    MarkdownCustomExtensionManager.shared.register(viewProvider: VideoViewProvider())
    MarkdownCustomExtensionManager.shared.register(actionHandler: VideoActionHandler())
    MarkdownCustomExtensionManager.shared.register(codeBlockRenderer: MermaidRenderer())
    return true
}
```

--------------------------------

### Install CocoaPods dependencies

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Run the pod install command to resolve and install dependencies.

```bash
pod install
```

--------------------------------

### Custom Configuration Example

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Demonstrates how to customize fonts, colors, and spacing by modifying a MarkdownConfiguration instance.

```swift
var config = MarkdownConfiguration.default

// Custom fonts
config.bodyFont = .systemFont(ofSize: 17)
config.h1Font = .systemFont(ofSize: 32, weight: .bold)
config.codeFont = .monospacedSystemFont(ofSize: 15, weight: .regular)

// Custom colors
config.textColor = .label
config.linkColor = .systemBlue
config.linkUnderlineEnabled = false    // Disable link underline
config.codeBackgroundColor = .systemGray6
config.blockquoteTextColor = .secondaryLabel

// Custom spacing
config.paragraphSpacing = 16
config.headingTopSpacing = 20
config.headingBottomSpacing = 12
config.imageMaxHeight = 500
config.lineSpacing = MarkdownLineSpacingConfiguration(
    body: 6,
    heading: 8,
    quote: 6,
    codeBlock: 4
)

// Apply configuration
markdownView.configuration = config
```

--------------------------------

### resetForReuse usage example

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit-streaming.md

Example of calling resetForReuse inside prepareForReuse for cell recycling.

```swift
override func prepareForReuse() {
    super.prepareForReuse()
    markdownView.resetForReuse()
}
```

--------------------------------

### VideoViewProvider Implementation Example

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdowncustomextension.md

A concrete implementation of MarkdownCustomViewProvider that renders a video placeholder view with a fixed height.

```swift
final class VideoViewProvider: MarkdownCustomViewProvider {
    var supportedType: String { "video" }

    func createView(for data: CustomElementData, configuration: MarkdownConfiguration, containerWidth: CGFloat) -> UIView {
        let imageView = UIImageView()
        imageView.backgroundColor = .darkGray
        return imageView
    }

    func calculateSize(for data: CustomElementData, configuration: MarkdownConfiguration, containerWidth: CGFloat) -> CGSize {
        CGSize(width: containerWidth, height: 140)
    }
}
```

--------------------------------

### MermaidRenderer Implementation Example

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdowncustomextension.md

An example implementation of the MarkdownCodeBlockRenderer protocol for rendering mermaid diagrams.

```swift
final class MermaidRenderer: MarkdownCodeBlockRenderer {
    var supportedLanguage: String { "mermaid" }
    // renderCodeBlock returns a WKWebView loading mermaid.js
    // calculateSize returns the diagram size
}
```

--------------------------------

### Update markdown configuration

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Example of modifying the default configuration and applying it to the markdownView.

```swift
var config = MarkdownConfiguration.default
config.bodyFont = .systemFont(ofSize: 17)
config.latexAlignment = .left
markdownView.configuration = config
```

--------------------------------

### Initialize ScrollableMarkdownViewTextKit

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Basic setup for creating a markdown view instance and setting its initial content.

```swift
import UIKit
import MarkdownDisplayView

let markdownView = ScrollableMarkdownViewTextKit()
markdownView.configuration = .default
markdownView.markdown = "# Hello\n\nRender **Markdown** with TextKit 2."
```

--------------------------------

### MarkdownImageAttachment usage example

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/attachments.md

Example of initializing a MarkdownImageAttachment, setting its constraints, and creating an attributed string.

```swift
let attachment = MarkdownImageAttachment()
attachment.maxWidth = 320
attachment.maxHeight = 400
attachment.image = UIImage(named: "hero")
let attr = NSAttributedString(attachment: attachment)
```

--------------------------------

### Using setPreparedContent with MarkdownRenderer

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Example showing how to prepare content using MarkdownRenderer and apply it to a markdownView on the main thread.

```swift
let renderer = MarkdownRenderer(
    configuration: config,
    containerWidth: width
)
let prepared = renderer.prepare(markdown)

DispatchQueue.main.async {
    markdownView.setPreparedContent(prepared)
}
```

--------------------------------

### Programmatic View Construction

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/scrollablemarkdownviewtextkit.md

Example of creating the view programmatically and adding it to a parent view.

```swift
let scrollable = ScrollableMarkdownViewTextKit(frame: view.bounds)
view.addSubview(scrollable)
// constrain like any UIScrollView
```

--------------------------------

### Usage of PreprocessCustomElements

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdowncustomextension.md

Example of invoking the preprocessing method on raw Markdown text.

```swift
let matches = MarkdownCustomExtensionManager.shared.preprocessCustomElements(in: markdown)
// matches: [(range: NSRange, data: CustomElementData)]
```

--------------------------------

### ImageLoader Usage Example

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/imageview-fontloader.md

Demonstrates how to use the ImageLoader to fetch an image and assign it to an image view using Combine.

```swift
import Combine

var cancellables = Set<AnyCancellable>()

ImageLoader.shared.loadImage(from: imageURL)
    .sink(receiveValue: { [weak self] image in
        self?.imageView.image = image
    })
    .store(in: &cancellables)
```

--------------------------------

### Assign markdown content

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Example of setting the markdown property to display content.

```swift
markdownView.markdown = "# Title\n\nBody **bold** text."
```

--------------------------------

### Scroll to Latest Example

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit-streaming.md

An example of using scrollToBottom within a MainActor context to scroll to the end of the view without animation.

```swift
@MainActor
func scrollToLatest(_ view: MarkdownViewTextKit) {
    view.scrollToBottom(animated: false)
}
```

--------------------------------

### Configuring MarkdownView callbacks

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Example demonstrating how to assign closures to onLinkTap and onHeightChange callbacks to handle link navigation and height updates.

```swift
markdownView.onLinkTap = { url in
    if UIApplication.shared.canOpenURL(url) {
        UIApplication.shared.open(url)
    }
}
markdownView.onHeightChange = { height in
    print("content height:", height)
}
```

--------------------------------

### Configure Config.local.json for AI Chat

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Create this file in the example target to enable the real AI chat demo. Replace the apiKey field with your actual API key.

```json
{
  "host": "https://api.deepseek.com",
  "path": "/chat/completions",
  "apiKey": "replace-with-your-api-key",
  "model": "deepseek-chat",
  "systemPrompt": "You are a helpful assistant.",
  "temperature": 0.7,
  "stream": true,
  "timeoutSeconds": 30
}
```

--------------------------------

### VideoParser Implementation Example

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdowncustomextension.md

A concrete implementation of MarkdownCustomParser that identifies video tags using a regex pattern and extracts the filename as payload.

```swift
final class VideoParser: MarkdownCustomParser {
    var identifier: String { "video" }
    var pattern: String { #"\[video:([^\]]+)\]"# }

    func parse(match: NSTextCheckingResult, in text: String) -> CustomElementData? {
        guard match.numberOfRanges > 1 else { return nil }
        let filename = (text as NSString).substring(with: match.range(at: 1))
        return CustomElementData(type: "video", rawText: String(text[Range(match.range, in: text)!]), payload: ["file": filename])
    }
}
```

--------------------------------

### endRealStreaming usage example

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit-streaming.md

Example of calling endRealStreaming within a streamDidFinish delegate method.

```swift
@MainActor
func streamDidFinish(_ view: MarkdownViewTextKit) {
    view.endRealStreaming {
        print("stream fully rendered")
    }
}
```

--------------------------------

### setPreparedContent(_:) method signature

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

The signature for the setPreparedContent method used to install pre-rendered Markdown content.

```swift
@MainActor
public func setPreparedContent(_ preparedContent: MarkdownPreparedContent)
```

--------------------------------

### FontLoader Registration Call

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/imageview-fontloader.md

Example of calling the font registration method, typically used during application launch.

```swift
FontLoader.ensureFontsRegistered()
```

--------------------------------

### Inorganic Chemical Equation Syntax

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Examples of chemical reaction equations using mhchem syntax.

```markdown
$$\ce{2H2 + O2 -> 2H2O}$$
$$\ce{2C8H18 + 25O2 -> 16CO2 + 18H2O}$$
```

```markdown
$$\ce{Cu^2+ + 2OH- -> Cu(OH)2 v}$$
$$\ce{[Ag(NH3)2]+ + OH- -> AgOH v + 2NH3}$$
```

```markdown
$$\ce{N2 + 3H2 <=>[high T][high P] 2NH3}$$
$$C_2H_5OH + CH_3COOH \xrightarrow{\text{conc. } H_2SO_4} CH_3COOC_2H_5 + H_2O$$
```

--------------------------------

### Create and append a LaTeXAttachment

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/attachments.md

Example of initializing a LaTeXAttachment with a math string and appending it to a UITextView's textStorage.

```swift
let attachment = LaTeXAttachment(
    latex: r"\frac{1}{2}\sqrt{x^2 + y^2}",
    fontSize: 20,
    maxWidth: 300,
    padding: 12,
    backgroundColor: .systemGray6,
    textColor: .label
)
let attr = NSAttributedString(attachment: attachment)
textView.textStorage.append(attr)
```

--------------------------------

### jsonString() usage

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/array-extensions.md

Example of serializing an array of dictionaries to a JSON string.

```swift
let payloads = [["id": 1], ["id": 2]]
let json = payloads.jsonString()   // "[{\"id\":1},{\"id\":2}]"
```

--------------------------------

### Basic LaTeX Formula Syntax

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Examples of inline and display math syntax using single and double dollar signs.

```markdown
Energy is $E=mc^2$ and momentum is $p=mv$.
```

```markdown
$$
\int_{-\infty}^{\infty} e^{-x^2}\,dx = \sqrt{\pi}
$$
```

--------------------------------

### Scroll to Top Usage

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/scrollablemarkdownviewtextkit.md

Example of triggering a scroll to top action, such as from a button tap.

```swift
button.addTarget(anyObject: scrollable, action: #selector(…), for: .touchUpInside)
// or directly:
scrollable.scrollToTop(animated: true)
```

--------------------------------

### Organic Chemical Structure Syntax

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Examples of rendering chemical structures like benzene rings and toluene using chemfig.

```markdown
$$\chemfig{**6(------)}$$
$$\chemfig{*6(-=-=-=)}$$
```

```markdown
$$\chemfig{**6(---(-OH)---)}$$
$$\chemfig{**6(---(-CH_3)---)}$$
$$\chemfig{**6(-NO_2-(-CH_3)-NO_2--NO_2-)}$$
```

```markdown
$$\chemfig{**6(---(-CH_3)---)} + 3HNO_3 \longrightarrow \chemfig{**6(-NO_2-(-CH_3)-NO_2--NO_2-)} + 3H_2O$$
```

--------------------------------

### Scroll to TOC Item Usage

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/scrollablemarkdownviewtextkit.md

Example of scrolling to the first item in the table of contents.

```swift
if let first = scrollable.tableOfContents.first {
    scrollable.scrollToTOCItem(first)
}
```

--------------------------------

### Play Typewriter Animation Usage

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Example of generating a Table of Contents view and triggering the typewriter animation for it.

```swift
let toc = markdownView.generateTOCView()
addSubview(toc)
markdownView.playTypewriterAnimation(for: toc)
```

--------------------------------

### Streaming Haptic Feedback Configuration

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Configures haptic feedback styles and intervals for streaming content, including the enum definition and implementation example.

```swift
public var streamingHapticFeedbackStyle: StreamingHapticFeedbackStyle  // Haptic feedback style (default: .none)
public var streamingHapticMinInterval: TimeInterval                    // Minimum interval between haptics (default: 0.05s)

// StreamingHapticFeedbackStyle enum
public enum StreamingHapticFeedbackStyle {
    case none    // No haptic feedback (default)
    case light   // Light haptic feedback
    case medium  // Medium haptic feedback
    case heavy   // Heavy haptic feedback
    case soft    // Soft haptic feedback (iOS 13+)
    case rigid   // Rigid haptic feedback (iOS 13+)
}

// Usage example
var config = MarkdownConfiguration.default
config.streamingHapticFeedbackStyle = .light  // Enable light haptic feedback
config.streamingHapticMinInterval = 0.05      // 50ms minimum interval
markdownView.configuration = config
```

--------------------------------

### Pattern Matching MarkdownRenderElement

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownrenderelement.md

An example of using a switch statement to inspect and describe different types of MarkdownRenderElement cases.

```swift
func describe(_ element: MarkdownRenderElement) -> String {
    switch element {
    case .attributedText(let text):
        return "text: \(text.string.prefix(20))"
    case .heading(let id, let text):
        return "heading \(id): \(text.string)"
    case .codeBlock(let language, _):
        return "code block (\(language ?? "none"))"
    case .latex(let src):
        return "latex: \(src.prefix(20))"
    case .image(let src, let alt):
        return "image: \(alt) <\(src)>"
    default:
        return "\(element)"
    }
}
```

--------------------------------

### Handling TOC item taps

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownrenderelement.md

Example of using the onTOCItemTap callback to log tapped heading information and trigger a scroll to the corresponding TOC item.

```swift
markdownView.onTOCItemTap = { item in
    print("tapped heading level \(item.level): \(item.title) (\(item.id))")
    markdownView.scrollToTOCItem(item)
}
```

--------------------------------

### convenience init(markdown:configuration:)

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Convenience initializer for one-shot display of a complete Markdown document.

```APIDOC
## convenience init(markdown:configuration:)

### Description
Initializes the view with a specific Markdown string and configuration. This method automatically schedules an asynchronous re-render of the content.

### Signature
`public convenience init(markdown: String, configuration: MarkdownConfiguration = .default)`

### Parameters
- **markdown** (String) - Required - Initial Markdown document to render.
- **configuration** (MarkdownConfiguration) - Optional - Style configuration applied before rendering (defaults to .default).

### Example
```swift
let view = MarkdownViewTextKit(
    markdown: "# Hello\n\nRender **Markdown** with TextKit 2.",
    configuration: .dark
)
```
```

--------------------------------

### init(configuration:containerWidth:)

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownrenderer.md

Initializes a new MarkdownRenderer instance with a specific configuration and container width.

```APIDOC
## init(configuration:containerWidth:)

### Description
Creates a new MarkdownRenderer instance. The containerWidth is required and should match the width of the display view.

### Parameters
#### Parameters
- **configuration** (MarkdownConfiguration) - Optional - Style configuration used for fonts, colors, spacing, and LaTeX sizing. Defaults to MarkdownConfiguration.default.
- **containerWidth** (CGFloat) - Required - The text layout width used for height estimation and LaTeX max-width.
```

--------------------------------

### Get Auto-Generated TOC

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Access the table of contents after the markdown has been parsed. Note that parsing is asynchronous, so access the TOC after a height callback or user action.

```swift
// Markdown content automatically parses headings to generate TOC
let tocItems = markdownView.tableOfContents

for item in tocItems {
    print("Level \(item.level): \(item.title)")
}
```

--------------------------------

### Initialize ScrollableMarkdownViewTextKit

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/scrollablemarkdownviewtextkit.md

Standard initializers for the component. Both call setupUI() to configure the internal markdown view and layout constraints.

```swift
public override init(frame: CGRect)
public required init?(coder: NSCoder)
```

--------------------------------

### beginRealStreaming(autoScrollBottom:)

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit-streaming.md

Initializes the streaming session, resets internal state, and prepares the view for incoming data deltas.

```APIDOC
## beginRealStreaming(autoScrollBottom:)

### Description
Resets all streaming state and enters real-streaming mode. This method must be called exactly once per stream session before any data is appended.

### Method
Swift Method

### Signature
`public func beginRealStreaming(autoScrollBottom: Bool = true)`

### Parameters
- **autoScrollBottom** (Bool) - Optional - Default: true - Whether the view should follow the bottom of the content while new deltas arrive.
```

--------------------------------

### prepare(_:)

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownrenderer.md

Pre-renders Markdown content and estimates element heights for performance optimization.

```APIDOC
## prepare(_:)

### Description
Calls render(_:) and estimates the height of each element based on the renderer's container width. This is designed to be run on a background queue.

### Parameters
#### Parameters
- **markdown** (String) - Required - Full Markdown source to pre-render.

### Returns
- **MarkdownPreparedContent** - An object containing the rendered elements and their estimated heights.
```

--------------------------------

### MarkdownViewTextKit convenience init(markdown:configuration:) Initializer

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Initializes the view with markdown content and an optional configuration. This is the preferred initializer for one-shot document rendering.

```swift
public convenience init(markdown: String, configuration: MarkdownConfiguration = .default)
```

```swift
let view = MarkdownViewTextKit(
    markdown: "# Hello\n\nRender **Markdown** with TextKit 2.",
    configuration: .dark
)
```

--------------------------------

### filterDuplicates(_:) usage

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/array-extensions.md

Example of filtering an array of structs based on a unique key.

```swift
struct User { let id: Int; let name: String }
let users = [User(id: 1,name: "a"), User(id: 2,name: "b"), User(id: 1,name: "c")]
let unique = users.filterDuplicates { $0.id }   // keeps id 1 ("a") and id 2 ("b")
```

--------------------------------

### init(frame:)

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Initializes a new MarkdownViewTextKit instance with a specified frame.

```APIDOC
## init(frame:)

### Description
Initializes a new MarkdownViewTextKit instance with the provided CGRect frame. This sets up the internal contentStackView constraints.

### Signature
`public override init(frame: CGRect)`

### Parameters
- **frame** (CGRect) - Required - The view frame.
```

--------------------------------

### Update Typewriter Speed Usage

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Example of updating the typewriter speed parameters for an active markdownView.

```swift
markdownView.updateTypewriterSpeed(
    charsPerStep: 12,
    baseDuration: 0.02,
    elementGapDuration: 0.08
)
```

--------------------------------

### init(latex:fontSize:maxWidth:padding:backgroundColor:textColor:appearance:isInline:inlineCapHeight:)

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/attachments.md

Initializes a new LaTeXAttachment with the specified LaTeX source and styling parameters. The initializer parses the LaTeX source and caches the render result for efficient display.

```APIDOC
## init(latex:fontSize:maxWidth:padding:backgroundColor:textColor:appearance:isInline:inlineCapHeight:)

### Description
Initializes a new LaTeXAttachment instance. This method eagerly parses the LaTeX source and caches the render result.

### Parameters
- **latex** (String) - Required - LaTeX math source.
- **fontSize** (CGFloat) - Optional - Formula font size in points (default: 22).
- **maxWidth** (CGFloat) - Required - Maximum layout width.
- **padding** (CGFloat) - Optional - Inner padding around the rendered formula (default: 20).
- **backgroundColor** (UIColor) - Optional - Formula background fill (default: systemGray6).
- **textColor** (UIColor) - Optional - Default formula foreground (default: .label).
- **appearance** (MarkdownBlockAppearance) - Optional - Corner radius/border configuration.
- **isInline** (Bool) - Optional - Whether the formula is rendered inline (default: false).
- **inlineCapHeight** (CGFloat) - Optional - Body text cap height for vertical centering (default: 0).

### Request Example
let attachment = LaTeXAttachment(
    latex: "\\frac{1}{2}\\sqrt{x^2 + y^2}",
    fontSize: 20,
    maxWidth: 300,
    padding: 12,
    backgroundColor: .systemGray6,
    textColor: .label
)
```

--------------------------------

### init?(coder:)

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Initializes a new MarkdownViewTextKit instance from an NSCoder, typically used with Storyboards or NIBs.

```APIDOC
## init?(coder:)

### Description
Initializes the view from an NSCoder. This is the required initializer when instantiating the view from a storyboard or nib file.

### Signature
`public required init?(coder: NSCoder)`

### Parameters
- **coder** (NSCoder) - Required - Interface-Builder coder.
```

--------------------------------

### configuration

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Configuration object containing fonts, colors, spacing, LaTeX, table, list, details, and haptic options.

```APIDOC
## Property: configuration

### Description
All fonts, colors, spacing, LaTeX, table, list, details, and haptic options. Setting this property invalidates the intrinsic-height cache and schedules a re-render.

### Type
MarkdownConfiguration

### Default
.default

### Usage Example
```swift
var config = MarkdownConfiguration.default
config.bodyFont = .systemFont(ofSize: 17)
config.latexAlignment = .left
markdownView.configuration = config
```
```

--------------------------------

### subscript(safe:) range usage

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/array-extensions.md

Examples of safe range slicing, returning nil if the range is invalid.

```swift
let slice = items[safe: 1..<3]         // ["b", "c"]
let missing = items[safe: 2..<9]      // nil
```

--------------------------------

### init(frame:)

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/scrollablemarkdownviewtextkit.md

Initializes a new ScrollableMarkdownViewTextKit instance programmatically.

```APIDOC
## init(frame:)

### Description
Initializes the view with a specified frame for programmatic construction.

### Signature
`public override init(frame: CGRect)`

### Parameters
- **frame** (CGRect) - Required - The frame rectangle for the view.
```

--------------------------------

### MarkdownRenderer prepare(_:) Method

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownrenderer.md

Pre-renders Markdown content into a cacheable format, typically executed on a background queue.

```swift
public func prepare(_ markdown: String) -> MarkdownPreparedContent
```

```swift
let width = markdownWidth
let config = configuration

DispatchQueue.global(qos: .userInitiated).async {
    let renderer = MarkdownRenderer(configuration: config, containerWidth: width)
    let prepared = renderer.prepare(source)

    DispatchQueue.main.async {
        markdownView.setPreparedContent(prepared)
    }
}
```

--------------------------------

### Usage of appendStreamData in streamDidReceive

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit-streaming.md

Example showing how to call appendStreamData within a stream delegate method on the main actor.

```swift
@MainActor
func streamDidReceive(_ delta: String, in view: MarkdownViewTextKit) {
    view.appendStreamData(delta)
}
```

--------------------------------

### MarkdownRenderer Initialization

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownrenderer.md

Initializes the renderer with a configuration and a required container width.

```swift
public init(configuration: MarkdownConfiguration = MarkdownConfiguration.default,
            containerWidth: CGFloat)
```

```swift
let renderer = MarkdownRenderer(
    configuration: MarkdownConfiguration.default,
    containerWidth: 320
)
```

--------------------------------

### Apply Preset Themes

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Switch between default light and dark themes using the configuration property.

```swift
// Use default light theme
markdownView.configuration = .default

// Use dark theme
markdownView.configuration = .dark
```

--------------------------------

### MarkdownViewTextKit init?(coder:) Initializer

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Required initializer for instantiating the view from a storyboard or nib.

```swift
public required init?(coder: NSCoder)
```

--------------------------------

### Prepared Content Rendering

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Optimize performance by preparing Markdown content on a background thread and applying it to the view.

```APIDOC
## setPreparedContent(_:)

### Description
Applies pre-rendered Markdown content to the view, bypassing parsing and initial height-estimation passes.

### Parameters
- **prepared** (MarkdownPreparedContent) - Required - The pre-rendered content object generated by MarkdownRenderer.

### Example
```swift
let renderer = MarkdownRenderer(configuration: renderConfiguration, containerWidth: width)
let prepared = renderer.prepare(source)

DispatchQueue.main.async {
    markdownView.setPreparedContent(prepared)
}
```
```

--------------------------------

### Play Typewriter Animation Method Signature

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

The playTypewriterAnimation method enqueues a view for the typewriter engine and starts the animation.

```swift
public func playTypewriterAnimation(for view: UIView)
```

--------------------------------

### subscript(safe:) single index usage

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/array-extensions.md

Examples of safe index access returning nil for out-of-bounds or negative indices.

```swift
let items = ["a", "b", "c"]
print(items[safe: 1]] ?? "nil")   // "b"
print(items[safe: 5]] ?? "nil")   // "nil"
print(items[safe: -1]] ?? "nil")   // "nil"
```

--------------------------------

### List Configuration Properties

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Defines spacing and padding settings for Markdown lists.

```swift
public var listItemSpacing: CGFloat        // List item spacing (default: 4)
public var listMarkerMinWidth: CGFloat     // List marker minimum width (default: 20)
public var listMarkerSpacing: CGFloat      // List marker to content spacing (default: 4)
public var listTopPadding: CGFloat         // Whole-list top padding (default: 0)
public var listBottomPadding: CGFloat      // Whole-list bottom padding (default: 0)
```

--------------------------------

### Advanced Mathematics and Physics Syntax

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Syntax for rendering calculus, matrices, and piecewise systems.

```markdown
$$\lim_{x \to 0} \frac{\sin x}{x} = 1, \quad \sum_{i=0}^{n} i^2 = \frac{n(n+1)(2n+1)}{6}$$
```

```markdown
$$\begin{bmatrix} 1 & x & x^2 \\ 0 & 1 & 2x \\ 0 & 0 & 2 \end{bmatrix}, \quad f(x) = \begin{cases} x^2 & x > 0 \\ -x & x \le 0 \end{cases}$$
```

--------------------------------

### Synchronize Prepared Content with Theme

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Ensures that cached or prepared content matches the current configuration to prevent theme mismatching.

```swift
let renderer = MarkdownRenderer(
    configuration: configuration,
    containerWidth: contentWidth
)
let preparedContent = renderer.prepare(markdown)

markdownView.configuration = configuration
markdownView.setPreparedContent(preparedContent)
```

--------------------------------

### Add library product to target in Package.swift

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Include the MarkdownDisplayView product in your target's dependencies list.

```swift
.target(
    name: "YourTarget",
    dependencies: [
        .product(name: "MarkdownDisplayView", package: "MarkdownDisplayView")
    ]
)
```

--------------------------------

### MarkdownViewTextKit init(frame:) Initializer

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

Initializes the view with a specific frame and sets up the contentStackView constraints.

```swift
public override init(frame: CGRect)
```

--------------------------------

### image(with:placeHolder:loadFinished:) Method

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/imageview-fontloader.md

Loads an image and executes a completion callback upon success with a non-zero size image. This overload is not main-actor annotated.

```swift
public func image(with url: String,placeHolder: UIImage?,loadFinished: @escaping (UIImage?) -> Void)
```

```swift
let imageView = ImageView(frame: CGRect(x: 0,y: 0,width: 100,height: 100))
imageView.image(with: urlString, placeHolder: nil) { image in
    print("loaded", image?.size as? Any ?? "nil")
}
```

--------------------------------

### Add dependency to Podfile

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Add the MarkdownDisplayKit pod to your Podfile.

```ruby
pod 'MarkdownDisplayKit', '~> 2.1.1'
```

--------------------------------

### Initialize MarkdownViewTextKit directly

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Instantiate the core view without the built-in scroll container.

```swift
let markdownView = MarkdownViewTextKit()
// You need to manage the scroll container yourself
```

--------------------------------

### Syntax Highlighting Configuration

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Defines the color scheme and structure for syntax highlighting.

```swift
public var syntaxColors: SyntaxHighlightColors // Active syntax-highlighting colors; `.dark` assigns `.xcodeDark`

// SyntaxHighlightColors structure
public struct SyntaxHighlightColors {
    public var keyword: UIColor       // Keyword color
    public var string: UIColor        // String color
    public var number: UIColor        // Number color
    public var comment: UIColor       // Comment color
    public var type: UIColor          // Type color
    public var function: UIColor      // Function color
    public var property: UIColor      // Property color
    public var preprocessor: UIColor  // Preprocessor color

    public static var xcode: SyntaxHighlightColors      // Xcode light theme
    public static var xcodeDark: SyntaxHighlightColors  // Xcode dark theme
}
```

--------------------------------

### render(_:)

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownrenderer.md

Parses a Markdown string and returns an array of renderable elements along with metadata.

```APIDOC
## render(_:)

### Description
Processes a Markdown string through a pipeline including normalization, custom syntax preprocessing, parsing, and restoration of custom elements.

### Parameters
#### Parameters
- **markdown** (String) - Required - Full Markdown source.

### Returns
- **elements** ([MarkdownRenderElement]) - The array of rendered elements.
- **imageAttachments** ([(attachment: MarkdownImageAttachment, urlString: String)]) - List of image attachments.
- **tableOfContents** ([MarkdownTOCItem]) - Table of contents items.
- **tocSectionId** (String?) - Optional section ID for the table of contents.
```

--------------------------------

### MarkdownViewTextKit Core Usage

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Initialize the core Markdown view and monitor content height changes.

```APIDOC
## MarkdownViewTextKit Initialization

### Description
Initializes the core Markdown view component and sets up a callback to monitor height changes.

### Method
Swift Class Initialization

### Parameters
- **onHeightChange** (closure) - Optional - Callback triggered when the content height updates, providing the new height as a CGFloat.

### Example
```swift
let markdownView = MarkdownViewTextKit()

markdownView.onHeightChange = { newHeight in
    print("Content height changed to: \(newHeight)")
}
```
```

--------------------------------

### ImageLoader.loadImage(from:)

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/imageview-fontloader.md

Fetches an image from a given URL and returns a Combine publisher.

```APIDOC
## func loadImage(from url: URL) -> AnyPublisher<UIImage?, Never>

### Description
Loads an image from the specified URL. Returns a cold publisher that performs the download via Kingfisher and delivers the result on the main queue.

### Parameters
- **url** (URL) - Required - The remote URL of the image to load.

### Return Value
- **AnyPublisher<UIImage?, Never>** - A publisher that emits the loaded image or an empty UIImage on failure/nil.

### Example
```swift
import Combine

var cancellables = Set<AnyCancellable>()

ImageLoader.shared.loadImage(from: imageURL)
    .sink(receiveValue: { [weak self] image in
        self?.imageView.image = image
    })
    .store(in: &cancellables)
```
```

--------------------------------

### Define configuration property

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit.md

The configuration property manages fonts, colors, spacing, and other display options.

```swift
public var configuration: MarkdownConfiguration = .default
```

--------------------------------

### Video Extension Markdown Syntax

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Use the video syntax in Markdown files. The referenced file must exist in the app bundle.

```markdown
## Video Demo

[video:video]

Supported formats: .mov, .mp4, .m4v
```

--------------------------------

### Add dependency in Package.swift

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Add the repository URL and version to the dependencies array in your Package.swift file.

```swift
dependencies: [
    .package(url: "https://github.com/zjc19891106/MarkdownDisplayView.git", from: "2.1.1")
]
```

--------------------------------

### LaTeXAttachment initializer signature

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/attachments.md

The convenience initializer for creating a LaTeXAttachment instance with configurable rendering parameters.

```swift
public convenience init(
    latex: String,
    fontSize: CGFloat = 22,
    maxWidth: CGFloat,
    padding: CGFloat = 20,
    backgroundColor: UIColor = UIColor.systemGray6.withAlphaComponent(0.5),
    textColor: UIColor = .label,
    appearance: MarkdownBlockAppearance = MarkdownBlockAppearance(cornerRadius: 8),
    isInline: Bool = false,
    inlineCapHeight: CGFloat = 0
)
```

--------------------------------

### beginRealStreaming Method Signature

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/markdownviewtextkit-streaming.md

The definition of the beginRealStreaming method used to initialize streaming mode.

```swift
public func beginRealStreaming(autoScrollBottom: Bool = true)
```

--------------------------------

### Configure streaming AI chat

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Recommended configuration settings for streaming AI chat interfaces.

```swift
var config = MarkdownConfiguration.default
config.typewriterTextMode = .append
config.typewriterHeightUpdateInterval = 20
config.streamMinModuleLength = 10
config.streamingHapticFeedbackStyle = .medium
config.latexAlignment = .left
scrollableMarkdownView.markdownView.configuration = config
```

--------------------------------

### image(with:placeHolder:) Method

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/imageview-fontloader.md

Loads an image from a raw URL string using Kingfisher, setting a placeholder if normalization fails or while loading. This method is annotated with @MainActor.

```swift
@MainActor public func image(with url: String,placeHolder: UIImage?)
```

```swift
let imageView = ImageView(frame: .zero)
imageView.image(with: "https://example.com/photo.jpg", placeHolder: UIImage(named: "thumb"))
```

--------------------------------

### Line Spacing Configuration

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Role-based line spacing configuration using the MarkdownLineSpacingConfiguration struct.

```swift
public var lineSpacing: MarkdownLineSpacingConfiguration // Role-based line spacing config

public struct MarkdownLineSpacingConfiguration {
    public var body: CGFloat
    public var heading: CGFloat
    public var quote: CGFloat
    public var codeBlock: CGFloat
}
```

--------------------------------

### image(with:placeHolder:)

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/imageview-fontloader.md

Loads an image into the ImageView from a URL string with an optional placeholder.

```APIDOC
## @MainActor func image(with url: String, placeHolder: UIImage?)

### Description
Sets the image of the view by normalizing the provided URL and loading it asynchronously via Kingfisher.

### Parameters
#### Parameters
- **url** (String) - Required - Raw URL string (normalized internally).
- **placeHolder** (UIImage?) - Optional - Placeholder shown while loading (and on invalid URL).
```

--------------------------------

### Configuring MarkdownViewTextKit

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/_autodocs/api-reference/scrollablemarkdownviewtextkit.md

The configuration property forwards settings like fonts, colors, and LaTeX options to the inner view.

```swift
public var configuration: MarkdownConfiguration {
    get { markdownView.configuration }
    set { markdownView.configuration = newValue }
}
```

--------------------------------

### Register Video Extension in AppDelegate

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Register the video extension during application launch. Ensure the implementation of registerVideoExtension() is copied into your project before calling it.

```swift
import MarkdownDisplayView

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
    // Register video extension
    MarkdownCustomExtensionManager.shared.registerVideoExtension()
    return true
}
```

--------------------------------

### Implement real-time streaming

Source: https://github.com/zjc19891106/markdowndisplayview/blob/master/README.md

Use the streaming API to append text fragments as they arrive from an LLM or SSE source.

```swift
@MainActor
func streamDidStart(_ view: MarkdownViewTextKit) {
    view.beginRealStreaming()
}

@MainActor
func streamDidReceive(_ delta: String, in view: MarkdownViewTextKit) {
    view.appendStreamData(delta)
}

@MainActor
func streamDidFinish(_ view: MarkdownViewTextKit) {
    view.endRealStreaming()
}
```
Tokens:
Raw