Skip to content

Latest commit

 

History

History
208 lines (151 loc) · 6.07 KB

README.md

File metadata and controls

208 lines (151 loc) · 6.07 KB
Raw

ssv-au-ui

CircleCI bitHound Overall Score npm version

UI components library for Aurelia by Sketch7.

NOTE: This project is under development and is not intended for general production use yet.

Quick links

Change logs | Project Repository

Installation

Get library via npm

npm install @ssv/au-ui --save

# install peers
npm install normalize-scss node-waves @ssv/core @ssv/au-core aurelia-dependency-injection aurelia-logging --save

Setup Plugin

Register au-ui plugin with optional global configuration and bootstrap.

import { UiConfig, UiBootstrapper, buttonType } from "@ssv/au-ui";

const uiConfig: UiConfig = {
    button: { type: buttonType.raised }
};
// register plugin with aurelia + configure
aurelia.use.plugin("@ssv/au-ui", uiConfig);

aurelia.start().then(() => {
    // invoke bootstrapper to initialize
    const uiBootstrapper = aurelia.container.get(UiBootstrapper) as UiBootstrapper;
    uiBootstrapper.init();
});

Styling

Register sass includePaths with the following naming.

"./node_modules/@ssv/au-ui/dist/sass",
"./node_modules/normalize-scss/sass",
"./node_modules/node-waves/src/scss",

Configure and import sass.

// configure/override
$ssv-primary-color: red;

// import all (vendors, core and components)
@import "@ssv/au-ui/all";

// import only vendors
@import "@ssv/au-ui/vendors";

// import only core
@import "@ssv/au-ui/core";

// import only components
@import "@ssv/au-ui/components";

Import fonts

<link href="https://fonts.googleapis.com/css?family=Roboto:400,500" rel="stylesheet">

Features

Feature Status Docs Issue
input Preview README -
button Preview README -
waves Preview README -
badge Preview README -
icon Preview README -
checkbox Preview README -
snackbar Preview README -
select Preview README -
chips Preview README -
datepicker Not Started -
switch Not Started -
radio Not Started -
alert Not Started -
modal Not Started -
collection Not Started -
tabs Not Started -
progress-bar Not Started -
progress-spinner Not Started -
tooltip Not Started -
card Not Started -
button toggle Not Started -

Value Converters

Value Converters Status Docs Issue
highlight Preview README -

Getting Started

Setup Machine for Development

Install/setup the following:

  • NodeJS v8+
  • Visual Studio Code or similar code editor
  • TypeScript 2.5+
  • Git + SourceTree, SmartGit or similar (optional)
  • Ensure to install global NPM modules using the following:
npm install -g git gulp yarn

Cloning Repo

  • Run git clone https://github.com/sketch7/ssv-au-ui.git
  • Switch to develop branch

Project Setup

The following process need to be executed in order to get started.

npm install

Building the code

gulp build
// or
npm run build

In order to view all other tasks invoke gulp or check the gulp tasks directly.

Running the tests

gulp test
// or
npm test

Development utils

Trigger gulp watch

Handles compiling of changes.

gulp watch
// or
npm start

Running Continuous Tests

Spawns test runner and keep watching for changes.

gulp tdd
// or
npm run tdd

Preparation for Release

gulp prepare-release --bump major|minor|patch|prerelease (default: patch)

Check out the release workflow guide in order to guide you creating a release and publishing it.

Library Size

Will be adding library file sizes once it will be completed.