Amexio Varanasi Release v1.0.0 (Bootstrap 3 Support + 30 Components)
Amexio (Angular MetaMagic EXtensions for Inputs and Outputs) is a rich set of (Google) Angular 4 UI
components powered by (Twitter) Bootstrap 3 for Responsive Design. We provide a single module as an import for using our rich set of 30 UI components and can be easily configured and implemented in a project. Check out the Amexio UI Library Demo and API documentation(amexio.org).
Component | Description |
---|---|
Button | Buttons with various style types - Default, Primary, Warning, Success, Danger. Size attribute - Small, Default, Large. Link attribute - Route to new page. Click event - take action on click of button. |
Button Group | Group various button in one group. Has all functionality of button also. |
Drop Down Button | Provides a built-in dropdown arrow that can fire an event separately from the default click event of the button. |
Text Input | Text input providing following features, Validation - based on attributes (min, max, allowblank, regex) defined. Hightlight the text input if data is not valid. Help Tooltip - based on attributes defined., Icon - define field icon, Style - Define custom font style. |
Email Input | Email input providing following features, Validation - Default Email validation . Hightlight the text input if data is not valid. Help Tooltip - based on attributes defined. Icon - define field icon |
Password Input | Password input providing following features, Validation - based on attributes (min, max, allowblank, regex) defined. Hightlight the text input if data is not valid. Help Tooltip - based on attributes defined., Icon - define field icon, Style - Define custom font style. |
Numeric Input | Numeric input providing following features, Validation - based on attributes (min, max, allowblank) defined. Hightlight the text input if data is not valid. Help Tooltip - based on attributes defined., Icon - define field icon, Style - Define custom font style." |
Text Area | Text Area providing following features, Validation - based on attributes (min, max, allowblank, regex) defined. Hightlight the text input if data is not valid. Help Tooltip - based on attributes defined., Icon - define field icon, Style - Define custom font style. |
Rating | Has following features: Max - based on attribute defined that many star will be displayed for user to rate, Percentage label display. |
Date Time Picker | Displays date/time component based on user configuration. Emitts date or time based on selection. |
Radio Group | Display radio button based on store. Emitts the data based on radio selection. |
Check Group | Display check box based on store. Emitts the data based on check box selection. |
Drop Down | Display dropdown components based on data store attached or service call. |
Multi Select Drop Down | Display dropdown components where user can select multiple values from drop down. |
Filter Drop Down | Provides search facility for drop-down |
Data Grid | Renders the data in table format, inbuilt features like sorting, pagination, Row Selection, Multi row selection using checkbox. |
Data Grid Template | User can customize the look and feel of the row/column using templates. |
Data Grid Responsive | Inbuilt responsive features, changes layout based of device size. |
Tree Data Grid | Renders tree structure data in tree data grid format. |
Tree View | Based on tree structure data creates tree view. |
Progress Bar | Shows the progress based on min/max/current value attribute defined. |
Carousel - Image | Renders the images in carousel view format. |
Carousel - Html Content | Renders the html content in carousel view format. |
Horizontal Tabs | Simple Tab Control for Angular Apps with multiple configurations. |
Horizontal Tabs with Icon | Renders tab with icon. |
Horizontal Tab with scrollable feature | Brings left/right navigation button If there are two many tabs. |
Left Popover for input component | Left Help popover displayed for input components. |
Right Popover for input component | Right Help popover displayed for input components. |
Top Popover for input component | Top Help popover displayed for input components. |
Bottom Popover for input component | Bottom Help popover displayed for input components. |