Angular UI components kit of Unicorn Platform.
npm install --save @unicorn.io/componentshttps://nitsnets.github.io/unicorn_components
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'| Group | Component | Naming | Status | Docs | Demo |
|---|---|---|---|---|---|
| Charts | Chart | <uni-chart> |
🔵 | Docs | - |
| " | Legend | <uni-chart-legend> |
🔵 | Docs | - |
| " | Tooltip | <uni-chart-tooltip> |
🔴 | Docs | - |
| Containers | Accordion | <uni-accordion> |
✅ | Docs | Demo |
| " | Aside | <uni-aside> |
✅ | Docs | Demo |
| " | Body | <uni-body> |
✅ | Docs | Demo |
| " | Box | <uni-box> |
✅ | Docs | Demo |
| " | Header | <uni-header> |
✅ | Docs | Demo |
| " | Layout | <uni-layout> |
✅ | Docs | Demo |
| " | Modal | <uni-modal> |
✅ | Docs | - |
| " | Popup | <uni-popup> |
✅ | Docs | Demo |
| " | Row | <uni-row> |
✅ | Docs | Demo |
| " | Row Spacer | <uni-row-spacer> |
✅ | Docs | Demo |
| " | Tabs | <uni-tabs> |
✅ | Docs | Demo |
| Forms | Button toggle | <uni-button-toggle> |
✅ | Docs | Demo |
| " | Checkbox | <uni-checkbox> |
✅ | Docs | Demo |
| " | Code Editor | <uni-code-editor> |
🔴 | Docs | - |
| " | Date Picker | <uni-date-picker> |
✅ | Docs | Demo |
| " | Date Range Picker | <uni-daterange-picker> |
✅ | Docs | Demo |
| " | Date Time Picker | <uni-datetime-picker> |
✅ | Docs | Demo |
| " | Image Picker | <uni-image-picker> |
🔵 | Docs | - |
| " | Input | <uni-input> |
✅ | Docs | Demo |
| " | Radio | <uni-radio> |
✅ | Docs | Demo |
| " | Select | <uni-select> |
✅ | Docs | Demo |
| " | Slider | <uni-slider> |
🔵 | Docs | Demo |
| " | Slider Range | <uni-slider-range> |
🔵 | Docs | Demo |
| " | Time Picker | <uni-time-picker> |
✅ | Docs | Demo |
| " | Toggle | <uni-toggle> |
✅ | Docs | Demo |
| UI | Button | <uni-button> |
✅ | Docs | Demo |
| " | Button File | <uni-button-file> |
🔵 | Docs | Demo |
| " | Button Group | <uni-button-group> |
✅ | Docs | Demo |
| " | Button Header | <uni-button-header> |
✅ | Docs | Demo |
| " | Button Menu | <uni-button-menu> |
✅ | Docs | Demo |
| " | Button Popup | <uni-button-popup> |
✅ | Docs | Demo |
| " | Calendar | <uni-calendar> |
✅ | Docs | Demo |
| " | Carousel | <uni-carousel> |
🔵 | Docs | - |
| " | Clock | <uni-clock> |
✅ | Docs | Demo |
| " | Datagrid | <uni-datagrid> |
🔵 | Docs | Demo |
| " | Filters | <uni-filters> |
🔵 | Docs | Demo |
| " | Filters List | <uni-filters-list> |
🔵 | Docs | - |
| " | List | <uni-list> |
🔵 | Docs | Demo |
| " | Menu | <uni-menu> |
✅ | Docs | Demo |
| " | Paginator | <uni-paginator> |
✅ | Docs | Demo |
| " | Tree | <uni-tree> |
⚪ | Docs | - |
| Utils | Alert | <uni-alert> |
✅ | Docs | Demo |
| " | Badge | <uni-badge> |
✅ | Docs | Demo |
| " | Chip | <uni-chip> |
🔵 | Docs | Demo |
| " | Face | <uni-face> |
✅ | Docs | Demo |
| " | Icon | <uni-icon> |
✅ | Docs | - |
| " | Progress | <uni-progress> |
✅ | Docs | Demo |
| " | Separator | <uni-separator> |
✅ | Docs | - |
| " | Spinner | <uni-spinner> |
✅ | Docs | Demo |
| " | Toast | <uni-toast> |
🔴 | Docs | - |
| " | Tooltip | <uni-tooltip> |
🔴 | Docs | - |
| Views | Filtered Datagrid | <uni-filtered-datagrid> |
🔵 | Docs | - |
| " | Search Header | <uni-search-header> |
🔵 | Docs | - |
Legend:
⚪ Coming soon
🔵 Initial
✅ Stable
🔴 Unstable
⚫ Deprecated