unicorn_components
unicorn_components copied to clipboard
nitsnets
Angular UI components kit of Unicorn Platform.
Unicorn Components
Angular UI components kit of Unicorn Platform.
Install
npm install --save @unicorn.io/components
Demo
https://nitsnets.github.io/unicorn_components
Usage
Import the module
import { UnicornComponentsModule } from '@unicorn.io/components';
@NgModule({
imports: [
UnicornComponentsModule.forRoot()
]
})
export class AppModule { }
Start using components
<uni-button label="My button"></uni-button>
Select styles theme (Optional)
@import './node_modules/@unicorn.io/components/styles/themes/cms/all'
List of components
| Group | Component | Naming | Status | Docs | Demo |
|---|---|---|---|---|---|
| Charts | Chart | <uni-chart> |
:large_blue_circle: | Docs | - |
| " | Legend | <uni-chart-legend> |
:large_blue_circle: | Docs | - |
| " | Tooltip | <uni-chart-tooltip> |
:red_circle: | Docs | - |
| Containers | Accordion | <uni-accordion> |
:white_check_mark: | Docs | Demo |
| " | Aside | <uni-aside> |
:white_check_mark: | Docs | Demo |
| " | Body | <uni-body> |
:white_check_mark: | Docs | Demo |
| " | Box | <uni-box> |
:white_check_mark: | Docs | Demo |
| " | Header | <uni-header> |
:white_check_mark: | Docs | Demo |
| " | Layout | <uni-layout> |
:white_check_mark: | Docs | Demo |
| " | Modal | <uni-modal> |
:white_check_mark: | Docs | - |
| " | Popup | <uni-popup> |
:white_check_mark: | Docs | Demo |
| " | Row | <uni-row> |
:white_check_mark: | Docs | Demo |
| " | Row Spacer | <uni-row-spacer> |
:white_check_mark: | Docs | Demo |
| " | Tabs | <uni-tabs> |
:white_check_mark: | Docs | Demo |
| Forms | Button toggle | <uni-button-toggle> |
:white_check_mark: | Docs | Demo |
| " | Checkbox | <uni-checkbox> |
:white_check_mark: | Docs | Demo |
| " | Code Editor | <uni-code-editor> |
:red_circle: | Docs | - |
| " | Date Picker | <uni-date-picker> |
:white_check_mark: | Docs | Demo |
| " | Date Range Picker | <uni-daterange-picker> |
:white_check_mark: | Docs | Demo |
| " | Date Time Picker | <uni-datetime-picker> |
:white_check_mark: | Docs | Demo |
| " | Image Picker | <uni-image-picker> |
:large_blue_circle: | Docs | - |
| " | Input | <uni-input> |
:white_check_mark: | Docs | Demo |
| " | Radio | <uni-radio> |
:white_check_mark: | Docs | Demo |
| " | Select | <uni-select> |
:white_check_mark: | Docs | Demo |
| " | Slider | <uni-slider> |
:large_blue_circle: | Docs | Demo |
| " | Slider Range | <uni-slider-range> |
:large_blue_circle: | Docs | Demo |
| " | Time Picker | <uni-time-picker> |
:white_check_mark: | Docs | Demo |
| " | Toggle | <uni-toggle> |
:white_check_mark: | Docs | Demo |
| UI | Button | <uni-button> |
:white_check_mark: | Docs | Demo |
| " | Button File | <uni-button-file> |
:large_blue_circle: | Docs | Demo |
| " | Button Group | <uni-button-group> |
:white_check_mark: | Docs | Demo |
| " | Button Header | <uni-button-header> |
:white_check_mark: | Docs | Demo |
| " | Button Menu | <uni-button-menu> |
:white_check_mark: | Docs | Demo |
| " | Button Popup | <uni-button-popup> |
:white_check_mark: | Docs | Demo |
| " | Calendar | <uni-calendar> |
:white_check_mark: | Docs | Demo |
| " | Carousel | <uni-carousel> |
:large_blue_circle: | Docs | - |
| " | Clock | <uni-clock> |
:white_check_mark: | Docs | Demo |
| " | Datagrid | <uni-datagrid> |
:large_blue_circle: | Docs | Demo |
| " | Filters | <uni-filters> |
:large_blue_circle: | Docs | Demo |
| " | Filters List | <uni-filters-list> |
:large_blue_circle: | Docs | - |
| " | List | <uni-list> |
:large_blue_circle: | Docs | Demo |
| " | Menu | <uni-menu> |
:white_check_mark: | Docs | Demo |
| " | Paginator | <uni-paginator> |
:white_check_mark: | Docs | Demo |
| " | Tree | <uni-tree> |
:white_circle: | Docs | - |
| Utils | Alert | <uni-alert> |
:white_check_mark: | Docs | Demo |
| " | Badge | <uni-badge> |
:white_check_mark: | Docs | Demo |
| " | Chip | <uni-chip> |
:large_blue_circle: | Docs | Demo |
| " | Face | <uni-face> |
:white_check_mark: | Docs | Demo |
| " | Icon | <uni-icon> |
:white_check_mark: | Docs | - |
| " | Progress | <uni-progress> |
:white_check_mark: | Docs | Demo |
| " | Separator | <uni-separator> |
:white_check_mark: | Docs | - |
| " | Spinner | <uni-spinner> |
:white_check_mark: | Docs | Demo |
| " | Toast | <uni-toast> |
:red_circle: | Docs | - |
| " | Tooltip | <uni-tooltip> |
:red_circle: | Docs | - |
| Views | Filtered Datagrid | <uni-filtered-datagrid> |
:large_blue_circle: | Docs | - |
| " | Search Header | <uni-search-header> |
:large_blue_circle: | Docs | - |
Legend:
:white_circle: Coming soon
:large_blue_circle: Initial
:white_check_mark: Stable
:red_circle: Unstable
:black_circle: Deprecated
nitsnets