Skip to content

mobi/goponents

Repository files navigation

Goponents

Currently v1.2.1

This project houses a set of UI components for Angular 7+ and designed around the 'Go' design system.

Getting Started

  1. Take a look at our code of conduct
  2. Read through our contribution guidelines
  3. Install the latest version of npm
    npm install -g npm@latest
    or if you are using nvm you can alternatively run:
    nvm install-latest-npm
    We try to stay as up to date a possible.
  4. Install all of the node modules
    npm install
  5. Start a development test server:
    ng serve --project=go-tester
    This will serve the go-tester directory at localhost:4200
  6. In a separate tab, start the tests for the go-lib components:
    ng test go-lib
    Test will continue to run anytime a file is saved. This will help ensure that breaking changes aren't introduced when changes are introduced.

Directory structure

The project is separated up into three project directories.

go-lib

projects/go-lib is where all of our production components, services, and other items are built out. If you are adding that you would like to distribute, this is where you will do that work.

The components are located here:

projects/go-lib/src/lib/components

go-tester

projects/go-tester is separate app that allows us to test the implementation of our components as we build them out. If you want to test to make sure your go-lib components work as expected in a more real world setting, this is where you will do that work.

The base tester app is located here;

projects/go-tester/src/app

go-tester-e2e

projects/go-tester will eventually be where we will write all of our end to end testing for our go-tester app. We have not yet done this, but we would welcome any contributions.

Other Useful Things

Code scaffolding

Run ng generate lib/components/component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Publishing to npm

To build and pack the library locally run:

npm run package

To build and pack the library locally and publish that package to npm run:

npm run publish

Properly Exposing Files for Importing

The projects/go-lib/src/public_api.ts file exposes files to the root of the node module. This allows for importing like:

import { GoTableConfig } from '@tangoe/goponents';

To do this properly, you must export each individual file within the public_api.ts file.

Components Available

Component Notes
accordion Available
badge Available
button Available
card Available
checkbox Available
checkbox group Available
copy button Available
datepicker Available
header Available
icon Available
icon button Available
input Available
hint Available
layout Available
modal Available
off-canvas Available
radio Available
radio group Available
select Available
search Available
side nav Available
slide toggle Available
table Available
textarea Available
toasts Available
---------------- ----------------------------------------
autocomplete Will Need
masked input Will Need
---------------- ----------------------------------------
tabs Idea
tooltip Idea
timepicker Idea
wysiwyg Idea