npm package: @nuiverse/core
Description: Nuiverse UI is an open-source design system of Nuinalp for products and digital experiencies.
Author: Nuinalp Authors
Latest version: 0.3.3

# @nuiverse/core

Nuiverse UI is an open-source design system of Nuinalp for products and digital experiencies, consists in a serie of resources and principies for create a awesome and rich experience.

The Nuiverse UI core package is a series of individual styles and web components built with StencilJS.

## 🛠 Status: In Development

> Nuiverse is currently in development.

## Features

- Tiny, highly optimized components built with [Stencil](https://stenciljs.com/)
- No build or compiling required
- Simply add the static files to any project
- Lazy-loaded components without configuration
- Asynchronous rendering

## How to use

### Vanilla HTML

Easiest way to start using Nuiverse UI Core is by adding a script tag to the CDN:

```html
<script type="module" src="https://cdn.jsdelivr.net/npm/@nuiverse/core@latest/dist/nuiverse-ui/nuiverse-ui.esm.js"></script>
<script nomodule src="https://cdn.jsdelivr.net/npm/@nuiverse/core@latest/dist/nuiverse-ui/nuiverse-ui.js"></script>
<link href="https://cdn.jsdelivr.net/npm/@nuiverse/core@latest/dist/nuiverse-ui/nuiverse-ui.css" rel="stylesheet">
```

### Install in project via NPM

```bash
$ npm install @nuiverse/core@latest
```

Any Nuiverse UI component added to the webpage will automatically load. This includes writing the component tag directly in HTML, or using JavaScript such as `document.createElement('nv-button').`

## Framework Bindings

The `@nuiverse/core` package can by used in simple HTML or by Vanilla JavaScript without any framework at all. The bindings for other frameworks like Vue, React or Angular is under development.

---

## Documentation

The documentation is in currently development, an initial version is avalible on the [GitLab](https://gitlab.com/nuinalp/nuiverse/docs) repo, Portuguese only. The english documentation are in development. But you can to see our [tecnical documentation](https://gitlab.com/nuinalp/nuiverse/nuiverse-ui/tree/master/src/core/src/components), avalible inside in all our components folders generated by [Stencil](https://stenciljs.com/).

## Components available

- Alert
- Avatar
- Badge
- Breadcrumbs
- Button
- Checkbox
- Card
- Chip
- Code
- Collapse
- Dialog
- Embed
- Grid
- Label
- List
- Loader
- Navigation view
- Progress
- Radio
- Rating
- Scroll
- Select
- Slider
- Sub-header
- Switch
- Table
- Tabs
- TextField
- Toast
- Tooltip
- Upload

We also have a modifiers, a series of individual css classes for personalize and  make easy to construct a projetc. You can to check our tests pages for more information, the documentation about this is availible soon.

- Borders
- Clearfix
- Colors
- Display
- Flex
- Float
- Image replacement
- Overflow
- Position
- Screen readers
- Shadows
- Sizing
- Spacing
- Text
- Typography
- Vertical align
- Visibility

## Project setup

```bash
git clone https://gitlab.com/nuinalp/nuiverse/nuiverse-ui.git
cd nuiverse-ui
```

and run:

```bash
npm install
npm start
```

To build the components for production, run:

```bash
npm run build
```

To run the unit tests for the components, run:

```bash
npm test
```

## Future Goals

Our goal is to make a best open-source design language of the world. In the next weeks and months our are work for add more features, new components, more flexibilit, more documentation, improve the currently components, add more accebility and fix all possibles bugs.

## Support

Do you have a question? Please open an issue on our [main repo](https://gitlab.com/nuinalp/nuiverse/nuiverse-ui/issues).

## License

[BSD Clause 3](https://opensource.org/licenses/BSD-3-Clause)

Copyright (c) 2019 The Nuinalp Authors. All rights reserved.  
Use of this source code is governed by a BSD-style license that can be found in the LICENSE file.