Components Library
The components library of the Luminu Project
Background
Implements all reused components, such as
Buttons, Notification Cards, Tabs, Cards, Alerts, Layout Items, etc.
This featurerich library is used in all Luminu Projects.
Project's README
@luminu/components
Setup
Deployment
Documentation
Props
Name |
required/default |
type |
description |
text |
true |
String |
Sets the button's text |
size |
false / normal |
String |
Sets the button's size (small, big) |
type |
false / normal |
String |
Sets the button's type (success, error) |
disabled |
false / false |
Boolean |
Sets the button's disabled state |
Seperator
Props
Name |
required/default |
type |
description |
mtop |
false / 5 |
Number |
Sets the top margin of the seperator |
mbottom |
false / 5 |
Number |
Sets the bottom margin of the seperator |
Notification
Props
Name |
required/default |
type |
description |
message |
true |
String |
Sets the message that will be displayed |
activity |
false / 0 |
Number |
Sets it's activity state (Increment to activate/set to negative to disable) |
timeout |
false / 2500 |
Number |
Sets the timeout when it should fade out again |
fontSize |
false / 24 |
Number |
Sets the font size for the notification message |
Card
Props
Name |
required/default |
type |
description |
highlight |
false / false |
Boolean |
Marks the card as highlighted |
Loader
Props
Name |
required/default |
type |
description |
mtop |
false / 0 |
Number |
Sets the top margin of the loader |
mbottom |
false / 0 |
Number |
Sets the bottom margin of the loader |
justifyCenter |
false / false |
Boolean |
Declares whether the loader should be aligned to the horizontal middle or not |
size |
false / 24 |
Number |
Sets the size of the loader |
Alert
Published Events
Name |
data |
type |
LM_ALERT_RESPONSE |
status |
{ isSuccess: boolean, message: string, title: string } |
Props
Name |
required/default |
type |
description |
links |
true |
Array(TLink) |
Sets the displayed links |
active |
false / -1 |
Number |
Sets which dropdown is pressed |
type |
false / 'defaultLogin' |
String |
Sets the login type |
username |
false / "" |
String |
Sets the displayed username |
userId |
false / -1 |
Number |
Sets the user id |
hasAvatar |
false / false |
Boolean |
If a user has an avatar his personal avatar will be displayed |
notLoggedInAction |
false / {} |
Any |
Sets login action (View integration test for implementation) |
dropdownItems |
false / [] |
Array |
Sets the dropdown items (View integration test for implementation) |
Props
Name |
required/default |
type |
description |
partners |
true |
Array(TPartners) |
Sets the actively displayed partners |
Tabs
Props
Name |
required/default |
type |
description |
tabs |
true |
Array(string) |
Sets the name of the displayed tabs |
active |
false / 0 |
number |
Sets the currently active tab |
Published Events
Name |
data |
type |
LM_CHANGED_TAB |
index |
number |