relottie-parse

relottie plugin to add support for parsing Lottie input.

Contents

• What is this?
• When should I use this?
• Install
• Use
• API
  • unified().use(relottieParse)
• Examples
  • Example: convert Lottie to dotLottie
• Syntax
• Syntax tree
• Types
• Compatibility
• Security
• Contribute
• Acknowledgments
• License

What is this?

This package is a unified (relottie) plugin that defines how to take Lottie as input and turn it into a syntax tree.

This plugin is built on momoa, which in turn parses JSON into JSON-AST and turns it into last syntax trees. relottie focusses on making it easier to transform content by abstracting such internals away.

unified is a project that transforms content with abstract syntax trees (ASTs). relottie adds support for Lottie to unified. last is the Lottie AST that relottie uses. momoa is the JSON parser we use to build a last. This is a relottie plugin that defines how input Lottie is turned into last.

When should I use this?

This plugin adds support to unified for parsing Lottie.

You can combine this plugin with other plugins to add syntax extensions. List of plugins.

Install

This package is ESM only. In Node.js (version 12.20+, 14.14+, or 16.0+), install with npm:

1yarn add @lottiefiles/relottie-parse

Use

Say we have the following module example.ts:

1import { unified } from 'unified'
2import relottieParse, { type Options } from '@lottiefiles/relottie-parse'
3
4const parseOptions: Options = {
5  position: false
6};
7
8const tree = unified().use(relottieParse, parseOptions).parse('{"v":"5.5.7"}');
9
10console.log('tree output', tree);

Running that with npx ts-node example.ts yields:

1// tree output:
2{
3  "type":"root",
4  "title":"animation",
5  "hasExpressions": false,
6  "children":[
7    {
8      "type":"attribute",
9      "key":"v",
10      "title":"version",
11      "children":[
12        {
13          "type":"primitive",
14          "value":"5.5.7",
15          "valueType":"string"
16        }
17      ]
18    }
19  ]
20}

API

The default export is relottieParse. You can import the parser Options and FileData type definitions as well.

unified().use(relottieParse)

Add support for parsing Lottie input. There are plugin options as well.

Examples

Convert Lottie to dotLottie

You can use dotLottie.js for converting a LottieJSON into .lottie format

Syntax

Lottie is parsed according to CommonMark. Other plugins can add support for syntax extensions.

Syntax tree

The syntax tree format used in relottie is last.

Types

This package is fully typed with TypeScript.

Compatibility

Projects maintained by the unified collective are compatible with maintained versions of Node.js. As of now, that is Node.js 16.0+, and 18.0+ (other versions have not been tested yet) Our projects sometimes work with older versions, but this is not guaranteed.

Security

As last properties can have expressions, and improper use of last can open you up to cross-site scripting cross-site scripting (XSS). Carefully assess each plugin and the risks involved in using them.

Contribute

Any contributions are welcome.

Acknowledgments

• unified
• momoa
• lottie-docs

License

License © LottieFiles