shipnow-mercurio

Mercurio

Shipnow's Design System implemented in React

Getting Started

Run the following command using npm.

Running the library for development

Run the following command to start Storybook for component display and test:

cd shipnow-mercurio
npm start

Using the library locally

First, you need to link Mercurio to your local node_modules npm repository.

cd shipnow-mercurio
npm link

The command will build the library for distribution with Rollup, copy the resulting folder in the local node_modules folder, and make it available for other local projects.

cd your-project-folder
npm link shipnow-mercurio

You'll need to manually install React JSS:

npm install --save react-jss

React JSS is mandatory for the use of theming. Then, in your app, you can use it like this:

import React, { Component } from 'react';
import { Title, DefaultTheme } from 'shipnow-mercurio';
import { ThemeProvider } from 'react-jss';

class App extends Component {
  render() {
    return (
      <ThemeProvider theme={DefaultTheme}>
        <Title>Hola mundo!</Title>
      </ThemeProvider>
    );
  }
}

export default App;

Note that ReactJSS and ThemeProvider only need to be used once, at the top of your app. Then inner components will get the active theme by context.

Components List

Visual Language

Bloomer Isssue fix

Note If you have a issue doing npm link when you are making a fresh install of node modules enter in the node_modules/bloomer folder and do find and replace of the following things:

• find 'import * as' and replace for 'import'

• find 'import tslib_1' and replace for 'import * as tslib_1'