@cesarbr/macaw

Macaw - CESAR Design System

Usage no npm install needed!

<script type="module">
  import cesarbrMacaw from 'https://cdn.skypack.dev/@cesarbr/macaw';
</script>

README

Built With Stencil

Macaw

Getting Started

To start development:

git clone git@github.com:CESARBR/macaw.git
cd macaw

and run:

npm install
npm start

To build the component for production, run:

npm run build

To run the unit tests for the components, run:

npm test

Need help? Check out our docs here.

Naming Components

When creating new component tags, we recommend using prefix m-. For example m-button.

Using this component

Script tag

  1. Put the following script tags in the head of your index.html
<script type="module" src="https://unpkg.com/@cesarbr/macaw/dist/macaw/macaw.esm.js"></script>
<script nomodule src="https://unpkg.com/@cesarbr/macaw/dist/macaw/macaw.js"></script>
  1. Then you can use the element anywhere in your template, JSX, html etc

NPM

  1. Run
$ npm install  @cesarbr/macaw --save
  1. Add an import to the npm packages
import { defineCustomElements as macaw } from '@cesarbr/macaw/loader';
  1. Init macaw
macaw(window);
  1. Then you can use the element anywhere in your template, JSX, html etc