remark-interlinear-gloss

[remark][] plugin to support interlinear glossing for linguistics in Markdown.

``markdown
:::gloss
| Chinese coverbs
我 坐 飞机 从 上海 到 北京 去。
/ wǒ zuò fēijī cóng Shànghǎi dào Běijīng qù.
= I sit airplane from Shanghai arrive.at Beijing go
| 'I'll go from Shanghai to Beijing by plane.'
:::
`

!Rendered interlinear gloss from the Chinese coverb example




Contents

- What is this?
- When should I use this?
- Install
- Use
- Syntax
- CSS
- API
- unified().use(remarkDirective).use(remarkInterlinearGloss)
- Types
- Security
- Related
- License

What is this?

This package is a [unified][] ([remark][]) plugin to add support for linguistic interlinear glossing via [remark-directive][remark-directive].

When should I use this?

This project is useful for Markdown documents that include interlinear glossed text, such as linguistics papers and language documentation. Because it uses [remark-directive][remark-directive], keep in mind that it won't be portable to other Markdown renderers. On your own site it can be great!

Install

This package is [ESM only][esm]. In Node.js (version 16+), install with [npm][]:

`sh
npm install remark-interlinear-gloss
`

In Deno with [esm.sh][esmsh]:

`js
import remarkInterlinearGloss from "https://esm.sh/remark-interlinear-gloss@1";
`

In browsers with [esm.sh][esmsh]:

`html


`

Use

Say our document example.md contains the following. (Note that \: is used because remark-directive would otherwise interpret :237 as an empty text directive.)

`markdown


Rule 1: Word-by-word alignment

Interlinear glosses are left-aligned vertically, word by word, with the example. E.g.

:::gloss
| Indonesian (Sneddon 1996\:237)
Mereka di Jakarta sekarang.
= they in Jakarta now
| 'They are in Jakarta now.'
:::
`

…and our module example.js contains:

`js
import rehypeStringify from "rehype-stringify";
import remarkDirective from "remark-directive";
import remarkInterlinearGloss from "remark-interlinear-gloss";
import remarkParse from "remark-parse";
import remarkRehype from "remark-rehype";
import { read } from "to-vfile";
import { unified } from "unified";

const file = await unified()
.use(remarkParse)
.use(remarkDirective)
.use(remarkInterlinearGloss)
.use(remarkRehype)
.use(rehypeStringify)
.process(await read("example.md"));

console.log(String(file));
`

…then running node example.js yields:

`html


Rule 1: Word-by-word alignment

Interlinear glosses are left-aligned vertically, word by word, with the example. E.g.

1. 
   
   
   
   1. Mereka
   
   
   2. they
   
   
   
   


2. 
   
   
   
   1. di
   
   
   2. in
   
   
   
   


3. 
   
   
   
   1. Jakarta
   
   
   2. Jakarta
   
   
   
   


4. 
   
   
   
   1. sekarang.
   
   
   2. now
   
   
   
   

'They are in Jakarta now.'

`

When the base styles are imported from "remark-interlinear-gloss/styles.css", the output is as follows:

!Rendered interlinear gloss from the Leipzig glossing rules

Syntax

Inside a :::gloss directive, each line is parsed as follows:

| Prefix | Meaning | CSS class |
| ------ | ---------------------- | ------------------------------- |
| (none) | Source text | gloss-word-text |
| / | Transliteration | gloss-word-transliteration |
| = | Gloss | gloss-word-gloss |
| \| | Header/footer metadata | gloss-header / gloss-footer |

Lines prefixed with | at the beginning or end of the block become headers or footers respectively. Outside of headers and footers, all words are automatically divided into columns. Additional Markdown styles may be used at any point in the gloss, as shown below.

`markdown
:::gloss
| Chinese
你 写 书
/ ní xiě shū
= 2SG write book
| 'You write a book.'
:::
`

CSS

This package includes optional base styles. Import them in your project:

`js
import "remark-interlinear-gloss/styles.css";
`

Or with [esm.sh][esmsh]:

`html

`

Or write your own styles targeting these classes:

- .gloss — the outer


- .gloss-header — the