@muraldevkit/ds-icons-animated
v1.0.1
Published
Mural's design system's animated icons library
Downloads
1,145
Readme
Animated icons
JSON files used by Lottie to generate animated SVGs for Mural's design system.
Table of contents
Installation
Review the design system's global usage guidelines to
learn how to install our packages. This package's name is @muraldevkit/ds-icons-animated
.
Usage
After you have installed the package into your project, you can import the JSON files you need into your file. This is a hybrid package which outputs both [CommonJs](https://requirejs. org/docs/commonjs.html) and ECMAScript modules.
// ESM
import { llamaBlack } from '@muraldevkit/ds-icons-animated';
// CommonJS
const llamaBlack = require('@muraldevkit/ds-icons-animated');
If you need to import a file directly from the dist
folder of the package, be sure to use the path of
the appropriate subfolder for your module, i.e. dist/cjs
for CommonJs and dist/esm
for ESM.
Once you have imported the JSON file you wish to render, you can pass it to the animated SVG
component (mrl-svg-animate
in @muraldevkit/ds-component-svg
) as a prop:
const icon = <mrl-svg-animate svg-data={ JSON.stringify(llamaBlack) } />;