# Getting Started

# NPM package

Add file .npmrc in the same directory as your package.json, and add the following registry:

@dnlf:registry=https://dnlf.pkgs.visualstudio.com/91b06e9f-20ec-41fa-9bbc-6b7ad87d5e4b/_packaging/dnlf-public-feed/npm/registry/

Install the package as a dev dependency:

yarn add @dnlf/legno-ui -D

This will also update the package to latest version.

# JavaScript and CSS

WARNING

Use this only for testing purposes. Importing the entire JS and CSS can have a negative impact on the the performance of your site.

Download the following JS and CSS files to set up a quick test environment:

CSS Example:

<head>
    <link rel="stylesheet" href="./legno-ui.css">
</head>

<body>
	<div class="legno-loader"></div>
</body>

VueJS Example:

<head>
	<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
    <script src="./legno-ui.umd.min.js"></script>
    <link rel="stylesheet" href="./legno-ui.css">
</head>

<body>
	<div id="app">
		<legno-text-input label="Name" :value="name" />
	</div>

    <script>
	var app = new Vue({
		el: '#app',
		data: { name: 'John' }
	})
    </script>
</body>

# DEV Environment

Clone the Git repo (link in header) and follow instructions in the README file.