Skip to content

Latest commit

 

History

History
58 lines (44 loc) · 3.48 KB

README.md

File metadata and controls

58 lines (44 loc) · 3.48 KB

Lambda VUI

This component library is designed for use with Vue 3 and is built using the Composition API. It features a modern, flat design with the NORD color palette and includes both light and dark themes.

The library also includes a customizable toast plugin, which enables you to display success, error, info, and warning messages in various positions and durations. Additionally, the library features customizable color animations that activate when users interact with components like inputs.

It's intended to be used with Laravel, InertiaJS and Vue 3.

There is currently no documentation for this library, but it will be added in the future.


Showcase GIF

Showcase GIF

Components

Implemented
Not implemented

Form components

Input component
Select component
Textarea component
Checkbox component
File component
Date & Time component
Button component
Dropzone upload component
Radio component
Switch component
Range component
Color component
Tags component
Rating component

Typography components

Heading component
Text/paragraph component
Link component

Other components

Toast component and plugin
Modal component and plugin
Card component

Bugs / Todo

❌ Fix DateTimePicker component to be initialized with a empty value (currently it's initialized with the current date and time but can be resat to empty with the clear button). Just using the reset method will not work (month and year will display as 00-00 in the input)
❌ Make tags component also take a options prop (like the select component) so that it can be used as a select component with predefined options only or a mix between predefined and user defined tags.
❌ Toast system needs an upgrade. Need to modify it so that toasts can be paused when hovering over them. Also need to add perfect scrollbar to the toast container so that it can be scrolled when there are many toasts. We also need to consider adding a AI time-to-read implementation when regarding the duration of the toasts with a minimum duration.
❌ Modify checkbox component to take in other values than booleans. For example, if you want to use a checkbox to select a value from a list of options, you would want to pass in the value of the option to the checkbox and then have the checkbox emit the value of the option when it's checked. This would make it easier to use the checkbox component in a v-for loop.
❌ Add prop: clean to VSelect to remove paddings, borders and background colors so it can be used inside other components that are supposed to be inputs but require multiple select components in a row.

Contributing

If you want to contribute to this project, please read the CONTRIBUTING.md file for more information.

License

This project is open-sourced software licensed under the MIT license.