Installation
This project is published to npm under the name lgs-vue.
To install this project, include the package from npm.
Usage
After installing the package via npm npm i lgs-vue, import whichever component/s you intend to use inside of your vue component, as well as the library stylesheet.
Then, include the component in your template as you would with any child component.
Example:
example here: need code highlighting engine
LgsSpinner
<lgs-spinner
:active="true"
stroke-color="#9561e2">
</lgs-spinner>
Props
- active
- type: boolean
- default: true
- purpose: determines whether or not the component renders to the page
- strokeColor
- type: string
- default: #111111
- sets the color of the spinner wheel
LgsAlert
Title
Body
Title
Body
Title
Body
Body
Close
<lgs-alert
:active="true"
:flyin="false">
<h3 class="absolute pin-t pin-b pin-r px-4 py-3" slot="header">
Title
</h3>
<p class="absolute pin-t pin-b pin-r px-4 py-3" slot="body">
Close
</p>
<span class="absolute pin-t pin-b pin-r px-4 py-3" slot="dismiss">
Close
</span>
</lgs-alert>
Props
- active
- type: boolean
- default: true
- Determines if the alert should be displayed or not
- flyin
- type: boolean
- default: false
- should the alert be displayed off screen and animated in
Slots
- header
- Title/header content of the alert
- body
- main body content of the alert
- dismiss
- Allows for the overriding of the close button
Updating the Project
We're leveraging the vue-cli to build modules ready for distribution. Inside of src you can create a new component as a *.vue file. When ready to distribute, edit index.js to import and export you component. Then, navigate to that directory in your terminal and run vue build index.js --prod --lib. This will package everything up in the dist folder.
To publish to NPM, copy the package.tpl.json file into dist, update the version number, and run npm publish from the command line. (You'll need to be auth'd on npm).
Also, please update the version number in package.tpl.json and the root package.json to reflect the latest version number.