Napoleonic Panda Machine

    invision-dsm-utils

    1.0.3 • Public • Published

    invision-dsm-utils

    Utility scripts to help integrate InVision Design System Manager (DSM) into your front-end codebase.

    You will need to be an InVision DSM customer to get value out of this library

    Functionality

    Installation

    npm install --dev invision-dsm-utils
    

    API

    Configuration

    You must set two variables in a configuration file that follows the cosmicconfig pattern (e.g. a package.json property, an extensionless "rc file", etc.)

    .invisiondsmutilsrc

    {
        dsmExportUrl: <url>,
        key: <string>
    }
    

    Find these values by:

    • Log into InVision DSM
    • Select your project
    • In the top right corner select the icon </>
    • Select Design tokens
    • Select CSS
    • Copy the URL displayed underneath the Styles heading and paste it into a text editor. For instance:
    https://rangle.invisionapp.com/dsm-export/rangle-io/where-van-gogh/_style-params.css?key=Hk4MnZ1bU
    
    • The dsmExportUrl is https://rangle.invisionapp.com/dsm-export/rangle-io/where-van-gogh
    • The key is the url query parameter value Hk4MnZ1bU

    Download

    This is a node script that accepts inputs from the command line.

    invision-dsm-utils download <type> <outDir> [options]
    

    Arguments

    type: css | scss | less | styl | xml | json | yaml | android | ios
    outDir: relative path to output directory
    

    Optional Inputs

    --icons-out-dir: relative path to output directory
    --json-export-format: lookup | list
    

    Note that json-export-format is only relevant when type is json. The default value is lookup.

    Setting the --icons-out-dir will download a zip file of icons from the DSM.

    Transform

    This is a node script that accepts inputs from the command line.

    invision-dsm-utils transform <inFile> <outFile>
    

    Arguments

    inFile: relative path to input to design tokens in JSON lookup format
    outFile: relative path to JS file 
    

    The outfile can be used as a theme object for any library that supports the Styled System Theme Specification (e.g. styled-system).

    Examples

    View the examples folder.

    License

    MIT

    Keywords

    none

    Install

    npm i invision-dsm-utils

    DownloadsWeekly Downloads

    0

    Version

    1.0.3

    License

    MIT

    Unpacked Size

    19.8 kB

    Total Files

    18

    Last publish

    Collaborators

    • chrisdepaul