❤
npm
Sign UpSign In

vue-typed-ui
TypeScript icon, indicating that this package has built-in type declarations

1.6.9 • Public • Published

VueTypedUI

Is sets of UI components made with Semantic UI, VueTyped and friends

Install

npm install vue-typed-ui --save-dev

Usage

import * as Vue from 'vue'
import * as VueTypedUI from 'VueTypedUI'
Vue.use(VueTypedUI /* optional */ ,{
  prefix: 'ui',
  settings: { /* see options/settings section bellow */ }
})

Options

prefix

Components tag prefix. Default is 'ui'

settings

Some components may have some individual settings

Name Default Description
Date / Time
dateFormat 'MM/DD/YYYY' Date / DateTime format. You can change this format by follow momentjs formats.
timeFormat 'HH:mm' Time format. You can change this format by follow momentjs formats.
Numeric
decimalPlaces 2 Decimal places
decimalSeparator '.' Decimal separator
groupSeparator ',' Group separator
max 9999999999999.99 Maximum number that component can handle
min -9999999999999.99 Minimum number that component can handle
Currency
sign 'USD' Currency sign
signPos 'right' Currency symbol position
Toastr
toastr Official toastr default settings Settings for toastr component to get more detail see: http://codeseven.github.io/toastr/

Requirements

These requirements must be referenced in your main HTML file. For example:

<!DOCTYPE html>
<html lang="en">
 
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>Awesome App</title>
    <!-- requirement css-->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.7/semantic.min.css" rel="stylesheet" type="text/css">
    <link href="https://cdn.rawgit.com/mdehoog/Semantic-UI-Calendar/master/dist/calendar.min.css" rel="stylesheet" type="text/css">
  </head>
 
  <body>
    <!-- main app here-->
    <div id="app"></div>
    <!-- requirement scripts-->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.7/semantic.min.js"></script> 
    <script src="https://cdn.rawgit.com/mdehoog/Semantic-UI-Calendar/master/dist/calendar.min.js"></script> 
  </body>
 
</html>

Credits

License

MIT

Readme

Keywords

none

Package Sidebar

Install

npm i vue-typed-ui

Repository

github.com/vue-typed/vue-typed-ui

Homepage

github.com/vue-typed/vue-typed-ui

Weekly Downloads

0

Version

1.6.9

License

MIT

Last publish

Collaborators

  • budiadiono
Try on RunKit
Report malware