@fsegurai/marked-extended-typographic

v17.0.0

Published

2 months ago

Extension for Marked.js that adds support for extended typography, allowing the use of special characters and formatting options to enhance the appearance of text. It supports any Markdown rendering and can be customized to fit your needs.

0High
0Medium
0Low

fsegurai

extensions javascript library markdown markedjs marked-extended-typographic parser syntax typescript

An extension library for Marked.js to enhance Markdown rendering.

@fsegurai/marked-extended-typographic Extension for Marked.js that adds support for extended typography, allowing the use of special characters and formatting options to enhance the appearance of text. It supports any Markdown rendering and can be customized to fit your needs.

🎯 Overview

The marked-extended-typographic extension transforms your text with professional smart typography and a comprehensive collection of 200+ Unicode symbols. Automatically convert straight quotes into elegant curly quotes, replace symbol shortcuts with proper mathematical and typographic characters, and access hundreds of Greek letters, mathematical operators, arrows, currency symbols, and emojis through simple text patterns. Perfect for academic papers, technical documentation, scientific content, and any professional writing.

✨ Key Features

📝 Smart Typography: Automatic curly quotes, em-dashes, en-dashes, and ellipses
🔤 Greek Alphabet: Complete uppercase and lowercase (24 letters × 2 = 48 symbols)
➗ Mathematical Symbols: Operators, set theory, logic, calculus (60+ symbols)
➡️ Arrows: Basic, double, directional, logical (15+ variants)
💰 Currency Symbols: Dollar, euro, pound, yen, cent (6+ currencies)
⚖️ Legal Marks: Copyright, trademark, registered, paragraph (8+ marks)
🎨 Typography: Degree, micro, bullet, dagger, section signs
😊 Emoji Indicators: Check, cross, warning, star, heart, fire (20+ emojis)
🔧 Custom Symbols: Define your own symbol patterns with regex
📊 Set Theory & Logic: Element, subset, union, forall, exists (20+ symbols)
🎯 Post-Processing: Works after Markdown, preserves code blocks
♿ Smart Preservation: Automatically skips code, HTML tags, attributes

🎪 Live Demo

Experience all typography enhancements and symbols: View Demo

Installation

To add @fsegurai/marked-extended-typographic along with Marked.js to your package.json use the following commands.

bun install @fsegurai/marked-extended-typographic marked@^17 --save

Usage

Basic Usage

Import @fsegurai/marked-extended-typographic and apply it to your Marked instance as shown below.

Quick Start

Basic Concept

This extension works automatically on all text content after Markdown processing through the postprocess hook. Enable smart typography features and use simple text patterns like (alpha) → α for symbols.

import { marked } from 'marked';
import markedExtendedTypographic from '@fsegurai/marked-extended-typographic';

// or UMD script
// <script src="https://cdn.jsdelivr.net/npm/marked/lib/marked.umd.js"></script>
// <script src="https://cdn.jsdelivr.net/npm/@fsegurai/marked-extended-typographic/lib/index.umd.js"></script>

marked.use(markedExtendedTypographic());

### Installation

Install the package using your preferred package manager:

```bash
# Using Bun (recommended)
bun add @fsegurai/marked-extended-typographic

# Using npm
npm install @fsegurai/marked-extended-typographic

# Using yarn
yarn add @fsegurai/marked-extended-typographic

# Using pnpm
pnpm add @fsegurai/marked-extended-typographic

Basic Implementation

import { marked } from 'marked';
import markedExtendedTypographic from '@fsegurai/marked-extended-typographic';

// Register the extension with smart typography
marked.use(markedExtendedTypographic({
  quotes: true,      // Enable smart curly quotes
  ellipses: true,    // Enable smart ellipses (...) → (…)
  dashes: false,     // Keep false to avoid CSS variable conflicts
  outputUnicode: true // Output Unicode instead of HTML entities
}));

// Your markdown content with typography and symbols
const markdown = `
# Mathematical Analysis Report

## Abstract

"This study examines the relationship between variables using advanced calculus," 
said Dr. Smith. The results are truly remarkable...

## Methodology

We analyzed the function f(x) using the following approach:

### Differential Calculus

The partial derivative (partial)f/(partial)x shows the rate of change.

Key equation: (integral) f(x)dx from 0 to (infinity)

### Statistical Analysis

- Mean: (mu) = 25.5
- Standard deviation: (sigma) = 3.2  
- Sample size: n = 1000
- Significance: (alpha) = 0.05

**Hypothesis Test:**
- H₀: (mu) = 25 (null hypothesis)
- H₁: (mu) (not equal) 25 (alternative hypothesis)
- Result: p < 0.001 (check) Reject H₀

## Results

### Greek Letter Variables

The relationship can be expressed as:

(Alpha) + (Beta) + (Gamma) = (Delta)

Where each symbol represents a distinct parameter.

### Set Theory Application

Sample space: S = {x | x (element) (R)}

- Set A (union) Set B represents all possible outcomes
- Intersection: A (intersect) B
- Empty set: (empty)

### Mathematical Operators

1. Summation: (sum) xᵢ from i=1 to n
2. Product: (prod) xᵢ for all i
3. Square root: (sqrt)x where x (greater than or equal) 0

## Arrows & Logic

Process flow: Input (->) Processing (->) Output

Logical implication: P (=>) Q (<=>) R

Navigation: Use (^up) (^down) (<-) (->) arrows

## Professional Notation

**Copyright Information:**
- (C^) 2026 Research Institute
- Published under license (section)3.2
- Registered trademark (R^) Analysis Tool

**Currency & Measurements:**
- Research grant: (euro)50,000 / (dollar)55,000 / (pound)42,000
- Temperature: 25(degree)C (plus-minus) 0.5(degree)
- Concentration: 10(micro)mol/L

## Status Indicators

- Data verified (check)
- Errors found (cross)
- Warnings issued (warning)
- Documentation complete (star)

## Conclusion

The results demonstrate a strong correlation (approximately equal) 0.95 between the variables,
supporting our hypothesis with high confidence.

**Rating:** (star)(star)(star)(star)(star)
`;

// Parse and render
const html = marked.parse(markdown);
document.getElementById('content').innerHTML = html;

Syntax & Usage

Smart Typography

Enable smart typography features:

<!-- Smart Quotes -->
"Hello world," she said. 'That's great!'
Result: "Hello world," she said. 'That's great!'

<!-- Smart Ellipses -->
Wait for it... amazing!
Result: Wait for it… amazing!

<!-- Em-dash (when dashes: true) -->
The book --- published in 2020 --- is excellent.
Result: The book — published in 2020 — is excellent.

Greek Letters

Use parentheses with letter names:

<!-- Uppercase -->
(Alpha) (Beta) (Gamma) (Delta) (Omega)
Result: Α Β Γ Δ Ω

<!-- Lowercase -->
(alpha) (beta) (gamma) (delta) (omega)
Result: α β γ δ ω

<!-- In equations -->
The angle (theta) = 45(degree)
Result: The angle θ = 45°

Mathematical Symbols

<!-- Operators -->
(sum) (prod) (integral) (partial) (infinity)
Result: ∑ ∏ ∫ ∂ ∞

<!-- Comparisons -->
x (less than or equal) 10
y (greater than or equal) 5
z (approximately equal) 3.14
Result: x ≤ 10, y ≥ 5, z ≈ 3.14

<!-- Special -->
(plus-minus) (multiply) (divide) (sqrt) (cbrt)
Result: ± × ÷ √ ∛

Set Theory & Logic

<!-- Sets -->
A (element) B
C (subset) D
E (union) F
G (intersect) H
Result: A ∈ B, C ⊂ D, E ∪ F, G ∩ H

<!-- Logic -->
(forall) x, (exists) y: P(x) (=>) Q(y)
Result: ∀ x, ∃ y: P(x) ⇒ Q(y)

Arrows & Directions

<!-- Basic -->
Go (<-) left or (->) right
Navigate (^up) or (^down)
Result: Go ← left or → right, Navigate ↑ or ↓

<!-- Logical -->
A (=>) B and B (<==) A, therefore A (<=>) B
Result: A ⇒ B and B ⇐ A, therefore A ⇔ B

Currency & Legal

<!-- Currency -->
Price: (euro)99 or (dollar)109 or (pound)85
Result: Price: €99 or $109 or £85

<!-- Legal -->
Copyright (C^) 2026 Company (TM)
Product (R^) by Company Name
Result: Copyright © 2026 Company ™, Product ® by Company Name

Status & Emoji

<!-- Status -->
Success (check) | Failed (cross) | Warning (warning) | Info (info)
Result: Success ✅ | Failed ❌ | Warning ⚠️ | Info ℹ️

<!-- Ratings -->
Quality: (star)(star)(star)(star) (4/5)
Result: Quality: ⭐⭐⭐⭐ (4/5)


The extension processes text **after** Markdown rendering, ensuring that code blocks, HTML tags, and other special
content remain unaffected. It intelligently preserves the structure while enhancing typography and replacing symbol
patterns.

### Typography Features

The extension provides several smart typography enhancements:

- **Smart Quotes**: Converts straight quotes (`"` and `'`) into curly quotes (`"` `"` `'` `'`)
- **Smart Ellipses**: Converts three dots (`...`) into proper ellipsis (`…`)
- **Smart Dashes**: Converts double/triple hyphens into en-dashes (`–`) and em-dashes (`—`) *(optional)*

### Symbol Categories

#### Mathematical Symbols

- **Greek Letters**: `(Alpha)` → Α, `(alpha)` → α, `(Beta)` → Β, `(beta)` → β, `(Gamma)` → Γ, etc.
- **Operators**: `(sum)` → ∑, `(prod)` → ∏, `(integral)` → ∫, `(partial)` → ∂
- **Special**: `(infinity)` → ∞, `(sqrt)` → √, `(cbrt)` → ∛, `(degree)` → °

#### Arrow Symbols

- **Basic**: `(<-)` → ←, `(->)` → →, `(<->)` → ↔, `(^up)` → ↑, `(^down)` → ↓
- **Double**: `(==>)` → ⇒, `(<==)` → ⇐, `(<=>)` → ⇔
- **Quotes**: `(<<)` → «, `(>>)` → »

#### Typographic Symbols

- **Legal**: `(C^)` → ©, `(R^)` → ®, `(TM^)` → ™, `(P^)` → ℗
- **Currency**: `(euro)` → €, `(pound)` → £, `(yen)` → ¥, `(cent)` → ¢
- **Special**: `(degree)` → °, `(micro)` → µ, `(middledot)` → ·, `(bullet)` → •

#### Emoji Symbols

- **Status**: `(check)` → ✅, `(cross)` → ❌, `(warning)` → ⚠️, `(info)` → ℹ️
- **Nature**: `(star)` → ⭐, `(sun)` → ☀️, `(cloud)` → ☁️, `(fire)` → 🔥
- **Emotions**: `(heart)` → ❤️, `(smile)` → 😊, `(thumbsup)` → 👍

### Configuration Options

The marked-extended-typographic extension accepts the following configuration options:

- `quotes`: Enable smart quote conversion. Defaults to `false`.
- `dashes`: Enable smart dash conversion. Defaults to `false`. *(Note: May conflict with CSS variables)*
- `ellipses`: Enable smart ellipsis conversion. Defaults to `false`.
- `attribute`: SmartyPants attribute for fine-grained control. Can be a number (-1 to 3) or string. Defaults to `'3'`.
- `customSymbols`: Object defining custom symbol replacements. See [Custom Symbols](#custom-symbols).
- `outputUnicode`: Whether to output Unicode characters instead of HTML entities. Defaults to `false`.

### Custom Symbols

You can define your own symbol replacements using regular expression patterns:

```javascript
marked.use(markedExtendedTypographic({
    quotes: true,
    ellipses: true,
    customSymbols: {
        // Custom arrows
        '\\(up-arrow\\)': '⬆️',
        '\\(down-arrow\\)': '⬇️',

        // Custom status indicators
        '\\(todo\\)': '📋',
        '\\(done\\)': '✅',
        '\\(error\\)': '❌',

        // Custom brand symbols
        '\\(github\\)': '🐙',
        '\\(twitter\\)': '🐦',
        '\\(linkedin\\)': '💼'
    }
}));

Advanced Examples

Complete Typography Enhancement

# Typography Showcase

## Smart Quotes and Punctuation

"Hello world," she said with a smile. 'That's amazing!'

The book "Markdown Mastery" is a must-read... truly exceptional.

## Mathematical Content

The equation (Alpha) + (beta) = (Gamma) demonstrates Greek letters.

Calculus concepts: (integral) f(x)dx and (partial)f/(partial)x

Set theory: A (subset) B, A (union) B, A (intersect) B

Statistical significance: p < 0.05 (approximately equal) significant

## Directional Indicators

Process flow: Start (->) Process (->) Decision (<->) End

Logical implication: A (=>) B (<=>) C

Navigate: (^up) (^down) (<-) (^right)

## Professional Symbols

Copyright (C^) 2023 Company Name (TM)
Registered trademark (R^) Product Name
Price: (euro)99.99 or (pound)89.99

Temperature: 25 (degree)C with (micro)g/ml concentration

Academic Paper Example

# Research Paper Abstract

## Mathematical Modeling of Population Growth

This study examines the relationship between population growth and resource availability using the equation:

dP/dt = rP(1 - P/K)

Where:

- P represents population size
- r is the intrinsic growth rate
- K is the carrying capacity
- (partial)P/(partial)t shows the rate of change

### Key Findings

1. Population growth (<=>) resource consumption correlation = 0.87 (p < 0.001)
2. Carrying capacity (approximately equal) 10,000 (plus-minus) 500 individuals
3. Critical threshold: P > 0.8K (=>) resource depletion risk

### Statistical Significance

Results show (Alpha) = 0.05 significance level with (chi^2) = 15.3, indicating strong evidence (check) for the proposed
model.

*Keywords*: population dynamics, mathematical modeling, sustainability (copyright) 2023

Technical Documentation

# API Documentation

## Status Codes

| Code | Symbol | Meaning |
|------|--------|---------|
| 200 | (check) | Success |
| 400 | (warning) | Bad Request |  
| 500 | (cross) | Server Error |

## Configuration Symbols

- Enabled: (check) / Disabled: (cross)
- Required: (star) / Optional: (middledot)
- Deprecated: (warning) / New: (fire)

## Special Characters in Responses

Currency values: (euro)29.99, (dollar)34.99, (pound)24.99
Measurements: 45(degree) angle, 2.5(micro)m thickness
Legal: (copyright) 2023, (registered) trademark, (trademark) pending

Configuration Examples

// Minimal setup - just smart quotes and ellipses
marked.use(markedExtendedTypographic({
    quotes: true,
    ellipses: true
}));

// Full enhancement with custom symbols
marked.use(markedExtendedTypographic({
    quotes: true,
    ellipses: true,
    attribute: '2', // En-dash for --, em-dash for ---
    outputUnicode: true, // Use Unicode instead of HTML entities
    customSymbols: {
        '\\(checkmark\\)': '✓',
        '\\(ballot-x\\)': '✗',
        '\\(right-arrow\\)': '→',
        '\\(left-arrow\\)': '←',
        '\\(company\\)': 'Acme Corp™'
    }
}));

// Academic/technical writing setup
marked.use(markedExtendedTypographic({
    quotes: true,
    ellipses: true,
    customSymbols: {
        // Mathematical shortcuts
        '\\(approx\\)': '≈',
        '\\(neq\\)': '≠',
        '\\(leq\\)': '≤',
        '\\(geq\\)': '≥',

        // Scientific notation
        '\\(micro\\)': 'μ',
        '\\(nano\\)': 'n',
        '\\(pi\\)': 'π',
        '\\(lambda\\)': 'λ'
    }
}));

Complete Symbol Reference

All Available Symbols

Greek Letters (Upper & Lower Case)

Alpha: (Alpha) → Α, (alpha) → α
Beta: (Beta) → Β, (beta) → β
Gamma: (Gamma) → Γ, (gamma) → γ
Delta: (Delta) → Δ, (delta) → δ
Epsilon: (Epsilon) → Ε, (epsilon) → ε
Zeta: (Zeta) → Ζ, (zeta) → ζ
Eta: (Eta) → Η, (eta) → η
Theta: (Theta) → Θ, (theta) → θ
Iota: (Iota) → Ι, (iota) → ι
Kappa: (Kappa) → Κ, (kappa) → κ
Lambda: (Lambda) → Λ, (lambda) → λ
Mu: (Mu) → Μ, (mu) → μ
Nu: (Nu) → Ν, (nu) → ν
Xi: (Xi) → Ξ, (xi) → ξ
Omicron: (Omicron) → Ο, (omicron) → ο
Pi: (Pi) → Π, (pi) → π
Rho: (Rho) → Ρ, (rho) → ρ
Sigma: (Sigma) → Σ, (sigma) → σ
Tau: (Tau) → Τ, (tau) → τ
Upsilon: (Upsilon) → Υ, (upsilon) → υ
Phi: (Phi) → Φ, (phi) → φ
Chi: (Chi) → Χ, (chi) → χ
Psi: (Psi) → Ψ, (psi) → ψ
Omega: (Omega) → Ω, (omega) → ω

Mathematical Operators

(sum) → ∑ (summation)
(prod) → ∏ (product)
(integral) → ∫ (integral)
(partial) → ∂ (partial derivative)
(sqrt) → √ (square root)
(cbrt) → ∛ (cube root)
(infinity) → ∞ (infinity)
(proportional) → ∝ (proportional to)
(approximately equal) → ≈ (approximately equal)
(not equal) → ≠ (not equal)
(less than or equal) → ≤ (less than or equal)
(greater than or equal) → ≥ (greater than or equal)
(plus-minus) → ± (plus-minus)
(multiply) → × (multiplication)
(divide) → ÷ (division)
(dot) → · (dot operator)

Set Theory & Logic

(element) → ∈ (element of)
(not element) → ∉ (not element of)
(subset) → ⊂ (subset)
(superset) → ⊃ (superset)
(union) → ∪ (union)
(intersect) → ∩ (intersection)
(empty) → ∅ (empty set)
(forall) → ∀ (for all)
(exists) → ∃ (there exists)
(and) → ∧ (logical and)
(or) → ∨ (logical or)
(not) → ¬ (logical not)

Arrows

(<-) → ← (left arrow)
(->) → → (right arrow)
(^up) → ↑ (up arrow)
(^down) → ↓ (down arrow)
(<->) → ↔ (left-right arrow)
(^updown) → ↕ (up-down arrow)
(<==) → ⇐ (double left arrow)
(==>) → ⇒ (double right arrow)
(<=>) → ⇔ (double left-right arrow)

Currency & Financial

(dollar) → $ (dollar)
(euro) → € (euro)
(pound) → £ (pound sterling)
(yen) → ¥ (yen)
(cent) → ¢ (cent)
(currency) → ¤ (generic currency)

Legal & Copyright

(C^) → © (copyright)
(R^) → ® (registered trademark)
(TM^) → ™ (trademark)
(P^) → ℗ (sound recording copyright)
(SM^) → ℠ (service mark)

Typography & Punctuation

(degree) → ° (degree)
(micro) → µ (micro)
(middledot) → · (middle dot)
(bullet) → • (bullet)
(ellipsis) → … (ellipsis)
(dagger) → † (dagger)
(double-dagger) → ‡ (double dagger)
(section) → § (section sign)
(paragraph) → ¶ (pilcrow/paragraph mark)

Emoji & Status Indicators

(check) → ✅ (check mark)
(cross) → ❌ (cross mark)
(warning) → ⚠️ (warning)
(info) → ℹ️ (information)
(star) → ⭐ (star)
(heart) → ❤️ (heart)
(thumbsup) → 👍 (thumbs up)
(thumbsdown) → 👎 (thumbs down)
(fire) → 🔥 (fire)
(rocket) → 🚀 (rocket)
(sun) → ☀️ (sun)
(cloud) → ☁️ (cloud)
(rain) → 🌧️ (rain)
(snow) → ❄️ (snowflake)

Advanced Use Cases

Scientific Documentation

# Quantum Mechanics Study

## Wave Function

The Schrödinger equation: i(h-bar)(partial)(psi)/(partial)t = H(psi)

Where:
- (psi) is the wave function
- (h-bar) = h/(2(pi)) (Planck's constant)
- H is the Hamiltonian operator

## Heisenberg Uncertainty Principle

(Delta)x · (Delta)p (greater than or equal) (h-bar)/2

This fundamental principle shows that position and momentum cannot be simultaneously known with arbitrary precision.

Business & Legal Documents

# Product Licensing Agreement

## Trademark Notice

This document covers the use of Product Name (TM) and Related Product (R^).

## Pricing Structure

| Region | Standard | Premium |
|--------|----------|---------|
| US | (dollar)99/month | (dollar)299/month |
| EU | (euro)89/month | (euro)269/month |
| UK | (pound)79/month | (pound)239/month |

## Copyright Notice

(C^) 2023-2026 Company Name. All rights reserved.
Licensed under terms (section)3.2 of the master agreement.

Technical Specifications

# Device Specifications

## Temperature Range

Operating: -10(degree)C to 45(degree)C
Storage: -20(degree)C to 60(degree)C

## Measurements

- Accuracy: (plus-minus)0.5(micro)m
- Resolution: 0.1(micro)m
- Wavelength: 532(nano)m ((plus-minus)0.1nm)

## Performance Metrics

- Speed: 1000 ops/s (approximately equal) 1 kHz
- Error Rate: < 0.01% (check)
- Efficiency: 95% (plus-minus) 2%

Framework Integration

React Component

import { marked } from 'marked';
import markedExtendedTypographic from '@fsegurai/marked-extended-typographic';
import { useMemo } from 'react';

marked.use(markedExtendedTypographic({
  quotes: true,
  ellipses: true,
  customSymbols: {
    '\\(brand\\)': 'MyCompany™'
  }
}));

export function MarkdownContent({ source }: { source: string }) {
  const html = useMemo(() => marked.parse(source), [source]);
  return <div dangerouslySetInnerHTML={{ __html: html }} />;
}

Vue 3 Component

<script setup lang="ts">
import { marked } from 'marked';
import markedExtendedTypographic from '@fsegurai/marked-extended-typographic';
import { computed } from 'vue';

marked.use(markedExtendedTypographic({
  quotes: true,
  ellipses: true,
  dashes: true
}));

const props = defineProps<{ markdown: string }>();
const html = computed(() => marked.parse(props.markdown));
</script>

<template>
  <div v-html="html" />
</template>

Performance Considerations

Symbol Replacement: Replacements happen in post-processing, after Markdown parsing
Code Preservation: Code blocks and inline code are automatically skipped
HTML Safety: The extension doesn't affect HTML tags or attributes
Regex Optimization: Symbol patterns are optimized for performance

Best Practices

Consistent Patterns: Use the same symbol patterns throughout your documentation
Custom Symbol Documentation: Document your custom symbols for team members
Selective Enhancement: Enable only the features you need (quotes, dashes, ellipses)
Testing: Test symbol replacements in your specific context before production use
Accessibility: Consider screen reader behavior with special Unicode characters
Fallback Fonts: Ensure your font stack supports Unicode characters you use

Troubleshooting

Symbols Not Appearing

Problem: Symbol patterns like (alpha) show as-is instead of replacing.

Solutions:

Verify the symbol pattern is correct (case-sensitive)
Check that the extension is registered: marked.use(markedExtendedTypographic())
Ensure patterns aren't inside code blocks or inline code
Check browser/font support for the Unicode character

Smart Quotes Breaking Code

Problem: Quotes inside code examples are being converted.

Solution: The extension automatically skips code blocks and inline code. If you see this issue:

// Use outputUnicode: false to use HTML entities
marked.use(markedExtendedTypographic({
  quotes: true,
  outputUnicode: false
}));

Custom Symbols Not Working

Problem: Custom symbol patterns aren't being replaced.

Solution: Ensure regex escaping is correct:

marked.use(markedExtendedTypographic({
  customSymbols: {
    // CORRECT: Escaped parentheses
    '\\(mysymbol\\)': '⚡',
    
    // WRONG: Not escaped
    // '(mysymbol)': '⚡',  // Won't work!
  }
}));

Performance Issues

Problem: Slow rendering with many symbols.

Solutions:

Limit the number of custom symbols
Use more specific patterns to reduce false matches
Consider caching parsed results for static content

Migration Guide

From v16.x to v17.x

No breaking changes in this extension. The API remains consistent.

// v16.x - Still works in v17.x
marked.use(markedExtendedTypographic({
  quotes: true,
  ellipses: true
}));

// v17.x - Same configuration
marked.use(markedExtendedTypographic({
  quotes: true,
  ellipses: true
}));

API Reference

Extension Options

interface TypographicOptions {
  quotes?: boolean;                    // Enable smart quotes (default: false)
  dashes?: boolean;                    // Enable smart dashes (default: false)
  ellipses?: boolean;                  // Enable smart ellipses (default: false)
  attribute?: string | number;         // SmartyPants attribute (default: '3')
  customSymbols?: Record<string, string>; // Custom symbol mappings
  outputUnicode?: boolean;             // Output Unicode vs HTML entities (default: false)
}

SmartyPants Attribute Values

'0' or 0: No processing
'1' or 1: Smart quotes only
'2' or 2: Smart quotes + en-dash (--) + em-dash (---)
'3' or 3: Smart quotes + en-dash (--) + em-dash (---) + ellipses
'q': Smart quotes only (alternative)
'b': Smart quotes + backticks (`)
'B': Smart quotes + backticks + dashes

Contributing

Found a symbol that should be added? Have ideas for new typography features?

Open an issue or PR on GitHub.

Related Resources

Available Extensions

| Extension | Package | Version | Description | |-------------|--------------------------------------------------------------------------------------------------------------|----------------------------------------------------------------------------|----------------------------------------------------------------------| | All - Bundle | @fsegurai/marked-extended-bundle | npm | Includes all extensions in a single package for easy integration | | Accordion | @fsegurai/marked-extended-accordion | npm | Add collapsible accordion sections to your markdown | | Alert | @fsegurai/marked-extended-alert | npm | Create styled alert boxes for important information | | Comments | @fsegurai/marked-extended-comments | npm | Add comment sections with author and timestamp metadata | | Embeds | @fsegurai/marked-extended-embeds | npm | Easily embed content from various platforms (YouTube, Twitter, etc.) | | Footnote | @fsegurai/marked-extended-footnote | npm | Add footnotes with automatic numbering | | Kanban | @fsegurai/marked-extended-kanban | npm | Create kanban boards with customizable columns and cards | | Lists | @fsegurai/marked-extended-lists | npm | Enhanced list formatting options | | Slide | @fsegurai/marked-extended-slide | npm | Create slide decks directly from markdown content | | Spoiler | @fsegurai/marked-extended-spoiler | npm | Hide content behind spoiler tags | | Tables | @fsegurai/marked-extended-tables | npm | Advanced table formatting with cell spanning | | Tabs | @fsegurai/marked-extended-tabs | npm | Create tabbed content sections | | Timeline | @fsegurai/marked-extended-timeline | npm | Display content in an interactive timeline format | | Typographic | @fsegurai/marked-extended-typographic | npm | Improve typography with smart quotes, dashes, and more |

Demo Application

To see all extensions in action, check out the [DEMO].

To set up the demo locally, follow the next steps:

git clone https://github.com/fsegurai/marked-extensions.git
bun install
bun start

This will serve the application locally at http://[::1]:8000.

License

Licensed under MIT.