wonka-uideprecated

wonka-ui is a front-end/user interface framework written in Angular and Typescript, aimed towards making front-end components and code re-usable within SINTEF Connect.

Usage no npm install needed!

<script type="module">
  import wonkaUi from 'https://cdn.skypack.dev/wonka-ui';
</script>

README

npm version

Angular wonka-ui - UI component library using Bulma CSS framework styles

wonka-ui is a front-end/user interface framework written in Angular and Typescript, aimed towards making front-end components and code re-usable within SINTEF Connect.


Versions

Angular wonka-ui
>=8.0.0 <9.0.0 v1.x

Table of contents

Components

  • ChartModule - simple wrapper for chart.js
  • KeyValueUnitListModule - module for creating a simple key-value list
  • ListModule - module for creating a simple list, emits event on item click
  • TableModule - module for creating a simple table, emits event on row click
  • FormModule - simple reactive form
  • InfoModule - info module with header, content and image
  • NavigationBarModule - simple navigation bar

Warning

Library is under active development and may have API breaking changes for subsequent major versions after 1.0.0.

Getting started

Step 1: Install wonka-ui:

NPM

npm install --save wonka-ui

Step 2: Import the chosen wonka-ui modules:

import { NavigationBarModule, InfoPanelModule } from 'wonka-ui';

@NgModule({
  declarations: [AppComponent],
  imports: [NavigationBarModule, InfoPanelModule],
  bootstrap: [AppComponent]
})
export class AppModule {}

Demo application

The github repository includes a demo application that demonstrates use of the wonka-ui modules.

Run demo application on default port 4200

git clone https://github.com/SINTEF/wonka-ui.git
cd wonka-ui
npm install
cd projects/application/src
npm run start-demo

Open demo-app on http://localhost:4200

Testing

npm run test

License

Shield: CC BY 4.0

This work is licensed under a Creative Commons Attribution 4.0 International License.

CC BY 4.0

=======