Installation

To install this library in your nodejs project you can run

npm install @ulibs/ui@next

Usage

You can import and use components like this:

import { Button } from '@ulibs/ui'

const str = Button({color: 'primary'}, 'Hello World!')
console.log(str)

Usage with Express

To use this library with your expressjs based applications, you can do something like this:


import express from 'express'
import {Button, ButtonGroup} from '@ulibs/ui'

const app = express()

app.get('/', (req, res) => {
  const page = ButtonGroup([
    Button({color: 'primary', onClick: "console.log('Hello World!')"}, 'Primary Button'),
    Button("Secondary Button")
  ]);
  const html = page.toHtml()
  res.send(html)
})

app.listen(3000)

usage with HTML (Not recommended)

It is possible to use styles and scripts of components directly without using Component functions, you need to add reference to these files in your html


<script src="https://unpkg.com/@ulibs/ui@next/dist/ulibs.js"></script>
<link rel="stylesheet" href="https://unpkg.com/@ulibs/ui@next/dist/styles.css"/>

Then You can use inspect element feature of your browser in our docs and and copy/paste HTML code of components to your HTML file.

<button u-button u-button-color="primary">Primary Button</button>